Component not updating

This is my router:

import { createBrowserRouter, Link, makeRouteConfig, Route } from 'found';

export const Router = createBrowserRouter({
    routeConfig: makeRouteConfig(
        <Route path='/'>
            <Route 
                path='/a'
                Component={() => <div>You are on A. Go to <Link to='/b'>B</Link></div>}
            />
            <Route
                path='/b'
                Component={() => <div>You are on B. Go to <Link to='/a'>A</Link></div>}
            />
        </Route>
    )
})

And I am rendering it to the DOM like this:

const root = ReactDOM.createRoot(
  document.getElementById('root') as HTMLElement
);
root.render(
  <React.StrictMode>
    <Router/>
  </React.StrictMode>
);

I start using the application on the /a path which displays fine. I then click the link which changes the link in the browser’s address bar but does not render the other component. What am I doing wrong? Does this have something to do with React 18? I saw there is an issue open right now regarding React 18 but that was resolved “by miracle” and I am not able to resolve it. Should I try downgrading React?

These are the versions I am using:

"react-dom": "^18.0.0",
"react": "^18.0.0",
"found": "^1.1.1",

[jquense]

should be fixed in https://github.com/4Catalyzer/found/commit/5c82516d93f93b94d1e16b7bfb216286074ae18d and released as 1.1.2, please test it out

[jquense]

I have been nerd sniped into working on this today, and so far what I gather is that most of the issues are due react 18 strict mode double mounting components, and side effects in lifecycles. Hoping its pretty easy to fix