React does not recognize the hasCreate prop on a DOM element.

[sebastianbuechler]

What happened:
When using a List element I get this in the console:

VM1174:1 Warning: React does not recognize the `hasCreate` prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase `hascreate` instead. If you accidentally passed it from a parent component, remove it from the DOM element.
    at p
    at div
    at http://localhost:3000/node_modules/.vite/deps/chunk-BTXKACF2.js?v=50442c42:1404:49
    at ListView (http://localhost:3000/node_modules/.vite/deps/react-admin.js?v=8ddc62c8:21892:20)
    at ListContextProvider (http://localhost:3000/node_modules/.vite/deps/chunk-S7TE75VY.js?v=50442c42:10039:18)
    at ResourceContextProvider (http://localhost:3000/node_modules/.vite/deps/chunk-S7TE75VY.js?v=50442c42:13723:21)
    at ListBase (http://localhost:3000/node_modules/.vite/deps/chunk-S7TE75VY.js?v=50442c42:10286:21)
    at List (http://localhost:3000/node_modules/.vite/deps/react-admin.js?v=8ddc62c8:22065:24)

Steps to reproduce:
Use List element like this:

    <List
      resource="client/orders"
      sort={{ field: 'creationTimestamp', order: 'DESC' }}
      exporter={false}
    >
      <Datagrid bulkActionButtons={false}>
        <DateField source="creationTimestamp" label="Creation Timestamp" showTime />
      </Datagrid>
    </List>

Environment

• React-admin version: 4.12.1
• Last version that did not exhibit the issue (if applicable): -
• React version: 18
• Browser: Chrome and Firefox

[slax57]

Thanks for this report.

I don't really understand how you can run into this issue with the code you provided, since it doesn't set hasCreate at all.
Can you provide a reproduction?

In any case, there's a good chance this issue will be fixed by #9101 once it is released.

[slax57]

EDIT: my bad, actually #9101 cleans other props but not this one which is still needed for some advanced cases including an EE component.

But still, I would require a reproduction sandbox, as I did not reproduce in our simple example.

[fzaninotto]

No news for some time, closing.

[ruslantalpa]

Hi,

This is not solved.

<List actions={<TopToolbar><FilterButton /></TopToolbar>}/> will trigger the error

this is because when custom actions are not provided, the Default is used (https://github.com/marmelab/react-admin/blob/master/packages/ra-ui-materialui/src/list/ListActions.tsx)

which "eats" the hasCreate prop and it is not passed to the TopToolbar

The way around this is to create a custom component (like in the docs) but it would be nice to be able to specify actions inline without needing a component

const MyTopToolbar = ({ hasCreate = false, children, ...rest }) => (
    <TopToolbar {...rest} >{children}</TopToolbar>
);

[slax57]

Indeed @ruslantalpa , with these instructions I was able to reproduce. Thanks.