I'm fairly new to React and am trying to get the BrowserRouter to render properly. However, when this renders:

ReactDOM.render(
  <ApolloProvider client={client}>
    
    <Router>
      <Routes>
        <Route element={<Nav />} />
        <Route path="/" element={<Search />}>
            <Route path="search" element={<Content />} />
        </Route>
      </Routes>
    </Router>
  </ApolloProvider>,
  document.getElementById('root')
)

All that shows up on the page is the Search bar, regardless of whether I'm at the index or at /search. I would like the Nav and Search elements to show up on all pages, and for any nested component to appear only at its specified route (e.g. /search for Content) I imported BrowserRouter as Router. Any help is greatly appreciated!