Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Prepare for react 19 #9919

Merged
merged 29 commits into from
Jun 17, 2024
Merged

Prepare for react 19 #9919

merged 29 commits into from
Jun 17, 2024

Conversation

djhi
Copy link
Collaborator

@djhi djhi commented Jun 12, 2024

We want to estimate the things that break in react-admin when using React 19 (currently in Release Candidate). Depending on the React 19 release date, we may even make it a requirement for react-admin v5.

As we are dependent on MUI, we'll wait for mui v6 or even v7 before releasing a new major requiring react 19. In the mean time, this PR update our dependencies to use the latest react 18.

@djhi djhi added RFR Ready For Review WIP Work In Progress and removed RFR Ready For Review labels Jun 12, 2024
packages/react-admin/package.json Outdated Show resolved Hide resolved
djhi and others added 2 commits June 17, 2024 09:13
Co-authored-by: Francois Zaninotto <francois@marmelab.com>
@adguernier adguernier self-requested a review June 17, 2024 08:12
@slax57 slax57 self-requested a review June 17, 2024 08:28
@djhi djhi added RFR Ready For Review and removed WIP Work In Progress labels Jun 17, 2024
@fzaninotto
Copy link
Member

In the Simple Example, I see a warning in the Post Edit page that doesn't appear in next:

Warning: A props object containing a "key" prop is being spread into JSX:
  let props = {key: someKey, label: ..., size: ..., className: ..., disabled: ..., data-tag-index: ..., tabIndex: ..., onDelete: ...};
  <ForwardRef(Chip2) {...props} />
