import {Box, Button, ButtonGroup} from "@mui/material";
import AutoModeIcon from "@mui/icons-material/AutoMode";
import DeleteIcon from "@mui/icons-material/Delete";
import EditLocationAltIcon from "@mui/icons-material/EditLocationAlt";
import SaveIcon from "@mui/icons-material/Save";
import CancelIcon from "@mui/icons-material/Cancel";

const MapActionButtons = ({
                              disableToCreate,
                              disableToEditAndDelete,
                              disableToSaveAndCancel,
                              onDraw,
                              onEdit,
                              onRemove,
                              onSave,
                              onCancel,
                          }) => (
    <>
        <Box sx={{
            background: "#ffffff",
            position: "absolute",
            zIndex: "1999",
            bottom: 0,
            left: 0,
            p: 2,
            pl: 0.5,
            pb: 0.5,
            borderTopRightRadius: 8,
        }}>
            <ButtonGroup variant="contained" orientation="vertical" aria-label="map action group button">
                <Button
                    sx={{justifyContent: "space-between"}}
                    startIcon={<AutoModeIcon/>}
                    color="primary"
                    disabled={disableToCreate}
                    onClick={onDraw}
                >
                    اصلاح
                </Button>
                <Button
                    sx={{justifyContent: "space-between"}}
                    startIcon={<EditLocationAltIcon/>}
                    color="warning"
                    disabled={disableToEditAndDelete}
                    onClick={onEdit}
                >
                    ویرایش
                </Button>
                <Button
                    sx={{justifyContent: "space-between"}}
                    startIcon={<DeleteIcon/>}
                    color="error"
                    disabled={disableToEditAndDelete}
                    onClick={onRemove}
                >
                    حذف
                </Button>
            </ButtonGroup>
        </Box>

        <Box sx={{
            position: "absolute",
            zIndex: "1999",
            right: 10,
            top: 10,
            background: "#fff",
            borderRadius: 1,
            padding: 0.5,
        }}>
            <Button
                sx={{justifyContent: "space-between", mr: 1}}
                startIcon={<SaveIcon/>}
                variant="outlined"
                size="small"
                color="success"
                disabled={disableToSaveAndCancel}
                onClick={onSave}
            >
                ذخیره
            </Button>
            <Button
                sx={{justifyContent: "space-between"}}
                startIcon={<CancelIcon/>}
                variant="outlined"
                size="small"
                color="error"
                disabled={disableToSaveAndCancel}
                onClick={onCancel}
            >
                لغو تغییرات
            </Button>
        </Box>
    </>
);

export default MapActionButtons;