CODEWITHSUNDEEP
react-admin
R H
R H

Reputation: 1227

How to add more properties to resource in react-admin

I'm working with reac-admin, and according to the demo I have an index file for each resources. for exampale this is my undex to organization resource:

import BusinessIcon from '@material-ui/icons/Business';
import { OrganizationCreate } from './OrganizationCreate';
import { OrganizationEdit } from './OrganizationEdit';
import { OrganizationList } from './OrganizationList';
import { OrganizationShow } from './OrganizationShow';

const resource = {
    list: OrganizationList,
    create: OrganizationCreate,
    edit: OrganizationEdit,
    show: OrganizationShow,
    icon: BusinessIcon,
};

export default resource;

Is it possible to add a custom actions to a resource, in addition to the list, create, edit and show? I mean for example I want my resources to support also in print or in any other action.

something like:

  const resource = {
    list: OrganizationList,
    create: OrganizationCreate,
    edit: OrganizationEdit,
    show: OrganizationShow,
    print: OrgnaizationPrint,
    icon: BusinessIcon,
};

Upvotes: 0

Views: 817

Answers (1)

François Zaninotto
François Zaninotto

Reputation: 7335

The resource allows to define components for predefined routes. If you want to add more components for routes not handled by react-admin, you probably want to override the <Admin customRoutes> prop.

To register your own routes, create a module returning a list of react-router-dom <Route> component:

// in src/customRoutes.js
import * as React from "react";
import { Route } from 'react-router-dom';
import Foo from './Foo';
import Bar from './Bar';

export default [
    <Route exact path="/foo" component={Foo} />,
    <Route exact path="/bar" component={Bar} />,
];

Then, pass this array as customRoutes prop in the <Admin> component:

// in src/App.js
import * as React from "react";
import { Admin } from 'react-admin';

import customRoutes from './customRoutes';

const App = () => (
    <Admin customRoutes={customRoutes} dataProvider={simpleRestProvider('http://path.to.my.api')}>
        ...
    </Admin>
);

export default App;

Taken from the react-admin documentation at https://marmelab.com/react-admin/Admin.html#customroutes

Upvotes: 1

Related Questions