How to make a nested Route in React?

Question

React

Good morning. I hope I phrased the question correctly. How to correctly implement routing for the admin panel from the point of view of the application architecture.
We have an entry point to the admin panel.

<Route exact path='/admin' render={(props) => (<Admin {...props} data={state}/>)}/>

Everything is great, it works, but now how to make your own routing in the Admin component. After all, the admin panel has its own sitebar, I wanted only the content in the main tag to change.

<div className="wrapper">
    <h1 className="h1">Админка</h1>
    <div className="d-flex mt-40">
      <aside className={style.asideMenu}>
      <AdminMenu path={match.path} menu={data.adminSidebar}/>
      </aside>
    <main>
      <Switch>
      <Route path="/articles" component={AdminPageArticle} />
                        <Route path="/posts" component={AdminPagePosts} />
                        <Route path="/users" component={AdminPageUsers} />
      </Switch>
    </main>
    </div>
    </div>

Answer 1

Something like this is possible:

<Route path="/im/">
            <Topbar/> <---- тыц
            <Switch>
              <Route path="/im/dialogs" component={Dialogs}/>
              <Route path="/im/dialog/:id" component={Dialog}/>
            </Switch>
          </Route>

Answer 2

What's the problem with using paths that match your needs?
/admin/articles
/admin/posts
/admin/users