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

Add support for React 19 #10437

Merged
merged 18 commits into from
Jan 10, 2025
Merged

Add support for React 19 #10437

merged 18 commits into from
Jan 10, 2025

Conversation

djhi
Copy link
Collaborator

@djhi djhi commented Jan 7, 2025

Problem

React 19 is out !

Solution

Add support for React 19. Requires to upgrade MUI to latest v5.

  • react-admin packages will still use v18 in their devDependencies to ensure we don't use v19 only features inadvertently.
  • The tutorial and e-commerce demo will use v19 so that we have an easy way to test v19

TODO

  • Fix CRM demo
  • Upgrade react-is

How To Test

  • Run each app and check that they work as before
  • Run the tests

Additional Checks

  • The PR targets master for a bugfix, or next for a feature

@djhi djhi added RFR Ready For Review WIP Work In Progress and removed WIP Work In Progress RFR Ready For Review labels Jan 8, 2025
@djhi djhi added RFR Ready For Review and removed WIP Work In Progress labels Jan 8, 2025
@djhi djhi mentioned this pull request Jan 8, 2025
1 task
@djhi djhi added WIP Work In Progress and removed RFR Ready For Review labels Jan 9, 2025
@djhi djhi added RFR Ready For Review and removed WIP Work In Progress labels Jan 9, 2025
@slax57 slax57 self-requested a review January 9, 2025 09:49
@djhi djhi mentioned this pull request Jan 9, 2025
3 tasks
examples/crm/package.json Outdated Show resolved Hide resolved
examples/crm/vite.config.ts Show resolved Hide resolved
examples/no-code/package.json Outdated Show resolved Hide resolved
examples/demo/package.json Show resolved Hide resolved
packages/ra-input-rich-text/package.json Outdated Show resolved Hide resolved
packages/ra-ui-materialui/package.json Show resolved Hide resolved
examples/demo/src/products/ProductEdit.tsx Outdated Show resolved Hide resolved
Comment on lines +34 to +35
"little-state-machine": "^4.8.1",
"react-simple-animate": "^3.5.3",
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Had to add those manually (hookform devtools depends on them) to have react-19 support

@@ -4761,13 +4690,34 @@ __metadata:
languageName: node
linkType: hard

"@types/d3-array@npm:^3.0.3":
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

There are a bunch of duplicates I can't resolve here with d3. This is because of recharts and one of its dependency (victory) that have conflicting types deps

@@ -47,7 +47,7 @@ const App = () => {
const darkTheme = themes.find(theme => theme.name === themeName)?.dark;
return (
<Admin
title=""
title="Posters Galore Admin"
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Added to access it in custom titles

Comment on lines +69 to +72
const pageTitle = translate('ra.page.edit', {
name: getResourceLabel('categories', 1),
recordRepresentation: `"${record?.name}"`,
});
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I did not use usePageTitle here because we want the quotes around the name in titles but not in the record representation

Comment on lines +43 to +46
const pageTitle = translate('ra.page.edit', {
name: getResourceLabel('products', 1),
recordRepresentation: `"${record?.reference}"`,
});
Copy link
Collaborator Author

@djhi djhi Jan 9, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I did not use usePageTitle here because we want the quotes around the reference in titles but not in the record representation

@@ -121,6 +122,7 @@ export const SimpleList = <RecordType extends RaRecord = any>(
rowClick={rowClick}
rowSx={rowSx}
rowStyle={rowStyle}
resource={resource}
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This fixes an issue we somehow missed before: SimpleList was not propagating its resource prop

Copy link
Contributor

@slax57 slax57 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Almost there!

examples/demo/src/segments/Segments.tsx Outdated Show resolved Hide resolved
@slax57 slax57 added this to the 5.5.0 milestone Jan 10, 2025
@slax57 slax57 merged commit 40bda09 into next Jan 10, 2025
15 checks passed
@slax57 slax57 deleted the react-19 branch January 10, 2025 09:05
@slax57 slax57 changed the title Supports react 19 React 19 support Jan 10, 2025
@slax57 slax57 changed the title React 19 support Add support for React 19 Jan 10, 2025
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.

2 participants