I have following routing for parent route /files:

/files
  | - /raw-medias
  | - /datasets

Route /files renders tabs for child routes and by default redirects to child route ./raw-medias. Each child route has a list with clickable items. On item click opens item page. There's a Back Button on that page.

Problem: if a user clicks on Datasets tab, then click on item in a list and then click on Back Button then Raw Media tab is active even though the user is on correct route /files/datasets (Datasets tab should be active).

How can I fix that?

Even though files/raw-medias/:rawMediaId and files/datasets/:datasetId are children of /files route I placed them outside in router because they should use HomePage.tsx <Outlet /> (the same as /files route).

Codesanbox: