src/views/components/NavBarLink.jsx


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31

import {
  ListItem,
  ListItemButton,
  ListItemContent,
  ListItemDecorator,
} from '@mui/joy'
import { Link } from 'react-router-dom'

const NavBarLink = ({ link }) => {
  const { to, icon, label } = link
  return (
    <ListItem>
      <ListItemButton
        key={to}
        component={Link}
        to={to}
        variant='plain'
        color='neutral'
        sx={{
          borderRadius: 4,
          py: 1.2,
        }}
      >
        <ListItemDecorator>{icon}</ListItemDecorator>
        <ListItemContent>{label}</ListItemContent>
      </ListItemButton>
    </ListItem>
  )
}

export default NavBarLink