Routes seem to be 'cached', trying to access the same route results in no navigation

Currently trying to implement this due to being unable to use react router V6 and history v5 together, hoping this package can help.

Looks like I've configured everything correctly and routing works but it seems that if I visit a URL and then go to visit the same URL, there is no navigation between pages on my app. This happens with both user navigation (buttons on the components) as well as the browser back buttons. Quick example of my code and the issue I'm facing. From what I can tell the redux actions are firing correctly.

Routing Issue:

Navigate to /tests route
- shown TestsPage
Navigate to /test/test-id route
- shown TestView page
Navigate back to /tests route
- browser URL changes but page does not navigate to TestsPage

AppRouter.tsx

export const history = createBrowserHistory();

<ReduxRouter history={history}>
    <Routes>
        <Route path="/test/create" element={<TestCreatePage />}
        <Route path="/" element={<Nav />}>
        <Route path="tests" element={<TestsPage />} />
        </Route>
    <Route
        path="/tests/:testId"
        element={<TestView />}
    />
    </Routes>
</ReduxRouter>

reducer.ts

const historyReducer = createRouterReducerMapObject(history);

export const rootReducer = combineReducers({
    [api.reducerPath]: api.reducer,
    [testSlice.name]: testSlice.reducer,
    [authSlice.name]: authSlice.reducer,
    ...historyReducer,
});

storeConfig.ts

const historyMiddleware = createRouterMiddleware(history);

// Persist root reducer
const persistedReducer = persistReducer(persistConfig, rootReducer);

// Configure redux store using redux toolkit
const store = configureStore({
    reducer: persistedReducer,
    middleware: (getDefaultMiddleware) =>
        getDefaultMiddleware({
            serializableCheck: {
                // These actions are ignored to prevent errors during re-hydration
                ignoredActions: [
                    FLUSH,
                    REHYDRATE,
                    PAUSE,
                    PERSIST,
                    PURGE,
                    REGISTER,
                ],
            },
        })
        .concat(
            api.middleware,
            authListenerMiddleware.middleware
        )
    .prepend(historyMiddleware),
});

Sorry for the long wall of text, just wanted to get enough information across of my setup in hopes you can spot me doing something dumb 😄. Cheers!

EDIT: Main reason I'm doing this is so I can use history.push() etc within functions/redux actions without issues. I've also been able to just about get away with it by using unstable_HistoryRouter from react-router-dom although unsure when support for that will end.

lagunovsky / redux-react-router

Routes seem to be 'cached', trying to access the same route results in no navigation #14