1

I am trying to integrate react-admin into an existing react app and am able to get the basic starter pages up and running , however, after adding a dummy resource and clicking on it in the UI, I am redirected to http://my-application.net/[resource name], which is incorrectly showing my applications error page.

I am trying to set up react admin in a sandbox-like scenario to avoid conflicts with some custom stuff I'm using for routing* and I currently have things set up to display react-admin under the /admin path in my app. Is it possible to tell react-admin to prefix all of its links (i.e. when clicking on a resource) with admin so that my app can correctly detect and route these pages to react-admin? For example, in the scenario from the last paragraph, when clicking on the dummy resource, i want it to direct me to http://my-application.net/admin/[resource name] instead of http://my-application.net/[resource name]

The closest I have been able to get is this SO post, which talks about adding admin/ as a prefix to the name of all resources. I have been able to make this work with some tweaks to my routing configuration to send all /admin pages to react-admin, but changing the resource names like this also has the side effect of changing them in the UI (i.e. my users resource appears as admin/users in the sidebar of react-admin)

Other things I looked at that didn't seem to be useful:

  • Using the customRoutes prop in <Admin>
  • <Resource>'s props seem to be intended more for tweaking the end of urls for different CRUD operations
  • this SO post seems like it might be about something different since this is the first mention ive seen of UrlField.

Does React-admin have an option to automatically add a baseUrl to all it's links?

* While not relevant for this question, the reason I am trying to do things this way is because my routing system (UniversalRouter, see here) is redux-based and appears to directly conflict with some of the redux state that react-admin needs according to the Using redux in a custom app tutorial.

MoralCode
  • 1,954
  • 1
  • 20
  • 42

1 Answers1

0

An answer I found from a post the StackOverflow "related" sidebar seems to suggest that the history API has this kind of functionality:

The only other thing I can think of is properly configuring baseName in your history.

referring to this line in the OP's question (variable name changed for clarity):

const newHistory = createHistory({ basename: '/myadmin' });

Passing this modified history into react-admin's Admin component seems to achieve the intended behavior where clicking on resource links now correctly redirects to that resource underneath the specified baseURL.

<Admin ... history={newHistory} ...>

This is also mentioned in this other answer, which is way more concise than mine or the one i based this answer off of.

MoralCode
  • 1,954
  • 1
  • 20
  • 42