React keys must be passed directly to JSX without using spread:
  let props = {label: ..., size: ..., className: ..., disabled: ..., data-tag-index: ..., tabIndex: ..., onDelete: ...};
  <ForwardRef(Chip2) key={someKey} {...props} />
    at Autocomplete2 (http://localhost:8080/node_modules/.vite/deps/@mui_material.js?v=eff8d57a:2461:17)
    at http://localhost:8080/node_modules/.vite/deps/chunk-FYAFR5RD.js?v=a839ccb4:1677:50
    at AutocompleteInput (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-ui-materialui/src/input/AutocompleteInput.tsx:57:14)
    at AutocompleteArrayInput (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-ui-materialui/src/input/AutocompleteArrayInput.tsx:19:3)
    at ChoicesContextProvider (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/form/choices/ChoicesContextProvider.tsx:19:3)
    at ResourceContextProvider (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/core/ResourceContextProvider.tsx:19:3)
    at ReferenceArrayInput (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-ui-materialui/src/input/ReferenceArrayInput.tsx:28:5)
    at div
    at http://localhost:8080/node_modules/.vite/deps/chunk-FYAFR5RD.js?v=a839ccb4:1677:50
    at Box3 (http://localhost:8080/node_modules/.vite/deps/chunk-R62JUMXW.js?v=a839ccb4:562:19)
    at TagReferenceInput (http://localhost:8080/src/posts/TagReferenceInput.tsx:37:6)
    at div
    at http://localhost:8080/node_modules/.vite/deps/chunk-FYAFR5RD.js?v=a839ccb4:1677:50
    at Grid2 (http://localhost:8080/node_modules/.vite/deps/chunk-R62JUMXW.js?v=a839ccb4:2693:24)
    at FormGroupContextProvider (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/form/FormGroupContextProvider.tsx:22:3)
    at FormTab (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-ui-materialui/src/form/FormTab.tsx:22:5)
    at div
    at http://localhost:8080/node_modules/.vite/deps/chunk-FYAFR5RD.js?v=a839ccb4:1677:50
    at CardContent2 (http://localhost:8080/node_modules/.vite/deps/chunk-FCYJRPPW.js?v=a839ccb4:66:17)
    at DefaultComponent (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-ui-materialui/src/form/TabbedFormView.tsx:131:29)
    at div
    at http://localhost:8080/node_modules/.vite/deps/chunk-FYAFR5RD.js?v=a839ccb4:1677:50
    at TabbedFormView (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-ui-materialui/src/form/TabbedFormView.tsx:41:5)
    at form
    at FormGroupsProvider (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/form/FormGroupsProvider.tsx:22:38)
    at FormProvider (http://localhost:8080/node_modules/.vite/deps/react-hook-form.js?v=27caa07d:77:11)
    at RecordContextProvider (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/controller/record/RecordContext.tsx:23:3)
    at OptionalRecordContextProvider (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/controller/record/OptionalRecordContextProvider.tsx:19:3)
    at Form (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/form/Form.tsx:41:5)
    at TabbedForm (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-ui-materialui/src/form/TabbedForm.tsx:29:28)
    at div
    at http://localhost:8080/node_modules/.vite/deps/chunk-FYAFR5RD.js?v=a839ccb4:1677:50
    at Paper2 (http://localhost:8080/node_modules/.vite/deps/chunk-XT6YJIR3.js?v=a839ccb4:97:17)
    at http://localhost:8080/node_modules/.vite/deps/chunk-FYAFR5RD.js?v=a839ccb4:1677:50
    at Card2 (http://localhost:8080/node_modules/.vite/deps/chunk-TVQPJZ3M.js?v=a839ccb4:69:17)
    at div
    at div
    at http://localhost:8080/node_modules/.vite/deps/chunk-FYAFR5RD.js?v=a839ccb4:1677:50
    at EditView (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-ui-materialui/src/detail/EditView.tsx:31:5)
    at RecordContextProvider (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/controller/record/RecordContext.tsx:23:3)
    at SaveContextProvider (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/controller/saveContext/SaveContextProvider.tsx:18:39)
    at EditContextProvider (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/controller/edit/EditContextProvider.tsx:22:3)
    at EditBase (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/controller/edit/EditBase.tsx:22:3)
    at Edit (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-ui-materialui/src/detail/Edit.tsx:25:3)
    at PostEdit (http://localhost:8080/src/posts/PostEdit.tsx:166:27)
    at RenderedRoute (http://localhost:8080/node_modules/.vite/deps/chunk-3YARWBZM.js?v=a839ccb4:3540:5)
    at Routes (http://localhost:8080/node_modules/.vite/deps/chunk-3YARWBZM.js?v=a839ccb4:4045:5)
    at ResourceContextProvider (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/core/ResourceContextProvider.tsx:19:3)
    at Resource (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/core/Resource.tsx:23:11)
    at RenderedRoute (http://localhost:8080/node_modules/.vite/deps/chunk-3YARWBZM.js?v=a839ccb4:3540:5)
    at Routes (http://localhost:8080/node_modules/.vite/deps/chunk-3YARWBZM.js?v=a839ccb4:4045:5)
    at Suspense
    at ErrorBoundary (http://localhost:8080/node_modules/.vite/deps/react-error-boundary.js?v=5f8cf257:18:5)
    at div
    at main
    at div
    at div
    at http://localhost:8080/node_modules/.vite/deps/chunk-FYAFR5RD.js?v=a839ccb4:1677:50
    at Layout (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-ui-materialui/src/layout/Layout.tsx:32:13)
    at default (http://localhost:8080/src/Layout.tsx:37:19)
    at RenderedRoute (http://localhost:8080/node_modules/.vite/deps/chunk-3YARWBZM.js?v=a839ccb4:3540:5)
    at Routes (http://localhost:8080/node_modules/.vite/deps/chunk-3YARWBZM.js?v=a839ccb4:4045:5)
    at CoreAdminRoutes (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/core/CoreAdminRoutes.tsx:26:3)
    at RenderedRoute (http://localhost:8080/node_modules/.vite/deps/chunk-3YARWBZM.js?v=a839ccb4:3540:5)
    at Routes (http://localhost:8080/node_modules/.vite/deps/chunk-3YARWBZM.js?v=a839ccb4:4045:5)
    at ErrorBoundary (http://localhost:8080/node_modules/.vite/deps/react-error-boundary.js?v=5f8cf257:18:5)
    at CoreAdminUI (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/core/CoreAdminUI.tsx:65:37)
    at div
    at http://localhost:8080/node_modules/.vite/deps/chunk-FYAFR5RD.js?v=a839ccb4:1677:50
    at ScopedCssBaseline2 (http://localhost:8080/node_modules/.vite/deps/@mui_material.js?v=eff8d57a:11283:17)
    at AdminUI (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-ui-materialui/src/AdminUI.tsx:29:3)
    at RtlProvider (http://localhost:8080/node_modules/.vite/deps/chunk-R62JUMXW.js?v=a839ccb4:934:5)
    at ThemeProvider (http://localhost:8080/node_modules/.vite/deps/chunk-R62JUMXW.js?v=a839ccb4:887:5)
    at ThemeProvider2 (http://localhost:8080/node_modules/.vite/deps/chunk-R62JUMXW.js?v=a839ccb4:973:5)
    at ThemeProvider (http://localhost:8080/node_modules/.vite/deps/chunk-J7YSJFBP.js?v=a839ccb4:274:12)
    at ThemeProvider (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-ui-materialui/src/theme/ThemeProvider.tsx:26:33)
    at ResourceDefinitionContextProvider (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/core/ResourceDefinitionContext.tsx:28:16)
    at NotificationContextProvider (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/notification/NotificationContextProvider.tsx:21:47)
    at I18nContextProvider (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/i18n/I18nContextProvider.tsx:23:3)
    at RenderedRoute (http://localhost:8080/node_modules/.vite/deps/chunk-3YARWBZM.js?v=a839ccb4:3540:5)
    at RenderErrorBoundary (http://localhost:8080/node_modules/.vite/deps/chunk-3YARWBZM.js?v=a839ccb4:3500:5)
    at DataRoutes (http://localhost:8080/node_modules/.vite/deps/react-router-dom.js?v=54a0983f:542:5)
    at Router (http://localhost:8080/node_modules/.vite/deps/chunk-3YARWBZM.js?v=a839ccb4:3988:15)
    at RouterProvider (http://localhost:8080/node_modules/.vite/deps/react-router-dom.js?v=54a0983f:359:5)
    at InternalRouter (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/routing/AdminRouter.tsx:51:3)
    at BasenameContextProvider (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/routing/BasenameContextProvider.tsx:18:43)
    at AdminRouter (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/routing/AdminRouter.tsx:24:31)
    at QueryClientProvider (http://localhost:8080/node_modules/.vite/deps/chunk-GERGK2QN.js?v=a839ccb4:2589:3)
    at PreferencesEditorContextProvider (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/preferences/PreferencesEditorContextProvider.tsx:22:52)
    at StoreContextProvider (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/store/StoreContextProvider.tsx:21:10)
    at CoreAdminContext (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/core/CoreAdminContext.tsx:36:5)
    at AdminContext (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/ra-ui-materialui/src/AdminContext.tsx:26:5)
    at Admin (http://localhost:8080/@fs/Users/francois/Documents/git/react-admin/packages/react-admin/src/Admin.tsx:26:5)

@fzaninotto
Copy link
Member

fzaninotto commented Jun 17, 2024

In the e-commerce example, I have a warnings on the customer edition and review list pages:

react-dom.development.js:86 Warning: FullNameField: Support for defaultProps will be removed from function components in a future major release. Use JavaScript default parameters instead.
    at FullNameField (http://localhost:8000/src/visitors/FullNameField.tsx:24:11)
    at VisitorTitle
    at span
    at PageTitle (http://localhost:8000/@fs/Users/francois/Documents/git/react-admin/packages/ra-ui-materialui/src/layout/PageTitle.tsx:19:29)
    at span
    at http://localhost:8000/node_modules/.vite/deps/chunk-SN5K255F.js?v=f8fb0d4a:1695:50
    at PreferenceKeyContextProvider (http://localhost:8000/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/preferences/PreferenceKeyContext.tsx:21:3)
    at Configurable (http://localhost:8000/@fs/Users/francois/Documents/git/react-admin/packages/ra-ui-materialui/src/preferences/Configurable.tsx:31:5)
    at PageTitleConfigurable (http://localhost:8000/@fs/Users/francois/Documents/git/react-admin/packages/ra-ui-materialui/src/layout/PageTitleConfigurable.tsx:54:41)
    at Title (http://localhost:8000/@fs/Users/francois/Documents/git/react-admin/packages/ra-ui-materialui/src/layout/Title.tsx:24:11)
    at div
    at http://localhost:8000/node_modules/.vite/deps/chunk-SN5K255F.js?v=f8fb0d4a:1695:50
    at EditView (http://localhost:8000/@fs/Users/francois/Documents/git/react-admin/packages/ra-ui-materialui/src/detail/EditView.tsx:31:5)
    at RecordContextProvider (http://localhost:8000/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/controller/record/RecordContext.tsx:23:3)
    at SaveContextProvider (http://localhost:8000/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/controller/saveContext/SaveContextProvider.tsx:18:39)
    at EditContextProvider (http://localhost:8000/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/controller/edit/EditContextProvider.tsx:22:3)
    at EditBase (http://localhost:8000/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/controller/edit/EditBase.tsx:22:3)
    at Edit (http://localhost:8000/@fs/Users/francois/Documents/git/react-admin/packages/ra-ui-materialui/src/detail/Edit.tsx:25:3)
    at VisitorEdit (http://localhost:8000/src/visitors/VisitorEdit.tsx:34:21)
    at RenderedRoute (http://localhost:8000/node_modules/.vite/deps/chunk-GU2QS2OM.js?v=f8fb0d4a:3540:5)
    at Routes (http://localhost:8000/node_modules/.vite/deps/chunk-GU2QS2OM.js?v=f8fb0d4a:4045:5)
    at ResourceContextProvider (http://localhost:8000/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/core/ResourceContextProvider.tsx:19:3)
    at Resource (http://localhost:8000/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/core/Resource.tsx:23:11)
    at RenderedRoute (http://localhost:8000/node_modules/.vite/deps/chunk-GU2QS2OM.js?v=f8fb0d4a:3540:5)
    at Routes (http://localhost:8000/node_modules/.vite/deps/chunk-GU2QS2OM.js?v=f8fb0d4a:4045:5)
    at Suspense
    at ErrorBoundary (http://localhost:8000/node_modules/.vite/deps/react-error-boundary.js?v=42981a9a:18:5)
    at div
    at main
    at div
    at div
    at http://localhost:8000/node_modules/.vite/deps/chunk-SN5K255F.js?v=f8fb0d4a:1695:50
    at Layout (http://localhost:8000/@fs/Users/francois/Documents/git/react-admin/packages/ra-ui-materialui/src/layout/Layout.tsx:32:13)
    at default (http://localhost:8000/src/layout/Layout.tsx:5:19)
    at RenderedRoute (http://localhost:8000/node_modules/.vite/deps/chunk-GU2QS2OM.js?v=f8fb0d4a:3540:5)
    at Routes (http://localhost:8000/node_modules/.vite/deps/chunk-GU2QS2OM.js?v=f8fb0d4a:4045:5)
    at CoreAdminRoutes (http://localhost:8000/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/core/CoreAdminRoutes.tsx:26:3)
    at RenderedRoute (http://localhost:8000/node_modules/.vite/deps/chunk-GU2QS2OM.js?v=f8fb0d4a:3540:5)
    at Routes (http://localhost:8000/node_modules/.vite/deps/chunk-GU2QS2OM.js?v=f8fb0d4a:4045:5)
    at ErrorBoundary (http://localhost:8000/node_modules/.vite/deps/react-error-boundary.js?v=42981a9a:18:5)
    at CoreAdminUI (http://localhost:8000/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/core/CoreAdminUI.tsx:65:37)
    at div
    at http://localhost:8000/node_modules/.vite/deps/chunk-SN5K255F.js?v=f8fb0d4a:1695:50
    at ScopedCssBaseline2 (http://localhost:8000/node_modules/.vite/deps/@mui_material.js?v=f98a2fb0:11736:17)
    at AdminUI (http://localhost:8000/@fs/Users/francois/Documents/git/react-admin/packages/ra-ui-materialui/src/AdminUI.tsx:29:3)
    at RtlProvider (http://localhost:8000/node_modules/.vite/deps/chunk-CSK5FG2C.js?v=f8fb0d4a:1029:5)
    at ThemeProvider (http://localhost:8000/node_modules/.vite/deps/chunk-CSK5FG2C.js?v=f8fb0d4a:978:5)
    at ThemeProvider2 (http://localhost:8000/node_modules/.vite/deps/chunk-CSK5FG2C.js?v=f8fb0d4a:1068:5)
    at ThemeProvider (http://localhost:8000/node_modules/.vite/deps/chunk-S6OTIEBM.js?v=f8fb0d4a:301:12)
    at ThemeProvider (http://localhost:8000/@fs/Users/francois/Documents/git/react-admin/packages/ra-ui-materialui/src/theme/ThemeProvider.tsx:26:33)
    at ResourceDefinitionContextProvider (http://localhost:8000/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/core/ResourceDefinitionContext.tsx:28:16)
    at NotificationContextProvider (http://localhost:8000/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/notification/NotificationContextProvider.tsx:21:47)
    at I18nContextProvider (http://localhost:8000/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/i18n/I18nContextProvider.tsx:23:3)
    at RenderedRoute (http://localhost:8000/node_modules/.vite/deps/chunk-GU2QS2OM.js?v=f8fb0d4a:3540:5)
    at RenderErrorBoundary (http://localhost:8000/node_modules/.vite/deps/chunk-GU2QS2OM.js?v=f8fb0d4a:3500:5)
    at DataRoutes (http://localhost:8000/node_modules/.vite/deps/react-router-dom.js?v=690e9e87:542:5)
    at Router (http://localhost:8000/node_modules/.vite/deps/chunk-GU2QS2OM.js?v=f8fb0d4a:3988:15)
    at RouterProvider (http://localhost:8000/node_modules/.vite/deps/react-router-dom.js?v=690e9e87:359:5)
    at InternalRouter (http://localhost:8000/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/routing/AdminRouter.tsx:51:3)
    at BasenameContextProvider (http://localhost:8000/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/routing/BasenameContextProvider.tsx:18:43)
    at AdminRouter (http://localhost:8000/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/routing/AdminRouter.tsx:24:31)
    at QueryClientProvider (http://localhost:8000/node_modules/.vite/deps/@tanstack_react-query.js?v=0b689529:2589:3)
    at PreferencesEditorContextProvider (http://localhost:8000/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/preferences/PreferencesEditorContextProvider.tsx:22:52)
    at StoreContextProvider (http://localhost:8000/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/store/StoreContextProvider.tsx:21:10)
    at CoreAdminContext (http://localhost:8000/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/core/CoreAdminContext.tsx:36:5)
    at AdminContext (http://localhost:8000/@fs/Users/francois/Documents/git/react-admin/packages/ra-ui-materialui/src/AdminContext.tsx:26:5)
    at Admin (http://localhost:8000/@fs/Users/francois/Documents/git/react-admin/packages/react-admin/src/Admin.tsx:26:5)
    at App (http://localhost:8000/src/App.tsx:57:23)
    at StoreContextProvider (http://localhost:8000/@fs/Users/francois/Documents/git/react-admin/packages/ra-core/src/store/StoreContextProvider.tsx:21:10)
    at AppWrapper

@slax57
Copy link
Contributor

slax57 commented Jun 17, 2024

Got another one of these in the http://localhost:8000/#/reviews/create page:

A props object containing a "key" prop is being spread into JSX:

@slax57 slax57 added this to the 5.0.0 milestone Jun 17, 2024
@slax57 slax57 merged commit e2fa925 into next Jun 17, 2024
14 checks passed
@slax57 slax57 deleted the react-19 branch June 17, 2024 13:48
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
RFR Ready For Review
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants