"use client";
import { Box, Divider, IconButton, Tooltip } from "@mui/material";
import PowerSettingsNewIcon from "@mui/icons-material/PowerSettingsNew";
import ModeEditIcon from "@mui/icons-material/ModeEdit";
import VpnKeyIcon from "@mui/icons-material/VpnKey";
import { useState } from "react";
import Update from "@/core/components/Profile/Update";
import ChangePass from "@/core/components/Profile/ChangePass";
import { useAuth } from "@/lib/contexts/auth";
import useRequest from "@/lib/hooks/useRequest";
import { LOGOUT_USER_ROUTE } from "@/core/utils/routes";

const ProfileActions = () => {
    const { getUser, logout } = useAuth();
    const requestServer = useRequest();
    const [openUpdate, setOpenUpdate] = useState(false);
    const [openChangePass, setOpenChangePass] = useState(false);

    const openUpdateProfile = () => {
        getUser();
        setOpenUpdate(true);
    };
    const handleLogout = () => {
        requestServer(LOGOUT_USER_ROUTE, "post").then(() => {
            logout();
        });
    };

    return (
        <>
            <Box sx={{ display: "flex", justifyContent: "center" }}>
                <Tooltip title="ویرایش پروفایل" arrow>
                    <IconButton aria-label="ویرایش پروفایل" color="success" onClick={openUpdateProfile}>
                        <ModeEditIcon />
                    </IconButton>
                </Tooltip>
                <Divider orientation="vertical" variant="middle" flexItem sx={{ mx: 1 }} />
                <Tooltip title="خروج" arrow>
                    <IconButton onClick={handleLogout} aria-label="خروج" color="error">
                        <PowerSettingsNewIcon />
                    </IconButton>
                </Tooltip>
                <Divider orientation="vertical" variant="middle" flexItem sx={{ mx: 1 }} />
                <Tooltip title="تغییر رمز عبور" arrow>
                    <IconButton
                        aria-label="تغییر رمز عبور"
                        color="primary"
                        onClick={() => {
                            setOpenChangePass(true);
                        }}
                    >
                        <VpnKeyIcon />
                    </IconButton>
                </Tooltip>
            </Box>
            <Update open={openUpdate} setOpen={setOpenUpdate} />
            <ChangePass open={openChangePass} setOpen={setOpenChangePass} />
        </>
    );
};
export default ProfileActions;