React-redux-form edit when initial data delayed

[ghost]

The Problem

When data come from remote server promise middleware used to set to state. I can see data fill table but when I try to submit it I get all validators errors as form still have all fields empty.

Steps to Reproduce

https://bitbucket.org/IndoVanja/react-redux-form-edit-delayed-get/overview Just clone repo, install npm packages, npm run build, npm start

Expected Behavior

Form state changes when data of model set in state, therefore triggering validation and whatever else needed.

Actual Behavior

Model data changes, input fields in form get filled, form data still empty in state, validators report errors on submit. In order to submit one needs to click on each field first, so data filled gets validated.

Reproducible Code Example

https://bitbucket.org/IndoVanja/react-redux-form-edit-delayed-get/overview

Additional note: I don't really understand from docs how all this stuff working, why I can't myself issue model or form actions, how to be sure that actions will be processed by form and not model, where to put model reducers, are models and forms changed apart from general app state, all super confusing.

[davidkpiano]

You're gonna have to point me to the exact code (please copy-paste it here) that is doing the model loading. However, I'm pretty sure this is fixed by eb18aa8 which fixed #1020

[ghost]

export const getUserData = () => (dispatch, getState) => {
  const payload = new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve({
        name: 'Ivan',
        email: 'a.b@gmail.com'
      })
    }, 3000);
  });

  dispatch({ type: ACTIONS.GET_USER_DATA, payload });
};

Then

export const defaultState = {
  name: '',
  email: ''
};

const mainReducer = (state = defaultState, action) => {
  switch (action.type) {
    case `${ACTIONS.GET_USER_DATA}_FULFILLED`:
    case `${ACTIONS.SET_USER_DATA}_FULFILLED`:
      return setUserData(state, action.payload);

    case `${ACTIONS.GET_USER_DATA}_REJECTED`:
    case `${ACTIONS.SET_USER_DATA}_REJECTED`:
      console.error(action.payload);
      return state;

    default:
      return state;
  }
};

function setUserData(state, { name, email }) {
  return {
    ...state,
    name,
    email
  };
}

And that is relation with form model

import { combineReducers } from 'redux';
import main from 'redux/modules/main/mainReducer';
import { combineForms, createForms } from 'react-redux-form';

const rootReducer = combineReducers({
  main,
  ...createForms({
    user: main
  })
});

export default rootReducer;

I tried to make whole app state to be used in form too, still the same.

[ghost]

Huh that commit was 12 minutes ago?

[ghost]

Not works in my case, upgraded package to latest.

[davidkpiano]

Not works in my case, upgraded package to latest.

Hasn't been released yet. You can fork the repo or add the GitHub link directly in package.json to test it.

[ghost]

Alright

[akshygupt]

@davidkpiano has this been released yet?

[davidkpiano]

There have been many releases since this issue. @akki199421 Are you not seeing this in the current version?

[akshygupt]

i switched to the latest release but i am still getting this problem.