"use client";

import { Box, Modal, ModalProps } from "@mui/material";
import { useCallback } from "react";

interface Props extends Omit<ModalProps, "children"> {}

const style = {
  position: "absolute",
  top: "50%",
  left: "50%",
  transform: "translate(-50%, -50%)",
  bgcolor: "background.paper",
  pt: 5,
  px: 5,
  pb: 10,
  width: { xs: "80%", sm: "80%", md: "80%" },
};

const QrCodeScanner: React.FC<Props> = ({ open }) => {
  const closeHandler = useCallback<NonNullable<ModalProps["onClose"]>>(
    (...args) => {
      //   onClose?.(...args);
      //   reset();
    },
    [],
  );

  return (
    <Modal open={open} onClose={closeHandler}>
      <Box sx={style}>
        <input type="file" accept="image/*" capture="environment"></input>
      </Box>
    </Modal>
  );
};
export default QrCodeScanner;
