I've been using mui lists to set up a sidebar.
<List>
<StyledLink to="/">
<ListItem disablePadding>
<ListItemButton>
<ListItemIcon>
<GridView />
</ListItemIcon>
<ListItemText primary="Dashboard" />
</ListItemButton>
</ListItem>
</StyledLink>
</List>
I attempted to create a custom Link like this,
import { Link } from "react-router-dom";
const StyledLink = ({ to, style = {}, children }) => (
<Link to={to} style={{ ...style, textDecoration: "none" }}>
{children}
</Link>
);
export default StyledLink;
I also looked into this solution.
However, despite my efforts, the blue color persists and it fails to adopt the mui list item text formatting.