Integrates react-route Links into Material UI list

For a <ListItem /> The component prop can be a string (for a dom element) or a react component itself.

https://material-ui.com/api/list-item/

You can define any component

const ListItemComponent  =  () => {
  return <Link to="/test">Check</Link>
}

as pass it as a component prop to <ListItem />.

        <List>
          <ListItem component={ListItemComponent}>
          </ListItem>
        </List>

Try this 👉 https://stackblitz.com/edit/react-ogpmxx

You can use Link as the component of the ListItem and use it as the following

<List>
  <ListItem component={Link} to="/reports">
    <ListItemIcon>
      <Icon>bar_chart</Icon>
    </ListItemIcon>
    <ListItemText primary="Reports" />
  </ListItem>
</List>