Proyectos de Subversion LeadersLinked - SPA

import React from 'react'
import styled from 'styled-components'

import WidgetLayout from 'components/widgets/WidgetLayout'
import { NavLink } from 'react-router-dom'

const SideMenuContainer = styled(WidgetLayout)`
  padding: 1rem;
  ul {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    li,
    label {
      cursor: pointer;
    }
    input:checked ~ label {
      font-weight: 600;
    }
  }
`

const SideMenu = ({ items = [], onChange = () => {} }) => {
  return (
    <SideMenuContainer>
      <ul>
        {items.map(({ value, name }) => (
          <li key={value}>
            <NavLink to={value} onClick={onChange}>
              {name}
            </NavLink>
          </li>
        ))}
      </ul>
    </SideMenuContainer>
  )
}

export default SideMenu