import { FC } from "react"
import { Button, Typography, useTheme, Box } from "@mui/material"
import { removeAmoAccount } from "@/api/integration";
import { enqueueSnackbar } from "notistack";


interface Props {
    stopThisPage: () => void;
    handleCloseModal: () => void;

}

export const RemoveAccount: FC<Props> = ({
    stopThisPage,
    handleCloseModal,

}: Props) => {
    const theme = useTheme();
    const removeAccount = async () => {
        const [, error] = await removeAmoAccount()

        if (error) {
            enqueueSnackbar(error)
        } else {
            handleCloseModal()
        }
    };

    return (
        <Box
        sx={{
            mt: "30px"
        }}
        >
            <Typography textAlign="center">
                Вы хотите сменить аккаунт?
            </Typography>
            <Box
                sx={{
                    display: "flex",
                    justifyContent: "space-evenly",
                    flexWrap: "wrap",
                    margin: "30px auto",
                }}
            >
                <Button
                    variant="contained"
                    sx={{
                        width: "150px",
                        mb: "15px"
                    }}
                    onClick={stopThisPage}
                >отмена</Button>
                <Button
                    variant="contained"
                    sx={{
                        width: "150px",
                        mb: "15px"
                    }}
                    onClick={removeAccount}
                >сменить</Button>
            </Box>
        </Box >
    )
}