Added Auth

2025-12-22 10:47:15 +07:00
parent 2c244b77fb
commit fa029365d0
79 changed files with 19643 additions and 2830 deletions
--- a/src/routes/__root.tsx
+++ b/src/routes/__root.tsx
@@ -5,20 +5,33 @@ import {
  createRootRouteWithContext,
 } from '@tanstack/react-router'
 import { TanStackRouterDevtoolsPanel } from '@tanstack/react-router-devtools'
-
-import Header from '../components/Header'
-
 import TanStackQueryDevtools from '../integrations/tanstack-query/devtools'
-
 import appCss from '../styles.css?url'
-
 import type { QueryClient } from '@tanstack/react-query'
+import React from 'react'
+import { setSSRLanguage } from '@/lib/i18n'
+import { useTranslation } from 'react-i18next'
+import { Toaster } from '@/components/ui/sonner'
+import { HugeiconsIcon } from '@hugeicons/react'
+import {
+  Alert02Icon,
+  AlertCircleIcon,
+  CheckmarkCircle01Icon,
+  InformationCircleIcon,
+} from '@hugeicons/core-free-icons'
+import { sessionQueryOptions } from '@/hooks/use-session'

 interface MyRouterContext {
  queryClient: QueryClient
 }

 export const Route = createRootRouteWithContext<MyRouterContext>()({
+  beforeLoad: async ({ context }) => {
+    const userSession =
+      await context.queryClient.ensureQueryData(sessionQueryOptions)
+    await setSSRLanguage()
+    return { userSession }
+  },
  head: () => ({
    meta: [
      {
@@ -39,31 +52,78 @@ export const Route = createRootRouteWithContext<MyRouterContext>()({
      },
    ],
  }),
-
  shellComponent: RootDocument,
+  notFoundComponent: () => <div>404 Not Found</div>,
 })

 function RootDocument({ children }: { children: React.ReactNode }) {
+  const { i18n } = useTranslation()
+
  return (
-    <html lang="en">
+    <html lang={i18n.language}>
      <head>
        <HeadContent />
      </head>
      <body>
-        <Header />
        {children}
-        <TanStackDevtools
-          config={{
-            position: 'bottom-right',
-          }}
-          plugins={[
-            {
-              name: 'Tanstack Router',
-              render: <TanStackRouterDevtoolsPanel />,
+        <Toaster
+          visibleToasts={5}
+          position={'top-right'}
+          offset={{ top: 60, right: 10 }}
+          closeButton={true}
+          toastOptions={{
+            classNames: {
+              success: '!bg-green-50',
+              error: '!bg-red-50',
+              info: '!bg-blue-50',
+              warning: '!bg-yellow-50',
            },
-            TanStackQueryDevtools,
-          ]}
+          }}
+          icons={{
+            success: (
+              <HugeiconsIcon
+                icon={CheckmarkCircle01Icon}
+                className="text-green-500"
+                size={16}
+              />
+            ),
+            error: (
+              <HugeiconsIcon
+                icon={AlertCircleIcon}
+                className="text-red-500"
+                size={16}
+              />
+            ),
+            info: (
+              <HugeiconsIcon
+                icon={InformationCircleIcon}
+                className="text-blue-500"
+                size={16}
+              />
+            ),
+            warning: (
+              <HugeiconsIcon
+                icon={Alert02Icon}
+                className="text-yellow-500"
+                size={16}
+              />
+            ),
+          }}
        />
+        <React.Suspense>
+          <TanStackDevtools
+            config={{
+              position: 'bottom-right',
+            }}
+            plugins={[
+              {
+                name: 'Tanstack Router',
+                render: <TanStackRouterDevtoolsPanel />,
+              },
+              TanStackQueryDevtools,
+            ]}
+          />
+        </React.Suspense>
        <Scripts />
      </body>
    </html>