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

41 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 {
2023-12-28 14:04:44 +03:00
isOpen: boolean;
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-12-28 14:04:44 +03:00
const logoutAndRedirect = () => {
2023-07-25 20:27:29 +03:00
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 (
2023-12-28 14:04:44 +03:00
<Dropdown className='w-36' stretchLeft isOpen={isOpen}>
<DropdownButton text={user?.username} title='Профиль пользователя' onClick={navigateProfile} />
<DropdownButton
text={darkMode ? 'Светлая тема' : 'Темная тема'}
title='Переключение темы оформления'
onClick={toggleDarkMode}
/>
<DropdownButton text='Выйти...' className='font-semibold' onClick={logoutAndRedirect} />
</Dropdown>
);
2023-07-15 17:46:19 +03:00
}
2023-12-28 14:04:44 +03:00
export default UserDropdown;