Proyectos de Subversion LeadersLinked - SPA

import React from 'react'
import { styled } from '@mui/material'

import CommentItem from './comment-item'
import EmptySection from '@components/UI/EmptySection'

const CommentsContainer = styled('div')(({ theme }) => ({
  display: 'flex',
  flexDirection: 'column',
  gap: theme.spacing(0.5),
  maxHeight: '300px',
  overflow: 'auto'
}))

export default function CommentsList({ comments = [], onDelete, onReport }) {
  if (!comments.length) {
    return <EmptySection message='No hay comentarios' />
  }

  return (
    <CommentsContainer>
      {comments.map((comment) => (
        <CommentItem
          key={comment.unique}
          comment={comment}
          onDelete={onDelete}
          onReport={onReport}
        />
      ))}
    </CommentsContainer>
  )
}