"use client";

import { FC } from 'react';
import LogoutIcon from "@mui/icons-material/Logout";
import { signOut } from 'next-auth/react';
import { useLocale, useTranslations } from 'next-intl';
import { Button } from '@/app/ui/button';

export const LogoutButton: FC = () => {
    const t = useTranslations('account-page');
    const locale = useLocale();

    const handleLogout = () => {
        signOut({ callbackUrl: `/${locale}/` });
    };

    return (
        <button className='btn btn-neutral' onClick={handleLogout}><LogoutIcon className='text-red-400' /> {t('logout-button-label')}</button>
    )
}