Remove redundant icons; make update selector

This commit is contained in:
Owen 2025-06-09 17:39:29 -04:00
parent 363b8b52af
commit cb85ad460e
No known key found for this signature in database
GPG key ID: 8271FDFFD9E0CCBD
3 changed files with 126 additions and 40 deletions

90
package-lock.json generated
View file

@ -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",

View file

@ -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",

View file

@ -1,7 +1,13 @@
'use client';
import { CheckIcon, LanguageIcon } from '@heroicons/react/24/solid';
import * as Select from '@radix-ui/react-select';
import {
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">
<Select.Root defaultValue={defaultValue} onValueChange={onChange}>
<Select.Trigger
aria-label={label}
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button
variant="ghost"
className={clsx(
'rounded-sm p-2 transition-colors hover:bg-slate-200',
isPending && 'pointer-events-none opacity-60'
'rounded-sm p-2 transition-colors flex items-center gap-2',
isPending && 'pointer-events-none'
)}
aria-label={label}
>
<Select.Icon>
<LanguageIcon className="h-6 w-6 text-slate-600 transition-colors group-hover:text-slate-900" />
</Select.Icon>
</Select.Trigger>
<Select.Portal>
<Select.Content
align="end"
className="min-w-[8rem] overflow-hidden rounded-sm bg-white py-1 shadow-md"
position="popper"
<Languages className="h-4 w-4" />
<span >{selected?.label ?? label}</span>
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end" className="min-w-[8rem]">
{items.map((item) => (
<DropdownMenuItem
key={item.value}
onClick={() => onChange(item.value)}
className="flex items-center gap-2"
>
<Select.Viewport>
{items.map((item) => (
<Select.Item
key={item.value}
className="flex cursor-default items-center px-3 py-2 text-base data-[highlighted]:bg-slate-100"
value={item.value}
>
<div className="mr-2 w-[1rem]">
{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>
{item.value === defaultValue && (
<Check className="h-4 w-4" />
)}
<span>{item.label}</span>
</DropdownMenuItem>
))}
</DropdownMenuContent>
</DropdownMenu>
);
}