'use client';

import Prompt, { PromptProps } from '@/components/utils/Prompt'
import { useAuthStore } from '@/zustand/authStore';
import React from 'react'
import { useTranslation } from 'react-i18next'
import { removeToken, removeRefreshToken } from '@/lib/api/func';

export type LogoutPromptProps = Omit<PromptProps, 'onConfirm' | 'onCancel' | 'children'> & {
    slug?: string;
};

function LogoutPrompt({ slug, ...rest }: LogoutPromptProps) {
    const { t } = useTranslation('common', {
        keyPrefix: 'LogoutModal'
    });
    const authLogout = useAuthStore((state) => state.logout);

    const onConfirmLogout = async (e: React.MouseEvent) => {
        if (!e) return;
        rest.onClick?.(e);
        authLogout();
        await removeToken();
        await removeRefreshToken();
        const redirectPath = slug ? `/${slug}` : '/';
        window.location.href = redirectPath;
    };

    const toggleLogoutModalVisibility = (e: React.MouseEvent) => {
        e?.preventDefault();
        e?.stopPropagation();
        rest.onClick?.(e);
    };


    return (
        <Prompt
            title={t("Heading")}
            description={t("Description")}
            textConfirm={t("ButtonOk")}
            textCancel={t("ButtonCancel")}
            onConfirm={onConfirmLogout}
            onCancel={toggleLogoutModalVisibility}
            {...rest}>
            <></>
        </Prompt>
    )
}

export default LogoutPrompt