SaveButton transform options not working as expected

[jeromediaz]

According to the documentation
https://marmelab.com/react-admin/SaveButton.html#transform

a SaveButton with the default type "submit" should be able to use a transform callback to transform the data before sending it.
<SaveButton transform={transformUser} />

In reality trying to use this property only result on a warning and no data transformation, which is confirmed by the the source code

warning( type === 'submit' && ((mutationOptions && (mutationOptions.onSuccess || mutationOptions.onError)) || transform), 'Cannot use <SaveButton mutationOptions> props on a button of type "submit". To override the default mutation options on a particular save button, set the <SaveButton type="button"> prop, or set mutationOptions in the main view component (<Create> or <Edit>).' );

https://github.com/marmelab/react-admin/blob/master/packages/ra-ui-materialui/src/button/SaveButton.tsx

I think either the code or the documentation should be updated

[fzaninotto]

The <SaveButton transform> prop is working in the simple example Post Create page.

https://stackblitz.com/github/marmelab/react-admin/tree/master/examples/simple?file=src%2Fposts%2FPostCreate.tsx%3AL84

Please provide a reproduction for the issue you report.

And by the way, we wrote an issue template so that we have enough details to investigate. You saw that template when you created a new issue. If you don't follow it, we'll close the issue.

[jeromediaz]

What you were expecting:
I expect the SaveButton transform option to be usable even without specifying a type="button".

It isn't specified in the documentation transform option is available only for SaveButton with type button
(https://marmelab.com/react-admin/SaveButton.html#transform) like it is for mutationOptions

What happened instead:
Using the "submit" SaveButton with the transform option result in the transform callback not being called and a warning being visible in the console

Cannot use <SaveButton mutationOptions> props on a button of type "submit". To override the default mutation options on a particular save button, set the <SaveButton type="button"> prop, or set mutationOptions in the main view component (<Create> or <Edit>).

Steps to reproduce:
Simply try to use the code provided in the documentation, where no type="button" is set

  const transformUser = data => ({
      ...data,
      fullName: `${data.firstName} ${data.lastName}`
  });

  const UserCreateToolbar = () => (
      <Toolbar>
          <SaveButton transform={transformUser} />
      </Toolbar>
  );

Related code:

Other information:
What I suggest if to update the documentation (https://marmelab.com/react-admin/SaveButton.html#transform) to reflect the need to use a SaveButton type="button" if we want to be able to use the transform option

Environment

• React-admin version: 4.16.16
• Last version that did not exhibit the issue (if applicable):
• React version: 18.3.1
• Browser: Safari
• Stack trace (in case of a JS error):

[slax57]

Indeed this seems like a documentation issue. Thanks for the report.

[fzaninotto]

The <SaveButton transform> prop is working in the simple example Post Create page.

https://stackblitz.com/github/marmelab/react-admin/tree/master/examples/simple?file=src%2Fposts%2FPostCreate.tsx%3AL84

Please provide a reproduction for the issue you report.

And by the way, we wrote an issue template so that we have enough details to investigate. You saw that template when you created a new issue. If you don't follow it, we'll close the issue.

[jeromediaz]

What you were expecting:
I expect the SaveButton transform option to be usable even without specifying a type="button".

It isn't specified in the documentation transform option is available only for SaveButton with type button
(https://marmelab.com/react-admin/SaveButton.html#transform) like it is for mutationOptions

What happened instead:
Using the "submit" SaveButton with the transform option result in the transform callback not being called and a warning being visible in the console

Cannot use <SaveButton mutationOptions> props on a button of type "submit". To override the default mutation options on a particular save button, set the <SaveButton type="button"> prop, or set mutationOptions in the main view component (<Create> or <Edit>).

Steps to reproduce:
Simply try to use the code provided in the documentation, where no type="button" is set

  const transformUser = data => ({
      ...data,
      fullName: `${data.firstName} ${data.lastName}`
  });

  const UserCreateToolbar = () => (
      <Toolbar>
          <SaveButton transform={transformUser} />
      </Toolbar>
  );

Related code:

Other information:
What I suggest if to update the documentation (https://marmelab.com/react-admin/SaveButton.html#transform) to reflect the need to use a SaveButton type="button" if we want to be able to use the transform option

Environment

• React-admin version: 4.16.16
• Last version that did not exhibit the issue (if applicable):
• React version: 18.3.1
• Browser: Safari
• Stack trace (in case of a JS error):

[slax57]

Indeed this seems like a documentation issue. Thanks for the report.