feat(i18n): add locale switcher

components/custom/theme-switch.tsx

@@ -1,6 +1,5 @@
 "use client"
 
-import * as React from "react"
 import { Moon, Sun } from "lucide-react"
 import { useTheme } from "next-themes"
 
@@ -11,9 +10,17 @@ import {
   DropdownMenuItem,
   DropdownMenuTrigger,
 } from "@/components/ui/dropdown-menu"
+import { useTranslations } from "next-intl"
 
 export function ThemeSwitch() {
-  const { setTheme } = useTheme()
+  const { setTheme } = useTheme();
+
+  const t = useTranslations('themes');
+    const themeLabels: Record<string, string> = {
+      light: t('light'),
+      dark: t('dark'),
+      system: t('system'),
+    }
 
   return (
     <DropdownMenu>
@@ -26,13 +33,13 @@ export function ThemeSwitch() {
       </DropdownMenuTrigger>
       <DropdownMenuContent align="end">
         <DropdownMenuItem onClick={() => setTheme("light")}>
-          Light
+          {themeLabels['light']}
         </DropdownMenuItem>
         <DropdownMenuItem onClick={() => setTheme("dark")}>
-          Dark
+          {themeLabels['dark']}
         </DropdownMenuItem>
         <DropdownMenuItem onClick={() => setTheme("system")}>
-          System
+          {themeLabels['system']}
         </DropdownMenuItem>
       </DropdownMenuContent>
     </DropdownMenu>