search

marmelab / react-admin

A frontend Framework for single-page applications on top of REST/GraphQL APIs, using TypeScript, React and Material Design
http://marmelab.com/react-admin
MIT License
24.93k stars 5.24k forks source link

[RFC] React-admin v5 #9462

Closed fzaninotto closed 4 months ago

fzaninotto commented 11 months ago

Rationale

It's been a year and a half since version 4.0. The React ecosystem has evolved a lot since then, and we must accept a few breaking changes in the react-admin codebase to keep up-to-date. So we're starting the work on the next major version, react-admin v5.

The main constraint of this version is to be a painless migration from v4. The 3.0 to 4.0 migration was costly for many developers, we don't want to reiterate that. The migration should take at most a day on a moderate size admin app.

Breaking Changes

See the progress in the following milestones:

Out Of Scope

Roadmap

We intend to release version 5 in early 2024.

There won't be any other major version until 2026, so we must include in v5 all the breaking changes that are necessary to last until then.

Version 5 is now the primary focus of the core team, so there won't be any new minor until we release v5. V4.16 is the last minor release in the 4.x branch. Every new feature will be added to the next branch, which will become react-admin v5.

https://github.com/github/release-radar

We need your feedback

Are there other breaking changes that you think should make it to v5? Please give us your feedback by commenting on this issue.

Note: Please don't comment with feature requests that don't imply any breaking change. For those, simply open a new issue.

quentin-decre commented 11 months ago

I am aligned with the changes and what is out of scope. Useful parts for us :

Thanks for your very nice work !

panfiva commented 10 months ago

there are a few tickets that mentioned implementing them in v5. one of them is moving title to context. that would be a good change. https://github.com/marmelab/react-admin/issues/8872

panfiva commented 10 months ago

Change how setFilters work to make it more convenient to use:

Nilegfx commented 10 months ago
KilianB commented 10 months ago
  • could you please elaborate more on this one Remove cloneElement in inputs by introducing an input name prefix context. maybe an example?

As far as I can remember cloneElement is used to augment the path of nested form controls e.g. inside ReferenceManyInput to have a unique location for the purpose of react-hook-forms useController . One thing that cost me hours was the inability to nest layout elements inside certain components as they would expect the direct children to be the input/field components. This would be fixed with this change right?

Does the rework of the stricter Typescript types include generics for input components? Those would save a lot of issues and if registered Resources could be types, this help a lot during development

panfiva commented 10 months ago

Evaluate migration to future.v7_relativeSplatPath flag that react-router team implemented to address breaking change that they made in 6.19.0.

https://github.com/remix-run/react-router/blob/main/packages/react-router-dom/CHANGELOG.md#6210

djhi commented 10 months ago

As far as I can remember cloneElement is used to augment the path of nested form controls e.g. inside ReferenceManyInput to have a unique location for the purpose of react-hook-forms useController . One thing that cost me hours was the inability to nest layout elements inside certain components as they would expect the direct children to be the input/field components. This would be fixed with this change right?

Yes, that's the plan. Some high level components might still inspect children though, Datagrid for instance.

Does the rework of the stricter Typescript types include generics for input components? Those would save a lot of issues and if registered Resources could be types, this help a lot during development

Yes, we have plans for this. Not necessarily in v5.0 though

milutinovici commented 10 months ago

Consider switching to https://github.com/TanStack/router?

fzaninotto commented 9 months ago

Consider switching to https://github.com/TanStack/router?

Why would we want to do that? What problems does react-router have that tanstack router would solve?

milutinovici commented 9 months ago

This blog post explains all the advantages

https://swizec.com/blog/tanstack-router-modern-react-for-the-rest-of-us/

fzaninotto commented 9 months ago

@milutinovici I don't understand the pain points that TanStack router would solve in react-admin apps.

DiegoAndai commented 9 months ago

Hey! Material UI has announced its v6 release for 2024 focusing on a new style engine: https://github.com/mui/material-ui/issues/38137

The timeline (kind of) aligns with React-admin's v5, and I thought you might be interested, especially given there won't be any other major version until 2026.

Let us know! 😊

fzaninotto commented 9 months ago

They announce v6 for Q2 2024... Which is late for us. It could mean up to 7 months without a new minor release for react-admin, which is too much. Besides, we'll need to wait until the dust settles e bit before using it, so I don't see our development on the new MUI starting before fall 24.

IMO, their schedule isn't compatible with ours, and react-admin v5 won't use MUI v6.

davidhenley commented 8 months ago

Make all input width 100% by default (to make this page nicer)

Finally!

smeng9 commented 7 months ago

I suggest we also update the documentation website to show the documentation for a specific branch (e.g. next as unreleased) in the dropdown selection before v5 is officially released. After v5 release we can then decide whether to remove that item from the dropdown list.

I propose we can do something like ESLint documentation in https://github.com/eslint/eslint/pull/18139

Screenshot 2024-02-29 at 10 00 10 AM

This feature request may be a breaking change for the current ci pipeline, but it will be particularly helpful for early adopters to try and give feedbacks without the need to build and serve the documentation locally. During the upgrade cycle from v3 to v4 we don't have such thing for a better developer experience and a smoother migration.

smeng9 commented 7 months ago

Hi @fzaninotto any plans on updating the docs on the https://marmelab.com/react-admin/documentation.html for v5 alpha?

fzaninotto commented 7 months ago

@smeng9 No, we don't have such plans. The docs on the react-admin website will only be updated when we release v5 stable. In the meantime, you can browse the V5 docs at https://github.com/marmelab/react-admin/tree/next/docs.

MohammedFaragallah commented 5 months ago

Hello thank you for all your hard and amazing work

