Skip to content

Conversation

@fzaninotto
Copy link
Member

@fzaninotto fzaninotto commented Jan 2, 2026

Problem

React-admin is tied to react-router. But the two main frameworks used to build new apps today are Next.js and TanStack Start, both NOT using react-router. Although it's possible to integrate RA with Next.js (by opting out of SSR and using a HashRouter), it's cumbersome. It's impossible to do it with TanStack Start.

Solution

Add a routing abstraction layer to allow react-admin to use another router.

Add a TanStack Router implementation to check that the abstraction works for at least 2 routers.

import { Admin, Resource, ListGuesser, tanStackRouterProvider } from 'react-admin';
import { dataProvider } from './dataProvider';

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

export default App;

How To Test

React-admin should use react-router by default, and nothing should be broken. The demo apps should work as before.

A demo app powered by TanStack Router was added:

http://localhost:9010/?path=/story/react-admin-frameworks-tanstack--full-app

It contains CRUD routes and custom routes, as well as sub-routes (TabbedForm) and blocker (useWarnWhenUnsavedChanges). All routing features should work, and are covered by integration tests.

The same demo app can be tested in a second story, where it's embedded into an existing TanStack router app:

http://localhost:9010/?path=/story/react-admin-frameworks-tanstack--embedded

In this case, react-admin doesn't create a router but adds its own routes.

Note: these stories don't reset their route properly, so navigating from one to the other will fail. Refresh the browser when opening one of TanStack router's stories.

Reviewing this PR

This is a large PR, so I rebased the history to allow reviewers to read it commit-by-commit.

The tests should pass at the end of each commit.

Additional Checks

  • The PR targets master for a bugfix or a documentation fix, or next for a feature
  • The PR includes unit tests (if not possible, describe why)
  • The PR includes one or several stories (if not possible, describe why)
  • The documentation is up to date

@fzaninotto fzaninotto added the RFR Ready For Review label Jan 2, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

RFR Ready For Review

Development

Successfully merging this pull request may close these issues.

2 participants