After going back from Detail to Home page, the title does not change.

[Bersaelor]

I have essentially 2 pages, <Home> on host.com/ and <Detail> onhost.com/:detailId.

Now, basically the structure is like this:

const Home: Component = () => {
  return (
    <MetaProvider>
      <Title>Home</Title>

const Detail: Component = () => {

 return (
    <MetaProvider>
      <Title>{detailData()?.title || ''}</Title>

but the result is like this

https://user-images.githubusercontent.com/4517582/217297678-42e7adf4-1a5d-4af3-8aa3-83423c07f52d.mov

Why does the detail page that is currently not rendered still overwrite the <Title> ?

This only happens when I programmatically do navigate('/', { resolve: false }), not when I use the browser back/forward buttons.