How to access a tab react-router-dom route from a listitem sidebar menu option

I have set up Material-UI react-router tab navigation as shown here in this Codesandbox example and all works fine.

My question is, I also have a left side-menu navigation setup that is using the Paperbase Material-UI template with the following code:

   {children.map(({ id: childId, icon, active, href }) => (
      <ListItem
        key={childId}
        button
        className={clsx(classes.item, active && classes.itemActiveItem)}
        component={Link}
        to={href}
      >
   ))}

Here href has the values: "/books" and "/favorites" which is what the material-UI tabs are using.

Using the above code, how can I direct a side-bar navigation menu click to go directly to this page that has both the Books and Favourites tabs and then also go into either the Books or Favourites components as if I clicked on either of these tabs myself?

I also need to ensure that the tab route path tab is active.