react-admin

Variables

• defaultI18nProvider

Functions

• Admin()

Interfaces

• AdminProps

variable defaultI18nProvider

const defaultI18nProvider: any;

function Admin

Admin: (props: AdminProps) => React.JSX.Element;

• Main admin component, entry point to the application.

  Initializes the various contexts (auth, data, i18n, router) and defines the main routes.

  Expects a list of resources as children, or a function returning a list of resources based on the permissions.

  Example 1

  // static list of resources

  import { Admin, Resource, ListGuesser, useDataProvider, } from 'react-admin';

  const App = () => ( <Admin dataProvider={myDataProvider}> <Resource name="posts" list={ListGuesser} /> );

  // dynamic list of resources based on permissions

  import { Admin, Resource, ListGuesser, useDataProvider, } from 'react-admin';

  const App = () => ( <Admin dataProvider={myDataProvider}> {permissions => [ <Resource name="posts" key="posts" list={ListGuesser} />, ]} );

  // If you have to build a dynamic list of resources using a side effect, // you can't use . But as it delegates to sub components, // it's relatively straightforward to replace it:

  import * as React from 'react'; import { useEffect, useState } from 'react'; import { AdminContext, AdminUI, defaultI18nProvider, localStorageStore, Resource, ListGuesser, useDataProvider, } from 'react-admin';

  const store = localStorageStore();

  const App = () => ( <AdminContext dataProvider={myDataProvider} i18nProvider={defaultI18nProvider} store={store}> );

  const Resources = () => { const [resources, setResources] = useState([]); const dataProvider = useDataProvider(); useEffect(() => { dataProvider.introspect().then(r => setResources(r)); }, []);

  return ( {resources.map(resource => ( <Resource name={resource.name} key={resource.key} list={ListGuesser} /> ))} ); };