Support for react-router@7.x

[stheine]

There is the new react-router@7.x, and redux-first-history does not yet support that.
Are there plans to do so?

[steinarb]

FWIW I am now using react-router 7.1.1 and both navigation with push and location detection with LOCATION_CHANGE seems to work for me...?

[sahara18]

We’ve discovered an interesting behavior: the project mostly aligns with React Router v7 in our case, except for the redux-first-history/rr6/HistoryRouter wrapper (https://github.com/salvoravida/redux-first-history/blob/master/rr6/index.js).

Since React Router v7 now provides different distribution files (.js and .mjs), different files are used depending on whether import or require is used. As a result, while we were importing React Router in the main project, the redux-first-history wrapper was still requiring it.

This led to the application ending up with two different router instances, which caused failures whenever React Router hooks were used 'outside' the expected context. The library essentially perceived the components as being outside the router.

So far, we haven’t found a better solution than copying the HistoryRouter wrapper into the project and updating it to use modern ES module imports. But perhaps a better approach could be applied?

import React, {ReactNode, useLayoutEffect, useState} from 'react';
import {Router} from 'react-router-dom';
import {History} from 'history';

export type Props = {
	basename?: string,
	history: History,
	children?: ReactNode,
};

export const HistoryRouter = (props: Props) => {
	const {basename, children, history} = props;
	const [historyState, setHistoryState] = useState({
		action: history.action,
		location: history.location,
	});

	useLayoutEffect(()=> (
		history.listen(setHistoryState)
	), [history]);

	return (
		<Router
			basename={basename}
			location={historyState.location}
			navigationType={historyState.action}
			navigator={history}
		>
			{children}
		</Router>
	);
};

[steinarb]

Can the problems with HistoryRouter wrapper be the cause for this problem? #137

(The react-first-history router stopped being recognized as a router when I bumped the vite version to 6)

[sahara18]

Thanks! We’re seeing almost the same error message, coming from an .mjs file — so the issues might be related.

However, the conditions seem different: we’re not using Vite, and the only change that just happened was the migration from React Router v6 to v7.