init create-fias

src/widgets/lang-toggle/lib/data.ts

@@ -0,0 +1,18 @@
+import { LanguageRoutes } from '@/shared/config/i18n/type';
+
+const languages: { name: string; key: LanguageRoutes }[] = [
+  {
+    name: "O'zbekcha",
+    key: LanguageRoutes.UZ,
+  },
+  {
+    name: 'Ўзбекча',
+    key: LanguageRoutes.KI,
+  },
+  {
+    name: 'Русский',
+    key: LanguageRoutes.RU,
+  },
+];
+
+export { languages };

src/widgets/lang-toggle/ui/lang-toggle.tsx

@@ -0,0 +1,38 @@
+import { LanguageRoutes } from '@/shared/config/i18n/type';
+import { Button } from '@/shared/ui/button';
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from '@/shared/ui/dropdown-menu';
+import { languages } from '@/widgets/lang-toggle/lib/data';
+import { GlobeIcon } from 'lucide-react';
+import { useTranslation } from 'react-i18next';
+
+const LangToggle = () => {
+  const { i18n } = useTranslation();
+  const changeLanguage = (lng: LanguageRoutes) => {
+    i18n.changeLanguage(lng);
+  };
+
+  return (
+    <DropdownMenu>
+      <DropdownMenuTrigger asChild>
+        <Button variant="outline">
+          <GlobeIcon />
+          <span>{languages.find((e) => e.key == i18n.language)?.name}</span>
+        </Button>
+      </DropdownMenuTrigger>
+      <DropdownMenuContent align="end">
+        {languages.map((e) => (
+          <DropdownMenuItem key={e.key} onClick={() => changeLanguage(e.key)}>
+            {e.name}
+          </DropdownMenuItem>
+        ))}
+      </DropdownMenuContent>
+    </DropdownMenu>
+  );
+};
+
+export default LangToggle;

src/widgets/theme-toggle/ui/theme-toggle.tsx

@@ -0,0 +1,39 @@
+import { Moon, Sun } from 'lucide-react';
+
+import { Button } from '@/shared/ui/button';
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from '@/shared/ui/dropdown-menu';
+import { useTheme } from '@/providers/theme/ThemeProvider';
+
+const ModeToggle = () => {
+  const { setTheme } = useTheme();
+
+  return (
+    <DropdownMenu>
+      <DropdownMenuTrigger asChild>
+        <Button variant="outline" size="icon">
+          <Sun className="h-[1.2rem] w-[1.2rem] rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0" />
+          <Moon className="absolute h-[1.2rem] w-[1.2rem] rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100" />
+          <span className="sr-only">Toggle theme</span>
+        </Button>
+      </DropdownMenuTrigger>
+      <DropdownMenuContent align="end">
+        <DropdownMenuItem onClick={() => setTheme('light')}>
+          Light
+        </DropdownMenuItem>
+        <DropdownMenuItem onClick={() => setTheme('dark')}>
+          Dark
+        </DropdownMenuItem>
+        <DropdownMenuItem onClick={() => setTheme('system')}>
+          System
+        </DropdownMenuItem>
+      </DropdownMenuContent>
+    </DropdownMenu>
+  );
+};
+
+export default ModeToggle;

src/widgets/welcome/ui/welcome.tsx

@@ -0,0 +1,36 @@
+import { getPosts } from '@/shared/config/api/test/test.request';
+import LangToggle from '@/widgets/lang-toggle/ui/lang-toggle';
+import ModeToggle from '@/widgets/theme-toggle/ui/theme-toggle';
+import { useQuery } from '@tanstack/react-query';
+import GitHubButton from 'react-github-btn';
+
+const Welcome = () => {
+  const { data } = useQuery({
+    queryKey: ['posts'],
+    queryFn: () => getPosts(),
+  });
+
+  console.log('data', data);
+
+  return (
+    <div className="custom-container h-screen rounded-2xl flex items-center justify-center">
+      <div className="flex flex-col gap-2 items-center">
+        <GitHubButton
+          href="https://github.com/fiasuz/fias-ui"
+          data-color-scheme="no-preference: light; light: light; dark: dark;"
+          data-size="large"
+          data-show-count="true"
+          aria-label="Star fiasuz/fias-ui on GitHub"
+        >
+          Star
+        </GitHubButton>
+        <div className="flex flex-row gap-2">
+          <ModeToggle />
+          <LangToggle />
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default Welcome;