Proyectos de Subversion LeadersLinked - SPA

import React from 'react'
import { List as MuiList, ListItem as MuiListItem } from '@mui/material'

import EmptySection from '@components/UI/EmptySection'

export default function List({
  elementsKey = 'id',
  items = [],
  emptyMessage = 'No hay elementos para mostrar',
  renderItem = () => {}
}) {
  if (!items.length) {
    return <EmptySection message={emptyMessage} />
  }

  return (
    <MuiList
      sx={{
        display: 'flex',
        flexDirection: 'column',
        gap: ({ spacing }) => spacing(0.5)
      }}
    >
      {items.map((item, index) => (
        <MuiListItem key={item[elementsKey] ?? index}>
          {renderItem(item)}
        </MuiListItem>
      ))}
    </MuiList>
  )
}