import { useFileUploadContext } from '../../contexts/FileUploadContext';

import { StatusItem } from './components/StatusItem/StatusItem';
import { StyledStatusList } from './styled';

export function StatusList() {
  const { fileList } = useFileUploadContext();
  return (
    <StyledStatusList>
      {fileList.map((file) => (
        <li key={file.taskId}>
          <StatusItem file={file} />
        </li>
      ))}
    </StyledStatusList>
  );
}
