|
import { forwardRef } from 'react'; |
|
import LogOutIcon from '../svg/LogOutIcon'; |
|
import { useAuthContext } from '~/hooks/AuthContext'; |
|
import { useRecoilValue } from 'recoil'; |
|
import store from '~/store'; |
|
import { localize } from '~/localization/Translation'; |
|
|
|
const Logout = forwardRef(() => { |
|
const { user, logout } = useAuthContext(); |
|
const lang = useRecoilValue(store.lang); |
|
|
|
const handleLogout = () => { |
|
logout(); |
|
window.location.reload(); |
|
}; |
|
|
|
return ( |
|
<button |
|
className="flex w-full cursor-pointer items-center gap-3 px-3 py-3 text-sm text-white transition-colors duration-200 hover:bg-gray-700" |
|
onClick={handleLogout} |
|
> |
|
<LogOutIcon /> |
|
{user?.username || localize(lang, 'com_nav_user')} |
|
<small>{localize(lang, 'com_nav_log_out')}</small> |
|
</button> |
|
); |
|
}); |
|
|
|
export default Logout; |
|
|