I see that you're planning on updating dependencies to their last major does that include date-fns? I can work on a PR.

fzaninotto commented 5 months ago

@MohammedFaragallah yes, good idea! PR welcome.

lefuturiste commented 5 months ago

On the issue of dynamic title #5893 If I understand correctly, the goal is to automatically update the document title from the title in TitlePortal. The PR that implemented this behaviour #6119 was reverted in #6357 because of an hidden breaking changes. So may be the v5 is the right time to re-introduce this patch/PR?

MohammedFaragallah commented 5 months ago

@fzaninotto what do you think about updating these packages

fzaninotto commented 5 months ago

@MohammedFaragallah I'm all for it, please feel free to open one PR per dependency

fzaninotto commented 5 months ago

On the issue of dynamic title #5893 If I understand correctly, the goal is to automatically update the document title from the title in TitlePortal. The PR that implemented this behaviour #6119 was reverted in #6357 because of an hidden breaking changes. So may be the v5 is the right time to re-introduce this patch/PR?

Yes, it's a good time. Would you like to try and solve the issue?

fzaninotto commented 5 months ago

@tauqeer-trailfive Do you know when it is supposed to be released?

fzaninotto commented 5 months ago

We hope to release react-admin v5 not too far in the future (ideally in a month from now). I doubt React 19 will be up at that time.

Also, which react 19 features do you think would benefit to react-admin ?

MohammedFaragallah commented 5 months ago

what do you think about adding generics to infer the returned props types from sanitize rest functions?

something like this

const sanitizeRestProps = <T extends Record<string, unknown>>({
    record,
    resource,
    initialValues,
    translate,
    ...rest
}: T) => rest;

rest here is typed Omit<T, "record" | "resource" | "initialValues" | "translate"> which is far more useful than the previous any

I can work on a PR

fzaninotto commented 5 months ago

what do you think about adding generics to infer the returned props types from sanitize rest functions?

I don't see the interest for the end user, and I don't see it as a breaking change. We do a v5 especially for breaking changes. So while your suggestion might bring some improvements to the core team, it won't be a priority.

MohammedFaragallah commented 5 months ago

I don't see the interest for the end user, and I don't see it as a breaking change.

I disagree i just noticed this while writing a custom input and I thought my experience would have been better if I had the returned props types and also if the sanitizers were exported instead of having to copy-paste them and keep them in sync

I understand if this is not a priority RN though 🤝

sixers commented 5 months ago

When can we expect 5.0.0-beta.1 release?

fzaninotto commented 5 months ago

When can we expect 5.0.0-beta.1 release?

Today! https://github.com/marmelab/react-admin/releases/tag/v5.0.0-beta.1

sixers commented 5 months ago

@fzaninotto I noticed that RA v5 still shows a few TS errors when strict: true, it only works with strict: false and strictNullChecks: true. Is it possible to go full strict mode before final v5 release? Looks like you're extremely close to achieving that.

fzaninotto commented 5 months ago

@fzaninotto I noticed that RA v5 still shows a few TS errors when strict: true, it only works with strict: false and strictNullChecks: true. Is it possible to go full strict mode before final v5 release? Looks like you're extremely close to achieving that.

This is not in our target for v5. However, if you want to submit a PR and it's small enough to be merged quickly, we'll take a look at it.

fzaninotto commented 4 months ago

5.0.0-beta.2 is out: https://github.com/marmelab/react-admin/releases/tag/v5.0.0-beta.2

fzaninotto commented 4 months ago

5.0.0-beta.3 is out: https://github.com/marmelab/react-admin/releases/tag/v5.0.0-beta.3

fzaninotto commented 4 months ago

5.0.0-rc.0 is out: https://github.com/marmelab/react-admin/releases/tag/v5.0.0-rc.0

This version will likely become 5.0 stable this Thursday, unless we receive some regression reports.

kztmk commented 4 months ago

I tried V5.0.0-rc.0:

node: v20.12.2 macOSX 14.5

How can I resolve this?

❯ npm init react-admin@next my-project Need to install the following packages: create-react-admin@5.0.0-rc.0 Ok to proceed? (y) Warning: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:

  1. You might have mismatching versions of React and the renderer (such as React DOM)
  2. You might be breaking the Rules of Hooks
  3. You might have more than one copy of React in the same app See https://reactjs.org/link/invalid-hook-call for tips about how to debug and fix this problem. Warning: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
  4. You might have mismatching versions of React and the renderer (such as React DOM)
  5. You might be breaking the Rules of Hooks
  6. You might have more than one copy of React in the same app See https://reactjs.org/link/invalid-hook-call for tips about how to debug and fix this problem.

ERROR Cannot read properties of null (reading 'useReducer')

/Users/username/.npm/_npx/f03da9ea442c06c6/node_modules/create-react-admin/node_modules/react/cjs/react.development .js:1626:21

1623: } 1624: function useReducer(reducer, initialArg, init) { 1625: var dispatcher = resolveDispatcher(); 1626: return dispatcher.useReducer(reducer, initialArg, init); 1627: } 1628: function useRef(initialValue) { 1629: var dispatcher = resolveDispatcher();

fzaninotto commented 4 months ago

@kztmk reproduced, thanks. We'll soon release a fix.

fzaninotto commented 4 months ago

v5.0.0-rc.1 is out. It fixes create-react-admin.

https://github.com/marmelab/react-admin/releases/tag/v5.0.0-rc.1

There is still a problem if you choose FakeRest as your data provider because of a typo in a dependency list, fixed in 795cd74f628071a4200eea79bb856b5654e2653d but not part of rc.1.

fzaninotto commented 4 months ago

React-admin v5 is out! https://github.com/marmelab/react-admin/releases/tag/v5.0.0