[Redux] return action CREATE

Bonjour tout le monde,
j'ai un petit problème sur mon application, j'essaye de créer un type POST en appelant mon API tout en lui envoyant les données de mon form.
mais j'ai une erreur "invalid form" alors que je recupere bien les données.
je début aussi avec redux, redux-sagas, c'est pour cela que j galère un peu...
Si quelqu'un a une idée, je suis à l’écoute, merci

**COMPONENT.JS**

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
     class CreatGroup extends React.Component{
 
     // function to post 
 
	 handleFormSubmit = (dataForm) => {
     console.log(dataForm, ' DATA FORM')
     this.props.dispatch(createPostGroup(dataForm))	
    }
 
	render() {
    // my form
    const { handleSubmit, submitting } = this.props
		return(
              <div>
                <form onSubmit={handleSubmit(this.handleFormSubmit)}>
                  <div>         
                    <Field name="amount" component={renderField} type="number" label="amount" />
                  </div>
                  <div>
                    <Field name="duration" component={renderField} type="number" label="duration" />
                  </div>
                  <div>
                    <Field name="limit_members" component={renderField} type="number" label="max members" />
                  </div>      
                  <div>
                    <button type="submit" disabled={submitting}>Submit</button>
                  </div>
                </form>
              </div>
		    )
	       } 
          }
 
          CreatGroup = reduxForm({
           form:'createGroup'
          })(CreatGroup)

**ACTIONS.JS**

Code:

1
2
3
4
5
        // CONST ACTIONS 
        const CREATE_GROUP = 'CREATE_GROUP'
 
        //ACTIONS
         export function createPostGroup(data){ return { type: CREATE_GROUP, data}};

**REDUCER.JS**

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
        // REDUCER 
          const initialState = {
           status: false,
           message: 'Group show all successfully',
           data: ''
          };
 
        export default function groupReducer( state=initialState, action){
	    switch (action.type){
		case CREATE_GROUP:
			return {
			   status: true,
			   message: 'Group create successfully',
			   data: action.data
			}
		case CREATE_GROUP_FAIL:
			return {
			   status: false,
			   message: 'ACTION CREATE FAILS',
			   data: action.data
			}
		default:
			return state
	      }
         }

**COMBINE REDUCER.JS**

Code:

1
2
3
4
5
        // COMBINE REDUCER 
         const reducer = combineReducers({
          groupReducer,
          form: formReducer
         });

**SAGAS.JS**

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
       //  CALL API
        export function* createApiDataGroup(action){
         try { 
	       const data = yield call(axios.post, 'http://localhost:8000/api/create');
           yield put({ type: "CREATE_GROUP", data })
         } catch (e) {
           yield put({ type: "CREATE_GROUP_FAIL", e})
         }
        } 
        export default function* mySaga() {
         yield all([
          takeEvery('CREATE_GROUP', createApiDataGroup)
         ])
        }

Citation:

Pièce jointe 372828

Citation:

Pièce jointe 372830

[Redux] return action CREATE_FAILS