You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
spa_instat_tv/src/features/Menu/index.tsx

52 lines
1.1 KiB

import React from 'react'
import { PAGES } from 'config'
import { useToggle } from 'hooks'
import { useAuthStore } from 'features/AuthStore'
import { T9n } from 'features/T9n'
import { OutsideClick } from 'features/OutsideClick'
import {
Wrapper,
ToggleButton,
MenuList,
MenuItem,
Icon,
StyledLink,
linkStyles,
} from './styled'
export const Menu = () => {
const {
close,
isOpen,
open,
} = useToggle()
const { logout } = useAuthStore()
return (
<OutsideClick onClick={close}>
<Wrapper>
<ToggleButton onClick={open} />
{isOpen && (
<MenuList>
<MenuItem>
<Icon image='userAccount' />
<StyledLink to={PAGES.useraccount}>
<T9n t='user_account' />
</StyledLink>
</MenuItem>
<MenuItem>
<Icon image='logout' />
<T9n
t='logout'
onClick={logout}
customStyles={linkStyles}
/>
</MenuItem>
</MenuList>
)}
</Wrapper>
</OutsideClick>
)
}