Remove redundant icons; make update selector

package-lock.json

@@ -950,6 +950,66 @@
                 "fast-glob": "3.3.1"
             }
         },
+        "node_modules/@next/swc-darwin-arm64": {
+            "version": "15.3.3",
+            "resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-15.3.3.tgz",
+            "integrity": "sha512-WRJERLuH+O3oYB4yZNVahSVFmtxRNjNF1I1c34tYMoJb0Pve+7/RaLAJJizyYiFhjYNGHRAE1Ri2Fd23zgDqhg==",
+            "cpu": [
+                "arm64"
+            ],
+            "optional": true,
+            "os": [
+                "darwin"
+            ],
+            "engines": {
+                "node": ">= 10"
+            }
+        },
+        "node_modules/@next/swc-darwin-x64": {
+            "version": "15.3.3",
+            "resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-15.3.3.tgz",
+            "integrity": "sha512-XHdzH/yBc55lu78k/XwtuFR/ZXUTcflpRXcsu0nKmF45U96jt1tsOZhVrn5YH+paw66zOANpOnFQ9i6/j+UYvw==",
+            "cpu": [
+                "x64"
+            ],
+            "optional": true,
+            "os": [
+                "darwin"
+            ],
+            "engines": {
+                "node": ">= 10"
+            }
+        },
+        "node_modules/@next/swc-linux-arm64-gnu": {
+            "version": "15.3.3",
+            "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-15.3.3.tgz",
+            "integrity": "sha512-VZ3sYL2LXB8znNGcjhocikEkag/8xiLgnvQts41tq6i+wql63SMS1Q6N8RVXHw5pEUjiof+II3HkDd7GFcgkzw==",
+            "cpu": [
+                "arm64"
+            ],
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "engines": {
+                "node": ">= 10"
+            }
+        },
+        "node_modules/@next/swc-linux-arm64-musl": {
+            "version": "15.3.3",
+            "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-15.3.3.tgz",
+            "integrity": "sha512-h6Y1fLU4RWAp1HPNJWDYBQ+e3G7sLckyBXhmH9ajn8l/RSMnhbuPBV/fXmy3muMcVwoJdHL+UtzRzs0nXOf9SA==",
+            "cpu": [
+                "arm64"
+            ],
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "engines": {
+                "node": ">= 10"
+            }
+        },
         "node_modules/@next/swc-linux-x64-gnu": {
             "version": "15.3.3",
             "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-15.3.3.tgz",
@@ -982,6 +1042,36 @@
                 "node": ">= 10"
             }
         },
+        "node_modules/@next/swc-win32-arm64-msvc": {
+            "version": "15.3.3",
+            "resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-15.3.3.tgz",
+            "integrity": "sha512-SxorONgi6K7ZUysMtRF3mIeHC5aA3IQLmKFQzU0OuhuUYwpOBc1ypaLJLP5Bf3M9k53KUUUj4vTPwzGvl/NwlQ==",
+            "cpu": [
+                "arm64"
+            ],
+            "optional": true,
+            "os": [
+                "win32"
+            ],
+            "engines": {
+                "node": ">= 10"
+            }
+        },
+        "node_modules/@next/swc-win32-x64-msvc": {
+            "version": "15.3.3",
+            "resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-15.3.3.tgz",
+            "integrity": "sha512-4QZG6F8enl9/S2+yIiOiju0iCTFd93d8VC1q9LZS4p/Xuk81W2QDjCFeoogmrWWkAD59z8ZxepBQap2dKS5ruw==",
+            "cpu": [
+                "x64"
+            ],
+            "optional": true,
+            "os": [
+                "win32"
+            ],
+            "engines": {
+                "node": ">= 10"
+            }
+        },
         "node_modules/@noble/ciphers": {
             "version": "1.3.0",
             "resolved": "https://registry.npmjs.org/@noble/ciphers/-/ciphers-1.3.0.tgz",

package.json

@@ -27,7 +27,6 @@
     },
     "dependencies": {
         "@asteasolutions/zod-to-openapi": "^7.3.2",
-        "@heroicons/react": "^2.2.0",
         "@hookform/resolvers": "3.9.1",
         "@node-rs/argon2": "^2.0.2",
         "@oslojs/crypto": "1.0.1",

src/components/LocaleSwitcherSelect.tsx

@@ -1,7 +1,13 @@
 'use client';
 
-import { CheckIcon, LanguageIcon } from '@heroicons/react/24/solid';
+import {
-import * as Select from '@radix-ui/react-select';
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger
+} from '@app/components/ui/dropdown-menu';
+import { Button } from '@app/components/ui/button';
+import { Check, Globe, Languages } from 'lucide-react';
 import clsx from 'clsx';
 import { useTransition } from 'react';
 import { Locale } from '@/i18n/config';
@@ -9,7 +15,7 @@ import { setUserLocale } from '@/services/locale';
 
 type Props = {
   defaultValue: string;
-  items: Array<{value: string; label: string}>;
+  items: Array<{ value: string; label: string }>;
   label: string;
 };
 
@@ -27,46 +33,37 @@ export default function LocaleSwitcherSelect({
     });
   }
 
+  const selected = items.find((item) => item.value === defaultValue);
+
   return (
-    <div className="relative">
+    <DropdownMenu>
-      <Select.Root defaultValue={defaultValue} onValueChange={onChange}>
+      <DropdownMenuTrigger asChild>
-        <Select.Trigger
+        <Button
-          aria-label={label}
+          variant="ghost"
           className={clsx(
-            'rounded-sm p-2 transition-colors hover:bg-slate-200',
+            'rounded-sm p-2 transition-colors flex items-center gap-2',
-            isPending && 'pointer-events-none opacity-60'
+            isPending && 'pointer-events-none'
           )}
+          aria-label={label}
         >
-          <Select.Icon>
+          <Languages className="h-4 w-4" />
-            <LanguageIcon className="h-6 w-6 text-slate-600 transition-colors group-hover:text-slate-900" />
+          <span >{selected?.label ?? label}</span>
-          </Select.Icon>
+        </Button>
-        </Select.Trigger>
+      </DropdownMenuTrigger>
-        <Select.Portal>
+      <DropdownMenuContent align="end" className="min-w-[8rem]">
-          <Select.Content
+        {items.map((item) => (
-            align="end"
+          <DropdownMenuItem
-            className="min-w-[8rem] overflow-hidden rounded-sm bg-white py-1 shadow-md"
+            key={item.value}
-            position="popper"
+            onClick={() => onChange(item.value)}
+            className="flex items-center gap-2"
           >
-            <Select.Viewport>
+            {item.value === defaultValue && (
-              {items.map((item) => (
+              <Check className="h-4 w-4" />
-                <Select.Item
+            )}
-                  key={item.value}
+            <span>{item.label}</span>
-                  className="flex cursor-default items-center px-3 py-2 text-base data-[highlighted]:bg-slate-100"
+          </DropdownMenuItem>
-                  value={item.value}
+        ))}
-                >
+      </DropdownMenuContent>
-                  <div className="mr-2 w-[1rem]">
+    </DropdownMenu>
-                    {item.value === defaultValue && (
-                      <CheckIcon className="h-5 w-5 text-slate-600" />
-                    )}
-                  </div>
-                  <span className="text-slate-900">{item.label}</span>
-                </Select.Item>
-              ))}
-            </Select.Viewport>
-            <Select.Arrow className="fill-white text-white" />
-          </Select.Content>
-        </Select.Portal>
-      </Select.Root>
-    </div>
   );
 }