Edit form doesn't send request

[BogdanScherban]

@fzaninotto Francois, could you please give an advice with this issue?

I worked with patient info editing. Edit form change information about patient ONLY in Store, but doesn't send request to the server path. Look: https://drive.google.com/file/d/1fA6Hxn4G3nmfoFz6TurkqCbYTX37oMbI/view?usp=sharing

Requests to server are absent (after click on "Complete"). I understand it is, because process doesn't come to dataProvider (rows 259-261): https://github.com/PulseTile/PulseTile-RA/blob/scotland/src/core/dataProviders/patientsProvider.js

This is my edit form: https://github.com/PulseTile/PulseTile-RA/blob/scotland/src/core/pages/PatientsList/PatientEdit.js

This is my template of it: https://github.com/PulseTile/PulseTile-RA/blob/scotland/src/core/common/ResourseTemplates/EditTemplate.js

Create form is done by the same scheme, but it works correctly - with requests to server path.

I assumed, that the reason in custom Toolbar, but default toolbar gives the same result.

Could you please help to find the reason?

[tony-shannon]

Hi @fzaninotto could you take a look at this for us please?

[fzaninotto]

In your EditToolbar, you clone the props twice, once for the Toolbar, and once for the custom save button:

const EditToolbar = ({ changeViewType, ...props }) => {
    return (
        <Toolbar {...props} >
            <CancelButton redirectTo={changeViewType} />
            <CustomSaveButton {...props} />
        </Toolbar>
    );
};

Does it work better if you don't pass the props to the custom save button?

const EditToolbar = ({ changeViewType, ...props }) => {
    return (
        <Toolbar {...props} >
            <CancelButton redirectTo={changeViewType} />
-           <CustomSaveButton {...props} />
+           <CustomSaveButton />
        </Toolbar>
    );
};

[BogdanScherban]

Thanks, @fzaninotto .

I tried to do this, but result was the same. I removed custom toolbar generally, and get the same problem with default toolbar. Please, look at the video - I share my code and my browser: https://drive.google.com/file/d/1S_x51bnd1aSfTBjFGkRqdoDQUwxLztLD/view?usp=sharing

When user clicks on "Save" - values are changed only in Store, but no actions in data provider.

I tried to do following in the file: https://github.com/PulseTile/PulseTile-RA/blob/cf3caaa103a695403a9f9dbdfa9d9712f9065592/src/core/common/ResourseTemplates/ListTemplate.js#L229

render() {
      const { create, edit, resourceUrl, title, children, classes, history } = this.props;
      const EditBlock = edit;
      ....
      return ( 
          <Grid>
            {
              (!this.isCreatePage())
                            ?
                            <Route
                                path={this.getDetailsUrl()}
-                                render={({ match }) => <DetailsTemplate mode="show" {...this.props} id={match.params.id} />}
+                                render={({ match }) => <EditBlock {...this.props} id={match.params.id} />}
                            />
                            :
                            <Route
                                path={createUrl}
                                render={({ match }) => <CreateBlock {...this.props} id={match.params.id} />}
                            />
                    }
             </Grid>
          );
}

Result is the same, although CreateForm is united by the same way and works correctly: https://drive.google.com/file/d/1X91e2oK4_3v1Ave9FqT0YEOUfNKO5hVc/view?usp=sharing

Can it will be some problem in Edit-component?

[fzaninotto]

Sorry, the resolution of your 2 videos isn't good enough to be able to read anything.

[fzaninotto]

CreateForm is united by the same way

I don't understand that part

[fzaninotto]

Does it work better if, instead of using the <FormInputs /> component, you use its contents? It's the only difference that I see between your code and classic react-admin.

[BogdanScherban]

@fzaninotto

Francois, I updated the video: https://drive.google.com/file/d/1flycmhcPU11_viJNtj9KWsZva8eUGzQg/view?usp=sharing

I want to show you, that data in store was changed, but request to server side wasn't sent. I added console.log to dataProvider:

export default (type, resource, params) => {

    console.log('type', type);
    console.log('resource', resource);
    console.log('params', params);

    if (resource === `patients`) {
        return fakePatientsProvider(type, resource, params);
    }
    return dataProvider(type, resource, params);
};

You can see, that type UPDATE after click on Complete wasn't appeared.

CreateForm is united by the same way

I mean, that I use the same principle to do Create form: Common template with {children} as form. And it works correctly: 1) add new data to store; 2) send request to the server.

https://drive.google.com/file/d/1UpxG_6NWM_EhiO4KA7OUWNlIaXWiBrRo/view?usp=sharing

[fzaninotto]

Can you share what the redux toolbar displays when you submit the form? there should be a CRUD_UPDATE action dispatched. From there on, if your dataProvider doesn't catch it, it can only be because of a custom saga I think.

[BogdanScherban]

@fzaninotto Francois, I share CRUD_UPDATE action: https://drive.google.com/file/d/14LJ-SRek6_RSyKzWyXOSGg5aAGGjkw5q/view?usp=sharing

it can only be because of a custom saga I think.

Could you please clarify, which custom sagas do you mean? Here the list of our custom sagas: https://github.com/PulseTile/PulseTile-RA/tree/feature-data-provider/src/core/sagas

But never of them work with CRUD_UPDATE action.

[fzaninotto]

I think it's because the update is optimistic. The fetch only starts after the notification hides. And I don't see the Notification Snackbar in your screencast. Did you forget to implement it?

cf https://github.com/marmelab/react-admin/issues/3049