react-admin icon indicating copy to clipboard operation
react-admin copied to clipboard

Add support for admin configuration through props instead of elements

Open djhi opened this issue 2 years ago • 0 comments

Problem

There are rules dictating the allowed children for the Admin components because those are configuration elements. You can't just pass any react elements. This is in part because that's how React Router works when you favor JSX for your routing configuration.

This can come as a surprise for newcomers as you actually have to read the documentation to know about them.

Solution

You can now pass your resources and custom routes as objects through the admin props. This make them explicit (resources, customRoutes and customRoutesWithoutLayout) and discoverable via your IDE autocompletion.

It looks like this:

export const App = () => (
    <Admin
        dataProvider={dataProvider}
        authProvider={authProvider}
        resources={(permissions: any) => ({
            posts: {
                edit: EditGuesser,
                list: ListGuesser,
            },
            comments: {
                list: ListGuesser,
                edit: EditGuesser,
                show: ShowGuesser,
            },
        })}
        customRoutes={(permissions: any) => [
            { path: 'custom', element: <div>Custom route</div> },
        ]}
        customRoutesWithoutLayout={[
            {
                path: 'custom-no-layout',
                element: <div>Custom route no layout</div>,
            },
        ]}
    />
);

TODO

  • [x] Implementation
  • [ ] Tests
  • [ ] Documentation

djhi avatar May 24 '23 15:05 djhi