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

const DocumentPrinters = ({ documentPrinters }) => {
  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>
              <DocumentPrinterIcon />
              Document Printers
            </Space>
          }
        >
          <PrinterList printers={documentPrinters} type="documentPrinter" />
        </Card>
      </Flex>
    </Flex>
  );
};

DocumentPrinters.propTypes = {};

export default DocumentPrinters;
