Error: Could not find router reducer in state tree, it must be mounted under "router" - React-Admin doesn't work with history@5.0.0

[altenorjr]

I'm not sure if I should be posting this here, but after couple hours of headache I found the solution, so I'm here only to share, as it is probably happening to a lot of people.

As mentioned in https://marmelab.com/react-admin/Admin.html#history, I tried to use the snippet

import { createBrowserHistory as createHistory } from 'history';

const history = createHistory();

const App = () => (
    <Admin history={history}>
        ...
    </Admin>
);

I installed the history module and then began receiving the following error message:

Could not find router reducer in state tree, it must be mounted under "router".

I eventually stumbled upon this thread and found a life-saving suggestion

supasate/connected-react-router#312

No, just lib history update v5.0.0, i decrease verion 4.10.1, it's work ok
remix-run/history#804

I did as he suggested and my App came back to life.

I didn't have time to dig too deep into it, but for what I realized, there's probably a mismatch between the versions of react-router-dom and the history module. But I have zero confidence that's really the case.

So I really don't know what to do with the information.

I'm using the latest and greatest version (3.9.5) of react-admin, of which I'm becoming an evangelist. (Nice work, guys!). The project was created just two days ago. I've have been using RA for the last year with never having a single problem up until now.

[ejferg]

I'm having the same problem.

[djhi]

Thanks @altenorjr :)

[fzaninotto]

I'd love to be able to detect the version of history passed to react-admin, and throw an explicit warning if it's a 5.0, but unfortunately I didn't find anything in the history public API allowing for that.

If anyone knows a way, please chime in!

I'm reopening this issue as it's something that will bite more devs.

[altenorjr]

@fzaninotto I think while it isn't fixed, this info could be be included in the docs, under the history prop section in the component docs.

Apart from actually fixing it, I guess maybe setting the history module as a peerDependency and locking it to the last known working version (4.10.1) could potentially do the trick. Or at least work as a warning or a guide.

[magnattic]

I am facing this same errror message in a project running yarn 3 in pnp mode. I am not even using history directly.

I have storybook in the same workspace that uses a history >5, but that shouldn't really affect anything as yarn should be isolating the subdependencies, right?

yarn why history
├─ @storybook/router@npm:6.4.0-beta.22
│ └─ history@npm:5.0.1 (via npm:^5.0.1)
│
├─ @storybook/router@npm:6.4.0-beta.22 [6c9a3]
│ └─ history@npm:5.0.1 (via npm:^5.0.1)
│
├─ @storybook/router@npm:6.4.0-beta.22 [dfecf]
│ └─ history@npm:5.0.1 (via npm:^5.0.1)
│
├─ react-router-dom@npm:5.3.0
│ └─ history@npm:4.10.1 (via npm:^4.9.0)
│
├─ react-router-dom@npm:5.3.0 [0e836]
│ └─ history@npm:4.10.1 (via npm:^4.9.0)
│
├─ react-router@npm:5.2.1
│ └─ history@npm:4.10.1 (via npm:^4.9.0)
│
└─ react-router@npm:5.2.1 [0e836]
└─ history@npm:4.10.1 (via npm:^4.9.0)

Any idea what the source could be and how to fix it?