feat: Add i18n

ui/src/components/LocaleToggle.tsx

@@ -0,0 +1,33 @@
+import { Languages } from "lucide-react";
+
+import { useTranslation } from "react-i18next";
+
+import { Button } from "@/components/ui/button";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from "@/components/ui/dropdown-menu";
+
+export default function LocaleToggle() {
+  const { i18n } = useTranslation()
+
+  return (
+    <DropdownMenu>
+      <DropdownMenuTrigger asChild>
+        <Button variant="outline" size="icon">
+          <Languages className="h-[1.2rem] w-[1.2rem]  dark:text-white" />
+          <span className="sr-only">Toggle theme</span>
+        </Button>
+      </DropdownMenuTrigger>
+      <DropdownMenuContent align="end">
+        {Object.keys(i18n.store.data).map(key => (
+          <DropdownMenuItem onClick={() => i18n.changeLanguage(key)}>
+            {i18n.store.data[key].name as string}
+          </DropdownMenuItem>
+        ))}
+      </DropdownMenuContent>
+    </DropdownMenu>
+  );
+}