"use client";
import turnosXpressTheme from "@core/app/theme/turnosXpress";
import { ThemeProvider } from "@emotion/react";
import Button from "@mui/material/Button";
import Dialog from "@mui/material/Dialog";
import DialogActions from "@mui/material/DialogActions";
import DialogContent from "@mui/material/DialogContent";
import DialogContentText from "@mui/material/DialogContentText";
import DialogTitle from "@mui/material/DialogTitle";
import { useConfirmStore } from "@store/Confirm.Store";

export default function ConfirmDialog() {
    const confirm = useConfirmStore();

    const handleCancell = () => {
        confirm.close();
        if (confirm.onCancel) {
            confirm.onCancel();
        }
    };

    const handleAgree = () => {
        confirm.close();
        if (confirm.onConfirm) {
            confirm.onConfirm();
        }
    };

    const handleClose = () => {
        confirm.close();
    };

    return (
        <>
            <ThemeProvider theme={turnosXpressTheme}>
                <Dialog
                    open={confirm.visible}
                    onClose={handleClose}
                    aria-labelledby="alert-dialog-title"
                    aria-describedby="alert-dialog-description"
                >
                    <DialogTitle id="alert-dialog-title">{confirm.title}</DialogTitle>
                    <DialogContent>
                        <DialogContentText id="alert-dialog-description">
                            {confirm.message}
                        </DialogContentText>
                    </DialogContent>
                    <DialogActions>
                        <Button onClick={handleCancell}>Cancelar</Button>
                        <Button onClick={handleAgree} autoFocus color="success" variant="contained">
                            Aceptar
                        </Button>
                    </DialogActions>
                </Dialog>
            </ThemeProvider>
        </>
    );
}
