import Stack from '@material-hu/mui/Stack/Stack';
import { type Attachment } from '@material-hu/types/attachments';

import FileCard from '@material-hu/components/design-system/FileCard';

type Props = {
  attachments: (Attachment & { id: number })[];
};

const QuestionAttachments = ({ attachments }: Props) => {
  if (!attachments || !attachments.length) {
    return null;
  }

  return (
    <Stack sx={{ gap: 1, width: 1 }}>
      {attachments.map(attachment => (
        <FileCard
          key={attachment.id}
          status="success"
          attachment={attachment}
          sx={{ width: '100%' }}
        />
      ))}
    </Stack>
  );
};

export default QuestionAttachments;
