ConceptPortal-public/rsconcept/frontend/src/components/Navigation/UserDropdown.tsx

48 lines
1.3 KiB
TypeScript
Raw Normal View History

import Dropdown from '@/components/Common/Dropdown';
import DropdownButton from '@/components/Common/DropdownButton';
import { useAuth } from '@/context/AuthContext';
2023-12-26 14:23:51 +03:00
import { useConceptNavigation } from '@/context/NavigationContext';
import { useConceptTheme } from '@/context/ThemeContext';
2023-07-15 17:46:19 +03:00
interface UserDropdownProps {
isOpen: boolean
2023-07-25 20:27:29 +03:00
hideDropdown: () => void
2023-07-15 17:46:19 +03:00
}
function UserDropdown({ isOpen, hideDropdown }: UserDropdownProps) {
2023-07-25 20:27:29 +03:00
const { darkMode, toggleDarkMode } = useConceptTheme();
const router = useConceptNavigation();
2023-07-25 20:27:29 +03:00
const { user, logout } = useAuth();
2023-07-15 17:46:19 +03:00
const navigateProfile = () => {
2023-08-27 16:35:17 +03:00
hideDropdown();
router.push('/profile');
2023-07-15 17:46:19 +03:00
};
2023-07-25 20:27:29 +03:00
const logoutAndRedirect =
() => {
hideDropdown();
logout(() => router.push('/login/'));
2023-07-15 17:46:19 +03:00
};
2023-07-16 22:53:22 +03:00
2023-07-15 17:46:19 +03:00
return (
<Dropdown className='w-36' stretchLeft isOpen={isOpen}>
<DropdownButton
2023-12-16 19:20:26 +03:00
text={user?.username}
title='Профиль пользователя'
onClick={navigateProfile}
2023-12-16 19:20:26 +03:00
/>
<DropdownButton
2023-12-16 19:20:26 +03:00
text={darkMode ? 'Светлая тема' : 'Темная тема'}
title='Переключение темы оформления'
onClick={toggleDarkMode}
2023-12-16 19:20:26 +03:00
/>
<DropdownButton
text='Выйти...'
className='font-semibold'
onClick={logoutAndRedirect}
/>
</Dropdown>);
2023-07-15 17:46:19 +03:00
}
export default UserDropdown;