Proyectos de Subversion LeadersLinked - SPA

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

import KnowledgeCard from './knowledge-card'
import Spinner from '@components/UI/Spinner'
import EmptySection from '@components/UI/EmptySection'

const KnowledgeGrid = styled('div')`
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 1rem;
`

export default function KnowledgesList({
  knowledges = [],
  loading,
  onEdit,
  onDelete
}) {
  const labels = useSelector(({ intl }) => intl.labels)

  if (loading) {
    return <Spinner />
  }

  if (!knowledges.length) {
    return <EmptySection message={labels.error_no_record_matched_your_query} />
  }

  return (
    <KnowledgeGrid>
      {knowledges.map((knowledge, index) => (
        <KnowledgeCard
          key={index}
          knowledge={knowledge}
          onEdit={onEdit}
          onDelete={onDelete}
        />
      ))}
    </KnowledgeGrid>
  )
}