Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Custom path for resource route in react-admin

Tags:

react-admin

Is there any way to specify custom paths for resources?

Example: <Resource name="User" path="/manageUsers" {...}>

If it's not possible "per resource", can we for example have all the CRUD pages be under a same basepath like: /crud/{/$resource.name} but keep the custom routes without that basepath.

Thank you very much.

EDIT #1

For context, we are building an admin panel that will have a lot of flows, basically step-by-step creation of resources. So I applaud the react-admin library for what it does (manage the CRUD part), but I want more flexibility in how the URLs are going to be.

I will need to have a section called /manageUsers/ that will have some data like a dashboard, and then the list could be /manageUsers/list/.

And then I may need another section called /customers/ that would list directly on that page.

EDIT #2

To give another use case, I'm trying to use graphQL as the dataProvider, and I had to rename all my resources since the rest API is using users where as the graphQL resource is User. So all my urls are now different!

I hope that makes it a bit more clear.

like image 407
E2zin Avatar asked Feb 08 '19 03:02

E2zin


People also ask

How do I add a custom route in react admin?

To register your own routes, pass one or several <CustomRoutes> elements as children of <Admin> . Declare as many react-router-dom <Route> as you want inside them. Alternatively, you can add your custom routes to resources. They will be available under the resource prefix.

How do I change the default path in React router?

Use the Navigate element to set a default route with redirect in React Router, e.g. <Route path="/" element={<Navigate to="/dashboard" />} /> . The Navigate element changes the current location when it is rendered.

How do I get the path PATH IN React?

If you need to access the path, use window. location. pathname . The pathname property returns a string containing the path of the URL for the location.


1 Answers

Is there any way to specify custom paths for resources?

No, this is not supported at the moment. One way to tackle this would be to use manageUsers as the resource name and translate it to User in your dataProvider.

I will need to have a section called /manageUsers/ that will have some data like a dashboard, and then the list could be /manageUsers/list/.

Definitely not supported by default either. However, you can replace the default Resource component with your own. It actually just creates routes for the resource inside a React Router switch. Note that you'll probably have to override the redirect prop of some components (such as Edit) because, when passed list, they expect the list to be at the resource root path.

I had to rename all my resources since the rest API is using users where as the graphQL resource is User

That's the dataProvider job to translate resources names into what your backend expect. Use resource names that make sense for your users (url wise).

like image 133
Gildas Garcia Avatar answered Sep 30 '22 12:09

Gildas Garcia