"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