update: add language-switcher

src/shared/language/ui/language-switcher.tsx

@@ -0,0 +1,44 @@
+'use client';
+
+import { Check, Globe } from 'lucide-react';
+import { useState } from 'react';
+
+import { type Language, languages, useLanguage } from '@/shared/language';
+import { Button } from '@/shared/shadcn-ui/button';
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from '@/shared/shadcn-ui/dropdown-menu';
+
+export function LanguageSwitcher() {
+  const { language, setLanguage } = useLanguage();
+  const [open, setOpen] = useState(false);
+
+  return (
+    <DropdownMenu open={open} onOpenChange={setOpen}>
+      <DropdownMenuTrigger asChild>
+        <Button variant='ghost' size='sm' className='h-8 w-8 px-0'>
+          <Globe className='h-4 w-4' />
+          <span className='sr-only'>Switch language</span>
+        </Button>
+      </DropdownMenuTrigger>
+      <DropdownMenuContent align='end'>
+        {Object.entries(languages).map(([code, { name, flag }]) => (
+          <DropdownMenuItem
+            key={code}
+            onClick={() => {
+              setLanguage(code as Language);
+              setOpen(false);
+            }}
+          >
+            <span className='mr-2'>{flag}</span>
+            {name}
+            {code === language && <Check className='ml-2 h-4 w-4' />}
+          </DropdownMenuItem>
+        ))}
+      </DropdownMenuContent>
+    </DropdownMenu>
+  );
+}

src/widgets/header/ui/desktop-nav.tsx

@@ -14,7 +14,7 @@ import {
 
 export function DesktopNav() {
   return (
-    <NavigationMenu className='hidden md:flex'>
+    <NavigationMenu className='hidden lg:flex'>
       <NavigationMenuList>
         <NavigationMenuItem>
           <Link href='/' scroll>

src/widgets/header/ui/index.tsx

@@ -1,6 +1,7 @@
 import Link from 'next/link';
 
 import { Logo } from '@/shared/assets/logo';
+import { LanguageSwitcher } from '@/shared/language/ui/language-switcher';
 import { Button } from '@/shared/shadcn-ui/button';
 
 import { DesktopNav } from './desktop-nav';
@@ -12,11 +13,14 @@ export function Header() {
       <div className='container mx-auto flex h-16 items-center justify-between p-4'>
         <Logo />
         <DesktopNav />
-        <div className='flex items-center gap-6 md:contents'>
+        <div className='flex items-center gap-6 lg:contents'>
           <MobileNav />
-          <Link href={'/login'}>
+          <div className='flex items-center gap-6'>
-            <Button>Вход</Button>
+            <LanguageSwitcher />
-          </Link>
+            <Link href={'/login'}>
+              <Button>Вход</Button>
+            </Link>
+          </div>
         </div>
       </div>
     </header>

src/widgets/header/ui/mobile-nav.tsx

@@ -19,7 +19,7 @@ export function MobileNav() {
   return (
     <Sheet open={open} onOpenChange={setOpen}>
       <SheetTrigger asChild>
-        <Button variant='ghost' className='md:hidden' size='icon'>
+        <Button variant='ghost' className='lg:hidden' size='icon'>
           <Menu className='h-6 w-6' />
           <span className='sr-only'>Открыть меню</span>
         </Button>