useParams query

[torn iron]

@grave bridge I do not understand the question. could you rephrase, maybe give an example?

btw with nested routes I think the paths need to look like this. the inner route already gets papers/:track from the parent

<Route path="/papers/:track" element={<TrackPage />}>
  <Route path="view/:paperId" element={<AbstractModal />} />
</Route>

[torn iron]

ok, I see. so you want to constrain a path param to a particular set of values

here are two ways. first way sounds stupid but it's actually great. hard code them as routes

<Route path="/papers/interactivity" element={<TrackPage />}>
  <Route path="view/:paperId" element={<AbstractModal />} />
</Route>
<Route path="/papers/fullpapers" element={<TrackPage />}>
  <Route path="view/:paperId" element={<AbstractModal />} />
</Route>
<Route path="/papers/wip" element={<TrackPage />}>
  <Route path="view/:paperId" element={<AbstractModal />} />
</Route>

if you plan on having multiple routes inside, I think you can do something like this to avoid too much duplication

const inner = (
  <>
     <Route path="view/:paperId" element={<AbstractModal />} />
     <Route path="other" element={<OtherPage />} />
  </>
)

<Route path="/papers/wip" element={<TrackPage />}>
  {inner}
</Route>

other way only works if you're on React Router 6.4 and using a DataBrowserRouter. keep a single route with path="/papers/:track" and check the param against a list of valid options in a loader and throw a 404 if it's not a valid one, then use an error boundary at top level to catch the 404