import {
  Box,
  Button,
  FormControl,
  FormLabel,
  Modal,
  ModalBody,
  ModalCloseButton,
  ModalContent,
  ModalFooter,
  ModalHeader,
  ModalOverlay,
  Textarea,
} from "@chakra-ui/react";
import React from "react";

const InvestorComment = ({ isOpen, onClose }) => {
  return (
    <div>
      <Modal isOpen={isOpen} onClose={onClose}>
        <ModalOverlay />
        <ModalContent>
          <ModalHeader fontSize={"md"}></ModalHeader>
          <ModalCloseButton />
          <Box as="form">
            <ModalBody>
              <FormControl mb={5}>
                <FormLabel fontSize="sm">Investor Comment</FormLabel>
                <Textarea
                  rows={6}
                  focusBorderColor="green.400"
                  name="fileName"
                  // {...register("fileName")}
                  fontSize="sm"
                  type="textarea"
                  size="md"
                  placeholder={"The amount of investment is not updated... "}
                  rounded={"md"}
                  resize={"none"}
                />
              </FormControl>
              <FormControl mb={4}>
                <FormLabel fontSize="sm">Admin Commment</FormLabel>
                <Textarea
                  rows={6}
                  focusBorderColor="green.400"
                  name="fileName"
                  // {...register("fileName")}
                  fontSize="sm"
                  type="textarea"
                  size="md"
                  placeholder={"Enter your comment...."}
                  rounded={"md"}
                  resize={"none"}
                />
              </FormControl>
            </ModalBody>
            <ModalFooter pb={8}>
              <Button
                colorScheme="gray"
                mr={3}
                onClick={onClose}
                size={"sm"}
                rounded={"sm"}
              >
                Reject
              </Button>
              <Button
                colorScheme="forestGreen"
                variant="solid"
                size={"sm"}
                rounded={"sm"}
                fontWeight={500}
              >
                Approve
              </Button>
            </ModalFooter>
          </Box>
        </ModalContent>
      </Modal>
    </div>
  );
};

export default InvestorComment;
