'use client';

import { Button } from '@/components/ui/button';
import { useAuthContext } from '@/lib/contexts/Auth.context';
import { useRouter } from 'next/navigation';
import { useState } from 'react';

export default function LogoutButton() {
    const { logout } = useAuthContext();
    const router = useRouter();
    const [loading, setLoading] = useState(false);

    const handleLogout = async () => {
        if (loading) return;

        setLoading(true);

        try {
            await logout();
            router.push('/');
        } finally {
            setLoading(false);
        }
    };

    return (
        <Button className="w-[310px]" onClick={handleLogout} disabled={loading}>
            {loading ? 'Выход...' : 'Выйти из аккаунта'}
        </Button>
    );
}