import React from "react";
import { Card, Flex, Space } from "antd";
import FileList from "../components/FileList.jsx";
import FileIcon from "../icons/FileIcon";

const Files = ({ files }) => {
  return (
    <Flex
      vertical
      size="large"
      style={{ width: "100%", height: "100%" }}
      gap={"middle"}
    >
      <Flex gap={"middle"} wrap style={{ flexGrow: 1 }}>
        <Card
          size="small"
          style={{ minWidth: "400px", flexGrow: 1 }}
          title={
            <Space>
              <FileIcon />
              Files
            </Space>
          }
        >
          <FileList files={files} type="file" />
        </Card>
      </Flex>
    </Flex>
  );
};

Files.propTypes = {};

export default Files;