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';
import { useConceptNavigation } from '@/context/NagivationContext';
import { useConceptTheme } from '@/context/ThemeContext';
2023-07-15 17:46:19 +03:00
interface UserDropdownProps {
2023-07-25 20:27:29 +03:00
hideDropdown: () => void
2023-07-15 17:46:19 +03:00
}
2023-07-25 20:27:29 +03:00
function UserDropdown({ hideDropdown }: UserDropdownProps) {
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 dimensions='w-36' stretchLeft>
<DropdownButton
tooltip='Профиль пользователя'
onClick={navigateProfile}
>
{user?.username}
</DropdownButton>
<DropdownButton
tooltip='Переключение темы оформления'
onClick={toggleDarkMode}
>
{darkMode ? 'Светлая тема' : 'Темная тема'}
</DropdownButton>
<DropdownButton onClick={logoutAndRedirect}>
<b>Выйти...</b>
</DropdownButton>
</Dropdown>);
2023-07-15 17:46:19 +03:00
}
2023-07-25 20:27:29 +03:00
export default UserDropdown;