feat(client): refactor auth/login

Signed-off-by: Noa Virellia <noa@requiem.garden>
feat(client): profile-wip
2026-01-02 16:48:16 +08:00 · 2026-01-02 16:47:37 +08:00 · 2026-01-02 16:47:15 +08:00 · 2026-01-02 16:37:30 +08:00 · 2026-01-02 16:26:21 +08:00 · 2026-01-02 15:57:42 +08:00
126 changed files with 9735 additions and 0 deletions
--- a/.env.development
+++ b/.env.development
@@ -0,0 +1 @@
+TZ=Asia/Shanghai
--- a/.env.production
+++ b/.env.production
@@ -0,0 +1 @@
+TZ=Asia/Shanghai
--- a/.envrc
+++ b/.envrc
@@ -0,0 +1,12 @@
+#!/usr/bin/env bash
+
+export DIRENV_WARN_TIMEOUT=20s
+
+eval "$(devenv direnvrc)"
+
+# `use devenv` supports the same options as the `devenv shell` command.
+#
+# To silence all output, use `--quiet`.
+#
+# Example usage: use devenv --quiet --impure --option services.postgres.enable:bool true
+use devenv
--- a/.gitignore
+++ b/.gitignore
@@ -0,0 +1,48 @@
+# devenv
+.devenv*
+devenv.local.nix
+devenv.local.yaml
+
+# direnv
+.direnv
+
+# pre-commit
+.pre-commit-config.yaml
+
+# build files
+.outputs/
+
+# go binaries
+*.exe
+*.exe~
+*.dll
+*.so
+*.dylib
+
+# test binary
+*.test
+
+# profiles and artifacts
+*.out
+coverage.*
+*.coverprofile
+profile.cov
+
+# dependency directories
+vendor/
+
+# go workspace file
+go.work
+go.work.sum
+
+# env file
+.env
+
+# editor/ide
+.idea/
+.vscode/
+
+# apple crap
+.DS_Store
+__MACOSX
+._*
--- a/.zed/settings.json
+++ b/.zed/settings.json
@@ -0,0 +1,41 @@
+// Folder-specific settings
+//
+// For a full list of overridable settings, and general information on folder-specific settings,
+// see the documentation: https://zed.dev/docs/configuring-zed#settings-files
+
+{
+    "tab_size": 4,
+    "format_on_save": "on",
+    "languages": {
+        "Nix": {
+            "tab_size": 2,
+        },
+        "TypeScript": {
+            "tab_size": 2,
+            "language_servers": [
+                "typescript-language-server",
+                "!vtsls",
+                "!deno",
+                "...",
+            ],
+        },
+        "TSX": {
+            "tab_size": 2,
+            "language_servers": [
+                "typescript-language-server",
+                "!vtsls",
+                "!deno",
+                "...",
+            ],
+        },
+        "JavaScript": {
+            "tab_size": 2,
+            "language_servers": [
+                "typescript-language-server",
+                "!vtsls",
+                "!deno",
+                "...",
+            ],
+        },
+    },
+}
--- a/README.md
+++ b/README.md
@@ -1,2 +1,25 @@
 # nixcn-cms

+## Contribution
+
+1. **Root docs serve the zh-CN version** _[MUST]_
+2. **Use sign-off via `git commit -s`** _[MUST]_
+3. **Do not modify the `main` branch for any reason** _[MUST]_
+4. **Do not omit the commit subject for any reason** _[MUST]_
+5. **Describe all changes in the commit message** _[MUST]_
+6. **Rebase before submitting patches** _[MUST]_
+7. **Commit message written in english** _[MUST]_
+8. **Use OpenPGP/SSH for commit signing** _[MUST]_
+9. **Split commits for large or multi-part changes** _[OPTION]_
+10. **Have fun contributing :)** _[VERY NECESSARY]_
+
+## Toolchain
+
+- Nix
+- Devenv
+- Direnv
+
+## Notice
+
+1. Client and all nix files use 2 space tab.
+2. All Golang files and other configs use 4 space tab.
--- a/client/.gitignore
+++ b/client/.gitignore
@@ -0,0 +1,26 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
+
+.direnv
--- a/client/bun.lock
+++ b/client/bun.lock
--- a/client/components.json
+++ b/client/components.json
@@ -0,0 +1,22 @@
+{
+  "$schema": "https://ui.shadcn.com/schema.json",
+  "style": "new-york",
+  "rsc": false,
+  "tsx": true,
+  "tailwind": {
+    "config": "",
+    "css": "src/index.css",
+    "baseColor": "neutral",
+    "cssVariables": true,
+    "prefix": ""
+  },
+  "iconLibrary": "lucide",
+  "aliases": {
+    "components": "@/components",
+    "utils": "@/lib/utils",
+    "ui": "@/components/ui",
+    "lib": "@/lib",
+    "hooks": "@/hooks"
+  },
+  "registries": {}
+}
--- a/client/eslint.config.js
+++ b/client/eslint.config.js
@@ -0,0 +1,16 @@
+import antfu from '@antfu/eslint-config';
+import pluginQuery from '@tanstack/eslint-plugin-query';
+
+export default antfu({
+  gitignore: true,
+  ignores: ['**/node_modules/**', '**/dist/**', 'bun.lock', '**/routeTree.gen.ts', '**/ui/**'],
+  react: true,
+  stylistic: {
+    semi: true,
+    quotes: 'single',
+    indent: 2,
+  },
+  typescript: {
+    tsconfigPath: 'tsconfig.json',
+  },
+}, ...pluginQuery.configs['flat/recommended']);
--- a/client/index.html
+++ b/client/index.html
@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>client</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>
--- a/client/package.json
+++ b/client/package.json
@@ -0,0 +1,89 @@
+{
+  "name": "client",
+  "type": "module",
+  "version": "0.0.0",
+  "private": true,
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc -b && vite build",
+    "lint": "eslint .",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "@dnd-kit/core": "^6.3.1",
+    "@dnd-kit/modifiers": "^9.0.0",
+    "@dnd-kit/sortable": "^10.0.0",
+    "@dnd-kit/utilities": "^3.2.2",
+    "@hookform/resolvers": "^5.2.2",
+    "@marsidev/react-turnstile": "^1.4.0",
+    "@radix-ui/react-avatar": "^1.1.11",
+    "@radix-ui/react-checkbox": "^1.3.3",
+    "@radix-ui/react-dialog": "^1.1.15",
+    "@radix-ui/react-dropdown-menu": "^2.1.16",
+    "@radix-ui/react-label": "^2.1.8",
+    "@radix-ui/react-select": "^2.2.6",
+    "@radix-ui/react-separator": "^1.1.8",
+    "@radix-ui/react-slot": "^1.2.4",
+    "@radix-ui/react-tabs": "^1.1.13",
+    "@radix-ui/react-toggle": "^1.1.10",
+    "@radix-ui/react-toggle-group": "^1.1.11",
+    "@radix-ui/react-tooltip": "^1.2.8",
+    "@tabler/icons-react": "^3.36.0",
+    "@tailwindcss/vite": "^4.1.18",
+    "@tanstack/react-form": "^1.27.7",
+    "@tanstack/react-query": "^5.90.12",
+    "@tanstack/react-router": "^1.141.6",
+    "@tanstack/react-router-devtools": "^1.141.6",
+    "@tanstack/react-table": "^8.21.3",
+    "@tanstack/zod-adapter": "^1.143.4",
+    "@tanstack/zod-form-adapter": "^0.42.1",
+    "axios": "^1.13.2",
+    "class-variance-authority": "^0.7.1",
+    "clsx": "^2.1.1",
+    "culori": "^4.0.2",
+    "immer": "^11.1.0",
+    "lucide-react": "^0.562.0",
+    "next-themes": "^0.4.6",
+    "qrcode": "^1.5.4",
+    "react": "^19.2.0",
+    "react-dom": "^19.2.0",
+    "react-hook-form": "^7.69.0",
+    "recharts": "2.15.4",
+    "sonner": "^2.0.7",
+    "tailwind-merge": "^3.4.0",
+    "tailwindcss": "^4.1.18",
+    "vaul": "^1.1.2",
+    "zod": "^4.2.1",
+    "zustand": "^5.0.9"
+  },
+  "devDependencies": {
+    "@antfu/eslint-config": "^6.7.1",
+    "@eslint-react/eslint-plugin": "^2.3.13",
+    "@eslint/js": "^9.39.1",
+    "@tanstack/eslint-plugin-query": "^5.91.2",
+    "@tanstack/router-plugin": "^1.141.7",
+    "@types/culori": "^4.0.1",
+    "@types/node": "^25.0.3",
+    "@types/qrcode": "^1.5.6",
+    "@types/react": "^19.2.5",
+    "@types/react-dom": "^19.2.3",
+    "@vitejs/plugin-react": "^5.1.1",
+    "eslint": "^9.39.1",
+    "eslint-plugin-react-hooks": "^7.0.1",
+    "eslint-plugin-react-refresh": "^0.4.26",
+    "globals": "^16.5.0",
+    "lint-staged": "^16.2.7",
+    "simple-git-hooks": "^2.13.1",
+    "tw-animate-css": "^1.4.0",
+    "typescript": "~5.9.3",
+    "typescript-eslint": "^8.46.4",
+    "vite": "^7.2.4",
+    "vite-plugin-svgr": "^4.5.0"
+  },
+  "simple-git-hooks": {
+    "pre-commit": "bun run lint-staged"
+  },
+  "lint-staged": {
+    "*": "eslint --fix"
+  }
+}
--- a/client/src/App.tsx
+++ b/client/src/App.tsx
@@ -0,0 +1,11 @@
+import { ThemeProvider } from '@/components/theme-provider';
+
+function App() {
+  return (
+    <ThemeProvider defaultTheme="dark" storageKey="vite-ui-theme">
+      <p>Hello world</p>
+    </ThemeProvider>
+  );
+}
+
+export { App };
--- a/client/src/assets/nixos.svg
+++ b/client/src/assets/nixos.svg
@@ -0,0 +1,28 @@
+<svg width="512" height="512" viewBox="0 0 512 512" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M120.587 309.626L148.36 261.518L269.887 472.005H214.34L186.567 423.897L158.794 472.005H131.021L117.126 447.943L158.794 375.772L120.604 309.626H120.587Z" fill="url(#paint0_linear_2199_41)"/>
+<path d="M141.421 165.285H196.968L75.4412 375.772L47.6681 327.664L75.4412 279.556H19.8949L6 255.494L19.8949 231.432H103.231L141.421 165.285Z" fill="url(#paint1_linear_2199_41)"/>
+<path d="M276.826 111.17L304.599 159.278H61.5632L89.3364 111.17H144.883L117.11 63.0623L131.004 39H158.778L200.446 111.17H276.826Z" fill="url(#paint2_linear_2199_41)"/>
+<path d="M391.413 201.379L363.64 249.487L242.114 39H297.66L325.433 87.108L353.206 39H380.979L394.874 63.0623L353.206 135.233L391.396 201.379H391.413Z" fill="url(#paint3_linear_2199_41)"/>
+<path d="M370.579 345.703H315.032L436.559 135.216L464.332 183.324L436.559 231.432H492.105L506 255.494L492.105 279.556H408.769L370.579 345.703Z" fill="url(#paint4_linear_2199_41)"/>
+<path d="M235.175 399.835L207.401 351.727H450.454L422.681 399.835H367.134L394.908 447.943L381.013 472.005H353.24L311.572 399.835H235.191H235.175Z" fill="url(#paint5_linear_2199_41)"/>
+<defs>
+<linearGradient id="paint0_linear_2199_41" x1="-244.299" y1="-121.183" x2="-163.239" y2="19.218" gradientUnits="userSpaceOnUse">
+<stop offset="1" stop-color="white"/>
+</linearGradient>
+<linearGradient id="paint1_linear_2199_41" x1="-194.029" y1="-258.424" x2="-275.089" y2="-118.023" gradientUnits="userSpaceOnUse">
+<stop offset="1" stop-color="white"/>
+</linearGradient>
+<linearGradient id="paint2_linear_2199_41" x1="-50.0423" y1="-283.509" x2="-212.164" y2="-283.509" gradientUnits="userSpaceOnUse">
+<stop offset="1" stop-color="white"/>
+</linearGradient>
+<linearGradient id="paint3_linear_2199_41" x1="43.6727" y1="-171.37" x2="-37.3876" y2="-311.771" gradientUnits="userSpaceOnUse">
+<stop offset="1" stop-color="white"/>
+</linearGradient>
+<linearGradient id="paint4_linear_2199_41" x1="-6.58154" y1="-34.1292" x2="74.4793" y2="-174.531" gradientUnits="userSpaceOnUse">
+<stop offset="1" stop-color="white"/>
+</linearGradient>
+<linearGradient id="paint5_linear_2199_41" x1="-150.568" y1="-9.02725" x2="11.5536" y2="-9.02733" gradientUnits="userSpaceOnUse">
+<stop offset="1" stop-color="white"/>
+</linearGradient>
+</defs>
+</svg>
--- a/client/src/components/checkin/qr-dialog.tsx
+++ b/client/src/components/checkin/qr-dialog.tsx
@@ -0,0 +1,70 @@
+import { useState } from 'react';
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger,
+} from '@/components/ui/dialog';
+import { QRCode } from '@/components/ui/shadcn-io/qr-code';
+import { useCheckinCode } from '@/hooks/data/useGetCheckInCode';
+import { Button } from '../ui/button';
+
+export function QrDialog(
+  { eventId }: { eventId: string },
+) {
+  const [open, setOpen] = useState(false);
+  return (
+    <Dialog open={open} onOpenChange={setOpen}>
+      <DialogTrigger asChild>
+        <Button className="w-20">签到</Button>
+      </DialogTrigger>
+      <DialogContent className="sm:max-w-[425px]">
+        <DialogHeader>
+          <DialogTitle>QR Code</DialogTitle>
+          <DialogDescription>
+            请工作人员扫描下面的二维码为你签到。
+          </DialogDescription>
+        </DialogHeader>
+        <QrSection eventId={eventId} enabled={open} />
+      </DialogContent>
+    </Dialog>
+  );
+}
+
+function QrSection({ eventId, enabled }: { eventId: string; enabled: boolean }) {
+  const { data } = useCheckinCode(eventId, enabled);
+  return data
+    ? (
+        <>
+          <div className="border-2 px-4 py-8 border-muted rounded-xl flex flex-col items-center justify-center p-4">
+            <QRCode data={data.data.checkin_code} className="size-60" />
+          </div>
+          <DialogFooter>
+            <div className="flex flex-1 items-center ml-2 font-mono text-3xl tracking-widest text-primary/80 justify-center">
+              {data.data.checkin_code}
+            </div>
+          </DialogFooter>
+        </>
+      )
+    : (
+        <QrSectionSkeleton />
+      );
+}
+
+function QrSectionSkeleton() {
+  return (
+    <>
+      <div className="border-2 px-4 py-8 border-muted rounded-xl flex flex-col items-center justify-center p-4">
+        <QRCode data="114514" className="size-60 blur-xs" />
+      </div>
+      <DialogFooter>
+        <div className="flex flex-1 items-center ml-2 font-mono text-3xl tracking-widest text-primary/80 justify-center">
+          Loading...
+        </div>
+      </DialogFooter>
+    </>
+  );
+}
--- a/client/src/components/hoc/with-fallback.tsx
+++ b/client/src/components/hoc/with-fallback.tsx
@@ -0,0 +1,20 @@
+import type { ReactNode } from 'react';
+import React, { Suspense } from 'react';
+
+export function withFallback<P extends object>(
+  Component: React.ComponentType<P>,
+  fallback: ReactNode,
+) {
+  const Wrapped: React.FC<P> = (props) => {
+    return (
+      <Suspense fallback={fallback}>
+        <Component {...props} />
+      </Suspense>
+    );
+  };
+
+  Wrapped.displayName = `withFallback(${Component.displayName! || Component.name || 'Component'
+  })`;
+
+  return Wrapped;
+}
--- a/client/src/components/login-form.tsx
+++ b/client/src/components/login-form.tsx
@@ -0,0 +1,84 @@
+import type { TurnstileInstance } from '@marsidev/react-turnstile';
+import type { AuthorizeSearchParams } from '@/routes/authorize';
+import { Turnstile } from '@marsidev/react-turnstile';
+import { useNavigate } from '@tanstack/react-router';
+import { useRef, useState } from 'react';
+import { toast } from 'sonner';
+import NixOSLogo from '@/assets/nixos.svg?react';
+import { Button } from '@/components/ui/button';
+import {
+  Field,
+  FieldGroup,
+  FieldLabel,
+} from '@/components/ui/field';
+import { Input } from '@/components/ui/input';
+import { useGetMagicLink } from '@/hooks/data/useGetMagicLink';
+import { cn } from '@/lib/utils';
+
+export function LoginForm({
+  oauthParams,
+  className,
+  ...props
+}: React.ComponentProps<'div'> & {
+  oauthParams: AuthorizeSearchParams;
+}) {
+  const formRef = useRef<HTMLFormElement>(null);
+  const turnstileRef = useRef<TurnstileInstance>(null);
+  const [token, setToken] = useState<string | null>(null);
+  const { mutateAsync, isPending } = useGetMagicLink();
+  const navigate = useNavigate();
+
+  const handleSubmit = (event: React.FormEvent<HTMLFormElement>) => {
+    event.preventDefault();
+    const formData = new FormData(formRef.current!);
+    const email = formData.get('email')! as string;
+    mutateAsync({ email, turnstile_token: token!, ...oauthParams }).then(() => {
+      void navigate({ to: '/magicLinkSent', search: { email } });
+    }).catch((error) => {
+      console.error(error);
+      toast.error('请求登录链接失败');
+      turnstileRef.current?.reset();
+    });
+  };
+
+  return (
+    <div className={cn('flex flex-col gap-6', className)} {...props}>
+      <form ref={formRef} onSubmit={handleSubmit}>
+        <FieldGroup>
+          <div className="flex flex-col items-center gap-2 text-center">
+            <div className="flex size-8 items-center justify-center rounded-md">
+              <NixOSLogo className="size-6" />
+            </div>
+            <span className="sr-only">Nix CN Meetup #2</span>
+            <h1 className="text-xl font-bold">欢迎来到 Nix CN Meetup #2</h1>
+          </div>
+          <Field>
+            <FieldLabel htmlFor="email">参会登记Email</FieldLabel>
+            <Input
+              id="email"
+              name="email"
+              type="email"
+              placeholder="edolstra@gmail.com"
+              required
+            />
+          </Field>
+          <Field>
+            <Button type="submit" disabled={token === null || isPending}>
+              {token === null ? '等待 Turnstile' : isPending ? '发送中...' : '发送登录链接'}
+            </Button>
+          </Field>
+        </FieldGroup>
+      </form>
+      <Turnstile
+        ref={turnstileRef}
+        siteKey="0x4AAAAAACI5pu-lNWFc6Wu1"
+        options={{
+          refreshExpired: 'auto',
+        }}
+        onSuccess={(token) => {
+          setToken(token);
+        }}
+      />
+    </div>
+  );
+}
--- a/client/src/components/profile/form.tsx
+++ b/client/src/components/profile/form.tsx
@@ -0,0 +1,104 @@
+import {
+  useForm,
+} from '@tanstack/react-form';
+import {
+  toast,
+} from 'sonner';
+import {
+  z,
+} from 'zod';
+import {
+  Button,
+} from '@/components/ui/button';
+import {
+  Field,
+  FieldError,
+  FieldLabel,
+} from '@/components/ui/field';
+import {
+  Input,
+} from '@/components/ui/input';
+
+const formSchema = z.object({
+  email: z.string(),
+  nickname: z.string().min(1),
+  subtitle: z.string().min(1),
+});
+
+export default function SettingsForm() {
+  const form = useForm({
+    defaultValues: {
+      email: '',
+      nickname: '',
+      subtitle: '',
+    },
+    validators: {
+      onBlur: formSchema,
+    },
+    onSubmit: async ({
+      value,
+    }) => {
+      try {
+        toast(
+          <code className="text-white">{JSON.stringify(value, null, 2)}</code>,
+        );
+      }
+      catch (error) {
+        console.error('Form submission error', error);
+        toast.error('Failed to submit the form. Please try again.');
+      }
+    },
+  });
+
+  return (
+    <form
+      onSubmit={(e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        void form.handleSubmit();
+      }}
+      className="space-y-3 max-w-5xl mr-auto py-10"
+    >
+      <Field>
+        <FieldLabel htmlFor="email">Email</FieldLabel>
+        <Input
+          id="email"
+          name="email"
+          placeholder="noa@requiem.garden"
+
+          value={form.getFieldValue('email')}
+          onChange={e => form.setFieldValue('email', e.target.value)}
+        />
+
+        <FieldError />
+      </Field>
+      <Field>
+        <FieldLabel htmlFor="nickname">昵称</FieldLabel>
+        <Input
+          id="nickname"
+          name="nickname"
+          placeholder="Noa Virellia"
+
+          value={form.getFieldValue('nickname')}
+          onChange={e => form.setFieldValue('nickname', e.target.value)}
+        />
+
+        <FieldError />
+      </Field>
+      <Field>
+        <FieldLabel htmlFor="subtitle">副标题</FieldLabel>
+        <Input
+          id="subtitle"
+          name="subtitle"
+          placeholder="天生骄傲"
+
+          value={form.getFieldValue('subtitle')}
+          onChange={e => form.setFieldValue('subtitle', e.target.value)}
+        />
+
+        <FieldError />
+      </Field>
+      <Button type="submit">提交</Button>
+    </form>
+  );
+}
--- a/client/src/components/profile/main-profile.tsx
+++ b/client/src/components/profile/main-profile.tsx
@@ -0,0 +1,34 @@
+import { Mail } from 'lucide-react';
+import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar';
+import { Button } from '@/components/ui/button';
+import { useUserInfo } from '@/hooks/data/useUserInfo';
+
+export function MainProfile() {
+  const { data: user } = useUserInfo();
+  return (
+    <div className="flex flex-col w-full">
+      <div className="flex w-full flex-row gap-4 mt-2">
+        <Avatar className="size-16 rounded-full border-2 border-muted">
+          <AvatarImage src={user.avatar} alt={user.nickname} />
+          <AvatarFallback className="rounded-lg">CN</AvatarFallback>
+        </Avatar>
+        <div className="flex flex-1 flex-col justify-center">
+          <span className="font-semibold text-2xl" aria-hidden="true">{user.nickname}</span>
+          <span className="text-[20px] text-muted-foreground" aria-hidden="true">{user.subtitle}</span>
+        </div>
+      </div>
+      <Button className="w-full mt-4" variant="outline" size="lg">
+        编辑个人资料
+      </Button>
+      <section className="px-2 mt-4">
+        <div className="flex flex-row gap-2 items-center text-sm">
+          <Mail className="h-4 w-4 stroke-muted-foreground" />
+          {user.email}
+        </div>
+      </section>
+      <section className="rounded-md border border-muted w-full min-h-72 mt-4">
+        {/* Bio */}
+      </section>
+    </div>
+  );
+}
--- a/client/src/components/sidebar/app-sidebar.tsx
+++ b/client/src/components/sidebar/app-sidebar.tsx
@@ -0,0 +1,44 @@
+import * as React from 'react';
+import NixOSLogo from '@/assets/nixos.svg?react';
+import { NavMain } from '@/components/sidebar/nav-main';
+import { NavSecondary } from '@/components/sidebar/nav-secondary';
+import {
+  Sidebar,
+  SidebarContent,
+  SidebarFooter,
+  SidebarHeader,
+  SidebarMenu,
+  SidebarMenuButton,
+  SidebarMenuItem,
+} from '@/components/ui/sidebar';
+import { navData } from '@/lib/navData';
+import { NavUser } from './nav-user';
+
+export function AppSidebar({ ...props }: React.ComponentProps<typeof Sidebar>) {
+  return (
+    <Sidebar collapsible="offcanvas" {...props}>
+      <SidebarHeader>
+        <SidebarMenu>
+          <SidebarMenuItem>
+            <SidebarMenuButton
+              asChild
+              className="data-[slot=sidebar-menu-button]:p-1.5!"
+            >
+              <a href="#">
+                <NixOSLogo />
+                <span className="text-base font-semibold">Nix CN CMS</span>
+              </a>
+            </SidebarMenuButton>
+          </SidebarMenuItem>
+        </SidebarMenu>
+      </SidebarHeader>
+      <SidebarContent>
+        <NavMain items={navData.navMain} />
+        <NavSecondary items={navData.navSecondary} className="mt-auto" />
+      </SidebarContent>
+      <SidebarFooter>
+        <NavUser />
+      </SidebarFooter>
+    </Sidebar>
+  );
+}
--- a/client/src/components/sidebar/nav-main.tsx
+++ b/client/src/components/sidebar/nav-main.tsx
@@ -0,0 +1,45 @@
+import type { Icon } from '@tabler/icons-react';
+
+import { Link } from '@tanstack/react-router';
+import {
+  SidebarGroup,
+  SidebarGroupContent,
+  SidebarMenu,
+  SidebarMenuButton,
+  SidebarMenuItem,
+} from '@/components/ui/sidebar';
+
+export function NavMain({
+  items,
+}: {
+  items: {
+    title: string;
+    url: string;
+    icon?: Icon;
+  }[];
+}) {
+  return (
+    <SidebarGroup>
+      <SidebarGroupContent className="flex flex-col gap-2">
+        <SidebarMenu>
+          {items.map(item => (
+            <SidebarMenuItem key={item.title}>
+              <Link
+                to={item.url}
+              >
+                {({ isActive }) => {
+                  return (
+                    <SidebarMenuButton isActive={isActive} tooltip={item.title}>
+                      {item.icon && <item.icon />}
+                      <span>{item.title}</span>
+                    </SidebarMenuButton>
+                  );
+                }}
+              </Link>
+            </SidebarMenuItem>
+          ))}
+        </SidebarMenu>
+      </SidebarGroupContent>
+    </SidebarGroup>
+  );
+}
--- a/client/src/components/sidebar/nav-secondary.tsx
+++ b/client/src/components/sidebar/nav-secondary.tsx
@@ -0,0 +1,47 @@
+'use client';
+
+import type { Icon } from '@tabler/icons-react';
+import { Link } from '@tanstack/react-router';
+
+import * as React from 'react';
+import {
+  SidebarGroup,
+  SidebarGroupContent,
+  SidebarMenu,
+  SidebarMenuButton,
+  SidebarMenuItem,
+} from '@/components/ui/sidebar';
+
+export function NavSecondary({
+  items,
+  ...props
+}: {
+  items: {
+    title: string;
+    url: string;
+    icon: Icon;
+  }[];
+} & React.ComponentPropsWithoutRef<typeof SidebarGroup>) {
+  return (
+    <SidebarGroup {...props}>
+      <SidebarGroupContent>
+        <SidebarMenu>
+          {items.map(item => (
+            <SidebarMenuItem key={item.title}>
+              <Link to={item.url}>
+                {({ isActive }) => {
+                  return (
+                    <SidebarMenuButton isActive={isActive} tooltip={item.title}>
+                      <item.icon />
+                      <span>{item.title}</span>
+                    </SidebarMenuButton>
+                  );
+                }}
+              </Link>
+            </SidebarMenuItem>
+          ))}
+        </SidebarMenu>
+      </SidebarGroupContent>
+    </SidebarGroup>
+  );
+}
--- a/client/src/components/sidebar/nav-user.tsx
+++ b/client/src/components/sidebar/nav-user.tsx
@@ -0,0 +1,104 @@
+import {
+  IconDotsVertical,
+  IconLogout,
+} from '@tabler/icons-react';
+
+import {
+  Avatar,
+  AvatarFallback,
+  AvatarImage,
+} from '@/components/ui/avatar';
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuLabel,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger,
+} from '@/components/ui/dropdown-menu';
+import {
+  SidebarMenu,
+  SidebarMenuButton,
+  SidebarMenuItem,
+  useSidebar,
+} from '@/components/ui/sidebar';
+import { useUserInfo } from '@/hooks/data/useUserInfo';
+import { useLogout } from '@/hooks/useLogout';
+import { withFallback } from '../hoc/with-fallback';
+import { Skeleton } from '../ui/skeleton';
+
+function NavUser_() {
+  const { isMobile } = useSidebar();
+  const { data: user } = useUserInfo();
+  const { logout } = useLogout();
+
+  return (
+    <SidebarMenu>
+      <SidebarMenuItem>
+        <DropdownMenu>
+          <DropdownMenuTrigger asChild>
+            <SidebarMenuButton
+              size="lg"
+              className="data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground"
+            >
+              <Avatar className="h-8 w-8 rounded-lg grayscale">
+                <AvatarImage src={user.avatar} alt={user.nickname} />
+                <AvatarFallback className="rounded-lg">CN</AvatarFallback>
+              </Avatar>
+              <div className="grid flex-1 text-left text-sm leading-tight">
+                <span className="truncate font-medium">{user.nickname}</span>
+                <span className="text-muted-foreground truncate text-xs">
+                  {user.email}
+                </span>
+              </div>
+              <IconDotsVertical className="ml-auto size-4" />
+            </SidebarMenuButton>
+          </DropdownMenuTrigger>
+          <DropdownMenuContent
+            className="w-(--radix-dropdown-menu-trigger-width) min-w-56 rounded-lg"
+            side={isMobile ? 'bottom' : 'right'}
+            align="end"
+            sideOffset={4}
+          >
+            <DropdownMenuLabel className="p-0 font-normal">
+              <div className="flex items-center gap-2 px-1 py-1.5 text-left text-sm">
+                <Avatar className="h-8 w-8 rounded-lg">
+                  <AvatarImage src={user.avatar} alt={user.nickname} />
+                  <AvatarFallback className="rounded-lg">CN</AvatarFallback>
+                </Avatar>
+                <div className="grid flex-1 text-left text-sm leading-tight">
+                  <span className="truncate font-medium">{user.nickname}</span>
+                  <span className="text-muted-foreground truncate text-xs">
+                    {user.email}
+                  </span>
+                </div>
+              </div>
+            </DropdownMenuLabel>
+            <DropdownMenuSeparator />
+            <DropdownMenuItem onClick={logout}>
+              <IconLogout />
+              登出
+            </DropdownMenuItem>
+          </DropdownMenuContent>
+        </DropdownMenu>
+      </SidebarMenuItem>
+    </SidebarMenu>
+  );
+}
+
+function NavUserSkeleton() {
+  return (
+    <SidebarMenuButton
+      size="lg"
+    >
+      <Skeleton className="h-8 w-8 rounded-lg" />
+      <div className="flex flex-col flex-1 gap-1">
+        <Skeleton className="h-3 w-16" />
+        <Skeleton className="h-3 w-24" />
+      </div>
+      <IconDotsVertical className="ml-auto size-4" />
+    </SidebarMenuButton>
+  );
+}
+
+export const NavUser = withFallback(NavUser_, <NavUserSkeleton />);
--- a/client/src/components/site-header.tsx
+++ b/client/src/components/site-header.tsx
@@ -0,0 +1,28 @@
+import { useRouterState } from '@tanstack/react-router';
+import { Separator } from '@/components/ui/separator';
+import { SidebarTrigger } from '@/components/ui/sidebar';
+import { navData } from '@/lib/navData';
+
+export function SiteHeader() {
+  const pathname = useRouterState({ select: state => state.location.pathname });
+  const allNavItems = [...navData.navMain, ...navData.navSecondary];
+  const currentTitle
+    = allNavItems.find(item =>
+      item.url === '/'
+        ? pathname === '/'
+        : pathname.startsWith(item.url),
+    )?.title ?? '工作台';
+
+  return (
+    <header className="flex h-(--header-height) shrink-0 items-center gap-2 border-b transition-[width,height] ease-linear group-has-data-[collapsible=icon]/sidebar-wrapper:h-(--header-height)">
+      <div className="flex w-full items-center gap-1 px-4 lg:gap-2 lg:px-6">
+        <SidebarTrigger className="-ml-1" />
+        <Separator
+          orientation="vertical"
+          className="mx-2 data-[orientation=vertical]:h-4"
+        />
+        <h1 className="text-base font-medium">{currentTitle}</h1>
+      </div>
+    </header>
+  );
+}
--- a/client/src/components/theme-provider.tsx
+++ b/client/src/components/theme-provider.tsx
@@ -0,0 +1,53 @@
+import type { Theme } from '@/hooks/useTheme';
+import { useEffect, useState } from 'react';
+import { ThemeProviderContext } from '@/hooks/useTheme';
+
+interface ThemeProviderProps {
+  children: React.ReactNode;
+  defaultTheme?: Theme;
+  storageKey?: string;
+}
+
+export function ThemeProvider({
+  children,
+  defaultTheme = 'dark',
+  storageKey = 'vite-ui-theme',
+  ...props
+}: ThemeProviderProps) {
+  const [theme, setTheme] = useState<Theme>(
+    () => (localStorage.getItem(storageKey) as Theme) || defaultTheme,
+  );
+
+  useEffect(() => {
+    const root = window.document.documentElement;
+
+    root.classList.remove('light', 'dark');
+
+    if (theme === 'system') {
+      const systemTheme = window.matchMedia('(prefers-color-scheme: dark)')
+        .matches
+        ? 'dark'
+        : 'light';
+
+      root.classList.add(systemTheme);
+      return;
+    }
+
+    root.classList.add(theme);
+  }, [theme]);
+
+  // eslint-disable-next-line react/no-unstable-context-value
+  const value = {
+    theme,
+    setTheme: (theme: Theme) => {
+      localStorage.setItem(storageKey, theme);
+      setTheme(theme);
+    },
+  };
+
+  return (
+    <ThemeProviderContext {...props} value={value}>
+      {children}
+    </ThemeProviderContext>
+  );
+}
--- a/client/src/components/ui/avatar.tsx
+++ b/client/src/components/ui/avatar.tsx
@@ -0,0 +1,53 @@
+"use client"
+
+import * as React from "react"
+import * as AvatarPrimitive from "@radix-ui/react-avatar"
+
+import { cn } from "@/lib/utils"
+
+function Avatar({
+  className,
+  ...props
+}: React.ComponentProps<typeof AvatarPrimitive.Root>) {
+  return (
+    <AvatarPrimitive.Root
+      data-slot="avatar"
+      className={cn(
+        "relative flex size-8 shrink-0 overflow-hidden rounded-full",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function AvatarImage({
+  className,
+  ...props
+}: React.ComponentProps<typeof AvatarPrimitive.Image>) {
+  return (
+    <AvatarPrimitive.Image
+      data-slot="avatar-image"
+      className={cn("aspect-square size-full", className)}
+      {...props}
+    />
+  )
+}
+
+function AvatarFallback({
+  className,
+  ...props
+}: React.ComponentProps<typeof AvatarPrimitive.Fallback>) {
+  return (
+    <AvatarPrimitive.Fallback
+      data-slot="avatar-fallback"
+      className={cn(
+        "bg-muted flex size-full items-center justify-center rounded-full",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+export { Avatar, AvatarImage, AvatarFallback }
--- a/client/src/components/ui/badge.tsx
+++ b/client/src/components/ui/badge.tsx
@@ -0,0 +1,46 @@
+import * as React from "react"
+import { Slot } from "@radix-ui/react-slot"
+import { cva, type VariantProps } from "class-variance-authority"
+
+import { cn } from "@/lib/utils"
+
+const badgeVariants = cva(
+  "inline-flex items-center justify-center rounded-full border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden",
+  {
+    variants: {
+      variant: {
+        default:
+          "border-transparent bg-primary text-primary-foreground [a&]:hover:bg-primary/90",
+        secondary:
+          "border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90",
+        destructive:
+          "border-transparent bg-destructive text-white [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
+        outline:
+          "text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
+      },
+    },
+    defaultVariants: {
+      variant: "default",
+    },
+  }
+)
+
+function Badge({
+  className,
+  variant,
+  asChild = false,
+  ...props
+}: React.ComponentProps<"span"> &
+  VariantProps<typeof badgeVariants> & { asChild?: boolean }) {
+  const Comp = asChild ? Slot : "span"
+
+  return (
+    <Comp
+      data-slot="badge"
+      className={cn(badgeVariants({ variant }), className)}
+      {...props}
+    />
+  )
+}
+
+export { Badge, badgeVariants }
--- a/client/src/components/ui/breadcrumb.tsx
+++ b/client/src/components/ui/breadcrumb.tsx
@@ -0,0 +1,109 @@
+import * as React from "react"
+import { Slot } from "@radix-ui/react-slot"
+import { ChevronRight, MoreHorizontal } from "lucide-react"
+
+import { cn } from "@/lib/utils"
+
+function Breadcrumb({ ...props }: React.ComponentProps<"nav">) {
+  return <nav aria-label="breadcrumb" data-slot="breadcrumb" {...props} />
+}
+
+function BreadcrumbList({ className, ...props }: React.ComponentProps<"ol">) {
+  return (
+    <ol
+      data-slot="breadcrumb-list"
+      className={cn(
+        "text-muted-foreground flex flex-wrap items-center gap-1.5 text-sm break-words sm:gap-2.5",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function BreadcrumbItem({ className, ...props }: React.ComponentProps<"li">) {
+  return (
+    <li
+      data-slot="breadcrumb-item"
+      className={cn("inline-flex items-center gap-1.5", className)}
+      {...props}
+    />
+  )
+}
+
+function BreadcrumbLink({
+  asChild,
+  className,
+  ...props
+}: React.ComponentProps<"a"> & {
+  asChild?: boolean
+}) {
+  const Comp = asChild ? Slot : "a"
+
+  return (
+    <Comp
+      data-slot="breadcrumb-link"
+      className={cn("hover:text-foreground transition-colors", className)}
+      {...props}
+    />
+  )
+}
+
+function BreadcrumbPage({ className, ...props }: React.ComponentProps<"span">) {
+  return (
+    <span
+      data-slot="breadcrumb-page"
+      role="link"
+      aria-disabled="true"
+      aria-current="page"
+      className={cn("text-foreground font-normal", className)}
+      {...props}
+    />
+  )
+}
+
+function BreadcrumbSeparator({
+  children,
+  className,
+  ...props
+}: React.ComponentProps<"li">) {
+  return (
+    <li
+      data-slot="breadcrumb-separator"
+      role="presentation"
+      aria-hidden="true"
+      className={cn("[&>svg]:size-3.5", className)}
+      {...props}
+    >
+      {children ?? <ChevronRight />}
+    </li>
+  )
+}
+
+function BreadcrumbEllipsis({
+  className,
+  ...props
+}: React.ComponentProps<"span">) {
+  return (
+    <span
+      data-slot="breadcrumb-ellipsis"
+      role="presentation"
+      aria-hidden="true"
+      className={cn("flex size-9 items-center justify-center", className)}
+      {...props}
+    >
+      <MoreHorizontal className="size-4" />
+      <span className="sr-only">More</span>
+    </span>
+  )
+}
+
+export {
+  Breadcrumb,
+  BreadcrumbList,
+  BreadcrumbItem,
+  BreadcrumbLink,
+  BreadcrumbPage,
+  BreadcrumbSeparator,
+  BreadcrumbEllipsis,
+}
--- a/client/src/components/ui/button.tsx
+++ b/client/src/components/ui/button.tsx
@@ -0,0 +1,63 @@
+import type { VariantProps } from 'class-variance-authority';
+import { Slot } from '@radix-ui/react-slot';
+import { cva } from 'class-variance-authority';
+import * as React from 'react';
+
+import { cn } from '@/lib/utils';
+
+const buttonVariants = cva(
+  'inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*=\'size-\'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive',
+  {
+    variants: {
+      variant: {
+        default: 'bg-primary text-primary-foreground hover:bg-primary/90',
+        destructive:
+          'bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60',
+        outline:
+          'border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50',
+        secondary:
+          'bg-secondary text-secondary-foreground hover:bg-secondary/80',
+        ghost:
+          'hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50',
+        link: 'text-primary underline-offset-4 hover:underline',
+      },
+      size: {
+        'default': 'h-9 px-4 py-2 has-[>svg]:px-3',
+        'sm': 'h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5',
+        'lg': 'h-10 rounded-md px-6 has-[>svg]:px-4',
+        'icon': 'size-9',
+        'icon-sm': 'size-8',
+        'icon-lg': 'size-10',
+      },
+    },
+    defaultVariants: {
+      variant: 'default',
+      size: 'default',
+    },
+  },
+);
+
+function Button({
+  className,
+  variant = 'default',
+  size = 'default',
+  asChild = false,
+  ...props
+}: React.ComponentProps<'button'>
+  & VariantProps<typeof buttonVariants> & {
+    asChild?: boolean;
+  }) {
+  const Comp = asChild ? Slot : 'button';
+
+  return (
+    <Comp
+      data-slot="button"
+      data-variant={variant}
+      data-size={size}
+      className={cn(buttonVariants({ variant, size, className }))}
+      {...props}
+    />
+  );
+}
+
+export { Button, buttonVariants };
--- a/client/src/components/ui/card.tsx
+++ b/client/src/components/ui/card.tsx
@@ -0,0 +1,92 @@
+import * as React from "react"
+
+import { cn } from "@/lib/utils"
+
+function Card({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="card"
+      className={cn(
+        "bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function CardHeader({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="card-header"
+      className={cn(
+        "@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-2 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function CardTitle({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="card-title"
+      className={cn("leading-none font-semibold", className)}
+      {...props}
+    />
+  )
+}
+
+function CardDescription({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="card-description"
+      className={cn("text-muted-foreground text-sm", className)}
+      {...props}
+    />
+  )
+}
+
+function CardAction({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="card-action"
+      className={cn(
+        "col-start-2 row-span-2 row-start-1 self-start justify-self-end",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function CardContent({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="card-content"
+      className={cn("px-6", className)}
+      {...props}
+    />
+  )
+}
+
+function CardFooter({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="card-footer"
+      className={cn("flex items-center px-6 [.border-t]:pt-6", className)}
+      {...props}
+    />
+  )
+}
+
+export {
+  Card,
+  CardHeader,
+  CardFooter,
+  CardTitle,
+  CardAction,
+  CardDescription,
+  CardContent,
+}
--- a/client/src/components/ui/chart.tsx
+++ b/client/src/components/ui/chart.tsx
@@ -0,0 +1,355 @@
+import * as React from "react"
+import * as RechartsPrimitive from "recharts"
+
+import { cn } from "@/lib/utils"
+
+// Format: { THEME_NAME: CSS_SELECTOR }
+const THEMES = { light: "", dark: ".dark" } as const
+
+export type ChartConfig = {
+  [k in string]: {
+    label?: React.ReactNode
+    icon?: React.ComponentType
+  } & (
+    | { color?: string; theme?: never }
+    | { color?: never; theme: Record<keyof typeof THEMES, string> }
+  )
+}
+
+type ChartContextProps = {
+  config: ChartConfig
+}
+
+const ChartContext = React.createContext<ChartContextProps | null>(null)
+
+function useChart() {
+  const context = React.useContext(ChartContext)
+
+  if (!context) {
+    throw new Error("useChart must be used within a <ChartContainer />")
+  }
+
+  return context
+}
+
+function ChartContainer({
+  id,
+  className,
+  children,
+  config,
+  ...props
+}: React.ComponentProps<"div"> & {
+  config: ChartConfig
+  children: React.ComponentProps<
+    typeof RechartsPrimitive.ResponsiveContainer
+  >["children"]
+}) {
+  const uniqueId = React.useId()
+  const chartId = `chart-${id || uniqueId.replace(/:/g, "")}`
+
+  return (
+    <ChartContext.Provider value={{ config }}>
+      <div
+        data-slot="chart"
+        data-chart={chartId}
+        className={cn(
+          "[&_.recharts-cartesian-axis-tick_text]:fill-muted-foreground [&_.recharts-cartesian-grid_line[stroke='#ccc']]:stroke-border/50 [&_.recharts-curve.recharts-tooltip-cursor]:stroke-border [&_.recharts-polar-grid_[stroke='#ccc']]:stroke-border [&_.recharts-radial-bar-background-sector]:fill-muted [&_.recharts-rectangle.recharts-tooltip-cursor]:fill-muted [&_.recharts-reference-line_[stroke='#ccc']]:stroke-border flex aspect-video justify-center text-xs [&_.recharts-dot[stroke='#fff']]:stroke-transparent [&_.recharts-layer]:outline-hidden [&_.recharts-sector]:outline-hidden [&_.recharts-sector[stroke='#fff']]:stroke-transparent [&_.recharts-surface]:outline-hidden",
+          className
+        )}
+        {...props}
+      >
+        <ChartStyle id={chartId} config={config} />
+        <RechartsPrimitive.ResponsiveContainer>
+          {children}
+        </RechartsPrimitive.ResponsiveContainer>
+      </div>
+    </ChartContext.Provider>
+  )
+}
+
+const ChartStyle = ({ id, config }: { id: string; config: ChartConfig }) => {
+  const colorConfig = Object.entries(config).filter(
+    ([, config]) => config.theme || config.color
+  )
+
+  if (!colorConfig.length) {
+    return null
+  }
+
+  return (
+    <style
+      dangerouslySetInnerHTML={{
+        __html: Object.entries(THEMES)
+          .map(
+            ([theme, prefix]) => `
+${prefix} [data-chart=${id}] {
+${colorConfig
+  .map(([key, itemConfig]) => {
+    const color =
+      itemConfig.theme?.[theme as keyof typeof itemConfig.theme] ||
+      itemConfig.color
+    return color ? `  --color-${key}: ${color};` : null
+  })
+  .join("\n")}
+}
+`
+          )
+          .join("\n"),
+      }}
+    />
+  )
+}
+
+const ChartTooltip = RechartsPrimitive.Tooltip
+
+function ChartTooltipContent({
+  active,
+  payload,
+  className,
+  indicator = "dot",
+  hideLabel = false,
+  hideIndicator = false,
+  label,
+  labelFormatter,
+  labelClassName,
+  formatter,
+  color,
+  nameKey,
+  labelKey,
+}: React.ComponentProps<typeof RechartsPrimitive.Tooltip> &
+  React.ComponentProps<"div"> & {
+    hideLabel?: boolean
+    hideIndicator?: boolean
+    indicator?: "line" | "dot" | "dashed"
+    nameKey?: string
+    labelKey?: string
+  }) {
+  const { config } = useChart()
+
+  const tooltipLabel = React.useMemo(() => {
+    if (hideLabel || !payload?.length) {
+      return null
+    }
+
+    const [item] = payload
+    const key = `${labelKey || item?.dataKey || item?.name || "value"}`
+    const itemConfig = getPayloadConfigFromPayload(config, item, key)
+    const value =
+      !labelKey && typeof label === "string"
+        ? config[label as keyof typeof config]?.label || label
+        : itemConfig?.label
+
+    if (labelFormatter) {
+      return (
+        <div className={cn("font-medium", labelClassName)}>
+          {labelFormatter(value, payload)}
+        </div>
+      )
+    }
+
+    if (!value) {
+      return null
+    }
+
+    return <div className={cn("font-medium", labelClassName)}>{value}</div>
+  }, [
+    label,
+    labelFormatter,
+    payload,
+    hideLabel,
+    labelClassName,
+    config,
+    labelKey,
+  ])
+
+  if (!active || !payload?.length) {
+    return null
+  }
+
+  const nestLabel = payload.length === 1 && indicator !== "dot"
+
+  return (
+    <div
+      className={cn(
+        "border-border/50 bg-background grid min-w-[8rem] items-start gap-1.5 rounded-lg border px-2.5 py-1.5 text-xs shadow-xl",
+        className
+      )}
+    >
+      {!nestLabel ? tooltipLabel : null}
+      <div className="grid gap-1.5">
+        {payload
+          .filter((item) => item.type !== "none")
+          .map((item, index) => {
+            const key = `${nameKey || item.name || item.dataKey || "value"}`
+            const itemConfig = getPayloadConfigFromPayload(config, item, key)
+            const indicatorColor = color || item.payload.fill || item.color
+
+            return (
+              <div
+                key={item.dataKey}
+                className={cn(
+                  "[&>svg]:text-muted-foreground flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5",
+                  indicator === "dot" && "items-center"
+                )}
+              >
+                {formatter && item?.value !== undefined && item.name ? (
+                  formatter(item.value, item.name, item, index, item.payload)
+                ) : (
+                  <>
+                    {itemConfig?.icon ? (
+                      <itemConfig.icon />
+                    ) : (
+                      !hideIndicator && (
+                        <div
+                          className={cn(
+                            "shrink-0 rounded-[2px] border-(--color-border) bg-(--color-bg)",
+                            {
+                              "h-2.5 w-2.5": indicator === "dot",
+                              "w-1": indicator === "line",
+                              "w-0 border-[1.5px] border-dashed bg-transparent":
+                                indicator === "dashed",
+                              "my-0.5": nestLabel && indicator === "dashed",
+                            }
+                          )}
+                          style={
+                            {
+                              "--color-bg": indicatorColor,
+                              "--color-border": indicatorColor,
+                            } as React.CSSProperties
+                          }
+                        />
+                      )
+                    )}
+                    <div
+                      className={cn(
+                        "flex flex-1 justify-between leading-none",
+                        nestLabel ? "items-end" : "items-center"
+                      )}
+                    >
+                      <div className="grid gap-1.5">
+                        {nestLabel ? tooltipLabel : null}
+                        <span className="text-muted-foreground">
+                          {itemConfig?.label || item.name}
+                        </span>
+                      </div>
+                      {item.value && (
+                        <span className="text-foreground font-mono font-medium tabular-nums">
+                          {item.value.toLocaleString()}
+                        </span>
+                      )}
+                    </div>
+                  </>
+                )}
+              </div>
+            )
+          })}
+      </div>
+    </div>
+  )
+}
+
+const ChartLegend = RechartsPrimitive.Legend
+
+function ChartLegendContent({
+  className,
+  hideIcon = false,
+  payload,
+  verticalAlign = "bottom",
+  nameKey,
+}: React.ComponentProps<"div"> &
+  Pick<RechartsPrimitive.LegendProps, "payload" | "verticalAlign"> & {
+    hideIcon?: boolean
+    nameKey?: string
+  }) {
+  const { config } = useChart()
+
+  if (!payload?.length) {
+    return null
+  }
+
+  return (
+    <div
+      className={cn(
+        "flex items-center justify-center gap-4",
+        verticalAlign === "top" ? "pb-3" : "pt-3",
+        className
+      )}
+    >
+      {payload
+        .filter((item) => item.type !== "none")
+        .map((item) => {
+          const key = `${nameKey || item.dataKey || "value"}`
+          const itemConfig = getPayloadConfigFromPayload(config, item, key)
+
+          return (
+            <div
+              key={item.value}
+              className={cn(
+                "[&>svg]:text-muted-foreground flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3"
+              )}
+            >
+              {itemConfig?.icon && !hideIcon ? (
+                <itemConfig.icon />
+              ) : (
+                <div
+                  className="h-2 w-2 shrink-0 rounded-[2px]"
+                  style={{
+                    backgroundColor: item.color,
+                  }}
+                />
+              )}
+              {itemConfig?.label}
+            </div>
+          )
+        })}
+    </div>
+  )
+}
+
+// Helper to extract item config from a payload.
+function getPayloadConfigFromPayload(
+  config: ChartConfig,
+  payload: unknown,
+  key: string
+) {
+  if (typeof payload !== "object" || payload === null) {
+    return undefined
+  }
+
+  const payloadPayload =
+    "payload" in payload &&
+    typeof payload.payload === "object" &&
+    payload.payload !== null
+      ? payload.payload
+      : undefined
+
+  let configLabelKey: string = key
+
+  if (
+    key in payload &&
+    typeof payload[key as keyof typeof payload] === "string"
+  ) {
+    configLabelKey = payload[key as keyof typeof payload] as string
+  } else if (
+    payloadPayload &&
+    key in payloadPayload &&
+    typeof payloadPayload[key as keyof typeof payloadPayload] === "string"
+  ) {
+    configLabelKey = payloadPayload[
+      key as keyof typeof payloadPayload
+    ] as string
+  }
+
+  return configLabelKey in config
+    ? config[configLabelKey]
+    : config[key as keyof typeof config]
+}
+
+export {
+  ChartContainer,
+  ChartTooltip,
+  ChartTooltipContent,
+  ChartLegend,
+  ChartLegendContent,
+  ChartStyle,
+}
--- a/client/src/components/ui/checkbox.tsx
+++ b/client/src/components/ui/checkbox.tsx
@@ -0,0 +1,30 @@
+import * as React from "react"
+import * as CheckboxPrimitive from "@radix-ui/react-checkbox"
+import { CheckIcon } from "lucide-react"
+
+import { cn } from "@/lib/utils"
+
+function Checkbox({
+  className,
+  ...props
+}: React.ComponentProps<typeof CheckboxPrimitive.Root>) {
+  return (
+    <CheckboxPrimitive.Root
+      data-slot="checkbox"
+      className={cn(
+        "peer border-input dark:bg-input/30 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground dark:data-[state=checked]:bg-primary data-[state=checked]:border-primary focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive size-4 shrink-0 rounded-[4px] border shadow-xs transition-shadow outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50",
+        className
+      )}
+      {...props}
+    >
+      <CheckboxPrimitive.Indicator
+        data-slot="checkbox-indicator"
+        className="grid place-content-center text-current transition-none"
+      >
+        <CheckIcon className="size-3.5" />
+      </CheckboxPrimitive.Indicator>
+    </CheckboxPrimitive.Root>
+  )
+}
+
+export { Checkbox }
--- a/client/src/components/ui/dialog.tsx
+++ b/client/src/components/ui/dialog.tsx
@@ -0,0 +1,141 @@
+import * as React from "react"
+import * as DialogPrimitive from "@radix-ui/react-dialog"
+import { XIcon } from "lucide-react"
+
+import { cn } from "@/lib/utils"
+
+function Dialog({
+  ...props
+}: React.ComponentProps<typeof DialogPrimitive.Root>) {
+  return <DialogPrimitive.Root data-slot="dialog" {...props} />
+}
+
+function DialogTrigger({
+  ...props
+}: React.ComponentProps<typeof DialogPrimitive.Trigger>) {
+  return <DialogPrimitive.Trigger data-slot="dialog-trigger" {...props} />
+}
+
+function DialogPortal({
+  ...props
+}: React.ComponentProps<typeof DialogPrimitive.Portal>) {
+  return <DialogPrimitive.Portal data-slot="dialog-portal" {...props} />
+}
+
+function DialogClose({
+  ...props
+}: React.ComponentProps<typeof DialogPrimitive.Close>) {
+  return <DialogPrimitive.Close data-slot="dialog-close" {...props} />
+}
+
+function DialogOverlay({
+  className,
+  ...props
+}: React.ComponentProps<typeof DialogPrimitive.Overlay>) {
+  return (
+    <DialogPrimitive.Overlay
+      data-slot="dialog-overlay"
+      className={cn(
+        "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function DialogContent({
+  className,
+  children,
+  showCloseButton = true,
+  ...props
+}: React.ComponentProps<typeof DialogPrimitive.Content> & {
+  showCloseButton?: boolean
+}) {
+  return (
+    <DialogPortal data-slot="dialog-portal">
+      <DialogOverlay />
+      <DialogPrimitive.Content
+        data-slot="dialog-content"
+        className={cn(
+          "bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 outline-none sm:max-w-lg",
+          className
+        )}
+        {...props}
+      >
+        {children}
+        {showCloseButton && (
+          <DialogPrimitive.Close
+            data-slot="dialog-close"
+            className="ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4"
+          >
+            <XIcon />
+            <span className="sr-only">Close</span>
+          </DialogPrimitive.Close>
+        )}
+      </DialogPrimitive.Content>
+    </DialogPortal>
+  )
+}
+
+function DialogHeader({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="dialog-header"
+      className={cn("flex flex-col gap-2 text-center sm:text-left", className)}
+      {...props}
+    />
+  )
+}
+
+function DialogFooter({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="dialog-footer"
+      className={cn(
+        "flex flex-col-reverse gap-2 sm:flex-row sm:justify-end",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function DialogTitle({
+  className,
+  ...props
+}: React.ComponentProps<typeof DialogPrimitive.Title>) {
+  return (
+    <DialogPrimitive.Title
+      data-slot="dialog-title"
+      className={cn("text-lg leading-none font-semibold", className)}
+      {...props}
+    />
+  )
+}
+
+function DialogDescription({
+  className,
+  ...props
+}: React.ComponentProps<typeof DialogPrimitive.Description>) {
+  return (
+    <DialogPrimitive.Description
+      data-slot="dialog-description"
+      className={cn("text-muted-foreground text-sm", className)}
+      {...props}
+    />
+  )
+}
+
+export {
+  Dialog,
+  DialogClose,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogOverlay,
+  DialogPortal,
+  DialogTitle,
+  DialogTrigger,
+}
--- a/client/src/components/ui/drawer.tsx
+++ b/client/src/components/ui/drawer.tsx
@@ -0,0 +1,133 @@
+import * as React from "react"
+import { Drawer as DrawerPrimitive } from "vaul"
+
+import { cn } from "@/lib/utils"
+
+function Drawer({
+  ...props
+}: React.ComponentProps<typeof DrawerPrimitive.Root>) {
+  return <DrawerPrimitive.Root data-slot="drawer" {...props} />
+}
+
+function DrawerTrigger({
+  ...props
+}: React.ComponentProps<typeof DrawerPrimitive.Trigger>) {
+  return <DrawerPrimitive.Trigger data-slot="drawer-trigger" {...props} />
+}
+
+function DrawerPortal({
+  ...props
+}: React.ComponentProps<typeof DrawerPrimitive.Portal>) {
+  return <DrawerPrimitive.Portal data-slot="drawer-portal" {...props} />
+}
+
+function DrawerClose({
+  ...props
+}: React.ComponentProps<typeof DrawerPrimitive.Close>) {
+  return <DrawerPrimitive.Close data-slot="drawer-close" {...props} />
+}
+
+function DrawerOverlay({
+  className,
+  ...props
+}: React.ComponentProps<typeof DrawerPrimitive.Overlay>) {
+  return (
+    <DrawerPrimitive.Overlay
+      data-slot="drawer-overlay"
+      className={cn(
+        "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function DrawerContent({
+  className,
+  children,
+  ...props
+}: React.ComponentProps<typeof DrawerPrimitive.Content>) {
+  return (
+    <DrawerPortal data-slot="drawer-portal">
+      <DrawerOverlay />
+      <DrawerPrimitive.Content
+        data-slot="drawer-content"
+        className={cn(
+          "group/drawer-content bg-background fixed z-50 flex h-auto flex-col",
+          "data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:rounded-b-lg data-[vaul-drawer-direction=top]:border-b",
+          "data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:rounded-t-lg data-[vaul-drawer-direction=bottom]:border-t",
+          "data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=right]:sm:max-w-sm",
+          "data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=left]:sm:max-w-sm",
+          className
+        )}
+        {...props}
+      >
+        <div className="bg-muted mx-auto mt-4 hidden h-2 w-[100px] shrink-0 rounded-full group-data-[vaul-drawer-direction=bottom]/drawer-content:block" />
+        {children}
+      </DrawerPrimitive.Content>
+    </DrawerPortal>
+  )
+}
+
+function DrawerHeader({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="drawer-header"
+      className={cn(
+        "flex flex-col gap-0.5 p-4 group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center group-data-[vaul-drawer-direction=top]/drawer-content:text-center md:gap-1.5 md:text-left",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function DrawerFooter({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="drawer-footer"
+      className={cn("mt-auto flex flex-col gap-2 p-4", className)}
+      {...props}
+    />
+  )
+}
+
+function DrawerTitle({
+  className,
+  ...props
+}: React.ComponentProps<typeof DrawerPrimitive.Title>) {
+  return (
+    <DrawerPrimitive.Title
+      data-slot="drawer-title"
+      className={cn("text-foreground font-semibold", className)}
+      {...props}
+    />
+  )
+}
+
+function DrawerDescription({
+  className,
+  ...props
+}: React.ComponentProps<typeof DrawerPrimitive.Description>) {
+  return (
+    <DrawerPrimitive.Description
+      data-slot="drawer-description"
+      className={cn("text-muted-foreground text-sm", className)}
+      {...props}
+    />
+  )
+}
+
+export {
+  Drawer,
+  DrawerPortal,
+  DrawerOverlay,
+  DrawerTrigger,
+  DrawerClose,
+  DrawerContent,
+  DrawerHeader,
+  DrawerFooter,
+  DrawerTitle,
+  DrawerDescription,
+}
--- a/client/src/components/ui/dropdown-menu.tsx
+++ b/client/src/components/ui/dropdown-menu.tsx
@@ -0,0 +1,257 @@
+"use client"
+
+import * as React from "react"
+import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu"
+import { CheckIcon, ChevronRightIcon, CircleIcon } from "lucide-react"
+
+import { cn } from "@/lib/utils"
+
+function DropdownMenu({
+  ...props
+}: React.ComponentProps<typeof DropdownMenuPrimitive.Root>) {
+  return <DropdownMenuPrimitive.Root data-slot="dropdown-menu" {...props} />
+}
+
+function DropdownMenuPortal({
+  ...props
+}: React.ComponentProps<typeof DropdownMenuPrimitive.Portal>) {
+  return (
+    <DropdownMenuPrimitive.Portal data-slot="dropdown-menu-portal" {...props} />
+  )
+}
+
+function DropdownMenuTrigger({
+  ...props
+}: React.ComponentProps<typeof DropdownMenuPrimitive.Trigger>) {
+  return (
+    <DropdownMenuPrimitive.Trigger
+      data-slot="dropdown-menu-trigger"
+      {...props}
+    />
+  )
+}
+
+function DropdownMenuContent({
+  className,
+  sideOffset = 4,
+  ...props
+}: React.ComponentProps<typeof DropdownMenuPrimitive.Content>) {
+  return (
+    <DropdownMenuPrimitive.Portal>
+      <DropdownMenuPrimitive.Content
+        data-slot="dropdown-menu-content"
+        sideOffset={sideOffset}
+        className={cn(
+          "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border p-1 shadow-md",
+          className
+        )}
+        {...props}
+      />
+    </DropdownMenuPrimitive.Portal>
+  )
+}
+
+function DropdownMenuGroup({
+  ...props
+}: React.ComponentProps<typeof DropdownMenuPrimitive.Group>) {
+  return (
+    <DropdownMenuPrimitive.Group data-slot="dropdown-menu-group" {...props} />
+  )
+}
+
+function DropdownMenuItem({
+  className,
+  inset,
+  variant = "default",
+  ...props
+}: React.ComponentProps<typeof DropdownMenuPrimitive.Item> & {
+  inset?: boolean
+  variant?: "default" | "destructive"
+}) {
+  return (
+    <DropdownMenuPrimitive.Item
+      data-slot="dropdown-menu-item"
+      data-inset={inset}
+      data-variant={variant}
+      className={cn(
+        "focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function DropdownMenuCheckboxItem({
+  className,
+  children,
+  checked,
+  ...props
+}: React.ComponentProps<typeof DropdownMenuPrimitive.CheckboxItem>) {
+  return (
+    <DropdownMenuPrimitive.CheckboxItem
+      data-slot="dropdown-menu-checkbox-item"
+      className={cn(
+        "focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        className
+      )}
+      checked={checked}
+      {...props}
+    >
+      <span className="pointer-events-none absolute left-2 flex size-3.5 items-center justify-center">
+        <DropdownMenuPrimitive.ItemIndicator>
+          <CheckIcon className="size-4" />
+        </DropdownMenuPrimitive.ItemIndicator>
+      </span>
+      {children}
+    </DropdownMenuPrimitive.CheckboxItem>
+  )
+}
+
+function DropdownMenuRadioGroup({
+  ...props
+}: React.ComponentProps<typeof DropdownMenuPrimitive.RadioGroup>) {
+  return (
+    <DropdownMenuPrimitive.RadioGroup
+      data-slot="dropdown-menu-radio-group"
+      {...props}
+    />
+  )
+}
+
+function DropdownMenuRadioItem({
+  className,
+  children,
+  ...props
+}: React.ComponentProps<typeof DropdownMenuPrimitive.RadioItem>) {
+  return (
+    <DropdownMenuPrimitive.RadioItem
+      data-slot="dropdown-menu-radio-item"
+      className={cn(
+        "focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        className
+      )}
+      {...props}
+    >
+      <span className="pointer-events-none absolute left-2 flex size-3.5 items-center justify-center">
+        <DropdownMenuPrimitive.ItemIndicator>
+          <CircleIcon className="size-2 fill-current" />
+        </DropdownMenuPrimitive.ItemIndicator>
+      </span>
+      {children}
+    </DropdownMenuPrimitive.RadioItem>
+  )
+}
+
+function DropdownMenuLabel({
+  className,
+  inset,
+  ...props
+}: React.ComponentProps<typeof DropdownMenuPrimitive.Label> & {
+  inset?: boolean
+}) {
+  return (
+    <DropdownMenuPrimitive.Label
+      data-slot="dropdown-menu-label"
+      data-inset={inset}
+      className={cn(
+        "px-2 py-1.5 text-sm font-medium data-[inset]:pl-8",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function DropdownMenuSeparator({
+  className,
+  ...props
+}: React.ComponentProps<typeof DropdownMenuPrimitive.Separator>) {
+  return (
+    <DropdownMenuPrimitive.Separator
+      data-slot="dropdown-menu-separator"
+      className={cn("bg-border -mx-1 my-1 h-px", className)}
+      {...props}
+    />
+  )
+}
+
+function DropdownMenuShortcut({
+  className,
+  ...props
+}: React.ComponentProps<"span">) {
+  return (
+    <span
+      data-slot="dropdown-menu-shortcut"
+      className={cn(
+        "text-muted-foreground ml-auto text-xs tracking-widest",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function DropdownMenuSub({
+  ...props
+}: React.ComponentProps<typeof DropdownMenuPrimitive.Sub>) {
+  return <DropdownMenuPrimitive.Sub data-slot="dropdown-menu-sub" {...props} />
+}
+
+function DropdownMenuSubTrigger({
+  className,
+  inset,
+  children,
+  ...props
+}: React.ComponentProps<typeof DropdownMenuPrimitive.SubTrigger> & {
+  inset?: boolean
+}) {
+  return (
+    <DropdownMenuPrimitive.SubTrigger
+      data-slot="dropdown-menu-sub-trigger"
+      data-inset={inset}
+      className={cn(
+        "focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        className
+      )}
+      {...props}
+    >
+      {children}
+      <ChevronRightIcon className="ml-auto size-4" />
+    </DropdownMenuPrimitive.SubTrigger>
+  )
+}
+
+function DropdownMenuSubContent({
+  className,
+  ...props
+}: React.ComponentProps<typeof DropdownMenuPrimitive.SubContent>) {
+  return (
+    <DropdownMenuPrimitive.SubContent
+      data-slot="dropdown-menu-sub-content"
+      className={cn(
+        "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-lg",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+export {
+  DropdownMenu,
+  DropdownMenuPortal,
+  DropdownMenuTrigger,
+  DropdownMenuContent,
+  DropdownMenuGroup,
+  DropdownMenuLabel,
+  DropdownMenuItem,
+  DropdownMenuCheckboxItem,
+  DropdownMenuRadioGroup,
+  DropdownMenuRadioItem,
+  DropdownMenuSeparator,
+  DropdownMenuShortcut,
+  DropdownMenuSub,
+  DropdownMenuSubTrigger,
+  DropdownMenuSubContent,
+}
--- a/client/src/components/ui/field.tsx
+++ b/client/src/components/ui/field.tsx
@@ -0,0 +1,247 @@
+import type { VariantProps } from 'class-variance-authority';
+import { cva } from 'class-variance-authority';
+import { useMemo } from 'react';
+
+import { Label } from '@/components/ui/label';
+import { Separator } from '@/components/ui/separator';
+import { cn } from '@/lib/utils';
+
+function FieldSet({ className, ...props }: React.ComponentProps<'fieldset'>) {
+  return (
+    <fieldset
+      data-slot="field-set"
+      className={cn(
+        'flex flex-col gap-6',
+        'has-[>[data-slot=checkbox-group]]:gap-3 has-[>[data-slot=radio-group]]:gap-3',
+        className,
+      )}
+      {...props}
+    />
+  );
+}
+
+function FieldLegend({
+  className,
+  variant = 'legend',
+  ...props
+}: React.ComponentProps<'legend'> & { variant?: 'legend' | 'label' }) {
+  return (
+    <legend
+      data-slot="field-legend"
+      data-variant={variant}
+      className={cn(
+        'mb-3 font-medium',
+        'data-[variant=legend]:text-base',
+        'data-[variant=label]:text-sm',
+        className,
+      )}
+      {...props}
+    />
+  );
+}
+
+function FieldGroup({ className, ...props }: React.ComponentProps<'div'>) {
+  return (
+    <div
+      data-slot="field-group"
+      className={cn(
+        'group/field-group @container/field-group flex w-full flex-col gap-7 data-[slot=checkbox-group]:gap-3 [&>[data-slot=field-group]]:gap-4',
+        className,
+      )}
+      {...props}
+    />
+  );
+}
+
+const fieldVariants = cva(
+  'group/field flex w-full gap-3 data-[invalid=true]:text-destructive',
+  {
+    variants: {
+      orientation: {
+        vertical: ['flex-col [&>*]:w-full [&>.sr-only]:w-auto'],
+        horizontal: [
+          'flex-row items-center',
+          '[&>[data-slot=field-label]]:flex-auto',
+          'has-[>[data-slot=field-content]]:items-start has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px',
+        ],
+        responsive: [
+          'flex-col [&>*]:w-full [&>.sr-only]:w-auto @md/field-group:flex-row @md/field-group:items-center @md/field-group:[&>*]:w-auto',
+          '@md/field-group:[&>[data-slot=field-label]]:flex-auto',
+          '@md/field-group:has-[>[data-slot=field-content]]:items-start @md/field-group:has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px',
+        ],
+      },
+    },
+    defaultVariants: {
+      orientation: 'vertical',
+    },
+  },
+);
+
+function Field({
+  className,
+  orientation = 'vertical',
+  ...props
+}: React.ComponentProps<'div'> & VariantProps<typeof fieldVariants>) {
+  return (
+    <div
+      role="group"
+      data-slot="field"
+      data-orientation={orientation}
+      className={cn(fieldVariants({ orientation }), className)}
+      {...props}
+    />
+  );
+}
+
+function FieldContent({ className, ...props }: React.ComponentProps<'div'>) {
+  return (
+    <div
+      data-slot="field-content"
+      className={cn(
+        'group/field-content flex flex-1 flex-col gap-1.5 leading-snug',
+        className,
+      )}
+      {...props}
+    />
+  );
+}
+
+function FieldLabel({
+  className,
+  ...props
+}: React.ComponentProps<typeof Label>) {
+  return (
+    <Label
+      data-slot="field-label"
+      className={cn(
+        'group/field-label peer/field-label flex w-fit gap-2 leading-snug group-data-[disabled=true]/field:opacity-50',
+        'has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col has-[>[data-slot=field]]:rounded-md has-[>[data-slot=field]]:border [&>*]:data-[slot=field]:p-4',
+        'has-data-[state=checked]:bg-primary/5 has-data-[state=checked]:border-primary dark:has-data-[state=checked]:bg-primary/10',
+        className,
+      )}
+      {...props}
+    />
+  );
+}
+
+function FieldTitle({ className, ...props }: React.ComponentProps<'div'>) {
+  return (
+    <div
+      data-slot="field-label"
+      className={cn(
+        'flex w-fit items-center gap-2 text-sm leading-snug font-medium group-data-[disabled=true]/field:opacity-50',
+        className,
+      )}
+      {...props}
+    />
+  );
+}
+
+function FieldDescription({ className, ...props }: React.ComponentProps<'p'>) {
+  return (
+    <p
+      data-slot="field-description"
+      className={cn(
+        'text-muted-foreground text-sm leading-normal font-normal group-has-[[data-orientation=horizontal]]/field:text-balance',
+        'last:mt-0 nth-last-2:-mt-1 [[data-variant=legend]+&]:-mt-1.5',
+        '[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4',
+        className,
+      )}
+      {...props}
+    />
+  );
+}
+
+function FieldSeparator({
+  children,
+  className,
+  ...props
+}: React.ComponentProps<'div'> & {
+  children?: React.ReactNode;
+}) {
+  return (
+    <div
+      data-slot="field-separator"
+      data-content={!!children}
+      className={cn(
+        'relative -my-2 h-5 text-sm group-data-[variant=outline]/field-group:-mb-2',
+        className,
+      )}
+      {...props}
+    >
+      <Separator className="absolute inset-0 top-1/2" />
+      {children && (
+        <span
+          className="bg-background text-muted-foreground relative mx-auto block w-fit px-2"
+          data-slot="field-separator-content"
+        >
+          {children}
+        </span>
+      )}
+    </div>
+  );
+}
+
+function FieldError({
+  className,
+  children,
+  errors,
+  ...props
+}: React.ComponentProps<'div'> & {
+  errors?: Array<{ message?: string } | undefined>;
+}) {
+  const content = useMemo(() => {
+    if (children) {
+      return children;
+    }
+
+    if (!errors?.length) {
+      return null;
+    }
+
+    const uniqueErrors = [
+      ...new Map(errors.map(error => [error?.message, error])).values(),
+    ];
+
+    if (uniqueErrors?.length == 1) {
+      return uniqueErrors[0]?.message;
+    }
+
+    return (
+      <ul className="ml-4 flex list-disc flex-col gap-1">
+        {uniqueErrors.map(
+          (error, index) =>
+            error?.message && <li key={index}>{error.message}</li>,
+        )}
+      </ul>
+    );
+  }, [children, errors]);
+
+  if (!content) {
+    return null;
+  }
+
+  return (
+    <div
+      role="alert"
+      data-slot="field-error"
+      className={cn('text-destructive text-sm font-normal', className)}
+      {...props}
+    >
+      {content}
+    </div>
+  );
+}
+
+export {
+  Field,
+  FieldContent,
+  FieldDescription,
+  FieldError,
+  FieldGroup,
+  FieldLabel,
+  FieldLegend,
+  FieldSeparator,
+  FieldSet,
+  FieldTitle,
+};
--- a/client/src/components/ui/input.tsx
+++ b/client/src/components/ui/input.tsx
@@ -0,0 +1,21 @@
+import * as React from 'react';
+
+import { cn } from '@/lib/utils';
+
+function Input({ className, type, ...props }: React.ComponentProps<'input'>) {
+  return (
+    <input
+      type={type}
+      data-slot="input"
+      className={cn(
+        'file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm',
+        'focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]',
+        'aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive',
+        className,
+      )}
+      {...props}
+    />
+  );
+}
+
+export { Input };
--- a/client/src/components/ui/label.tsx
+++ b/client/src/components/ui/label.tsx
@@ -0,0 +1,22 @@
+import * as LabelPrimitive from '@radix-ui/react-label';
+import * as React from 'react';
+
+import { cn } from '@/lib/utils';
+
+function Label({
+  className,
+  ...props
+}: React.ComponentProps<typeof LabelPrimitive.Root>) {
+  return (
+    <LabelPrimitive.Root
+      data-slot="label"
+      className={cn(
+        'flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50',
+        className,
+      )}
+      {...props}
+    />
+  );
+}
+
+export { Label };
--- a/client/src/components/ui/select.tsx
+++ b/client/src/components/ui/select.tsx
@@ -0,0 +1,188 @@
+import * as React from "react"
+import * as SelectPrimitive from "@radix-ui/react-select"
+import { CheckIcon, ChevronDownIcon, ChevronUpIcon } from "lucide-react"
+
+import { cn } from "@/lib/utils"
+
+function Select({
+  ...props
+}: React.ComponentProps<typeof SelectPrimitive.Root>) {
+  return <SelectPrimitive.Root data-slot="select" {...props} />
+}
+
+function SelectGroup({
+  ...props
+}: React.ComponentProps<typeof SelectPrimitive.Group>) {
+  return <SelectPrimitive.Group data-slot="select-group" {...props} />
+}
+
+function SelectValue({
+  ...props
+}: React.ComponentProps<typeof SelectPrimitive.Value>) {
+  return <SelectPrimitive.Value data-slot="select-value" {...props} />
+}
+
+function SelectTrigger({
+  className,
+  size = "default",
+  children,
+  ...props
+}: React.ComponentProps<typeof SelectPrimitive.Trigger> & {
+  size?: "sm" | "default"
+}) {
+  return (
+    <SelectPrimitive.Trigger
+      data-slot="select-trigger"
+      data-size={size}
+      className={cn(
+        "border-input data-[placeholder]:text-muted-foreground [&_svg:not([class*='text-'])]:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 dark:hover:bg-input/50 flex w-fit items-center justify-between gap-2 rounded-md border bg-transparent px-3 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        className
+      )}
+      {...props}
+    >
+      {children}
+      <SelectPrimitive.Icon asChild>
+        <ChevronDownIcon className="size-4 opacity-50" />
+      </SelectPrimitive.Icon>
+    </SelectPrimitive.Trigger>
+  )
+}
+
+function SelectContent({
+  className,
+  children,
+  position = "item-aligned",
+  align = "center",
+  ...props
+}: React.ComponentProps<typeof SelectPrimitive.Content>) {
+  return (
+    <SelectPrimitive.Portal>
+      <SelectPrimitive.Content
+        data-slot="select-content"
+        className={cn(
+          "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-(--radix-select-content-available-height) min-w-[8rem] origin-(--radix-select-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border shadow-md",
+          position === "popper" &&
+            "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
+          className
+        )}
+        position={position}
+        align={align}
+        {...props}
+      >
+        <SelectScrollUpButton />
+        <SelectPrimitive.Viewport
+          className={cn(
+            "p-1",
+            position === "popper" &&
+              "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)] scroll-my-1"
+          )}
+        >
+          {children}
+        </SelectPrimitive.Viewport>
+        <SelectScrollDownButton />
+      </SelectPrimitive.Content>
+    </SelectPrimitive.Portal>
+  )
+}
+
+function SelectLabel({
+  className,
+  ...props
+}: React.ComponentProps<typeof SelectPrimitive.Label>) {
+  return (
+    <SelectPrimitive.Label
+      data-slot="select-label"
+      className={cn("text-muted-foreground px-2 py-1.5 text-xs", className)}
+      {...props}
+    />
+  )
+}
+
+function SelectItem({
+  className,
+  children,
+  ...props
+}: React.ComponentProps<typeof SelectPrimitive.Item>) {
+  return (
+    <SelectPrimitive.Item
+      data-slot="select-item"
+      className={cn(
+        "focus:bg-accent focus:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex w-full cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
+        className
+      )}
+      {...props}
+    >
+      <span
+        data-slot="select-item-indicator"
+        className="absolute right-2 flex size-3.5 items-center justify-center"
+      >
+        <SelectPrimitive.ItemIndicator>
+          <CheckIcon className="size-4" />
+        </SelectPrimitive.ItemIndicator>
+      </span>
+      <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>
+    </SelectPrimitive.Item>
+  )
+}
+
+function SelectSeparator({
+  className,
+  ...props
+}: React.ComponentProps<typeof SelectPrimitive.Separator>) {
+  return (
+    <SelectPrimitive.Separator
+      data-slot="select-separator"
+      className={cn("bg-border pointer-events-none -mx-1 my-1 h-px", className)}
+      {...props}
+    />
+  )
+}
+
+function SelectScrollUpButton({
+  className,
+  ...props
+}: React.ComponentProps<typeof SelectPrimitive.ScrollUpButton>) {
+  return (
+    <SelectPrimitive.ScrollUpButton
+      data-slot="select-scroll-up-button"
+      className={cn(
+        "flex cursor-default items-center justify-center py-1",
+        className
+      )}
+      {...props}
+    >
+      <ChevronUpIcon className="size-4" />
+    </SelectPrimitive.ScrollUpButton>
+  )
+}
+
+function SelectScrollDownButton({
+  className,
+  ...props
+}: React.ComponentProps<typeof SelectPrimitive.ScrollDownButton>) {
+  return (
+    <SelectPrimitive.ScrollDownButton
+      data-slot="select-scroll-down-button"
+      className={cn(
+        "flex cursor-default items-center justify-center py-1",
+        className
+      )}
+      {...props}
+    >
+      <ChevronDownIcon className="size-4" />
+    </SelectPrimitive.ScrollDownButton>
+  )
+}
+
+export {
+  Select,
+  SelectContent,
+  SelectGroup,
+  SelectItem,
+  SelectLabel,
+  SelectScrollDownButton,
+  SelectScrollUpButton,
+  SelectSeparator,
+  SelectTrigger,
+  SelectValue,
+}
--- a/client/src/components/ui/separator.tsx
+++ b/client/src/components/ui/separator.tsx
@@ -0,0 +1,28 @@
+'use client';
+
+import * as SeparatorPrimitive from '@radix-ui/react-separator';
+import * as React from 'react';
+
+import { cn } from '@/lib/utils';
+
+function Separator({
+  className,
+  orientation = 'horizontal',
+  decorative = true,
+  ...props
+}: React.ComponentProps<typeof SeparatorPrimitive.Root>) {
+  return (
+    <SeparatorPrimitive.Root
+      data-slot="separator"
+      decorative={decorative}
+      orientation={orientation}
+      className={cn(
+        'bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px',
+        className,
+      )}
+      {...props}
+    />
+  );
+}
+
+export { Separator };
--- a/client/src/components/ui/shadcn-io/qr-code/index.tsx
+++ b/client/src/components/ui/shadcn-io/qr-code/index.tsx
@@ -0,0 +1,86 @@
+import { formatHex, oklch } from 'culori';
+import QR from 'qrcode';
+import { type HTMLAttributes, useEffect, useState } from 'react';
+import { cn } from '@/lib/utils';
+
+export type QRCodeProps = HTMLAttributes<HTMLDivElement> & {
+  data: string;
+  foreground?: string;
+  background?: string;
+  robustness?: 'L' | 'M' | 'Q' | 'H';
+};
+
+const oklchRegex = /oklch\(([0-9.]+)\s+([0-9.]+)\s+([0-9.]+)\)/;
+
+const getOklch = (color: string, fallback: [number, number, number]) => {
+  const oklchMatch = color.match(oklchRegex);
+
+  if (!oklchMatch) {
+    return { l: fallback[0], c: fallback[1], h: fallback[2] };
+  }
+
+  return {
+    l: Number.parseFloat(oklchMatch[1]),
+    c: Number.parseFloat(oklchMatch[2]),
+    h: Number.parseFloat(oklchMatch[3]),
+  };
+};
+
+export const QRCode = ({
+  data,
+  foreground,
+  background,
+  robustness = 'M',
+  className,
+  ...props
+}: QRCodeProps) => {
+  const [svg, setSVG] = useState<string | null>(null);
+
+  useEffect(() => {
+    const generateQR = async () => {
+      try {
+        const styles = getComputedStyle(document.documentElement);
+        const foregroundColor =
+          foreground ?? styles.getPropertyValue('--foreground');
+        const backgroundColor =
+          background ?? styles.getPropertyValue('--background');
+
+        const foregroundOklch = getOklch(
+          foregroundColor,
+          [0.21, 0.006, 285.885]
+        );
+        const backgroundOklch = getOklch(backgroundColor, [0.985, 0, 0]);
+
+        const newSvg = await QR.toString(data, {
+          type: 'svg',
+          color: {
+            dark: formatHex(oklch({ mode: 'oklch', ...foregroundOklch })),
+            light: formatHex(oklch({ mode: 'oklch', ...backgroundOklch })),
+          },
+          width: 200,
+          errorCorrectionLevel: robustness,
+          margin: 0,
+        });
+
+        setSVG(newSvg);
+      } catch (err) {
+        console.error(err);
+      }
+    };
+
+    generateQR();
+  }, [data, foreground, background, robustness]);
+
+  if (!svg) {
+    return null;
+  }
+
+  return (
+    <div
+      className={cn('size-full', '[&_svg]:size-full', className)}
+      // biome-ignore lint/security/noDangerouslySetInnerHtml: "Required for SVG"
+      dangerouslySetInnerHTML={{ __html: svg }}
+      {...(props as any)}
+    />
+  );
+};
--- a/client/src/components/ui/sheet.tsx
+++ b/client/src/components/ui/sheet.tsx
@@ -0,0 +1,139 @@
+"use client"
+
+import * as React from "react"
+import * as SheetPrimitive from "@radix-ui/react-dialog"
+import { XIcon } from "lucide-react"
+
+import { cn } from "@/lib/utils"
+
+function Sheet({ ...props }: React.ComponentProps<typeof SheetPrimitive.Root>) {
+  return <SheetPrimitive.Root data-slot="sheet" {...props} />
+}
+
+function SheetTrigger({
+  ...props
+}: React.ComponentProps<typeof SheetPrimitive.Trigger>) {
+  return <SheetPrimitive.Trigger data-slot="sheet-trigger" {...props} />
+}
+
+function SheetClose({
+  ...props
+}: React.ComponentProps<typeof SheetPrimitive.Close>) {
+  return <SheetPrimitive.Close data-slot="sheet-close" {...props} />
+}
+
+function SheetPortal({
+  ...props
+}: React.ComponentProps<typeof SheetPrimitive.Portal>) {
+  return <SheetPrimitive.Portal data-slot="sheet-portal" {...props} />
+}
+
+function SheetOverlay({
+  className,
+  ...props
+}: React.ComponentProps<typeof SheetPrimitive.Overlay>) {
+  return (
+    <SheetPrimitive.Overlay
+      data-slot="sheet-overlay"
+      className={cn(
+        "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function SheetContent({
+  className,
+  children,
+  side = "right",
+  ...props
+}: React.ComponentProps<typeof SheetPrimitive.Content> & {
+  side?: "top" | "right" | "bottom" | "left"
+}) {
+  return (
+    <SheetPortal>
+      <SheetOverlay />
+      <SheetPrimitive.Content
+        data-slot="sheet-content"
+        className={cn(
+          "bg-background data-[state=open]:animate-in data-[state=closed]:animate-out fixed z-50 flex flex-col gap-4 shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500",
+          side === "right" &&
+            "data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right inset-y-0 right-0 h-full w-3/4 border-l sm:max-w-sm",
+          side === "left" &&
+            "data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left inset-y-0 left-0 h-full w-3/4 border-r sm:max-w-sm",
+          side === "top" &&
+            "data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top inset-x-0 top-0 h-auto border-b",
+          side === "bottom" &&
+            "data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom inset-x-0 bottom-0 h-auto border-t",
+          className
+        )}
+        {...props}
+      >
+        {children}
+        <SheetPrimitive.Close className="ring-offset-background focus:ring-ring data-[state=open]:bg-secondary absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none">
+          <XIcon className="size-4" />
+          <span className="sr-only">Close</span>
+        </SheetPrimitive.Close>
+      </SheetPrimitive.Content>
+    </SheetPortal>
+  )
+}
+
+function SheetHeader({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="sheet-header"
+      className={cn("flex flex-col gap-1.5 p-4", className)}
+      {...props}
+    />
+  )
+}
+
+function SheetFooter({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="sheet-footer"
+      className={cn("mt-auto flex flex-col gap-2 p-4", className)}
+      {...props}
+    />
+  )
+}
+
+function SheetTitle({
+  className,
+  ...props
+}: React.ComponentProps<typeof SheetPrimitive.Title>) {
+  return (
+    <SheetPrimitive.Title
+      data-slot="sheet-title"
+      className={cn("text-foreground font-semibold", className)}
+      {...props}
+    />
+  )
+}
+
+function SheetDescription({
+  className,
+  ...props
+}: React.ComponentProps<typeof SheetPrimitive.Description>) {
+  return (
+    <SheetPrimitive.Description
+      data-slot="sheet-description"
+      className={cn("text-muted-foreground text-sm", className)}
+      {...props}
+    />
+  )
+}
+
+export {
+  Sheet,
+  SheetTrigger,
+  SheetClose,
+  SheetContent,
+  SheetHeader,
+  SheetFooter,
+  SheetTitle,
+  SheetDescription,
+}
--- a/client/src/components/ui/sidebar.tsx
+++ b/client/src/components/ui/sidebar.tsx
@@ -0,0 +1,726 @@
+"use client"
+
+import * as React from "react"
+import { Slot } from "@radix-ui/react-slot"
+import { cva, type VariantProps } from "class-variance-authority"
+import { PanelLeftIcon } from "lucide-react"
+
+import { useIsMobile } from "@/hooks/use-mobile"
+import { cn } from "@/lib/utils"
+import { Button } from "@/components/ui/button"
+import { Input } from "@/components/ui/input"
+import { Separator } from "@/components/ui/separator"
+import {
+  Sheet,
+  SheetContent,
+  SheetDescription,
+  SheetHeader,
+  SheetTitle,
+} from "@/components/ui/sheet"
+import { Skeleton } from "@/components/ui/skeleton"
+import {
+  Tooltip,
+  TooltipContent,
+  TooltipProvider,
+  TooltipTrigger,
+} from "@/components/ui/tooltip"
+
+const SIDEBAR_COOKIE_NAME = "sidebar_state"
+const SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7
+const SIDEBAR_WIDTH = "16rem"
+const SIDEBAR_WIDTH_MOBILE = "18rem"
+const SIDEBAR_WIDTH_ICON = "3rem"
+const SIDEBAR_KEYBOARD_SHORTCUT = "b"
+
+type SidebarContextProps = {
+  state: "expanded" | "collapsed"
+  open: boolean
+  setOpen: (open: boolean) => void
+  openMobile: boolean
+  setOpenMobile: (open: boolean) => void
+  isMobile: boolean
+  toggleSidebar: () => void
+}
+
+const SidebarContext = React.createContext<SidebarContextProps | null>(null)
+
+function useSidebar() {
+  const context = React.useContext(SidebarContext)
+  if (!context) {
+    throw new Error("useSidebar must be used within a SidebarProvider.")
+  }
+
+  return context
+}
+
+function SidebarProvider({
+  defaultOpen = true,
+  open: openProp,
+  onOpenChange: setOpenProp,
+  className,
+  style,
+  children,
+  ...props
+}: React.ComponentProps<"div"> & {
+  defaultOpen?: boolean
+  open?: boolean
+  onOpenChange?: (open: boolean) => void
+}) {
+  const isMobile = useIsMobile()
+  const [openMobile, setOpenMobile] = React.useState(false)
+
+  // This is the internal state of the sidebar.
+  // We use openProp and setOpenProp for control from outside the component.
+  const [_open, _setOpen] = React.useState(defaultOpen)
+  const open = openProp ?? _open
+  const setOpen = React.useCallback(
+    (value: boolean | ((value: boolean) => boolean)) => {
+      const openState = typeof value === "function" ? value(open) : value
+      if (setOpenProp) {
+        setOpenProp(openState)
+      } else {
+        _setOpen(openState)
+      }
+
+      // This sets the cookie to keep the sidebar state.
+      document.cookie = `${SIDEBAR_COOKIE_NAME}=${openState}; path=/; max-age=${SIDEBAR_COOKIE_MAX_AGE}`
+    },
+    [setOpenProp, open]
+  )
+
+  // Helper to toggle the sidebar.
+  const toggleSidebar = React.useCallback(() => {
+    return isMobile ? setOpenMobile((open) => !open) : setOpen((open) => !open)
+  }, [isMobile, setOpen, setOpenMobile])
+
+  // Adds a keyboard shortcut to toggle the sidebar.
+  React.useEffect(() => {
+    const handleKeyDown = (event: KeyboardEvent) => {
+      if (
+        event.key === SIDEBAR_KEYBOARD_SHORTCUT &&
+        (event.metaKey || event.ctrlKey)
+      ) {
+        event.preventDefault()
+        toggleSidebar()
+      }
+    }
+
+    window.addEventListener("keydown", handleKeyDown)
+    return () => window.removeEventListener("keydown", handleKeyDown)
+  }, [toggleSidebar])
+
+  // We add a state so that we can do data-state="expanded" or "collapsed".
+  // This makes it easier to style the sidebar with Tailwind classes.
+  const state = open ? "expanded" : "collapsed"
+
+  const contextValue = React.useMemo<SidebarContextProps>(
+    () => ({
+      state,
+      open,
+      setOpen,
+      isMobile,
+      openMobile,
+      setOpenMobile,
+      toggleSidebar,
+    }),
+    [state, open, setOpen, isMobile, openMobile, setOpenMobile, toggleSidebar]
+  )
+
+  return (
+    <SidebarContext.Provider value={contextValue}>
+      <TooltipProvider delayDuration={0}>
+        <div
+          data-slot="sidebar-wrapper"
+          style={
+            {
+              "--sidebar-width": SIDEBAR_WIDTH,
+              "--sidebar-width-icon": SIDEBAR_WIDTH_ICON,
+              ...style,
+            } as React.CSSProperties
+          }
+          className={cn(
+            "group/sidebar-wrapper has-data-[variant=inset]:bg-sidebar flex min-h-svh w-full",
+            className
+          )}
+          {...props}
+        >
+          {children}
+        </div>
+      </TooltipProvider>
+    </SidebarContext.Provider>
+  )
+}
+
+function Sidebar({
+  side = "left",
+  variant = "sidebar",
+  collapsible = "offcanvas",
+  className,
+  children,
+  ...props
+}: React.ComponentProps<"div"> & {
+  side?: "left" | "right"
+  variant?: "sidebar" | "floating" | "inset"
+  collapsible?: "offcanvas" | "icon" | "none"
+}) {
+  const { isMobile, state, openMobile, setOpenMobile } = useSidebar()
+
+  if (collapsible === "none") {
+    return (
+      <div
+        data-slot="sidebar"
+        className={cn(
+          "bg-sidebar text-sidebar-foreground flex h-full w-(--sidebar-width) flex-col",
+          className
+        )}
+        {...props}
+      >
+        {children}
+      </div>
+    )
+  }
+
+  if (isMobile) {
+    return (
+      <Sheet open={openMobile} onOpenChange={setOpenMobile} {...props}>
+        <SheetContent
+          data-sidebar="sidebar"
+          data-slot="sidebar"
+          data-mobile="true"
+          className="bg-sidebar text-sidebar-foreground w-(--sidebar-width) p-0 [&>button]:hidden"
+          style={
+            {
+              "--sidebar-width": SIDEBAR_WIDTH_MOBILE,
+            } as React.CSSProperties
+          }
+          side={side}
+        >
+          <SheetHeader className="sr-only">
+            <SheetTitle>Sidebar</SheetTitle>
+            <SheetDescription>Displays the mobile sidebar.</SheetDescription>
+          </SheetHeader>
+          <div className="flex h-full w-full flex-col">{children}</div>
+        </SheetContent>
+      </Sheet>
+    )
+  }
+
+  return (
+    <div
+      className="group peer text-sidebar-foreground hidden md:block"
+      data-state={state}
+      data-collapsible={state === "collapsed" ? collapsible : ""}
+      data-variant={variant}
+      data-side={side}
+      data-slot="sidebar"
+    >
+      {/* This is what handles the sidebar gap on desktop */}
+      <div
+        data-slot="sidebar-gap"
+        className={cn(
+          "relative w-(--sidebar-width) bg-transparent transition-[width] duration-200 ease-linear",
+          "group-data-[collapsible=offcanvas]:w-0",
+          "group-data-[side=right]:rotate-180",
+          variant === "floating" || variant === "inset"
+            ? "group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4)))]"
+            : "group-data-[collapsible=icon]:w-(--sidebar-width-icon)"
+        )}
+      />
+      <div
+        data-slot="sidebar-container"
+        className={cn(
+          "fixed inset-y-0 z-10 hidden h-svh w-(--sidebar-width) transition-[left,right,width] duration-200 ease-linear md:flex",
+          side === "left"
+            ? "left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]"
+            : "right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]",
+          // Adjust the padding for floating and inset variants.
+          variant === "floating" || variant === "inset"
+            ? "p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4))+2px)]"
+            : "group-data-[collapsible=icon]:w-(--sidebar-width-icon) group-data-[side=left]:border-r group-data-[side=right]:border-l",
+          className
+        )}
+        {...props}
+      >
+        <div
+          data-sidebar="sidebar"
+          data-slot="sidebar-inner"
+          className="bg-sidebar group-data-[variant=floating]:border-sidebar-border flex h-full w-full flex-col group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:border group-data-[variant=floating]:shadow-sm"
+        >
+          {children}
+        </div>
+      </div>
+    </div>
+  )
+}
+
+function SidebarTrigger({
+  className,
+  onClick,
+  ...props
+}: React.ComponentProps<typeof Button>) {
+  const { toggleSidebar } = useSidebar()
+
+  return (
+    <Button
+      data-sidebar="trigger"
+      data-slot="sidebar-trigger"
+      variant="ghost"
+      size="icon"
+      className={cn("size-7", className)}
+      onClick={(event) => {
+        onClick?.(event)
+        toggleSidebar()
+      }}
+      {...props}
+    >
+      <PanelLeftIcon />
+      <span className="sr-only">Toggle Sidebar</span>
+    </Button>
+  )
+}
+
+function SidebarRail({ className, ...props }: React.ComponentProps<"button">) {
+  const { toggleSidebar } = useSidebar()
+
+  return (
+    <button
+      data-sidebar="rail"
+      data-slot="sidebar-rail"
+      aria-label="Toggle Sidebar"
+      tabIndex={-1}
+      onClick={toggleSidebar}
+      title="Toggle Sidebar"
+      className={cn(
+        "hover:after:bg-sidebar-border absolute inset-y-0 z-20 hidden w-4 -translate-x-1/2 transition-all ease-linear group-data-[side=left]:-right-4 group-data-[side=right]:left-0 after:absolute after:inset-y-0 after:left-1/2 after:w-[2px] sm:flex",
+        "in-data-[side=left]:cursor-w-resize in-data-[side=right]:cursor-e-resize",
+        "[[data-side=left][data-state=collapsed]_&]:cursor-e-resize [[data-side=right][data-state=collapsed]_&]:cursor-w-resize",
+        "hover:group-data-[collapsible=offcanvas]:bg-sidebar group-data-[collapsible=offcanvas]:translate-x-0 group-data-[collapsible=offcanvas]:after:left-full",
+        "[[data-side=left][data-collapsible=offcanvas]_&]:-right-2",
+        "[[data-side=right][data-collapsible=offcanvas]_&]:-left-2",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function SidebarInset({ className, ...props }: React.ComponentProps<"main">) {
+  return (
+    <main
+      data-slot="sidebar-inset"
+      className={cn(
+        "bg-background relative flex w-full flex-1 flex-col",
+        "md:peer-data-[variant=inset]:m-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow-sm md:peer-data-[variant=inset]:peer-data-[state=collapsed]:ml-2",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function SidebarInput({
+  className,
+  ...props
+}: React.ComponentProps<typeof Input>) {
+  return (
+    <Input
+      data-slot="sidebar-input"
+      data-sidebar="input"
+      className={cn("bg-background h-8 w-full shadow-none", className)}
+      {...props}
+    />
+  )
+}
+
+function SidebarHeader({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="sidebar-header"
+      data-sidebar="header"
+      className={cn("flex flex-col gap-2 p-2", className)}
+      {...props}
+    />
+  )
+}
+
+function SidebarFooter({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="sidebar-footer"
+      data-sidebar="footer"
+      className={cn("flex flex-col gap-2 p-2", className)}
+      {...props}
+    />
+  )
+}
+
+function SidebarSeparator({
+  className,
+  ...props
+}: React.ComponentProps<typeof Separator>) {
+  return (
+    <Separator
+      data-slot="sidebar-separator"
+      data-sidebar="separator"
+      className={cn("bg-sidebar-border mx-2 w-auto", className)}
+      {...props}
+    />
+  )
+}
+
+function SidebarContent({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="sidebar-content"
+      data-sidebar="content"
+      className={cn(
+        "flex min-h-0 flex-1 flex-col gap-2 overflow-auto group-data-[collapsible=icon]:overflow-hidden",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function SidebarGroup({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="sidebar-group"
+      data-sidebar="group"
+      className={cn("relative flex w-full min-w-0 flex-col p-2", className)}
+      {...props}
+    />
+  )
+}
+
+function SidebarGroupLabel({
+  className,
+  asChild = false,
+  ...props
+}: React.ComponentProps<"div"> & { asChild?: boolean }) {
+  const Comp = asChild ? Slot : "div"
+
+  return (
+    <Comp
+      data-slot="sidebar-group-label"
+      data-sidebar="group-label"
+      className={cn(
+        "text-sidebar-foreground/70 ring-sidebar-ring flex h-8 shrink-0 items-center rounded-md px-2 text-xs font-medium outline-hidden transition-[margin,opacity] duration-200 ease-linear focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0",
+        "group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function SidebarGroupAction({
+  className,
+  asChild = false,
+  ...props
+}: React.ComponentProps<"button"> & { asChild?: boolean }) {
+  const Comp = asChild ? Slot : "button"
+
+  return (
+    <Comp
+      data-slot="sidebar-group-action"
+      data-sidebar="group-action"
+      className={cn(
+        "text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground absolute top-3.5 right-3 flex aspect-square w-5 items-center justify-center rounded-md p-0 outline-hidden transition-transform focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0",
+        // Increases the hit area of the button on mobile.
+        "after:absolute after:-inset-2 md:after:hidden",
+        "group-data-[collapsible=icon]:hidden",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function SidebarGroupContent({
+  className,
+  ...props
+}: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="sidebar-group-content"
+      data-sidebar="group-content"
+      className={cn("w-full text-sm", className)}
+      {...props}
+    />
+  )
+}
+
+function SidebarMenu({ className, ...props }: React.ComponentProps<"ul">) {
+  return (
+    <ul
+      data-slot="sidebar-menu"
+      data-sidebar="menu"
+      className={cn("flex w-full min-w-0 flex-col gap-1", className)}
+      {...props}
+    />
+  )
+}
+
+function SidebarMenuItem({ className, ...props }: React.ComponentProps<"li">) {
+  return (
+    <li
+      data-slot="sidebar-menu-item"
+      data-sidebar="menu-item"
+      className={cn("group/menu-item relative", className)}
+      {...props}
+    />
+  )
+}
+
+const sidebarMenuButtonVariants = cva(
+  "peer/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left text-sm outline-hidden ring-sidebar-ring transition-[width,height,padding] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 group-has-data-[sidebar=menu-action]/menu-item:pr-8 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:bg-sidebar-accent data-[active=true]:font-medium data-[active=true]:text-sidebar-accent-foreground data-[state=open]:hover:bg-sidebar-accent data-[state=open]:hover:text-sidebar-accent-foreground group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0",
+  {
+    variants: {
+      variant: {
+        default: "hover:bg-sidebar-accent hover:text-sidebar-accent-foreground",
+        outline:
+          "bg-background shadow-[0_0_0_1px_hsl(var(--sidebar-border))] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground hover:shadow-[0_0_0_1px_hsl(var(--sidebar-accent))]",
+      },
+      size: {
+        default: "h-8 text-sm",
+        sm: "h-7 text-xs",
+        lg: "h-12 text-sm group-data-[collapsible=icon]:p-0!",
+      },
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default",
+    },
+  }
+)
+
+function SidebarMenuButton({
+  asChild = false,
+  isActive = false,
+  variant = "default",
+  size = "default",
+  tooltip,
+  className,
+  ...props
+}: React.ComponentProps<"button"> & {
+  asChild?: boolean
+  isActive?: boolean
+  tooltip?: string | React.ComponentProps<typeof TooltipContent>
+} & VariantProps<typeof sidebarMenuButtonVariants>) {
+  const Comp = asChild ? Slot : "button"
+  const { isMobile, state } = useSidebar()
+
+  const button = (
+    <Comp
+      data-slot="sidebar-menu-button"
+      data-sidebar="menu-button"
+      data-size={size}
+      data-active={isActive}
+      className={cn(sidebarMenuButtonVariants({ variant, size }), className)}
+      {...props}
+    />
+  )
+
+  if (!tooltip) {
+    return button
+  }
+
+  if (typeof tooltip === "string") {
+    tooltip = {
+      children: tooltip,
+    }
+  }
+
+  return (
+    <Tooltip>
+      <TooltipTrigger asChild>{button}</TooltipTrigger>
+      <TooltipContent
+        side="right"
+        align="center"
+        hidden={state !== "collapsed" || isMobile}
+        {...tooltip}
+      />
+    </Tooltip>
+  )
+}
+
+function SidebarMenuAction({
+  className,
+  asChild = false,
+  showOnHover = false,
+  ...props
+}: React.ComponentProps<"button"> & {
+  asChild?: boolean
+  showOnHover?: boolean
+}) {
+  const Comp = asChild ? Slot : "button"
+
+  return (
+    <Comp
+      data-slot="sidebar-menu-action"
+      data-sidebar="menu-action"
+      className={cn(
+        "text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground peer-hover/menu-button:text-sidebar-accent-foreground absolute top-1.5 right-1 flex aspect-square w-5 items-center justify-center rounded-md p-0 outline-hidden transition-transform focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0",
+        // Increases the hit area of the button on mobile.
+        "after:absolute after:-inset-2 md:after:hidden",
+        "peer-data-[size=sm]/menu-button:top-1",
+        "peer-data-[size=default]/menu-button:top-1.5",
+        "peer-data-[size=lg]/menu-button:top-2.5",
+        "group-data-[collapsible=icon]:hidden",
+        showOnHover &&
+          "peer-data-[active=true]/menu-button:text-sidebar-accent-foreground group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 data-[state=open]:opacity-100 md:opacity-0",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function SidebarMenuBadge({
+  className,
+  ...props
+}: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="sidebar-menu-badge"
+      data-sidebar="menu-badge"
+      className={cn(
+        "text-sidebar-foreground pointer-events-none absolute right-1 flex h-5 min-w-5 items-center justify-center rounded-md px-1 text-xs font-medium tabular-nums select-none",
+        "peer-hover/menu-button:text-sidebar-accent-foreground peer-data-[active=true]/menu-button:text-sidebar-accent-foreground",
+        "peer-data-[size=sm]/menu-button:top-1",
+        "peer-data-[size=default]/menu-button:top-1.5",
+        "peer-data-[size=lg]/menu-button:top-2.5",
+        "group-data-[collapsible=icon]:hidden",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function SidebarMenuSkeleton({
+  className,
+  showIcon = false,
+  ...props
+}: React.ComponentProps<"div"> & {
+  showIcon?: boolean
+}) {
+  // Random width between 50 to 90%.
+  const width = React.useMemo(() => {
+    return `${Math.floor(Math.random() * 40) + 50}%`
+  }, [])
+
+  return (
+    <div
+      data-slot="sidebar-menu-skeleton"
+      data-sidebar="menu-skeleton"
+      className={cn("flex h-8 items-center gap-2 rounded-md px-2", className)}
+      {...props}
+    >
+      {showIcon && (
+        <Skeleton
+          className="size-4 rounded-md"
+          data-sidebar="menu-skeleton-icon"
+        />
+      )}
+      <Skeleton
+        className="h-4 max-w-(--skeleton-width) flex-1"
+        data-sidebar="menu-skeleton-text"
+        style={
+          {
+            "--skeleton-width": width,
+          } as React.CSSProperties
+        }
+      />
+    </div>
+  )
+}
+
+function SidebarMenuSub({ className, ...props }: React.ComponentProps<"ul">) {
+  return (
+    <ul
+      data-slot="sidebar-menu-sub"
+      data-sidebar="menu-sub"
+      className={cn(
+        "border-sidebar-border mx-3.5 flex min-w-0 translate-x-px flex-col gap-1 border-l px-2.5 py-0.5",
+        "group-data-[collapsible=icon]:hidden",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function SidebarMenuSubItem({
+  className,
+  ...props
+}: React.ComponentProps<"li">) {
+  return (
+    <li
+      data-slot="sidebar-menu-sub-item"
+      data-sidebar="menu-sub-item"
+      className={cn("group/menu-sub-item relative", className)}
+      {...props}
+    />
+  )
+}
+
+function SidebarMenuSubButton({
+  asChild = false,
+  size = "md",
+  isActive = false,
+  className,
+  ...props
+}: React.ComponentProps<"a"> & {
+  asChild?: boolean
+  size?: "sm" | "md"
+  isActive?: boolean
+}) {
+  const Comp = asChild ? Slot : "a"
+
+  return (
+    <Comp
+      data-slot="sidebar-menu-sub-button"
+      data-sidebar="menu-sub-button"
+      data-size={size}
+      data-active={isActive}
+      className={cn(
+        "text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground [&>svg]:text-sidebar-accent-foreground flex h-7 min-w-0 -translate-x-px items-center gap-2 overflow-hidden rounded-md px-2 outline-hidden focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0",
+        "data-[active=true]:bg-sidebar-accent data-[active=true]:text-sidebar-accent-foreground",
+        size === "sm" && "text-xs",
+        size === "md" && "text-sm",
+        "group-data-[collapsible=icon]:hidden",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+export {
+  Sidebar,
+  SidebarContent,
+  SidebarFooter,
+  SidebarGroup,
+  SidebarGroupAction,
+  SidebarGroupContent,
+  SidebarGroupLabel,
+  SidebarHeader,
+  SidebarInput,
+  SidebarInset,
+  SidebarMenu,
+  SidebarMenuAction,
+  SidebarMenuBadge,
+  SidebarMenuButton,
+  SidebarMenuItem,
+  SidebarMenuSkeleton,
+  SidebarMenuSub,
+  SidebarMenuSubButton,
+  SidebarMenuSubItem,
+  SidebarProvider,
+  SidebarRail,
+  SidebarSeparator,
+  SidebarTrigger,
+  useSidebar,
+}
--- a/client/src/components/ui/skeleton.tsx
+++ b/client/src/components/ui/skeleton.tsx
@@ -0,0 +1,13 @@
+import { cn } from "@/lib/utils"
+
+function Skeleton({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="skeleton"
+      className={cn("bg-accent animate-pulse rounded-md", className)}
+      {...props}
+    />
+  )
+}
+
+export { Skeleton }
--- a/client/src/components/ui/sonner.tsx
+++ b/client/src/components/ui/sonner.tsx
@@ -0,0 +1,38 @@
+import {
+  CircleCheckIcon,
+  InfoIcon,
+  Loader2Icon,
+  OctagonXIcon,
+  TriangleAlertIcon,
+} from "lucide-react"
+import { useTheme } from "next-themes"
+import { Toaster as Sonner, type ToasterProps } from "sonner"
+
+const Toaster = ({ ...props }: ToasterProps) => {
+  const { theme = "system" } = useTheme()
+
+  return (
+    <Sonner
+      theme={theme as ToasterProps["theme"]}
+      className="toaster group"
+      icons={{
+        success: <CircleCheckIcon className="size-4" />,
+        info: <InfoIcon className="size-4" />,
+        warning: <TriangleAlertIcon className="size-4" />,
+        error: <OctagonXIcon className="size-4" />,
+        loading: <Loader2Icon className="size-4 animate-spin" />,
+      }}
+      style={
+        {
+          "--normal-bg": "var(--popover)",
+          "--normal-text": "var(--popover-foreground)",
+          "--normal-border": "var(--border)",
+          "--border-radius": "var(--radius)",
+        } as React.CSSProperties
+      }
+      {...props}
+    />
+  )
+}
+
+export { Toaster }
--- a/client/src/components/ui/table.tsx
+++ b/client/src/components/ui/table.tsx
@@ -0,0 +1,114 @@
+import * as React from "react"
+
+import { cn } from "@/lib/utils"
+
+function Table({ className, ...props }: React.ComponentProps<"table">) {
+  return (
+    <div
+      data-slot="table-container"
+      className="relative w-full overflow-x-auto"
+    >
+      <table
+        data-slot="table"
+        className={cn("w-full caption-bottom text-sm", className)}
+        {...props}
+      />
+    </div>
+  )
+}
+
+function TableHeader({ className, ...props }: React.ComponentProps<"thead">) {
+  return (
+    <thead
+      data-slot="table-header"
+      className={cn("[&_tr]:border-b", className)}
+      {...props}
+    />
+  )
+}
+
+function TableBody({ className, ...props }: React.ComponentProps<"tbody">) {
+  return (
+    <tbody
+      data-slot="table-body"
+      className={cn("[&_tr:last-child]:border-0", className)}
+      {...props}
+    />
+  )
+}
+
+function TableFooter({ className, ...props }: React.ComponentProps<"tfoot">) {
+  return (
+    <tfoot
+      data-slot="table-footer"
+      className={cn(
+        "bg-muted/50 border-t font-medium [&>tr]:last:border-b-0",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function TableRow({ className, ...props }: React.ComponentProps<"tr">) {
+  return (
+    <tr
+      data-slot="table-row"
+      className={cn(
+        "hover:bg-muted/50 data-[state=selected]:bg-muted border-b transition-colors",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function TableHead({ className, ...props }: React.ComponentProps<"th">) {
+  return (
+    <th
+      data-slot="table-head"
+      className={cn(
+        "text-foreground h-10 px-2 text-left align-middle font-medium whitespace-nowrap [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function TableCell({ className, ...props }: React.ComponentProps<"td">) {
+  return (
+    <td
+      data-slot="table-cell"
+      className={cn(
+        "p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function TableCaption({
+  className,
+  ...props
+}: React.ComponentProps<"caption">) {
+  return (
+    <caption
+      data-slot="table-caption"
+      className={cn("text-muted-foreground mt-4 text-sm", className)}
+      {...props}
+    />
+  )
+}
+
+export {
+  Table,
+  TableHeader,
+  TableBody,
+  TableFooter,
+  TableHead,
+  TableRow,
+  TableCell,
+  TableCaption,
+}
--- a/client/src/components/ui/tabs.tsx
+++ b/client/src/components/ui/tabs.tsx
@@ -0,0 +1,66 @@
+"use client"
+
+import * as React from "react"
+import * as TabsPrimitive from "@radix-ui/react-tabs"
+
+import { cn } from "@/lib/utils"
+
+function Tabs({
+  className,
+  ...props
+}: React.ComponentProps<typeof TabsPrimitive.Root>) {
+  return (
+    <TabsPrimitive.Root
+      data-slot="tabs"
+      className={cn("flex flex-col gap-2", className)}
+      {...props}
+    />
+  )
+}
+
+function TabsList({
+  className,
+  ...props
+}: React.ComponentProps<typeof TabsPrimitive.List>) {
+  return (
+    <TabsPrimitive.List
+      data-slot="tabs-list"
+      className={cn(
+        "bg-muted text-muted-foreground inline-flex h-9 w-fit items-center justify-center rounded-lg p-[3px]",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function TabsTrigger({
+  className,
+  ...props
+}: React.ComponentProps<typeof TabsPrimitive.Trigger>) {
+  return (
+    <TabsPrimitive.Trigger
+      data-slot="tabs-trigger"
+      className={cn(
+        "data-[state=active]:bg-background dark:data-[state=active]:text-foreground focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:outline-ring dark:data-[state=active]:border-input dark:data-[state=active]:bg-input/30 text-foreground dark:text-muted-foreground inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-2 py-1 text-sm font-medium whitespace-nowrap transition-[color,box-shadow] focus-visible:ring-[3px] focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:shadow-sm [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function TabsContent({
+  className,
+  ...props
+}: React.ComponentProps<typeof TabsPrimitive.Content>) {
+  return (
+    <TabsPrimitive.Content
+      data-slot="tabs-content"
+      className={cn("flex-1 outline-none", className)}
+      {...props}
+    />
+  )
+}
+
+export { Tabs, TabsList, TabsTrigger, TabsContent }
--- a/client/src/components/ui/toggle-group.tsx
+++ b/client/src/components/ui/toggle-group.tsx
@@ -0,0 +1,83 @@
+"use client"
+
+import * as React from "react"
+import * as ToggleGroupPrimitive from "@radix-ui/react-toggle-group"
+import { type VariantProps } from "class-variance-authority"
+
+import { cn } from "@/lib/utils"
+import { toggleVariants } from "@/components/ui/toggle"
+
+const ToggleGroupContext = React.createContext<
+  VariantProps<typeof toggleVariants> & {
+    spacing?: number
+  }
+>({
+  size: "default",
+  variant: "default",
+  spacing: 0,
+})
+
+function ToggleGroup({
+  className,
+  variant,
+  size,
+  spacing = 0,
+  children,
+  ...props
+}: React.ComponentProps<typeof ToggleGroupPrimitive.Root> &
+  VariantProps<typeof toggleVariants> & {
+    spacing?: number
+  }) {
+  return (
+    <ToggleGroupPrimitive.Root
+      data-slot="toggle-group"
+      data-variant={variant}
+      data-size={size}
+      data-spacing={spacing}
+      style={{ "--gap": spacing } as React.CSSProperties}
+      className={cn(
+        "group/toggle-group flex w-fit items-center gap-[--spacing(var(--gap))] rounded-md data-[spacing=default]:data-[variant=outline]:shadow-xs",
+        className
+      )}
+      {...props}
+    >
+      <ToggleGroupContext.Provider value={{ variant, size, spacing }}>
+        {children}
+      </ToggleGroupContext.Provider>
+    </ToggleGroupPrimitive.Root>
+  )
+}
+
+function ToggleGroupItem({
+  className,
+  children,
+  variant,
+  size,
+  ...props
+}: React.ComponentProps<typeof ToggleGroupPrimitive.Item> &
+  VariantProps<typeof toggleVariants>) {
+  const context = React.useContext(ToggleGroupContext)
+
+  return (
+    <ToggleGroupPrimitive.Item
+      data-slot="toggle-group-item"
+      data-variant={context.variant || variant}
+      data-size={context.size || size}
+      data-spacing={context.spacing}
+      className={cn(
+        toggleVariants({
+          variant: context.variant || variant,
+          size: context.size || size,
+        }),
+        "w-auto min-w-0 shrink-0 px-3 focus:z-10 focus-visible:z-10",
+        "data-[spacing=0]:rounded-none data-[spacing=0]:shadow-none data-[spacing=0]:first:rounded-l-md data-[spacing=0]:last:rounded-r-md data-[spacing=0]:data-[variant=outline]:border-l-0 data-[spacing=0]:data-[variant=outline]:first:border-l",
+        className
+      )}
+      {...props}
+    >
+      {children}
+    </ToggleGroupPrimitive.Item>
+  )
+}
+
+export { ToggleGroup, ToggleGroupItem }
--- a/client/src/components/ui/toggle.tsx
+++ b/client/src/components/ui/toggle.tsx
@@ -0,0 +1,47 @@
+"use client"
+
+import * as React from "react"
+import * as TogglePrimitive from "@radix-ui/react-toggle"
+import { cva, type VariantProps } from "class-variance-authority"
+
+import { cn } from "@/lib/utils"
+
+const toggleVariants = cva(
+  "inline-flex items-center justify-center gap-2 rounded-md text-sm font-medium hover:bg-muted hover:text-muted-foreground disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] outline-none transition-[color,box-shadow] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive whitespace-nowrap",
+  {
+    variants: {
+      variant: {
+        default: "bg-transparent",
+        outline:
+          "border border-input bg-transparent shadow-xs hover:bg-accent hover:text-accent-foreground",
+      },
+      size: {
+        default: "h-9 px-2 min-w-9",
+        sm: "h-8 px-1.5 min-w-8",
+        lg: "h-10 px-2.5 min-w-10",
+      },
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default",
+    },
+  }
+)
+
+function Toggle({
+  className,
+  variant,
+  size,
+  ...props
+}: React.ComponentProps<typeof TogglePrimitive.Root> &
+  VariantProps<typeof toggleVariants>) {
+  return (
+    <TogglePrimitive.Root
+      data-slot="toggle"
+      className={cn(toggleVariants({ variant, size, className }))}
+      {...props}
+    />
+  )
+}
+
+export { Toggle, toggleVariants }
--- a/client/src/components/ui/tooltip.tsx
+++ b/client/src/components/ui/tooltip.tsx
@@ -0,0 +1,59 @@
+import * as React from "react"
+import * as TooltipPrimitive from "@radix-ui/react-tooltip"
+
+import { cn } from "@/lib/utils"
+
+function TooltipProvider({
+  delayDuration = 0,
+  ...props
+}: React.ComponentProps<typeof TooltipPrimitive.Provider>) {
+  return (
+    <TooltipPrimitive.Provider
+      data-slot="tooltip-provider"
+      delayDuration={delayDuration}
+      {...props}
+    />
+  )
+}
+
+function Tooltip({
+  ...props
+}: React.ComponentProps<typeof TooltipPrimitive.Root>) {
+  return (
+    <TooltipProvider>
+      <TooltipPrimitive.Root data-slot="tooltip" {...props} />
+    </TooltipProvider>
+  )
+}
+
+function TooltipTrigger({
+  ...props
+}: React.ComponentProps<typeof TooltipPrimitive.Trigger>) {
+  return <TooltipPrimitive.Trigger data-slot="tooltip-trigger" {...props} />
+}
+
+function TooltipContent({
+  className,
+  sideOffset = 0,
+  children,
+  ...props
+}: React.ComponentProps<typeof TooltipPrimitive.Content>) {
+  return (
+    <TooltipPrimitive.Portal>
+      <TooltipPrimitive.Content
+        data-slot="tooltip-content"
+        sideOffset={sideOffset}
+        className={cn(
+          "bg-foreground text-background animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance",
+          className
+        )}
+        {...props}
+      >
+        {children}
+        <TooltipPrimitive.Arrow className="bg-foreground fill-foreground z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]" />
+      </TooltipPrimitive.Content>
+    </TooltipPrimitive.Portal>
+  )
+}
+
+export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider }
--- a/client/src/components/workbenchCards/card-skeleton.tsx
+++ b/client/src/components/workbenchCards/card-skeleton.tsx
@@ -0,0 +1,9 @@
+import { Skeleton } from '../ui/skeleton';
+
+export function CardSkeleton() {
+  return (
+    <Skeleton
+      className="gap-6 rounded-xl py-6 h-full"
+    />
+  );
+}
--- a/client/src/components/workbenchCards/checkin.tsx
+++ b/client/src/components/workbenchCards/checkin.tsx
@@ -0,0 +1,32 @@
+import { Badge } from '@/components/ui/badge';
+import { Card, CardAction, CardDescription, CardFooter, CardHeader, CardTitle } from '@/components/ui/card';
+import { useUserInfo } from '@/hooks/data/useUserInfo';
+import { QrDialog } from '../checkin/qr-dialog';
+import { withFallback } from '../hoc/with-fallback';
+import { CardSkeleton } from './card-skeleton';
+
+function CheckinCard_() {
+  const { data } = useUserInfo();
+  return (
+    <Card className="@container/card">
+      <CardHeader>
+        <CardDescription>签到状态</CardDescription>
+        <CardTitle className="text-2xl font-semibold tabular-nums @[250px]/card:text-3xl">
+          {data.checkin !== null ? '已签到' : '未签到'}
+          {data.checkin !== null && <span className="text-sm font-medium ml-2">{`${new Date(data.checkin).toLocaleString()}`}</span>}
+        </CardTitle>
+        <CardAction>
+          <Badge variant="outline">Day 1</Badge>
+        </CardAction>
+      </CardHeader>
+      <CardFooter className="flex-col items-start gap-1.5 text-sm">
+        <QrDialog
+          eventId="019b5bf2-90ce-75f5-93a4-a66914c2ef11"
+        >
+        </QrDialog>
+      </CardFooter>
+    </Card>
+  );
+}
+
+export const CheckinCard = withFallback(CheckinCard_, <CardSkeleton />);
--- a/client/src/hooks/data/useGetCheckInCode.ts
+++ b/client/src/hooks/data/useGetCheckInCode.ts
@@ -0,0 +1,18 @@
+import { useQuery } from '@tanstack/react-query';
+import { axiosClient } from '@/lib/axios';
+
+export function useCheckinCode(eventId: string, enabled: boolean) {
+  return useQuery({
+    queryKey: ['getCheckinCode', eventId],
+    queryFn: async () => {
+      return axiosClient.get<{
+        checkin_code: string;
+      }>('/user/checkin', {
+        params: {
+          event_id: eventId,
+        },
+      });
+    },
+    enabled,
+  });
+}
--- a/client/src/hooks/data/useGetMagicLink.ts
+++ b/client/src/hooks/data/useGetMagicLink.ts
@@ -0,0 +1,16 @@
+import type { AuthorizeSearchParams } from '@/routes/authorize';
+import { useMutation } from '@tanstack/react-query';
+import { axiosClient } from '@/lib/axios';
+
+interface GetMagicLinkPayload extends AuthorizeSearchParams {
+  email: string;
+  turnstile_token: string;
+}
+
+export function useGetMagicLink() {
+  return useMutation({
+    mutationFn: async (payload: GetMagicLinkPayload) => {
+      return axiosClient.post<{ status: string }>('/auth/magic', payload);
+    },
+  });
+}
--- a/client/src/hooks/data/useUserInfo.ts
+++ b/client/src/hooks/data/useUserInfo.ts
@@ -0,0 +1,22 @@
+import { useSuspenseQuery } from '@tanstack/react-query';
+import { axiosClient } from '@/lib/axios';
+
+export function useUserInfo() {
+  return useSuspenseQuery({
+    queryKey: ['userInfo'],
+    queryFn: async () => {
+      const response = await axiosClient.get<{
+        user_id: string;
+        email: string;
+        type: string;
+        nickname: string;
+        subtitle: string;
+        avatar: string;
+        checkin: string | null;
+      }
+      >('/user/info');
+      return response.data;
+    },
+    staleTime: 10 * 60 * 1000,
+  });
+}
--- a/client/src/hooks/data/useValidateMagicLink.ts
+++ b/client/src/hooks/data/useValidateMagicLink.ts
@@ -0,0 +1,11 @@
+import { useSuspenseQuery } from '@tanstack/react-query';
+import { axiosClient } from '@/lib/axios';
+
+export function useValidateMagicLink(ticket: string) {
+  return useSuspenseQuery({
+    queryKey: ['validateMagicLink', ticket],
+    queryFn: async () => {
+      return axiosClient.get<{ access_token: string; refresh_token: string }>('/auth/magic/verify', { params: { token: ticket } });
+    },
+  });
+}
--- a/client/src/hooks/use-mobile.ts
+++ b/client/src/hooks/use-mobile.ts
@@ -0,0 +1,19 @@
+import * as React from 'react';
+
+const MOBILE_BREAKPOINT = 768;
+
+export function useIsMobile() {
+  const [isMobile, setIsMobile] = React.useState<boolean | undefined>(undefined);
+
+  React.useEffect(() => {
+    const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);
+    const onChange = () => {
+      setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
+    };
+    mql.addEventListener('change', onChange);
+    setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
+    return () => mql.removeEventListener('change', onChange);
+  }, []);
+
+  return !!isMobile;
+}
--- a/client/src/hooks/useLogout.ts
+++ b/client/src/hooks/useLogout.ts
@@ -0,0 +1,14 @@
+import { useNavigate } from '@tanstack/react-router';
+import { useCallback } from 'react';
+import { clearTokens } from '@/lib/token';
+
+export function useLogout() {
+  const navigate = useNavigate();
+
+  const logout = useCallback(() => {
+    clearTokens();
+    void navigate({ to: '/authorize' });
+  }, [navigate]);
+
+  return { logout };
+}
--- a/client/src/hooks/useTheme.ts
+++ b/client/src/hooks/useTheme.ts
@@ -0,0 +1,24 @@
+import { createContext, use } from 'react';
+
+export type Theme = 'dark' | 'light' | 'system';
+
+interface ThemeProviderState {
+  theme: Theme;
+  setTheme: (theme: Theme) => void;
+}
+
+const initialState: ThemeProviderState = {
+  theme: 'system',
+  setTheme: () => null,
+};
+
+export const ThemeProviderContext = createContext<ThemeProviderState>(initialState);
+
+export function useTheme() {
+  const context = use(ThemeProviderContext);
+
+  if (context === undefined)
+    throw new Error('useTheme must be used within a ThemeProvider');
+
+  return context;
+}
--- a/client/src/index.css
+++ b/client/src/index.css
@@ -0,0 +1,218 @@
+@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+Mono:wght@100..900&display=swap");
+@import "tailwindcss";
+@import "tw-animate-css";
+
+@custom-variant dark (&:is(.dark *));
+
+@theme inline {
+  --radius-sm: calc(var(--radius) - 4px);
+  --radius-md: calc(var(--radius) - 2px);
+  --radius-lg: var(--radius);
+  --radius-xl: calc(var(--radius) + 4px);
+  --radius-2xl: calc(var(--radius) + 8px);
+  --radius-3xl: calc(var(--radius) + 12px);
+  --radius-4xl: calc(var(--radius) + 16px);
+  --color-background: var(--background);
+  --color-foreground: var(--foreground);
+  --color-card: var(--card);
+  --color-card-foreground: var(--card-foreground);
+  --color-popover: var(--popover);
+  --color-popover-foreground: var(--popover-foreground);
+  --color-primary: var(--primary);
+  --color-primary-foreground: var(--primary-foreground);
+  --color-secondary: var(--secondary);
+  --color-secondary-foreground: var(--secondary-foreground);
+  --color-muted: var(--muted);
+  --color-muted-foreground: var(--muted-foreground);
+  --color-accent: var(--accent);
+  --color-accent-foreground: var(--accent-foreground);
+  --color-destructive: var(--destructive);
+  --color-border: var(--border);
+  --color-input: var(--input);
+  --color-ring: var(--ring);
+  --color-chart-1: var(--chart-1);
+  --color-chart-2: var(--chart-2);
+  --color-chart-3: var(--chart-3);
+  --color-chart-4: var(--chart-4);
+  --color-chart-5: var(--chart-5);
+  --color-sidebar: var(--sidebar);
+  --color-sidebar-foreground: var(--sidebar-foreground);
+  --color-sidebar-primary: var(--sidebar-primary);
+  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
+  --color-sidebar-accent: var(--sidebar-accent);
+  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
+  --color-sidebar-border: var(--sidebar-border);
+  --color-sidebar-ring: var(--sidebar-ring);
+  --font-sans: "Inter", sans-serif;
+  --font-mono: "Noto Sans Mono", monospace;
+  --font-serif: "Lora", serif;
+  --radius: 0.5rem;
+  --tracking-tighter: calc(var(--tracking-normal) - 0.05em);
+  --tracking-tight: calc(var(--tracking-normal) - 0.025em);
+  --tracking-wide: calc(var(--tracking-normal) + 0.025em);
+  --tracking-wider: calc(var(--tracking-normal) + 0.05em);
+  --tracking-widest: calc(var(--tracking-normal) + 0.1em);
+  --tracking-normal: var(--tracking-normal);
+  --shadow-2xl: var(--shadow-2xl);
+  --shadow-xl: var(--shadow-xl);
+  --shadow-lg: var(--shadow-lg);
+  --shadow-md: var(--shadow-md);
+  --shadow: var(--shadow);
+  --shadow-sm: var(--shadow-sm);
+  --shadow-xs: var(--shadow-xs);
+  --shadow-2xs: var(--shadow-2xs);
+  --spacing: var(--spacing);
+  --letter-spacing: var(--letter-spacing);
+  --shadow-offset-y: var(--shadow-offset-y);
+  --shadow-offset-x: var(--shadow-offset-x);
+  --shadow-spread: var(--shadow-spread);
+  --shadow-blur: var(--shadow-blur);
+  --shadow-opacity: var(--shadow-opacity);
+  --color-shadow-color: var(--shadow-color);
+  --color-destructive-foreground: var(--destructive-foreground);
+}
+
+:root {
+  --radius: 0.5rem;
+  --background: oklch(0.9816 0.0017 247.839);
+  --foreground: oklch(0.2621 0.0095 248.1897);
+  --card: oklch(1 0 0);
+  --card-foreground: oklch(0.2621 0.0095 248.1897);
+  --popover: oklch(1 0 0);
+  --popover-foreground: oklch(0.2621 0.0095 248.1897);
+  --primary: oklch(0.5502 0.1193 263.8209);
+  --primary-foreground: oklch(1 0 0);
+  --secondary: oklch(0.7499 0.0898 239.3977);
+  --secondary-foreground: oklch(0.2621 0.0095 248.1897);
+  --muted: oklch(0.9417 0.0052 247.879);
+  --muted-foreground: oklch(0.5575 0.0165 244.8933);
+  --accent: oklch(0.9417 0.0052 247.879);
+  --accent-foreground: oklch(0.2621 0.0095 248.1897);
+  --destructive: oklch(0.5915 0.202 21.2388);
+  --border: oklch(0.9109 0.007 247.9014);
+  --input: oklch(1 0 0);
+  --ring: oklch(0.5502 0.1193 263.8209);
+  --chart-1: oklch(0.5502 0.1193 263.8209);
+  --chart-2: oklch(0.7499 0.0898 239.3977);
+  --chart-3: oklch(0.4711 0.0998 264.0792);
+  --chart-4: oklch(0.6689 0.0699 240.3096);
+  --chart-5: oklch(0.5107 0.1098 263.6921);
+  --sidebar: oklch(0.9632 0.0034 247.8585);
+  --sidebar-foreground: oklch(0.2621 0.0095 248.1897);
+  --sidebar-primary: oklch(0.5502 0.1193 263.8209);
+  --sidebar-primary-foreground: oklch(1 0 0);
+  --sidebar-accent: oklch(0.9417 0.0052 247.879);
+  --sidebar-accent-foreground: oklch(0.2621 0.0095 248.1897);
+  --sidebar-border: oklch(0.9109 0.007 247.9014);
+  --sidebar-ring: oklch(0.5502 0.1193 263.8209);
+  --destructive-foreground: oklch(1 0 0);
+  --font-sans: "Inter", sans-serif;
+  --font-serif: "Lora", serif;
+  --font-mono: "JetBrains Mono", monospace;
+  --shadow-color: #000000;
+  --shadow-opacity: 0.05;
+  --shadow-blur: 0.5rem;
+  --shadow-spread: 0rem;
+  --shadow-offset-x: 0rem;
+  --shadow-offset-y: 0.1rem;
+  --letter-spacing: 0em;
+  --spacing: 0.25rem;
+  --shadow-2xs: 0rem 0.1rem 0.5rem 0rem hsl(0 0% 0% / 0.03);
+  --shadow-xs: 0rem 0.1rem 0.5rem 0rem hsl(0 0% 0% / 0.03);
+  --shadow-sm:
+    0rem 0.1rem 0.5rem 0rem hsl(0 0% 0% / 0.05),
+    0rem 1px 2px -1px hsl(0 0% 0% / 0.05);
+  --shadow:
+    0rem 0.1rem 0.5rem 0rem hsl(0 0% 0% / 0.05),
+    0rem 1px 2px -1px hsl(0 0% 0% / 0.05);
+  --shadow-md:
+    0rem 0.1rem 0.5rem 0rem hsl(0 0% 0% / 0.05),
+    0rem 2px 4px -1px hsl(0 0% 0% / 0.05);
+  --shadow-lg:
+    0rem 0.1rem 0.5rem 0rem hsl(0 0% 0% / 0.05),
+    0rem 4px 6px -1px hsl(0 0% 0% / 0.05);
+  --shadow-xl:
+    0rem 0.1rem 0.5rem 0rem hsl(0 0% 0% / 0.05),
+    0rem 8px 10px -1px hsl(0 0% 0% / 0.05);
+  --shadow-2xl: 0rem 0.1rem 0.5rem 0rem hsl(0 0% 0% / 0.13);
+  --tracking-normal: 0em;
+}
+
+.dark {
+  --background: oklch(0.227 0.012 270.8402);
+  --foreground: oklch(0.9067 0 0);
+  --card: oklch(0.263 0.0127 258.3724);
+  --card-foreground: oklch(0.9067 0 0);
+  --popover: oklch(0.263 0.0127 258.3724);
+  --popover-foreground: oklch(0.9067 0 0);
+  --primary: oklch(0.5774 0.1248 263.377);
+  --primary-foreground: oklch(1 0 0);
+  --secondary: oklch(0.7636 0.0866 239.8852);
+  --secondary-foreground: oklch(0.2621 0.0095 248.1897);
+  --muted: oklch(0.3006 0.0156 264.3078);
+  --muted-foreground: oklch(0.7137 0.0192 261.3246);
+  --accent: oklch(0.3006 0.0156 264.3078);
+  --accent-foreground: oklch(0.9067 0 0);
+  --destructive: oklch(0.5915 0.202 21.2388);
+  --border: oklch(0.3451 0.0133 248.2124);
+  --input: oklch(0.263 0.0127 258.3724);
+  --ring: oklch(0.5502 0.1193 263.8209);
+  --chart-1: oklch(0.5502 0.1193 263.8209);
+  --chart-2: oklch(0.7499 0.0898 239.3977);
+  --chart-3: oklch(0.4711 0.0998 264.0792);
+  --chart-4: oklch(0.6689 0.0699 240.3096);
+  --chart-5: oklch(0.5107 0.1098 263.6921);
+  --sidebar: oklch(0.227 0.012 270.8402);
+  --sidebar-foreground: oklch(0.9067 0 0);
+  --sidebar-primary: oklch(0.5502 0.1193 263.8209);
+  --sidebar-primary-foreground: oklch(1 0 0);
+  --sidebar-accent: oklch(0.3006 0.0156 264.3078);
+  --sidebar-accent-foreground: oklch(0.9067 0 0);
+  --sidebar-border: oklch(0.3451 0.0133 248.2124);
+  --sidebar-ring: oklch(0.5502 0.1193 263.8209);
+  --destructive-foreground: oklch(1 0 0);
+  --radius: 0.5rem;
+  --font-sans: "Inter", sans-serif;
+  --font-serif: "Lora", serif;
+  --font-mono: "JetBrains Mono", monospace;
+  --shadow-color: #000000;
+  --shadow-opacity: 0.3;
+  --shadow-blur: 0.5rem;
+  --shadow-spread: 0rem;
+  --shadow-offset-x: 0rem;
+  --shadow-offset-y: 0.1rem;
+  --letter-spacing: 0em;
+  --spacing: 0.25rem;
+  --shadow-2xs: 0rem 0.1rem 0.5rem 0rem hsl(0 0% 0% / 0.15);
+  --shadow-xs: 0rem 0.1rem 0.5rem 0rem hsl(0 0% 0% / 0.15);
+  --shadow-sm:
+    0rem 0.1rem 0.5rem 0rem hsl(0 0% 0% / 0.3),
+    0rem 1px 2px -1px hsl(0 0% 0% / 0.3);
+  --shadow:
+    0rem 0.1rem 0.5rem 0rem hsl(0 0% 0% / 0.3),
+    0rem 1px 2px -1px hsl(0 0% 0% / 0.3);
+  --shadow-md:
+    0rem 0.1rem 0.5rem 0rem hsl(0 0% 0% / 0.3),
+    0rem 2px 4px -1px hsl(0 0% 0% / 0.3);
+  --shadow-lg:
+    0rem 0.1rem 0.5rem 0rem hsl(0 0% 0% / 0.3),
+    0rem 4px 6px -1px hsl(0 0% 0% / 0.3);
+  --shadow-xl:
+    0rem 0.1rem 0.5rem 0rem hsl(0 0% 0% / 0.3),
+    0rem 8px 10px -1px hsl(0 0% 0% / 0.3);
+  --shadow-2xl: 0rem 0.1rem 0.5rem 0rem hsl(0 0% 0% / 0.75);
+}
+
+@layer base {
+  * {
+    @apply border-border outline-ring/50;
+  }
+  body {
+    @apply bg-background text-foreground;
+    letter-spacing: var(--tracking-normal);
+  }
+}
+
+[data-slot="dialog-overlay"] {
+  backdrop-filter: blur(3px);
+}
--- a/client/src/lib/axios.ts
+++ b/client/src/lib/axios.ts
@@ -0,0 +1,44 @@
+import type { AxiosRequestConfig } from 'axios';
+import axios, { AxiosError } from 'axios';
+import { router } from '@/lib/router';
+import { doRefreshToken, getRefreshToken, getToken, setRefreshToken, setToken } from './token';
+
+export const axiosClient = axios.create({
+  baseURL: '/api/v1/',
+});
+
+axiosClient.interceptors.request.use((config) => {
+  const token = getToken();
+  if (token !== null) {
+    config.headers = config.headers ?? {};
+    config.headers.Authorization = `Bearer ${token}`;
+  }
+  return config;
+});
+
+type RetryConfig = AxiosRequestConfig & { _retry?: boolean };
+
+axiosClient.interceptors.response.use(undefined, async (error: AxiosError) => {
+  const originalRequest = error.config as RetryConfig | undefined;
+  if (!error.response || error.response.status !== 401 || !originalRequest) {
+    return Promise.reject(error);
+  }
+
+  if (error.response.status === 401 && getRefreshToken() !== null) {
+    try {
+      const maybeRefreshTokenValue = await doRefreshToken();
+      const { access_token, refresh_token } = maybeRefreshTokenValue.data;
+      originalRequest.headers = originalRequest.headers ?? {};
+      originalRequest.headers.Authorization = `Bearer ${access_token}`;
+      setToken(access_token);
+      setRefreshToken(refresh_token);
+      return await axiosClient(originalRequest);
+    }
+    catch (e) {
+      if (e instanceof AxiosError && e.status === 401) {
+        await router.navigate({ to: '/login' });
+        return Promise.reject(error);
+      }
+    }
+  }
+});
--- a/client/src/lib/navData.ts
+++ b/client/src/lib/navData.ts
@@ -0,0 +1,21 @@
+import {
+  IconDashboard,
+  IconUser,
+} from '@tabler/icons-react';
+
+export const navData = {
+  navMain: [
+    {
+      title: '工作台',
+      url: '/',
+      icon: IconDashboard,
+    },
+  ],
+  navSecondary: [
+    {
+      title: '个人资料',
+      url: '/profile',
+      icon: IconUser,
+    },
+  ],
+};
--- a/client/src/lib/random.ts
+++ b/client/src/lib/random.ts
@@ -0,0 +1,14 @@
+/**
+ * Generate a cryptographically secure OAuth2 state string
+ * base64url encoded, URL-safe
+ */
+export function generateOAuthState(bytes: number = 32): string {
+  const random = new Uint8Array(bytes);
+  crypto.getRandomValues(random);
+
+  // base64url encode
+  return btoa(String.fromCharCode(...random))
+    .replace(/\+/g, '-')
+    .replace(/\//g, '_')
+    .replace(/=+$/, '');
+}
--- a/client/src/lib/router.ts
+++ b/client/src/lib/router.ts
@@ -0,0 +1,13 @@
+import { createRouter } from '@tanstack/react-router';
+// Import the generated route tree
+import { routeTree } from '../routeTree.gen';
+
+// Create a new router instance
+export const router = createRouter({ routeTree });
+
+// Register the router instance for type safety
+declare module '@tanstack/react-router' {
+  interface Register {
+    router: typeof router;
+  }
+}
--- a/client/src/lib/token.ts
+++ b/client/src/lib/token.ts
@@ -0,0 +1,40 @@
+import axios from 'axios';
+
+export function setToken(token: string) {
+  localStorage.setItem('token', token);
+}
+
+export function getToken() {
+  return localStorage.getItem('token');
+}
+
+export function removeToken() {
+  localStorage.removeItem('token');
+}
+
+export function hasToken() {
+  return getToken() !== null;
+}
+
+export function setRefreshToken(refreshToken: string) {
+  localStorage.setItem('refreshToken', refreshToken);
+}
+
+export function getRefreshToken() {
+  return localStorage.getItem('refreshToken');
+}
+
+export function clearTokens() {
+  removeToken();
+  setRefreshToken('');
+}
+
+export async function doSetTokenByCode(code: string) {
+  const { data } = await axios.post<{ access_token: string; refresh_token: string }>('/api/v1/auth/token', { code });
+  setToken(data.access_token);
+  setRefreshToken(data.refresh_token);
+}
+
+export async function doRefreshToken() {
+  return axios.post<{ access_token: string; refresh_token: string }>('/api/v1/auth/refresh', { refresh_token: getRefreshToken() });
+}
--- a/client/src/lib/utils.ts
+++ b/client/src/lib/utils.ts
@@ -0,0 +1,7 @@
+import type { ClassValue } from 'clsx';
+import { clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+
+export function cn(...inputs: ClassValue[]) {
+  return twMerge(clsx(inputs));
+}
--- a/client/src/main.tsx
+++ b/client/src/main.tsx
@@ -0,0 +1,15 @@
+import { RouterProvider } from '@tanstack/react-router';
+import { StrictMode } from 'react';
+import ReactDOM from 'react-dom/client';
+import { router } from '@/lib/router';
+
+// Render the app
+const rootElement = document.getElementById('root')!;
+if (!rootElement.innerHTML) {
+  const root = ReactDOM.createRoot(rootElement);
+  root.render(
+    <StrictMode>
+      <RouterProvider router={router} />
+    </StrictMode>,
+  );
+}
--- a/client/src/routeTree.gen.ts
+++ b/client/src/routeTree.gen.ts
@@ -0,0 +1,163 @@
+/* eslint-disable */
+
+// @ts-nocheck
+
+// noinspection JSUnusedGlobalSymbols
+
+// This file was automatically generated by TanStack Router.
+// You should NOT make any changes in this file as it will be overwritten.
+// Additionally, you should also exclude this file from your linter and/or formatter to prevent it from being checked or modified.
+
+import { Route as rootRouteImport } from './routes/__root'
+import { Route as TokenRouteImport } from './routes/token'
+import { Route as MagicLinkSentRouteImport } from './routes/magicLinkSent'
+import { Route as AuthorizeRouteImport } from './routes/authorize'
+import { Route as SidebarLayoutRouteImport } from './routes/_sidebarLayout'
+import { Route as SidebarLayoutIndexRouteImport } from './routes/_sidebarLayout/index'
+import { Route as SidebarLayoutProfileRouteImport } from './routes/_sidebarLayout/profile'
+
+const TokenRoute = TokenRouteImport.update({
+  id: '/token',
+  path: '/token',
+  getParentRoute: () => rootRouteImport,
+} as any)
+const MagicLinkSentRoute = MagicLinkSentRouteImport.update({
+  id: '/magicLinkSent',
+  path: '/magicLinkSent',
+  getParentRoute: () => rootRouteImport,
+} as any)
+const AuthorizeRoute = AuthorizeRouteImport.update({
+  id: '/authorize',
+  path: '/authorize',
+  getParentRoute: () => rootRouteImport,
+} as any)
+const SidebarLayoutRoute = SidebarLayoutRouteImport.update({
+  id: '/_sidebarLayout',
+  getParentRoute: () => rootRouteImport,
+} as any)
+const SidebarLayoutIndexRoute = SidebarLayoutIndexRouteImport.update({
+  id: '/',
+  path: '/',
+  getParentRoute: () => SidebarLayoutRoute,
+} as any)
+const SidebarLayoutProfileRoute = SidebarLayoutProfileRouteImport.update({
+  id: '/profile',
+  path: '/profile',
+  getParentRoute: () => SidebarLayoutRoute,
+} as any)
+
+export interface FileRoutesByFullPath {
+  '/authorize': typeof AuthorizeRoute
+  '/magicLinkSent': typeof MagicLinkSentRoute
+  '/token': typeof TokenRoute
+  '/profile': typeof SidebarLayoutProfileRoute
+  '/': typeof SidebarLayoutIndexRoute
+}
+export interface FileRoutesByTo {
+  '/authorize': typeof AuthorizeRoute
+  '/magicLinkSent': typeof MagicLinkSentRoute
+  '/token': typeof TokenRoute
+  '/profile': typeof SidebarLayoutProfileRoute
+  '/': typeof SidebarLayoutIndexRoute
+}
+export interface FileRoutesById {
+  __root__: typeof rootRouteImport
+  '/_sidebarLayout': typeof SidebarLayoutRouteWithChildren
+  '/authorize': typeof AuthorizeRoute
+  '/magicLinkSent': typeof MagicLinkSentRoute
+  '/token': typeof TokenRoute
+  '/_sidebarLayout/profile': typeof SidebarLayoutProfileRoute
+  '/_sidebarLayout/': typeof SidebarLayoutIndexRoute
+}
+export interface FileRouteTypes {
+  fileRoutesByFullPath: FileRoutesByFullPath
+  fullPaths: '/authorize' | '/magicLinkSent' | '/token' | '/profile' | '/'
+  fileRoutesByTo: FileRoutesByTo
+  to: '/authorize' | '/magicLinkSent' | '/token' | '/profile' | '/'
+  id:
+    | '__root__'
+    | '/_sidebarLayout'
+    | '/authorize'
+    | '/magicLinkSent'
+    | '/token'
+    | '/_sidebarLayout/profile'
+    | '/_sidebarLayout/'
+  fileRoutesById: FileRoutesById
+}
+export interface RootRouteChildren {
+  SidebarLayoutRoute: typeof SidebarLayoutRouteWithChildren
+  AuthorizeRoute: typeof AuthorizeRoute
+  MagicLinkSentRoute: typeof MagicLinkSentRoute
+  TokenRoute: typeof TokenRoute
+}
+
+declare module '@tanstack/react-router' {
+  interface FileRoutesByPath {
+    '/token': {
+      id: '/token'
+      path: '/token'
+      fullPath: '/token'
+      preLoaderRoute: typeof TokenRouteImport
+      parentRoute: typeof rootRouteImport
+    }
+    '/magicLinkSent': {
+      id: '/magicLinkSent'
+      path: '/magicLinkSent'
+      fullPath: '/magicLinkSent'
+      preLoaderRoute: typeof MagicLinkSentRouteImport
+      parentRoute: typeof rootRouteImport
+    }
+    '/authorize': {
+      id: '/authorize'
+      path: '/authorize'
+      fullPath: '/authorize'
+      preLoaderRoute: typeof AuthorizeRouteImport
+      parentRoute: typeof rootRouteImport
+    }
+    '/_sidebarLayout': {
+      id: '/_sidebarLayout'
+      path: ''
+      fullPath: ''
+      preLoaderRoute: typeof SidebarLayoutRouteImport
+      parentRoute: typeof rootRouteImport
+    }
+    '/_sidebarLayout/': {
+      id: '/_sidebarLayout/'
+      path: '/'
+      fullPath: '/'
+      preLoaderRoute: typeof SidebarLayoutIndexRouteImport
+      parentRoute: typeof SidebarLayoutRoute
+    }
+    '/_sidebarLayout/profile': {
+      id: '/_sidebarLayout/profile'
+      path: '/profile'
+      fullPath: '/profile'
+      preLoaderRoute: typeof SidebarLayoutProfileRouteImport
+      parentRoute: typeof SidebarLayoutRoute
+    }
+  }
+}
+
+interface SidebarLayoutRouteChildren {
+  SidebarLayoutProfileRoute: typeof SidebarLayoutProfileRoute
+  SidebarLayoutIndexRoute: typeof SidebarLayoutIndexRoute
+}
+
+const SidebarLayoutRouteChildren: SidebarLayoutRouteChildren = {
+  SidebarLayoutProfileRoute: SidebarLayoutProfileRoute,
+  SidebarLayoutIndexRoute: SidebarLayoutIndexRoute,
+}
+
+const SidebarLayoutRouteWithChildren = SidebarLayoutRoute._addFileChildren(
+  SidebarLayoutRouteChildren,
+)
+
+const rootRouteChildren: RootRouteChildren = {
+  SidebarLayoutRoute: SidebarLayoutRouteWithChildren,
+  AuthorizeRoute: AuthorizeRoute,
+  MagicLinkSentRoute: MagicLinkSentRoute,
+  TokenRoute: TokenRoute,
+}
+export const routeTree = rootRouteImport
+  ._addFileChildren(rootRouteChildren)
+  ._addFileTypes<FileRouteTypes>()
--- a/client/src/routes/__root.tsx
+++ b/client/src/routes/__root.tsx
@@ -0,0 +1,39 @@
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+import { createRootRoute, Outlet } from '@tanstack/react-router';
+import { ThemeProvider } from '@/components/theme-provider';
+import { Toaster } from '@/components/ui/sonner';
+import '@/index.css';
+
+const queryClient = new QueryClient({
+  defaultOptions: {
+    queries: {
+      retry: (failureCount, error: any) => {
+        // eslint-disable-next-line ts/no-unsafe-assignment
+        const status
+          // eslint-disable-next-line ts/no-unsafe-member-access
+          = error?.response?.status ?? error?.status;
+
+        if (status >= 400 && status < 500) {
+          return false;
+        }
+
+        return failureCount < 3;
+      },
+    },
+  },
+});
+
+function RootLayout() {
+  return (
+    <>
+      <ThemeProvider defaultTheme="dark" storageKey="vite-ui-theme">
+        <QueryClientProvider client={queryClient}>
+          <Outlet />
+        </QueryClientProvider>
+      </ThemeProvider>
+      <Toaster position="top-right" />
+    </>
+  );
+}
+
+export const Route = createRootRoute({ component: RootLayout });
--- a/client/src/routes/_sidebarLayout.tsx
+++ b/client/src/routes/_sidebarLayout.tsx
@@ -0,0 +1,31 @@
+import { createFileRoute, Outlet } from '@tanstack/react-router';
+import { AppSidebar } from '@/components/sidebar/app-sidebar';
+import { SiteHeader } from '@/components/site-header';
+import { SidebarInset, SidebarProvider } from '@/components/ui/sidebar';
+
+export const Route = createFileRoute('/_sidebarLayout')({
+  component: RouteComponent,
+});
+
+function RouteComponent() {
+  return (
+    <SidebarProvider
+      style={
+        {
+          '--sidebar-width': 'calc(var(--spacing) * 72)',
+          '--header-height': 'calc(var(--spacing) * 12)',
+        } as React.CSSProperties
+      }
+    >
+      <AppSidebar variant="inset" />
+      <SidebarInset>
+        <SiteHeader />
+        <div className="flex flex-1 flex-col">
+          <div className="@container/main flex flex-1 flex-col gap-2">
+            <Outlet />
+          </div>
+        </div>
+      </SidebarInset>
+    </SidebarProvider>
+  );
+}
--- a/client/src/routes/_sidebarLayout/index.tsx
+++ b/client/src/routes/_sidebarLayout/index.tsx
@@ -0,0 +1,28 @@
+import { createFileRoute, redirect } from '@tanstack/react-router';
+import { CheckinCard } from '@/components/workbenchCards/checkin';
+import { hasToken } from '@/lib/token';
+
+export const Route = createFileRoute('/_sidebarLayout/')({
+  component: Index,
+  loader: async () => {
+    if (!hasToken()) {
+      throw redirect({
+        to: '/authorize',
+      });
+    }
+  },
+});
+
+function Index() {
+  return (
+    <div className="flex flex-col gap-4 py-4 md:gap-6 md:py-6">
+      {/* Section Cards */}
+      <div className="*:data-[slot=card]:from-primary/5 *:data-[slot=card]:to-card dark:*:data-[slot=card]:bg-card
+        grid grid-cols-1 gap-4 px-4 auto-rows-[minmax(175px,auto)] items-stretch
+        *:data-[slot=card]:bg-linear-to-t *:data-[slot=card]:shadow-xs lg:px-6 @xl/main:grid-cols-2 @5xl/main:grid-cols-4"
+      >
+        <CheckinCard />
+      </div>
+    </div>
+  );
+}
--- a/client/src/routes/_sidebarLayout/profile.tsx
+++ b/client/src/routes/_sidebarLayout/profile.tsx
@@ -0,0 +1,14 @@
+import { createFileRoute } from '@tanstack/react-router';
+import { MainProfile } from '@/components/profile/main-profile';
+
+export const Route = createFileRoute('/_sidebarLayout/profile')({
+  component: RouteComponent,
+});
+
+function RouteComponent() {
+  return (
+    <div className="flex min-h-[560px] flex-col gap-6 px-4 py-6">
+      <MainProfile />
+    </div>
+  );
+}
--- a/client/src/routes/authorize.tsx
+++ b/client/src/routes/authorize.tsx
@@ -0,0 +1,42 @@
+import { createFileRoute } from '@tanstack/react-router';
+import { zodValidator } from '@tanstack/zod-adapter';
+import z from 'zod';
+import { LoginForm } from '@/components/login-form';
+import { generateOAuthState } from '@/lib/random';
+import { getToken } from '@/lib/token';
+
+const authorizeSchema = z.object({
+  response_type: z.literal('code').default('code'),
+  client_id: z.literal('org_client').default('org_client'),
+  redirect_uri: z.string().default(`${new URL(import.meta.env.VITE_APP_BASE_URL as string).toString()}token`),
+  state: z.string().default(generateOAuthState()),
+});
+
+export type AuthorizeSearchParams = z.infer<typeof authorizeSchema>;
+
+export const Route = createFileRoute('/authorize')({
+  component: RouteComponent,
+  validateSearch: zodValidator(authorizeSchema),
+});
+
+function RouteComponent() {
+  const token = getToken();
+  const oauthParams = Route.useSearch();
+  if (token !== null) {
+    const base = new URL(window.location.origin);
+    const url = new URL('/api/v1/auth/redirect', base);
+    url.searchParams.set('client_id', oauthParams.client_id);
+    url.searchParams.set('response_type', oauthParams.response_type);
+    url.searchParams.set('redirect_uri', oauthParams.redirect_uri);
+    url.searchParams.set('state', oauthParams.state);
+    window.location.href = url.toString();
+    return null;
+  }
+  return (
+    <div className="bg-background flex min-h-svh flex-col items-center justify-center gap-6 p-6 md:p-10">
+      <div className="w-full max-w-sm">
+        <LoginForm oauthParams={oauthParams} />
+      </div>
+    </div>
+  );
+}
--- a/client/src/routes/magicLinkSent.tsx
+++ b/client/src/routes/magicLinkSent.tsx
@@ -0,0 +1,33 @@
+import { createFileRoute, Navigate } from '@tanstack/react-router';
+import { zodValidator } from '@tanstack/zod-adapter';
+import z from 'zod';
+import NixOSLogo from '@/assets/nixos.svg?react';
+
+const paramsSchema = z.object({
+  email: z.string().optional(),
+});
+
+export const Route = createFileRoute('/magicLinkSent')({
+  component: RouteComponent,
+  validateSearch: zodValidator(paramsSchema),
+});
+
+function RouteComponent() {
+  const { email } = Route.useSearch();
+  return email !== undefined
+    ? (
+        <div className="
+      bg-background flex min-h-svh flex-row items-center justify-center gap-6 p-6 md:p-10"
+        >
+          <NixOSLogo className="size-12" />
+          <span
+            aria-hidden="true"
+            className="mx-2 inline-block h-6 w-px bg-current opacity-40"
+          />
+          登录链接已发送至
+          {' '}
+          {email}
+        </div>
+      )
+    : <Navigate to="/login" />;
+}
--- a/client/src/routes/token.tsx
+++ b/client/src/routes/token.tsx
@@ -0,0 +1,25 @@
+import { createFileRoute, useNavigate } from '@tanstack/react-router';
+import { useState } from 'react';
+import z from 'zod';
+import { doSetTokenByCode } from '@/lib/token';
+
+const tokenCodeSchema = z.object({
+  code: z.string().nonempty(),
+});
+
+export const Route = createFileRoute('/token')({
+  component: RouteComponent,
+  validateSearch: tokenCodeSchema,
+});
+
+function RouteComponent() {
+  const { code } = Route.useSearch();
+  const [status, setStatus] = useState('Loading...');
+  const navigate = useNavigate();
+  doSetTokenByCode(code).then(() => {
+    void navigate({ to: '/' });
+  }).catch((_) => {
+    setStatus('Error getting token');
+  });
+  return <div>{status}</div>;
+}
--- a/client/tsconfig.app.json
+++ b/client/tsconfig.app.json
@@ -0,0 +1,32 @@
+{
+  "compilerOptions": {
+    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
+    "target": "ES2022",
+    "jsx": "react-jsx",
+    "lib": ["ES2022", "DOM", "DOM.Iterable"],
+    "moduleDetection": "force",
+    "useDefineForClassFields": true,
+    "baseUrl": ".",
+    "module": "ESNext",
+
+    /* Bundler mode */
+    "moduleResolution": "bundler",
+    "paths": {
+      "@/*": ["./src/*"]
+    },
+    "types": ["vite/client", "vite-plugin-svgr/client"],
+    "allowImportingTsExtensions": true,
+
+    /* Linting */
+    "strict": true,
+    "noFallthroughCasesInSwitch": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noEmit": true,
+    "verbatimModuleSyntax": true,
+    "erasableSyntaxOnly": true,
+    "skipLibCheck": true,
+    "noUncheckedSideEffectImports": true
+  },
+  "include": ["src"]
+}
--- a/client/tsconfig.json
+++ b/client/tsconfig.json
@@ -0,0 +1,13 @@
+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "@/*": ["./src/*"]
+    }
+  },
+  "references": [
+    { "path": "./tsconfig.app.json" },
+    { "path": "./tsconfig.node.json" }
+  ],
+  "files": []
+}
--- a/client/tsconfig.node.json
+++ b/client/tsconfig.node.json
@@ -0,0 +1,26 @@
+{
+  "compilerOptions": {
+    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
+    "target": "ES2023",
+    "lib": ["ES2023"],
+    "moduleDetection": "force",
+    "module": "ESNext",
+
+    /* Bundler mode */
+    "moduleResolution": "bundler",
+    "types": ["node"],
+    "allowImportingTsExtensions": true,
+
+    /* Linting */
+    "strict": true,
+    "noFallthroughCasesInSwitch": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noEmit": true,
+    "verbatimModuleSyntax": true,
+    "erasableSyntaxOnly": true,
+    "skipLibCheck": true,
+    "noUncheckedSideEffectImports": true
+  },
+  "include": ["vite.config.ts"]
+}
--- a/client/vite.config.ts
+++ b/client/vite.config.ts
@@ -0,0 +1,32 @@
+import path from 'node:path';
+import tailwindcss from '@tailwindcss/vite';
+import { tanstackRouter } from '@tanstack/router-plugin/vite';
+import react from '@vitejs/plugin-react';
+import { defineConfig } from 'vite';
+import svgr from 'vite-plugin-svgr';
+
+// https://vite.dev/config/
+export default defineConfig({
+  plugins: [
+    tanstackRouter({
+      target: 'react',
+      autoCodeSplitting: true,
+    }),
+    react(),
+    tailwindcss(),
+    svgr(),
+  ],
+  resolve: {
+    alias: {
+      '@': path.resolve(__dirname, './src'),
+    },
+  },
+  server: {
+    proxy: {
+      '/api': 'http://10.0.0.250:8000',
+    },
+    host: '0.0.0.0',
+    port: 5173,
+    allowedHosts: ['test.sne.moe'],
+  },
+});
--- a/config.default.yaml
+++ b/config.default.yaml
@@ -0,0 +1,38 @@
+server:
+    application: example
+    address: :8000
+    external_url: https://example.com
+    debug_mode: false
+    file_logger: false
+database:
+    type: postgres
+    host: 127.0.0.1
+    name: postgres
+    username: postgres
+    password: postgres
+cache:
+    hosts: ["127.0.0.1:6379"]
+    master: ""
+    username: ""
+    password: ""
+    db: 0
+search:
+    host: 127.0.0.1
+    api_key: ""
+email:
+    host:
+    port:
+    username:
+    password:
+    security:
+    insecure_skip_verify:
+    from:
+secrets:
+    jwt_secret: example
+    turnstile_secret: example
+    client_secret_key: example
+ttl:
+    auth_code_ttl: 10m
+    access_ttl: 15s
+    refresh_ttl: 168h
+    checkin_code_ttl: 10m
--- a/config/config.go
+++ b/config/config.go
@@ -0,0 +1,37 @@
+package config
+
+import (
+	"log"
+	"os"
+	"strings"
+
+	"github.com/spf13/viper"
+)
+
+func ConfigDir() string {
+	env := os.Getenv("CONFIG_PATH")
+	if env != "" {
+		return env
+	}
+	return "."
+}
+
+func Init() {
+	// Read global config
+	viper.SetConfigName("config")
+	viper.SetConfigType("yaml")
+	viper.AddConfigPath(ConfigDir())
+
+	// Bind ENV
+	viper.SetEnvKeyReplacer(strings.NewReplacer(".", "_"))
+	viper.AutomaticEnv()
+
+	conf := &config{}
+	if err := viper.ReadInConfig(); err != nil {
+		// Dont generate config when using dev mode
+		log.Fatalln("Can't read config!")
+	}
+	if err := viper.Unmarshal(conf); err != nil {
+		log.Fatal(err)
+	}
+}
--- a/config/env.go
+++ b/config/env.go
@@ -0,0 +1,14 @@
+package config
+
+import (
+	"os"
+)
+
+func TZ() string {
+	tz := os.Getenv("TZ")
+
+	if tz == "" {
+		return "Asia/Shanghai"
+	}
+	return tz
+}
--- a/config/types.go
+++ b/config/types.go
@@ -0,0 +1,63 @@
+package config
+
+type config struct {
+	Server   server   `yaml:"server"`
+	Database database `yaml:"database"`
+	Cache    cache    `yaml:"cache"`
+	Search   search   `yaml:"search"`
+	Email    email    `yaml:"email"`
+	Secrets  secrets  `yaml:"secrets"`
+	TTL      ttl      `yaml:"ttl"`
+}
+
+type server struct {
+	Application string `yaml:"application"`
+	Address     string `yaml:"address"`
+	ExternalUrl string `yaml:"external_url"`
+	DebugMode   string `yaml:"debug_mode"`
+	FileLogger  string `yaml:"file_logger"`
+}
+
+type database struct {
+	Type     string `yaml:"type"`
+	Host     string `yaml:"host"`
+	Name     string `yaml:"name"`
+	Username string `yaml:"username"`
+	Password string `yaml:"password"`
+}
+
+type cache struct {
+	Hosts    []string `yaml:"hosts"`
+	Master   string   `yaml:"master"`
+	Username string   `yaml:"username"`
+	Password string   `yaml:"passowrd"`
+	DB       int      `yaml:"db"`
+}
+
+type search struct {
+	Host   string `yaml:"host"`
+	ApiKey string `yaml:"api_key"`
+}
+
+type email struct {
+	Host               string `yaml:"host"`
+	Port               string `yaml:"port"`
+	Username           string `yaml:"username"`
+	Password           string `yaml:"password"`
+	Security           string `yaml:"security"`
+	InsecureSkipVerify bool   `yaml:"insecure_skip_verify"`
+	From               string `yaml:"from"`
+}
+
+type secrets struct {
+	JwtSecret       string `yaml:"jwt_secret"`
+	TurnstileSecret string `yaml:"turnstile_secret"`
+	ClientSecretKey string `yaml:"client_secret_key"`
+}
+
+type ttl struct {
+	AuthCodeTTL    string `yaml:"auth_code_ttl"`
+	AccessTTL      string `yaml:"access_ttl"`
+	RefreshTTL     string `yaml:"refresh_ttl"`
+	CheckinCodeTTL string `yaml:"checkin_code_ttl"`
+}
--- a/data/attendance.go
+++ b/data/attendance.go
@@ -0,0 +1,263 @@
+package data
+
+import (
+	"context"
+	"errors"
+	"fmt"
+	"math/rand"
+	"strings"
+	"time"
+
+	"github.com/google/uuid"
+	"github.com/meilisearch/meilisearch-go"
+	"github.com/spf13/viper"
+	"gorm.io/gorm"
+)
+
+type Attendance struct {
+	Id           uint      `json:"id" gorm:"primarykey;autoIncrement"`
+	UUID         uuid.UUID `json:"uuid" gorm:"type:uuid;uniqueIndex;not null"`
+	AttendanceId uuid.UUID `json:"attendance_id" gorm:"type:uuid;uniqueIndex;not null"`
+	EventId      uuid.UUID `json:"event_id" gorm:"type:uuid;uniqueIndex:unique_event_user;not null"`
+	UserId       uuid.UUID `json:"user_id" gorm:"type:uuid;uniqueIndex:unique_event_user;not null"`
+	Role         string    `json:"role" gorm:"type:varchar(255);not null"`
+	CheckinAt    time.Time `json:"checkin_at"`
+}
+
+type AttendanceSearchDoc struct {
+	AttendanceId string    `json:"attendance_id"`
+	EventId      string    `json:"event_id"`
+	UserId       string    `json:"user_id"`
+	Role         string    `json:"role"`
+	CheckinAt    time.Time `json:"checkin_at"`
+}
+
+func (self *Attendance) GetAttendance(userId, eventId uuid.UUID) (*Attendance, error) {
+	var checkin Attendance
+
+	err := Database.
+		Where("user_id = ? AND event_id = ?", userId, eventId).
+		First(&checkin).Error
+
+	if err != nil {
+		if err == gorm.ErrRecordNotFound {
+			return nil, nil
+		}
+		return nil, err
+	}
+
+	return &checkin, err
+}
+
+type AttendanceUsers struct {
+	UserId    uuid.UUID `json:"user_id"`
+	Role      string    `json:"role"`
+	CheckinAt time.Time `json:"checkin_at"`
+}
+
+func (self *Attendance) GetUsersByEventID(eventID uuid.UUID) (*[]AttendanceUsers, error) {
+	var result []AttendanceUsers
+
+	err := Database.
+		Model(&Attendance{}).
+		Select("user_id, checkin_at").
+		Where("event_id = ?", eventID).
+		Order("checkin_at ASC").
+		Scan(&result).Error
+
+	return &result, err
+}
+
+type AttendanceEvent struct {
+	EventId   uuid.UUID `json:"event_id"`
+	CheckinAt time.Time `json:"checkin_at"`
+}
+
+func (self *Attendance) GetEventsByUserID(userID uuid.UUID) (*[]AttendanceEvent, error) {
+	var result []AttendanceEvent
+
+	err := Database.
+		Model(&Attendance{}).
+		Select("event_id, checkin_at").
+		Where("user_id = ?", userID).
+		Order("checkin_at ASC").
+		Scan(&result).Error
+
+	return &result, err
+}
+
+func (self *Attendance) Create() error {
+	self.UUID = uuid.New()
+	self.AttendanceId = uuid.New()
+
+	// DB transaction for strong consistency
+	err := Database.Transaction(func(tx *gorm.DB) error {
+		if err := tx.Create(&self).Error; err != nil {
+			return err
+		}
+		return nil
+	})
+	if err != nil {
+		return err
+	}
+
+	if err := self.UpdateSearchIndex(); err != nil {
+		return err
+	}
+
+	return nil
+}
+
+func (self *Attendance) Update(attendanceId uuid.UUID, checkinTime *time.Time) (*Attendance, error) {
+	var attendance Attendance
+
+	err := Database.Transaction(func(tx *gorm.DB) error {
+		// Lock the row for update
+		if err := tx.
+			Where("attendance_id = ?", attendanceId).
+			First(&attendance).Error; err != nil {
+			return err
+		}
+
+		updates := map[string]any{}
+
+		if checkinTime != nil {
+			updates["checkin_at"] = *checkinTime
+		}
+
+		if len(updates) == 0 {
+			return nil
+		}
+
+		if err := tx.
+			Model(&attendance).
+			Updates(updates).Error; err != nil {
+			return err
+		}
+
+		// Reload to ensure struct is up to date
+		return tx.
+			Where("attendance_id = ?", attendanceId).
+			First(&attendance).Error
+	})
+
+	if err != nil {
+		return nil, err
+	}
+
+	// Sync to MeiliSearch (eventual consistency)
+	if err := attendance.UpdateSearchIndex(); err != nil {
+		return nil, err
+	}
+
+	return &attendance, nil
+}
+
+func (self *Attendance) SearchUsersByEvent(eventID string) (*meilisearch.SearchResponse, error) {
+	index := MeiliSearch.Index("attendance")
+
+	return index.Search("", &meilisearch.SearchRequest{
+		Filter: "event_id = \"" + eventID + "\"",
+		Sort:   []string{"checkin_at:asc"},
+	})
+}
+
+func (self *Attendance) SearchEventsByUser(userID string) (*meilisearch.SearchResponse, error) {
+	index := MeiliSearch.Index("attendance")
+
+	return index.Search("", &meilisearch.SearchRequest{
+		Filter: "user_id = \"" + userID + "\"",
+		Sort:   []string{"checkin_at:asc"},
+	})
+}
+
+func (self *Attendance) UpdateSearchIndex() error {
+	doc := AttendanceSearchDoc{
+		AttendanceId: self.AttendanceId.String(),
+		EventId:      self.EventId.String(),
+		UserId:       self.UserId.String(),
+		CheckinAt:    self.CheckinAt,
+	}
+
+	index := MeiliSearch.Index("attendance")
+
+	primaryKey := "attendance_id"
+	opts := &meilisearch.DocumentOptions{
+		PrimaryKey: &primaryKey,
+	}
+
+	if _, err := index.UpdateDocuments([]AttendanceSearchDoc{doc}, opts); err != nil {
+		return err
+	}
+
+	return nil
+}
+
+func (self *Attendance) DeleteSearchIndex() error {
+	index := MeiliSearch.Index("attendance")
+	_, err := index.DeleteDocument(self.AttendanceId.String(), nil)
+	return err
+}
+
+func (self *Attendance) GenCheckinCode(eventId uuid.UUID) (*string, error) {
+	ctx := context.Background()
+	ttl := viper.GetDuration("ttl.checkin_code_ttl")
+	rng := rand.New(rand.NewSource(time.Now().UnixNano()))
+
+	for {
+		code := fmt.Sprintf("%06d", rng.Intn(900000)+100000)
+		ok, err := Redis.SetNX(
+			ctx,
+			"checkin_code:"+code,
+			"user_id:"+self.UserId.String()+":event_id:"+eventId.String(),
+			ttl,
+		).Result()
+		if err != nil {
+			return nil, err
+		}
+		if ok {
+			return &code, nil
+		}
+	}
+}
+
+func (self *Attendance) VerifyCheckinCode(checkinCode string) error {
+	ctx := context.Background()
+
+	val, err := Redis.Get(ctx, "checkin_code:"+checkinCode).Result()
+	if err != nil {
+		return errors.New("invalid or expired checkin code")
+	}
+
+	// Expected format: user_id:<uuid>:event_id:<uuid>
+	parts := strings.Split(val, ":")
+	if len(parts) != 4 {
+		return errors.New("invalid checkin code format")
+	}
+
+	userIdStr := parts[1]
+	eventIdStr := parts[3]
+
+	userId, err := uuid.Parse(userIdStr)
+	if err != nil {
+		return err
+	}
+
+	eventId, err := uuid.Parse(eventIdStr)
+	if err != nil {
+		return err
+	}
+
+	attendanceData, err := self.GetAttendance(userId, eventId)
+	if err != nil {
+		return err
+	}
+
+	time := time.Now()
+	_, err = self.Update(attendanceData.AttendanceId, &time)
+	if err != nil {
+		return err
+	}
+
+	return nil
+}
--- a/data/client.go
+++ b/data/client.go
@@ -0,0 +1,91 @@
+package data
+
+import (
+	"crypto/rand"
+	"encoding/base64"
+	"encoding/json"
+	"errors"
+	"nixcn-cms/internal/cryptography"
+	"strings"
+
+	"github.com/google/uuid"
+	"github.com/spf13/viper"
+	"gorm.io/datatypes"
+)
+
+type Client struct {
+	Id           uint           `json:"id" gorm:"primaryKey;autoIncrement"`
+	UUID         uuid.UUID      `json:"uuid" gorm:"type:uuid;uniqueIndex;not null"`
+	ClientId     string         `json:"client_id" gorm:"type:varchar(255);uniqueIndex;not null"`
+	ClientSecret string         `json:"client_secret" gorm:"type:varchar(255);not null"`
+	ClientName   string         `json:"client_name" gorm:"type:varchar(255);uniqueIndex;not null"`
+	RedirectUri  datatypes.JSON `json:"redirect_uri" gorm:"type:json;not null"`
+}
+
+func (self *Client) GetClientByClientId(clientId string) (*Client, error) {
+	var client Client
+	if err := Database.
+		Where("client_id = ?", clientId).
+		First(&client).Error; err != nil {
+		return nil, err
+	}
+	return &client, nil
+}
+
+func (self *Client) GetDecryptedSecret() (string, error) {
+	secretKey := viper.GetString("secrets.client_secret_key")
+	secret, err := cryptography.AESCBCDecrypt(self.ClientSecret, []byte(secretKey))
+	return string(secret), err
+}
+
+type ClientParams struct {
+	ClientId    string
+	ClientName  string
+	RedirectUri []string
+}
+
+func (self *Client) Create(params *ClientParams) (*Client, error) {
+	jsonRedirectUri, err := json.Marshal(params.RedirectUri)
+	if err != nil {
+		return nil, err
+	}
+
+	encKey := viper.GetString("secrets.client_secret_key")
+	b := make([]byte, 32)
+	if _, err := rand.Read(b); err != nil {
+		return nil, err
+	}
+	clientSecret := base64.RawURLEncoding.EncodeToString(b)
+	encryptedSecret, err := cryptography.AESCBCEncrypt([]byte(clientSecret), []byte(encKey))
+	if err != nil {
+		return nil, err
+	}
+
+	client := &Client{
+		UUID:         uuid.New(),
+		ClientId:     params.ClientId,
+		ClientSecret: encryptedSecret,
+		ClientName:   params.ClientName,
+		RedirectUri:  jsonRedirectUri,
+	}
+
+	if err := Database.Create(&client).Error; err != nil {
+		return nil, err
+	}
+
+	return client, nil
+}
+
+func (self *Client) ValidateRedirectURI(redirectURI string) error {
+	var uris []string
+	if err := json.Unmarshal(self.RedirectUri, &uris); err != nil {
+		return err
+	}
+
+	for _, prefix := range uris {
+		if strings.HasPrefix(redirectURI, prefix) {
+			return nil
+		}
+	}
+	return errors.New("redirect uri not match")
+}
--- a/data/data.go
+++ b/data/data.go
@@ -0,0 +1,66 @@
+package data
+
+import (
+	"nixcn-cms/data/drivers"
+
+	"github.com/meilisearch/meilisearch-go"
+	"github.com/redis/go-redis/v9"
+	log "github.com/sirupsen/logrus"
+	"github.com/spf13/viper"
+	"gorm.io/gorm"
+)
+
+var Database *gorm.DB
+var Redis redis.UniversalClient
+var MeiliSearch meilisearch.ServiceManager
+
+func Init() {
+	// Init database
+	dbType := viper.GetString("database.type")
+	exDSN := drivers.ExternalDSN{
+		Host:     viper.GetString("database.host"),
+		Name:     viper.GetString("database.name"),
+		Username: viper.GetString("database.username"),
+		Password: viper.GetString("database.password"),
+	}
+
+	if dbType != "postgres" {
+		log.Fatal("[Database] Only support postgras db!")
+	}
+
+	// Conect to db
+	db, err := drivers.Postgres(exDSN)
+	if err != nil {
+		log.Fatal("[Database] Error connecting to db!")
+	}
+
+	// Auto migrate
+	err = db.AutoMigrate(&User{}, &Event{}, &Attendance{}, &Client{})
+	if err != nil {
+		log.Error("[Database] Error migrating database: ", err)
+	}
+	Database = db
+
+	// Init redis conection
+	rdbAddress := viper.GetStringSlice("cache.hosts")
+	rDSN := drivers.RedisDSN{
+		Hosts:    rdbAddress,
+		Master:   viper.GetString("cache.master"),
+		Username: viper.GetString("cache.username"),
+		Password: viper.GetString("cache.password"),
+		DB:       viper.GetInt("cache.db"),
+	}
+	rdb, err := drivers.Redis(rDSN)
+	if err != nil {
+		log.Fatal("[Redis] Error connecting to Redis: ", err)
+	}
+	Redis = rdb
+
+	// Init meilisearch
+	mDSN := drivers.MeiliDSN{
+		Host:   viper.GetString("search.host"),
+		ApiKey: viper.GetString("search.api_key"),
+	}
+	mdb := drivers.MeiliSearch(mDSN)
+	MeiliSearch = mdb
+}
--- a/data/drivers/meilisearch.go
+++ b/data/drivers/meilisearch.go
@@ -0,0 +1,13 @@
+package drivers
+
+import "github.com/meilisearch/meilisearch-go"
+
+func MeiliSearch(dsn MeiliDSN) meilisearch.ServiceManager {
+	return meilisearch.New(dsn.Host,
+		meilisearch.WithAPIKey(dsn.ApiKey),
+		meilisearch.WithContentEncoding(
+			meilisearch.GzipEncoding,
+			meilisearch.BestCompression,
+		),
+	)
+}
--- a/data/drivers/postgres.go
+++ b/data/drivers/postgres.go
@@ -0,0 +1,24 @@
+package drivers
+
+import (
+	"nixcn-cms/config"
+	"strings"
+
+	"gorm.io/driver/postgres"
+	"gorm.io/gorm"
+)
+
+func SplitHostPort(url string) (host, port string) {
+	if !strings.Contains(url, ":") {
+		return url, "5432"
+	}
+	split := strings.Split(url, ":")
+	return split[0], split[1]
+}
+
+func Postgres(dsn ExternalDSN) (*gorm.DB, error) {
+	host, port := SplitHostPort(dsn.Host)
+	conn := "host=" + host + " user=" + dsn.Username + " password=" + dsn.Password + " dbname=" + dsn.Name + " port=" + port + " sslmode=disable TimeZone=" + config.TZ()
+	db, err := gorm.Open(postgres.Open(conn), &gorm.Config{})
+	return db, err
+}
--- a/data/drivers/redis.go
+++ b/data/drivers/redis.go
@@ -0,0 +1,22 @@
+package drivers
+
+import (
+	"context"
+
+	"github.com/redis/go-redis/v9"
+)
+
+func Redis(dsn RedisDSN) (redis.UniversalClient, error) {
+	// Connect to Redis
+	rdb := redis.NewUniversalClient(&redis.UniversalOptions{
+		Addrs:      dsn.Hosts,
+		MasterName: dsn.Master,
+		Username:   dsn.Username,
+		Password:   dsn.Password,
+		DB:         dsn.DB,
+	})
+	ctx := context.Background()
+	// Ping Redis
+	_, err := rdb.Ping(ctx).Result()
+	return rdb, err
+}
--- a/data/drivers/types.go
+++ b/data/drivers/types.go
@@ -0,0 +1,21 @@
+package drivers
+
+type ExternalDSN struct {
+	Host     string
+	Name     string
+	Username string
+	Password string
+}
+
+type RedisDSN struct {
+	Hosts    []string
+	Master   string
+	Username string
+	Password string
+	DB       int
+}
+
+type MeiliDSN struct {
+	Host   string
+	ApiKey string
+}
--- a/data/event.go
+++ b/data/event.go
@@ -0,0 +1,150 @@
+package data
+
+import (
+	"time"
+
+	"github.com/go-viper/mapstructure/v2"
+	"github.com/google/uuid"
+	"github.com/meilisearch/meilisearch-go"
+	"gorm.io/gorm"
+)
+
+type Event struct {
+	Id        uint      `json:"id" gorm:"primarykey;autoincrement"`
+	UUID      uuid.UUID `json:"uuid" gorm:"type:uuid;uniqueIndex;not null"`
+	EventId   uuid.UUID `json:"event_id" gorm:"type:uuid;uniqueIndex;not null"`
+	Name      string    `json:"name" gorm:"type:varchar(255);index;not null"`
+	Type      string    `json:"type" gotm:"type:varchar(255);index;not null"`
+	StartTime time.Time `json:"start_time" gorm:"index"`
+	EndTime   time.Time `json:"end_time" gorm:"index"`
+}
+
+type EventSearchDoc struct {
+	EventId   string    `json:"event_id"`
+	Name      string    `json:"name"`
+	StartTime time.Time `json:"start_time"`
+	EndTime   time.Time `json:"end_time"`
+}
+
+func (self *Event) GetEventById(eventId uuid.UUID) (*Event, error) {
+	var event Event
+
+	err := Database.
+		Where("event_id = ?", eventId).
+		First(&event).Error
+
+	if err != nil {
+		if err == gorm.ErrRecordNotFound {
+			return nil, nil
+		}
+		return nil, err
+	}
+
+	return &event, nil
+}
+
+func (self *Event) UpdateEventById(eventId uuid.UUID) error {
+	// DB transaction
+	if err := Database.Transaction(func(tx *gorm.DB) error {
+		// Update by business key
+		if err := tx.
+			Model(&Event{}).
+			Where("event_id = ?", eventId).
+			Updates(self).Error; err != nil {
+			return err
+		}
+
+		// Reload to ensure struct is fresh
+		return tx.
+			Where("event_id = ?", eventId).
+			First(self).Error
+	}); err != nil {
+		return err
+	}
+
+	// Sync search index
+	if err := self.UpdateSearchIndex(); err != nil {
+		return err
+	}
+
+	return nil
+}
+
+func (self *Event) Create() error {
+	self.UUID = uuid.New()
+	self.EventId = uuid.New()
+
+	// DB transaction only
+	if err := Database.Transaction(func(tx *gorm.DB) error {
+		if err := tx.Create(self).Error; err != nil {
+			return err
+		}
+		return nil
+	}); err != nil {
+		return err
+	}
+
+	// Search index (eventual consistency)
+	if err := self.UpdateSearchIndex(); err != nil {
+		// TODO: async retry / log
+		return err
+	}
+
+	return nil
+}
+
+func (self *Event) GetFullTable() (*[]Event, error) {
+	var events []Event
+	err := Database.Find(&events).Error
+	if err != nil {
+		return nil, err
+	}
+	return &events, err
+}
+
+func (self *Event) FastListEvents(limit, offset int64) (*[]EventSearchDoc, error) {
+	index := MeiliSearch.Index("event")
+
+	// Fast read from MeiliSearch (no DB involved)
+	result, err := index.Search("", &meilisearch.SearchRequest{
+		Limit:  limit,
+		Offset: offset,
+	})
+	if err != nil {
+		return nil, err
+	}
+
+	var list []EventSearchDoc
+	if err := mapstructure.Decode(result.Hits, &list); err != nil {
+		return nil, err
+	}
+
+	return &list, nil
+}
+
+func (self *Event) UpdateSearchIndex() error {
+	doc := EventSearchDoc{
+		EventId:   self.EventId.String(),
+		Name:      self.Name,
+		StartTime: self.StartTime,
+		EndTime:   self.EndTime,
+	}
+	index := MeiliSearch.Index("event")
+
+	primaryKey := "event_id"
+	opts := &meilisearch.DocumentOptions{
+		PrimaryKey: &primaryKey,
+	}
+
+	if _, err := index.UpdateDocuments([]EventSearchDoc{doc}, opts); err != nil {
+		return err
+	}
+
+	return nil
+}
+
+func (self *Event) DeleteSearchIndex() error {
+	index := MeiliSearch.Index("event")
+	_, err := index.DeleteDocument(self.EventId.String(), nil)
+	return err
+}
--- a/data/user.go
+++ b/data/user.go
@@ -0,0 +1,163 @@
+package data
+
+import (
+	"github.com/go-viper/mapstructure/v2"
+	"github.com/google/uuid"
+	"github.com/meilisearch/meilisearch-go"
+	"gorm.io/gorm"
+)
+
+// Permission Level
+// Banned User: 0
+// Normal User: 10
+// Admin User: 20
+// Super User: 30
+
+type User struct {
+	Id              uint      `json:"id" gorm:"primarykey;autoincrement"`
+	UUID            uuid.UUID `json:"uuid" gorm:"type:uuid;uniqueindex;not null"`
+	UserId          uuid.UUID `json:"user_id" gorm:"type:uuid;uniqueindex;not null"`
+	Email           string    `json:"email" gorm:"type:varchar(255);uniqueindex;not null"`
+	Nickname        string    `json:"nickname"`
+	Subtitle        string    `json:"subtitle"`
+	Avatar          string    `json:"avatar"`
+	Bio             string    `json:"bio" gorm:"type:text"`
+	PermissionLevel uint      `json:"permission_level" gorm:"default:10;not null"`
+}
+
+type UserSearchDoc struct {
+	UserId          string `json:"user_id"`
+	Email           string `json:"email"`
+	Type            string `json:"type"`
+	Nickname        string `json:"nickname"`
+	Subtitle        string `json:"subtitle"`
+	Avatar          string `json:"avatar"`
+	PermissionLevel uint   `json:"permission_level"`
+}
+
+func (self *User) GetByEmail(email string) (*User, error) {
+	var user User
+
+	err := Database.
+		Where("email = ?", email).
+		First(&user).Error
+
+	if err != nil {
+		if err == gorm.ErrRecordNotFound {
+			return nil, nil
+		}
+		return nil, err
+	}
+
+	return &user, nil
+}
+
+func (self *User) GetByUserId(userId uuid.UUID) (*User, error) {
+	var user User
+
+	err := Database.
+		Where("user_id = ?", userId).
+		First(&user).Error
+
+	if err != nil {
+		if err == gorm.ErrRecordNotFound {
+			return nil, nil
+		}
+		return nil, err
+	}
+
+	return &user, err
+}
+
+func (self *User) Create() error {
+	self.UUID = uuid.New()
+	self.UserId = uuid.New()
+
+	// DB transaction only
+	if err := Database.Transaction(func(tx *gorm.DB) error {
+		if err := tx.Create(self).Error; err != nil {
+			return err
+		}
+		return nil
+	}); err != nil {
+		return err
+	}
+
+	// Search index (eventual consistency)
+	if err := self.UpdateSearchIndex(); err != nil {
+		// TODO: async retry / log
+		return err
+	}
+
+	return nil
+}
+
+func (self *User) UpdateByUserID(userId uuid.UUID) error {
+	return Database.Transaction(func(tx *gorm.DB) error {
+		if err := tx.Model(&User{}).Where("user_id = ?", userId).Updates(&self).Error; err != nil {
+			return err
+		}
+		return nil
+	})
+}
+
+func (self *User) GetFullTable() (*[]User, error) {
+	var users []User
+	err := Database.Find(&users).Error
+	if err != nil {
+		return nil, err
+	}
+	return &users, nil
+}
+
+func (self *User) FastListUsers(limit, offset int64) (*[]UserSearchDoc, error) {
+	index := MeiliSearch.Index("user")
+
+	// Fast read from MeiliSearch, no DB involved
+	result, err := index.Search("", &meilisearch.SearchRequest{
+		Limit:  limit,
+		Offset: offset,
+	})
+	if err != nil {
+		return nil, err
+	}
+
+	var list []UserSearchDoc
+	if err := mapstructure.Decode(result.Hits, &list); err != nil {
+		return nil, err
+	}
+
+	return &list, nil
+}
+
+func (self *User) UpdateSearchIndex() error {
+	doc := UserSearchDoc{
+		UserId:          self.UserId.String(),
+		Email:           self.Email,
+		Nickname:        self.Nickname,
+		Subtitle:        self.Subtitle,
+		Avatar:          self.Avatar,
+		PermissionLevel: self.PermissionLevel,
+	}
+	index := MeiliSearch.Index("user")
+
+	primaryKey := "user_id"
+	opts := &meilisearch.DocumentOptions{
+		PrimaryKey: &primaryKey,
+	}
+
+	if _, err := index.UpdateDocuments(
+		[]UserSearchDoc{doc},
+		opts,
+	); err != nil {
+		return err
+	}
+
+	return nil
+}
+
+func (self *User) DeleteSearchIndex() error {
+	index := MeiliSearch.Index("user")
+	_, err := index.DeleteDocument(self.UserId.String(), nil)
+	return err
+}
--- a/devenv.lock
+++ b/devenv.lock
@@ -0,0 +1,214 @@
+{
+  "nodes": {
+    "devenv": {
+      "locked": {
+        "dir": "src/modules",
+        "lastModified": 1766087669,
+        "owner": "cachix",
+        "repo": "devenv",
+        "rev": "c03eed645ea94da7afbee29da76436b7ce33a5cb",
+        "type": "github"
+      },
+      "original": {
+        "dir": "src/modules",
+        "owner": "cachix",
+        "repo": "devenv",
+        "type": "github"
+      }
+    },
+    "flake-compat": {
+      "flake": false,
+      "locked": {
+        "lastModified": 1765121682,
+        "owner": "edolstra",
+        "repo": "flake-compat",
+        "rev": "65f23138d8d09a92e30f1e5c87611b23ef451bf3",
+        "type": "github"
+      },
+      "original": {
+        "owner": "edolstra",
+        "repo": "flake-compat",
+        "type": "github"
+      }
+    },
+    "flake-compat_2": {
+      "flake": false,
+      "locked": {
+        "lastModified": 1765121682,
+        "owner": "edolstra",
+        "repo": "flake-compat",
+        "rev": "65f23138d8d09a92e30f1e5c87611b23ef451bf3",
+        "type": "github"
+      },
+      "original": {
+        "owner": "edolstra",
+        "repo": "flake-compat",
+        "type": "github"
+      }
+    },
+    "flake-utils": {
+      "inputs": {
+        "systems": "systems"
+      },
+      "locked": {
+        "lastModified": 1731533236,
+        "owner": "numtide",
+        "repo": "flake-utils",
+        "rev": "11707dc2f618dd54ca8739b309ec4fc024de578b",
+        "type": "github"
+      },
+      "original": {
+        "owner": "numtide",
+        "repo": "flake-utils",
+        "type": "github"
+      }
+    },
+    "git-hooks": {
+      "inputs": {
+        "flake-compat": "flake-compat",
+        "gitignore": "gitignore",
+        "nixpkgs": [
+          "nixpkgs"
+        ]
+      },
+      "locked": {
+        "lastModified": 1765911976,
+        "owner": "cachix",
+        "repo": "git-hooks.nix",
+        "rev": "b68b780b69702a090c8bb1b973bab13756cc7a27",
+        "type": "github"
+      },
+      "original": {
+        "owner": "cachix",
+        "repo": "git-hooks.nix",
+        "type": "github"
+      }
+    },
+    "git-hooks_2": {
+      "inputs": {
+        "flake-compat": "flake-compat_2",
+        "gitignore": "gitignore_2",
+        "nixpkgs": [
+          "go-overlay",
+          "nixpkgs"
+        ]
+      },
+      "locked": {
+        "lastModified": 1765911976,
+        "owner": "cachix",
+        "repo": "git-hooks.nix",
+        "rev": "b68b780b69702a090c8bb1b973bab13756cc7a27",
+        "type": "github"
+      },
+      "original": {
+        "owner": "cachix",
+        "repo": "git-hooks.nix",
+        "type": "github"
+      }
+    },
+    "gitignore": {
+      "inputs": {
+        "nixpkgs": [
+          "git-hooks",
+          "nixpkgs"
+        ]
+      },
+      "locked": {
+        "lastModified": 1762808025,
+        "owner": "hercules-ci",
+        "repo": "gitignore.nix",
+        "rev": "cb5e3fdca1de58ccbc3ef53de65bd372b48f567c",
+        "type": "github"
+      },
+      "original": {
+        "owner": "hercules-ci",
+        "repo": "gitignore.nix",
+        "type": "github"
+      }
+    },
+    "gitignore_2": {
+      "inputs": {
+        "nixpkgs": [
+          "go-overlay",
+          "git-hooks",
+          "nixpkgs"
+        ]
+      },
+      "locked": {
+        "lastModified": 1762808025,
+        "owner": "hercules-ci",
+        "repo": "gitignore.nix",
+        "rev": "cb5e3fdca1de58ccbc3ef53de65bd372b48f567c",
+        "type": "github"
+      },
+      "original": {
+        "owner": "hercules-ci",
+        "repo": "gitignore.nix",
+        "type": "github"
+      }
+    },
+    "go-overlay": {
+      "inputs": {
+        "flake-utils": "flake-utils",
+        "git-hooks": "git-hooks_2",
+        "nixpkgs": [
+          "nixpkgs"
+        ]
+      },
+      "locked": {
+        "lastModified": 1766126609,
+        "owner": "purpleclay",
+        "repo": "go-overlay",
+        "rev": "959f32b00fd3d462d4d570bd118b4be03c3f2019",
+        "type": "github"
+      },
+      "original": {
+        "owner": "purpleclay",
+        "repo": "go-overlay",
+        "type": "github"
+      }
+    },
+    "nixpkgs": {
+      "locked": {
+        "lastModified": 1764580874,
+        "owner": "cachix",
+        "repo": "devenv-nixpkgs",
+        "rev": "dcf61356c3ab25f1362b4a4428a6d871e84f1d1d",
+        "type": "github"
+      },
+      "original": {
+        "owner": "cachix",
+        "ref": "rolling",
+        "repo": "devenv-nixpkgs",
+        "type": "github"
+      }
+    },
+    "root": {
+      "inputs": {
+        "devenv": "devenv",
+        "git-hooks": "git-hooks",
+        "go-overlay": "go-overlay",
+        "nixpkgs": "nixpkgs",
+        "pre-commit-hooks": [
+          "git-hooks"
+        ]
+      }
+    },
+    "systems": {
+      "locked": {
+        "lastModified": 1681028828,
+        "owner": "nix-systems",
+        "repo": "default",
+        "rev": "da67096a3b9bf56a91d16901293e51ba5b49a27e",
+        "type": "github"
+      },
+      "original": {
+        "owner": "nix-systems",
+        "repo": "default",
+        "type": "github"
+      }
+    }
+  },
+  "root": "root",
+  "version": 7
+}
--- a/devenv.nix
+++ b/devenv.nix
@@ -0,0 +1,73 @@
+{ pkgs, config, ... }:
+
+{
+  process.managers.process-compose = {
+    settings.log_level = "info";
+  };
+
+  packages = [
+    pkgs.git
+    pkgs.just
+    pkgs.watchexec
+  ];
+
+  dotenv = {
+    enable = true;
+    filename = [
+      ".env.production"
+      ".env.development"
+    ];
+  };
+
+  languages = {
+    go = {
+      enable = true;
+      version = "1.25.5";
+    };
+    javascript.enable = true;
+    javascript.bun.enable = true;
+  };
+
+  processes = {
+    vite = {
+      exec = "bun run dev";
+      cwd = "./client";
+    };
+    backend.exec = "just dev-back";
+  };
+
+  services = {
+    caddy = {
+      enable = true;
+      dataDir = "${config.env.DEVENV_STATE}/caddy";
+      config = ''
+        :8080 {
+          handle /api/* {
+            reverse_proxy 127.0.0.1:8000
+          }
+          handle {
+            reverse_proxy 127.0.0.1:5173
+          }
+         }
+      '';
+    };
+    redis = {
+      enable = true;
+    };
+    postgres = {
+      enable = true;
+      createDatabase = true;
+      listen_addresses = "127.0.0.1";
+      initialDatabases = [
+        {
+          name = "postgres";
+          user = "postgres";
+          pass = "postgres";
+        }
+      ];
+    };
+    meilisearch = {
+      enable = true;
+    };
+  };
+}
--- a/devenv.yaml
+++ b/devenv.yaml
@@ -0,0 +1,8 @@
+inputs:
+  go-overlay:
+    url: github:purpleclay/go-overlay
+    inputs:
+      nixpkgs:
+        follows: nixpkgs
+  nixpkgs:
+    url: github:cachix/devenv-nixpkgs/rolling
--- a/go.mod
+++ b/go.mod
@@ -0,0 +1,73 @@
+module nixcn-cms
+
+go 1.25.5
+
+require (
+	filippo.io/edwards25519 v1.1.0 // indirect
+	github.com/andybalholm/brotli v1.1.1 // indirect
+	github.com/bytedance/gopkg v0.1.3 // indirect
+	github.com/bytedance/sonic v1.14.2 // indirect
+	github.com/bytedance/sonic/loader v0.4.0 // indirect
+	github.com/cespare/xxhash/v2 v2.3.0 // indirect
+	github.com/cloudwego/base64x v0.1.6 // indirect
+	github.com/dgryski/go-rendezvous v0.0.0-20200823014737-9f7001d12a5f // indirect
+	github.com/fsnotify/fsnotify v1.9.0 // indirect
+	github.com/gabriel-vasile/mimetype v1.4.12 // indirect
+	github.com/gin-contrib/sse v1.1.0 // indirect
+	github.com/gin-gonic/gin v1.11.0 // indirect
+	github.com/go-playground/locales v0.14.1 // indirect
+	github.com/go-playground/universal-translator v0.18.1 // indirect
+	github.com/go-playground/validator/v10 v10.29.0 // indirect
+	github.com/go-sql-driver/mysql v1.8.1 // indirect
+	github.com/go-viper/mapstructure/v2 v2.4.0 // indirect
+	github.com/goccy/go-json v0.10.5 // indirect
+	github.com/goccy/go-yaml v1.19.1 // indirect
+	github.com/golang-jwt/jwt/v4 v4.5.2 // indirect
+	github.com/golang-jwt/jwt/v5 v5.3.0 // indirect
+	github.com/google/uuid v1.6.0 // indirect
+	github.com/jackc/pgpassfile v1.0.0 // indirect
+	github.com/jackc/pgservicefile v0.0.0-20240606120523-5a60cdf6a761 // indirect
+	github.com/jackc/pgx/v5 v5.6.0 // indirect
+	github.com/jackc/puddle/v2 v2.2.2 // indirect
+	github.com/jinzhu/inflection v1.0.0 // indirect
+	github.com/jinzhu/now v1.1.5 // indirect
+	github.com/joho/godotenv v1.5.1 // indirect
+	github.com/json-iterator/go v1.1.12 // indirect
+	github.com/klauspost/cpuid/v2 v2.3.0 // indirect
+	github.com/leodido/go-urn v1.4.0 // indirect
+	github.com/mattn/go-isatty v0.0.20 // indirect
+	github.com/meilisearch/meilisearch-go v0.35.0 // indirect
+	github.com/modern-go/concurrent v0.0.0-20180306012644-bacd9c7ef1dd // indirect
+	github.com/modern-go/reflect2 v1.0.2 // indirect
+	github.com/pelletier/go-toml/v2 v2.2.4 // indirect
+	github.com/quic-go/qpack v0.6.0 // indirect
+	github.com/quic-go/quic-go v0.57.1 // indirect
+	github.com/redis/go-redis/v9 v9.17.2 // indirect
+	github.com/sagikazarmark/locafero v0.11.0 // indirect
+	github.com/sirupsen/logrus v1.9.3 // indirect
+	github.com/sourcegraph/conc v0.3.1-0.20240121214520-5f936abd7ae8 // indirect
+	github.com/spf13/afero v1.15.0 // indirect
+	github.com/spf13/cast v1.10.0 // indirect
+	github.com/spf13/pflag v1.0.10 // indirect
+	github.com/spf13/viper v1.21.0 // indirect
+	github.com/subosito/gotenv v1.6.0 // indirect
+	github.com/twitchyliquid64/golang-asm v0.15.1 // indirect
+	github.com/ugorji/go/codec v1.3.1 // indirect
+	go.uber.org/mock v0.6.0 // indirect
+	go.yaml.in/yaml/v3 v3.0.4 // indirect
+	golang.org/x/arch v0.23.0 // indirect
+	golang.org/x/crypto v0.46.0 // indirect
+	golang.org/x/mod v0.31.0 // indirect
+	golang.org/x/net v0.48.0 // indirect
+	golang.org/x/sync v0.19.0 // indirect
+	golang.org/x/sys v0.39.0 // indirect
+	golang.org/x/text v0.32.0 // indirect
+	golang.org/x/tools v0.40.0 // indirect
+	google.golang.org/protobuf v1.36.11 // indirect
+	gopkg.in/alexcesaro/quotedprintable.v3 v3.0.0-20150716171945-2caba252f4dc // indirect
+	gopkg.in/gomail.v2 v2.0.0-20160411212932-81ebce5c23df // indirect
+	gorm.io/datatypes v1.2.7 // indirect
+	gorm.io/driver/mysql v1.5.6 // indirect
+	gorm.io/driver/postgres v1.6.0 // indirect
+	gorm.io/gorm v1.31.1 // indirect
+)
--- a/go.sum
+++ b/go.sum
@@ -0,0 +1,157 @@
+filippo.io/edwards25519 v1.1.0 h1:FNf4tywRC1HmFuKW5xopWpigGjJKiJSV0Cqo0cJWDaA=
+filippo.io/edwards25519 v1.1.0/go.mod h1:BxyFTGdWcka3PhytdK4V28tE5sGfRvvvRV7EaN4VDT4=
+github.com/andybalholm/brotli v1.1.1 h1:PR2pgnyFznKEugtsUo0xLdDop5SKXd5Qf5ysW+7XdTA=
+github.com/andybalholm/brotli v1.1.1/go.mod h1:05ib4cKhjx3OQYUY22hTVd34Bc8upXjOLL2rKwwZBoA=
+github.com/bytedance/gopkg v0.1.3 h1:TPBSwH8RsouGCBcMBktLt1AymVo2TVsBVCY4b6TnZ/M=
+github.com/bytedance/gopkg v0.1.3/go.mod h1:576VvJ+eJgyCzdjS+c4+77QF3p7ubbtiKARP3TxducM=
+github.com/bytedance/sonic v1.14.2 h1:k1twIoe97C1DtYUo+fZQy865IuHia4PR5RPiuGPPIIE=
+github.com/bytedance/sonic v1.14.2/go.mod h1:T80iDELeHiHKSc0C9tubFygiuXoGzrkjKzX2quAx980=
+github.com/bytedance/sonic/loader v0.4.0 h1:olZ7lEqcxtZygCK9EKYKADnpQoYkRQxaeY2NYzevs+o=
+github.com/bytedance/sonic/loader v0.4.0/go.mod h1:AR4NYCk5DdzZizZ5djGqQ92eEhCCcdf5x77udYiSJRo=
+github.com/cespare/xxhash/v2 v2.3.0 h1:UL815xU9SqsFlibzuggzjXhog7bL6oX9BbNZnL2UFvs=
+github.com/cespare/xxhash/v2 v2.3.0/go.mod h1:VGX0DQ3Q6kWi7AoAeZDth3/j3BFtOZR5XLFGgcrjCOs=
+github.com/cloudwego/base64x v0.1.6 h1:t11wG9AECkCDk5fMSoxmufanudBtJ+/HemLstXDLI2M=
+github.com/cloudwego/base64x v0.1.6/go.mod h1:OFcloc187FXDaYHvrNIjxSe8ncn0OOM8gEHfghB2IPU=
+github.com/davecgh/go-spew v1.1.0/go.mod h1:J7Y8YcW2NihsgmVo/mv3lAwl/skON4iLHjSsI+c5H38=
+github.com/davecgh/go-spew v1.1.1/go.mod h1:J7Y8YcW2NihsgmVo/mv3lAwl/skON4iLHjSsI+c5H38=
+github.com/dgryski/go-rendezvous v0.0.0-20200823014737-9f7001d12a5f h1:lO4WD4F/rVNCu3HqELle0jiPLLBs70cWOduZpkS1E78=
+github.com/dgryski/go-rendezvous v0.0.0-20200823014737-9f7001d12a5f/go.mod h1:cuUVRXasLTGF7a8hSLbxyZXjz+1KgoB3wDUb6vlszIc=
+github.com/fsnotify/fsnotify v1.9.0 h1:2Ml+OJNzbYCTzsxtv8vKSFD9PbJjmhYF14k/jKC7S9k=
+github.com/fsnotify/fsnotify v1.9.0/go.mod h1:8jBTzvmWwFyi3Pb8djgCCO5IBqzKJ/Jwo8TRcHyHii0=
+github.com/gabriel-vasile/mimetype v1.4.12 h1:e9hWvmLYvtp846tLHam2o++qitpguFiYCKbn0w9jyqw=
+github.com/gabriel-vasile/mimetype v1.4.12/go.mod h1:d+9Oxyo1wTzWdyVUPMmXFvp4F9tea18J8ufA774AB3s=
+github.com/gin-contrib/sse v1.1.0 h1:n0w2GMuUpWDVp7qSpvze6fAu9iRxJY4Hmj6AmBOU05w=
+github.com/gin-contrib/sse v1.1.0/go.mod h1:hxRZ5gVpWMT7Z0B0gSNYqqsSCNIJMjzvm6fqCz9vjwM=
+github.com/gin-gonic/gin v1.11.0 h1:OW/6PLjyusp2PPXtyxKHU0RbX6I/l28FTdDlae5ueWk=
+github.com/gin-gonic/gin v1.11.0/go.mod h1:+iq/FyxlGzII0KHiBGjuNn4UNENUlKbGlNmc+W50Dls=
+github.com/go-playground/locales v0.14.1 h1:EWaQ/wswjilfKLTECiXz7Rh+3BjFhfDFKv/oXslEjJA=
+github.com/go-playground/locales v0.14.1/go.mod h1:hxrqLVvrK65+Rwrd5Fc6F2O76J/NuW9t0sjnWqG1slY=
+github.com/go-playground/universal-translator v0.18.1 h1:Bcnm0ZwsGyWbCzImXv+pAJnYK9S473LQFuzCbDbfSFY=
+github.com/go-playground/universal-translator v0.18.1/go.mod h1:xekY+UJKNuX9WP91TpwSH2VMlDf28Uj24BCp08ZFTUY=
+github.com/go-playground/validator/v10 v10.29.0 h1:lQlF5VNJWNlRbRZNeOIkWElR+1LL/OuHcc0Kp14w1xk=
+github.com/go-playground/validator/v10 v10.29.0/go.mod h1:D6QxqeMlgIPuT02L66f2ccrZ7AGgHkzKmmTMZhk/Kc4=
+github.com/go-sql-driver/mysql v1.7.0/go.mod h1:OXbVy3sEdcQ2Doequ6Z5BW6fXNQTmx+9S1MCJN5yJMI=
+github.com/go-sql-driver/mysql v1.8.1 h1:LedoTUt/eveggdHS9qUFC1EFSa8bU2+1pZjSRpvNJ1Y=
+github.com/go-sql-driver/mysql v1.8.1/go.mod h1:wEBSXgmK//2ZFJyE+qWnIsVGmvmEKlqwuVSjsCm7DZg=
+github.com/go-viper/mapstructure/v2 v2.4.0 h1:EBsztssimR/CONLSZZ04E8qAkxNYq4Qp9LvH92wZUgs=
+github.com/go-viper/mapstructure/v2 v2.4.0/go.mod h1:oJDH3BJKyqBA2TXFhDsKDGDTlndYOZ6rGS0BRZIxGhM=
+github.com/goccy/go-json v0.10.5 h1:Fq85nIqj+gXn/S5ahsiTlK3TmC85qgirsdTP/+DeaC4=
+github.com/goccy/go-json v0.10.5/go.mod h1:oq7eo15ShAhp70Anwd5lgX2pLfOS3QCiwU/PULtXL6M=
+github.com/goccy/go-yaml v1.19.1 h1:3rG3+v8pkhRqoQ/88NYNMHYVGYztCOCIZ7UQhu7H+NE=
+github.com/goccy/go-yaml v1.19.1/go.mod h1:XBurs7gK8ATbW4ZPGKgcbrY1Br56PdM69F7LkFRi1kA=
+github.com/golang-jwt/jwt/v4 v4.5.2 h1:YtQM7lnr8iZ+j5q71MGKkNw9Mn7AjHM68uc9g5fXeUI=
+github.com/golang-jwt/jwt/v4 v4.5.2/go.mod h1:m21LjoU+eqJr34lmDMbreY2eSTRJ1cv77w39/MY0Ch0=
+github.com/golang-jwt/jwt/v5 v5.3.0 h1:pv4AsKCKKZuqlgs5sUmn4x8UlGa0kEVt/puTpKx9vvo=
+github.com/golang-jwt/jwt/v5 v5.3.0/go.mod h1:fxCRLWMO43lRc8nhHWY6LGqRcf+1gQWArsqaEUEa5bE=
+github.com/google/gofuzz v1.0.0/go.mod h1:dBl0BpW6vV/+mYPU4Po3pmUjxk6FQPldtuIdl/M65Eg=
+github.com/google/uuid v1.6.0 h1:NIvaJDMOsjHA8n1jAhLSgzrAzy1Hgr+hNrb57e+94F0=
+github.com/google/uuid v1.6.0/go.mod h1:TIyPZe4MgqvfeYDBFedMoGGpEw/LqOeaOT+nhxU+yHo=
+github.com/jackc/pgpassfile v1.0.0 h1:/6Hmqy13Ss2zCq62VdNG8tM1wchn8zjSGOBJ6icpsIM=
+github.com/jackc/pgpassfile v1.0.0/go.mod h1:CEx0iS5ambNFdcRtxPj5JhEz+xB6uRky5eyVu/W2HEg=
+github.com/jackc/pgservicefile v0.0.0-20240606120523-5a60cdf6a761 h1:iCEnooe7UlwOQYpKFhBabPMi4aNAfoODPEFNiAnClxo=
+github.com/jackc/pgservicefile v0.0.0-20240606120523-5a60cdf6a761/go.mod h1:5TJZWKEWniPve33vlWYSoGYefn3gLQRzjfDlhSJ9ZKM=
+github.com/jackc/pgx/v5 v5.6.0 h1:SWJzexBzPL5jb0GEsrPMLIsi/3jOo7RHlzTjcAeDrPY=
+github.com/jackc/pgx/v5 v5.6.0/go.mod h1:DNZ/vlrUnhWCoFGxHAG8U2ljioxukquj7utPDgtQdTw=
+github.com/jackc/puddle/v2 v2.2.2 h1:PR8nw+E/1w0GLuRFSmiioY6UooMp6KJv0/61nB7icHo=
+github.com/jackc/puddle/v2 v2.2.2/go.mod h1:vriiEXHvEE654aYKXXjOvZM39qJ0q+azkZFrfEOc3H4=
+github.com/jinzhu/inflection v1.0.0 h1:K317FqzuhWc8YvSVlFMCCUb36O/S9MCKRDI7QkRKD/E=
+github.com/jinzhu/inflection v1.0.0/go.mod h1:h+uFLlag+Qp1Va5pdKtLDYj+kHp5pxUVkryuEj+Srlc=
+github.com/jinzhu/now v1.1.5 h1:/o9tlHleP7gOFmsnYNz3RGnqzefHA47wQpKrrdTIwXQ=
+github.com/jinzhu/now v1.1.5/go.mod h1:d3SSVoowX0Lcu0IBviAWJpolVfI5UJVZZ7cO71lE/z8=
+github.com/joho/godotenv v1.5.1 h1:7eLL/+HRGLY0ldzfGMeQkb7vMd0as4CfYvUVzLqw0N0=
+github.com/joho/godotenv v1.5.1/go.mod h1:f4LDr5Voq0i2e/R5DDNOoa2zzDfwtkZa6DnEwAbqwq4=
+github.com/json-iterator/go v1.1.12 h1:PV8peI4a0ysnczrg+LtxykD8LfKY9ML6u2jnxaEnrnM=
+github.com/json-iterator/go v1.1.12/go.mod h1:e30LSqwooZae/UwlEbR2852Gd8hjQvJoHmT4TnhNGBo=
+github.com/klauspost/cpuid/v2 v2.3.0 h1:S4CRMLnYUhGeDFDqkGriYKdfoFlDnMtqTiI/sFzhA9Y=
+github.com/klauspost/cpuid/v2 v2.3.0/go.mod h1:hqwkgyIinND0mEev00jJYCxPNVRVXFQeu1XKlok6oO0=
+github.com/leodido/go-urn v1.4.0 h1:WT9HwE9SGECu3lg4d/dIA+jxlljEa1/ffXKmRjqdmIQ=
+github.com/leodido/go-urn v1.4.0/go.mod h1:bvxc+MVxLKB4z00jd1z+Dvzr47oO32F/QSNjSBOlFxI=
+github.com/mattn/go-isatty v0.0.20 h1:xfD0iDuEKnDkl03q4limB+vH+GxLEtL/jb4xVJSWWEY=
+github.com/mattn/go-isatty v0.0.20/go.mod h1:W+V8PltTTMOvKvAeJH7IuucS94S2C6jfK/D7dTCTo3Y=
+github.com/meilisearch/meilisearch-go v0.35.0 h1:Gh4vO+PinVQZ58iiFdUX9Hld8uXKzKh+C7mSSsCDlI8=
+github.com/meilisearch/meilisearch-go v0.35.0/go.mod h1:cUVJZ2zMqTvvwIMEEAdsWH+zrHsrLpAw6gm8Lt1MXK0=
+github.com/modern-go/concurrent v0.0.0-20180228061459-e0a39a4cb421/go.mod h1:6dJC0mAP4ikYIbvyc7fijjWJddQyLn8Ig3JB5CqoB9Q=
+github.com/modern-go/concurrent v0.0.0-20180306012644-bacd9c7ef1dd h1:TRLaZ9cD/w8PVh93nsPXa1VrQ6jlwL5oN8l14QlcNfg=
+github.com/modern-go/concurrent v0.0.0-20180306012644-bacd9c7ef1dd/go.mod h1:6dJC0mAP4ikYIbvyc7fijjWJddQyLn8Ig3JB5CqoB9Q=
+github.com/modern-go/reflect2 v1.0.2 h1:xBagoLtFs94CBntxluKeaWgTMpvLxC4ur3nMaC9Gz0M=
+github.com/modern-go/reflect2 v1.0.2/go.mod h1:yWuevngMOJpCy52FWWMvUC8ws7m/LJsjYzDa0/r8luk=
+github.com/pelletier/go-toml/v2 v2.2.4 h1:mye9XuhQ6gvn5h28+VilKrrPoQVanw5PMw/TB0t5Ec4=
+github.com/pelletier/go-toml/v2 v2.2.4/go.mod h1:2gIqNv+qfxSVS7cM2xJQKtLSTLUE9V8t9Stt+h56mCY=
+github.com/pmezard/go-difflib v1.0.0/go.mod h1:iKH77koFhYxTK1pcRnkKkqfTogsbg7gZNVY4sRDYZ/4=
+github.com/quic-go/qpack v0.6.0 h1:g7W+BMYynC1LbYLSqRt8PBg5Tgwxn214ZZR34VIOjz8=
+github.com/quic-go/qpack v0.6.0/go.mod h1:lUpLKChi8njB4ty2bFLX2x4gzDqXwUpaO1DP9qMDZII=
+github.com/quic-go/quic-go v0.57.1 h1:25KAAR9QR8KZrCZRThWMKVAwGoiHIrNbT72ULHTuI10=
+github.com/quic-go/quic-go v0.57.1/go.mod h1:ly4QBAjHA2VhdnxhojRsCUOeJwKYg+taDlos92xb1+s=
+github.com/redis/go-redis/v9 v9.17.2 h1:P2EGsA4qVIM3Pp+aPocCJ7DguDHhqrXNhVcEp4ViluI=
+github.com/redis/go-redis/v9 v9.17.2/go.mod h1:u410H11HMLoB+TP67dz8rL9s6QW2j76l0//kSOd3370=
+github.com/sagikazarmark/locafero v0.11.0 h1:1iurJgmM9G3PA/I+wWYIOw/5SyBtxapeHDcg+AAIFXc=
+github.com/sagikazarmark/locafero v0.11.0/go.mod h1:nVIGvgyzw595SUSUE6tvCp3YYTeHs15MvlmU87WwIik=
+github.com/sirupsen/logrus v1.9.3 h1:dueUQJ1C2q9oE3F7wvmSGAaVtTmUizReu6fjN8uqzbQ=
+github.com/sirupsen/logrus v1.9.3/go.mod h1:naHLuLoDiP4jHNo9R0sCBMtWGeIprob74mVsIT4qYEQ=
+github.com/sourcegraph/conc v0.3.1-0.20240121214520-5f936abd7ae8 h1:+jumHNA0Wrelhe64i8F6HNlS8pkoyMv5sreGx2Ry5Rw=
+github.com/sourcegraph/conc v0.3.1-0.20240121214520-5f936abd7ae8/go.mod h1:3n1Cwaq1E1/1lhQhtRK2ts/ZwZEhjcQeJQ1RuC6Q/8U=
+github.com/spf13/afero v1.15.0 h1:b/YBCLWAJdFWJTN9cLhiXXcD7mzKn9Dm86dNnfyQw1I=
+github.com/spf13/afero v1.15.0/go.mod h1:NC2ByUVxtQs4b3sIUphxK0NioZnmxgyCrfzeuq8lxMg=
+github.com/spf13/cast v1.10.0 h1:h2x0u2shc1QuLHfxi+cTJvs30+ZAHOGRic8uyGTDWxY=
+github.com/spf13/cast v1.10.0/go.mod h1:jNfB8QC9IA6ZuY2ZjDp0KtFO2LZZlg4S/7bzP6qqeHo=
+github.com/spf13/pflag v1.0.10 h1:4EBh2KAYBwaONj6b2Ye1GiHfwjqyROoF4RwYO+vPwFk=
+github.com/spf13/pflag v1.0.10/go.mod h1:McXfInJRrz4CZXVZOBLb0bTZqETkiAhM9Iw0y3An2Bg=
+github.com/spf13/viper v1.21.0 h1:x5S+0EU27Lbphp4UKm1C+1oQO+rKx36vfCoaVebLFSU=
+github.com/spf13/viper v1.21.0/go.mod h1:P0lhsswPGWD/1lZJ9ny3fYnVqxiegrlNrEmgLjbTCAY=
+github.com/stretchr/objx v0.1.0/go.mod h1:HFkY916IF+rwdDfMAkV7OtwuqBVzrE8GR6GFx+wExME=
+github.com/stretchr/objx v0.4.0/go.mod h1:YvHI0jy2hoMjB+UWwv71VJQ9isScKT/TqJzVSSt89Yw=
+github.com/stretchr/objx v0.5.0/go.mod h1:Yh+to48EsGEfYuaHDzXPcE3xhTkx73EhmCGUpEOglKo=
+github.com/stretchr/objx v0.5.2/go.mod h1:FRsXN1f5AsAjCGJKqEizvkpNtU+EGNCLh3NxZ/8L+MA=
+github.com/stretchr/testify v1.3.0/go.mod h1:M5WIy9Dh21IEIfnGCwXGc5bZfKNJtfHm1UVUgZn+9EI=
+github.com/stretchr/testify v1.7.0/go.mod h1:6Fq8oRcR53rry900zMqJjRRixrwX3KX962/h/Wwjteg=
+github.com/stretchr/testify v1.7.1/go.mod h1:6Fq8oRcR53rry900zMqJjRRixrwX3KX962/h/Wwjteg=
+github.com/stretchr/testify v1.8.0/go.mod h1:yNjHg4UonilssWZ8iaSj1OCr/vHnekPRkoO+kdMU+MU=
+github.com/stretchr/testify v1.8.4/go.mod h1:sz/lmYIOXD/1dqDmKjjqLyZ2RngseejIcXlSw2iwfAo=
+github.com/stretchr/testify v1.10.0/go.mod h1:r2ic/lqez/lEtzL7wO/rwa5dbSLXVDPFyf8C91i36aY=
+github.com/subosito/gotenv v1.6.0 h1:9NlTDc1FTs4qu0DDq7AEtTPNw6SVm7uBMsUCUjABIf8=
+github.com/subosito/gotenv v1.6.0/go.mod h1:Dk4QP5c2W3ibzajGcXpNraDfq2IrhjMIvMSWPKKo0FU=
+github.com/twitchyliquid64/golang-asm v0.15.1 h1:SU5vSMR7hnwNxj24w34ZyCi/FmDZTkS4MhqMhdFk5YI=
+github.com/twitchyliquid64/golang-asm v0.15.1/go.mod h1:a1lVb/DtPvCB8fslRZhAngC2+aY1QWCk3Cedj/Gdt08=
+github.com/ugorji/go/codec v1.3.1 h1:waO7eEiFDwidsBN6agj1vJQ4AG7lh2yqXyOXqhgQuyY=
+github.com/ugorji/go/codec v1.3.1/go.mod h1:pRBVtBSKl77K30Bv8R2P+cLSGaTtex6fsA2Wjqmfxj4=
+github.com/xyproto/randomstring v1.0.5/go.mod h1:rgmS5DeNXLivK7YprL0pY+lTuhNQW3iGxZ18UQApw/E=
+go.uber.org/mock v0.6.0 h1:hyF9dfmbgIX5EfOdasqLsWD6xqpNZlXblLB/Dbnwv3Y=
+go.uber.org/mock v0.6.0/go.mod h1:KiVJ4BqZJaMj4svdfmHM0AUx4NJYO8ZNpPnZn1Z+BBU=
+go.yaml.in/yaml/v3 v3.0.4 h1:tfq32ie2Jv2UxXFdLJdh3jXuOzWiL1fo0bu/FbuKpbc=
+go.yaml.in/yaml/v3 v3.0.4/go.mod h1:DhzuOOF2ATzADvBadXxruRBLzYTpT36CKvDb3+aBEFg=
+golang.org/x/arch v0.23.0 h1:lKF64A2jF6Zd8L0knGltUnegD62JMFBiCPBmQpToHhg=
+golang.org/x/arch v0.23.0/go.mod h1:dNHoOeKiyja7GTvF9NJS1l3Z2yntpQNzgrjh1cU103A=
+golang.org/x/crypto v0.46.0 h1:cKRW/pmt1pKAfetfu+RCEvjvZkA9RimPbh7bhFjGVBU=
+golang.org/x/crypto v0.46.0/go.mod h1:Evb/oLKmMraqjZ2iQTwDwvCtJkczlDuTmdJXoZVzqU0=
+golang.org/x/mod v0.31.0 h1:HaW9xtz0+kOcWKwli0ZXy79Ix+UW/vOfmWI5QVd2tgI=
+golang.org/x/mod v0.31.0/go.mod h1:43JraMp9cGx1Rx3AqioxrbrhNsLl2l/iNAvuBkrezpg=
+golang.org/x/net v0.48.0 h1:zyQRTTrjc33Lhh0fBgT/H3oZq9WuvRR5gPC70xpDiQU=
+golang.org/x/net v0.48.0/go.mod h1:+ndRgGjkh8FGtu1w1FGbEC31if4VrNVMuKTgcAAnQRY=
+golang.org/x/sync v0.19.0 h1:vV+1eWNmZ5geRlYjzm2adRgW2/mcpevXNg50YZtPCE4=
+golang.org/x/sync v0.19.0/go.mod h1:9KTHXmSnoGruLpwFjVSX0lNNA75CykiMECbovNTZqGI=
+golang.org/x/sys v0.0.0-20220715151400-c0bba94af5f8/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
+golang.org/x/sys v0.6.0/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
+golang.org/x/sys v0.39.0 h1:CvCKL8MeisomCi6qNZ+wbb0DN9E5AATixKsvNtMoMFk=
+golang.org/x/sys v0.39.0/go.mod h1:OgkHotnGiDImocRcuBABYBEXf8A9a87e/uXjp9XT3ks=
+golang.org/x/text v0.32.0 h1:ZD01bjUt1FQ9WJ0ClOL5vxgxOI/sVCNgX1YtKwcY0mU=
+golang.org/x/text v0.32.0/go.mod h1:o/rUWzghvpD5TXrTIBuJU77MTaN0ljMWE47kxGJQ7jY=
+golang.org/x/tools v0.40.0 h1:yLkxfA+Qnul4cs9QA3KnlFu0lVmd8JJfoq+E41uSutA=
+golang.org/x/tools v0.40.0/go.mod h1:Ik/tzLRlbscWpqqMRjyWYDisX8bG13FrdXp3o4Sr9lc=
+google.golang.org/protobuf v1.36.11 h1:fV6ZwhNocDyBLK0dj+fg8ektcVegBBuEolpbTQyBNVE=
+google.golang.org/protobuf v1.36.11/go.mod h1:HTf+CrKn2C3g5S8VImy6tdcUvCska2kB7j23XfzDpco=
+gopkg.in/alexcesaro/quotedprintable.v3 v3.0.0-20150716171945-2caba252f4dc h1:2gGKlE2+asNV9m7xrywl36YYNnBG5ZQ0r/BOOxqPpmk=
+gopkg.in/alexcesaro/quotedprintable.v3 v3.0.0-20150716171945-2caba252f4dc/go.mod h1:m7x9LTH6d71AHyAX77c9yqWCCa3UKHcVEj9y7hAtKDk=
+gopkg.in/check.v1 v0.0.0-20161208181325-20d25e280405/go.mod h1:Co6ibVJAznAaIkqp8huTwlJQCZ016jof/cbN4VW5Yz0=
+gopkg.in/gomail.v2 v2.0.0-20160411212932-81ebce5c23df h1:n7WqCuqOuCbNr617RXOY0AWRXxgwEyPp2z+p0+hgMuE=
+gopkg.in/gomail.v2 v2.0.0-20160411212932-81ebce5c23df/go.mod h1:LRQQ+SO6ZHR7tOkpBDuZnXENFzX8qRjMDMyPD6BRkCw=
+gopkg.in/yaml.v3 v3.0.0-20200313102051-9f266ea9e77c/go.mod h1:K4uyk7z7BCEPqu6E+C64Yfv1cQ7kz7rIZviUmN+EgEM=
+gopkg.in/yaml.v3 v3.0.1/go.mod h1:K4uyk7z7BCEPqu6E+C64Yfv1cQ7kz7rIZviUmN+EgEM=
+gorm.io/datatypes v1.2.7 h1:ww9GAhF1aGXZY3EB3cJPJ7//JiuQo7DlQA7NNlVaTdk=
+gorm.io/datatypes v1.2.7/go.mod h1:M2iO+6S3hhi4nAyYe444Pcb0dcIiOMJ7QHaUXxyiNZY=
+gorm.io/driver/mysql v1.5.6 h1:Ld4mkIickM+EliaQZQx3uOJDJHtrd70MxAUqWqlx3Y8=
+gorm.io/driver/mysql v1.5.6/go.mod h1:sEtPWMiqiN1N1cMXoXmBbd8C6/l+TESwriotuRRpkDM=
+gorm.io/driver/postgres v1.6.0 h1:2dxzU8xJ+ivvqTRph34QX+WrRaJlmfyPqXmoGVjMBa4=
+gorm.io/driver/postgres v1.6.0/go.mod h1:vUw0mrGgrTK+uPHEhAdV4sfFELrByKVGnaVRkXDhtWo=
+gorm.io/gorm v1.25.7/go.mod h1:hbnx/Oo0ChWMn1BIhpy1oYozzpM15i4YPuHDmfYtwg8=
+gorm.io/gorm v1.31.1 h1:7CA8FTFz/gRfgqgpeKIBcervUn3xSyPUmr6B2WXJ7kg=
+gorm.io/gorm v1.31.1/go.mod h1:XyQVbO2k6YkOis7C2437jSit3SsDK72s7n7rsSHd+Gs=
--- a/internal/cryptography/aes.go
+++ b/internal/cryptography/aes.go
@@ -0,0 +1,208 @@
+package cryptography
+
+import (
+	"bytes"
+	"crypto/aes"
+	"crypto/cipher"
+	"crypto/rand"
+	"encoding/base64"
+	"errors"
+	"io"
+)
+
+func randomBytes(n int) ([]byte, error) {
+	b := make([]byte, n)
+	_, err := io.ReadFull(rand.Reader, b)
+	return b, err
+}
+
+func normalizeKey(key []byte) ([]byte, error) {
+	switch len(key) {
+	case 16, 24, 32:
+		return key, nil
+	default:
+		return nil, errors.New("AES key length must be 16, 24, or 32 bytes")
+	}
+}
+
+func AESGCMEncrypt(plaintext, key []byte) (string, error) {
+	key, err := normalizeKey(key)
+	if err != nil {
+		return "", err
+	}
+
+	block, err := aes.NewCipher(key)
+	if err != nil {
+		return "", err
+	}
+
+	gcm, err := cipher.NewGCM(block)
+	if err != nil {
+		return "", err
+	}
+
+	nonce, err := randomBytes(gcm.NonceSize())
+	if err != nil {
+		return "", err
+	}
+
+	ciphertext := gcm.Seal(nil, nonce, plaintext, nil)
+	out := append(nonce, ciphertext...)
+
+	return base64.RawURLEncoding.EncodeToString(out), nil
+}
+
+func AESGCMDecrypt(encoded string, key []byte) ([]byte, error) {
+	key, err := normalizeKey(key)
+	if err != nil {
+		return nil, err
+	}
+
+	data, err := base64.RawURLEncoding.DecodeString(encoded)
+	if err != nil {
+		return nil, err
+	}
+
+	block, err := aes.NewCipher(key)
+	if err != nil {
+		return nil, err
+	}
+
+	gcm, err := cipher.NewGCM(block)
+	if err != nil {
+		return nil, err
+	}
+
+	if len(data) < gcm.NonceSize() {
+		return nil, errors.New("ciphertext too short")
+	}
+
+	nonce := data[:gcm.NonceSize()]
+	ciphertext := data[gcm.NonceSize():]
+
+	return gcm.Open(nil, nonce, ciphertext, nil)
+}
+
+func pkcs7Pad(data []byte, blockSize int) []byte {
+	padding := blockSize - len(data)%blockSize
+	padtext := bytes.Repeat([]byte{byte(padding)}, padding)
+	return append(data, padtext...)
+}
+
+func pkcs7Unpad(data []byte) ([]byte, error) {
+	length := len(data)
+	if length == 0 {
+		return nil, errors.New("invalid padding")
+	}
+	padding := int(data[length-1])
+	if padding == 0 || padding > length {
+		return nil, errors.New("invalid padding")
+	}
+	return data[:length-padding], nil
+}
+
+func AESCBCEncrypt(plaintext, key []byte) (string, error) {
+	key, err := normalizeKey(key)
+	if err != nil {
+		return "", err
+	}
+
+	block, err := aes.NewCipher(key)
+	if err != nil {
+		return "", err
+	}
+
+	plaintext = pkcs7Pad(plaintext, block.BlockSize())
+
+	iv, err := randomBytes(block.BlockSize())
+	if err != nil {
+		return "", err
+	}
+
+	mode := cipher.NewCBCEncrypter(block, iv)
+	mode.CryptBlocks(plaintext, plaintext)
+
+	out := append(iv, plaintext...)
+	return base64.RawURLEncoding.EncodeToString(out), nil
+}
+
+func AESCBCDecrypt(encoded string, key []byte) ([]byte, error) {
+	key, err := normalizeKey(key)
+	if err != nil {
+		return nil, err
+	}
+
+	data, err := base64.RawURLEncoding.DecodeString(encoded)
+	if err != nil {
+		return nil, err
+	}
+
+	block, err := aes.NewCipher(key)
+	if err != nil {
+		return nil, err
+	}
+
+	if len(data) < block.BlockSize() {
+		return nil, errors.New("ciphertext too short")
+	}
+
+	iv := data[:block.BlockSize()]
+	data = data[block.BlockSize():]
+
+	mode := cipher.NewCBCDecrypter(block, iv)
+	mode.CryptBlocks(data, data)
+
+	return pkcs7Unpad(data)
+}
+
+func AESCFBEncrypt(plaintext, key []byte) (string, error) {
+	key, err := normalizeKey(key)
+	if err != nil {
+		return "", err
+	}
+
+	block, err := aes.NewCipher(key)
+	if err != nil {
+		return "", err
+	}
+
+	iv, err := randomBytes(block.BlockSize())
+	if err != nil {
+		return "", err
+	}
+
+	stream := cipher.NewCFBEncrypter(block, iv)
+	stream.XORKeyStream(plaintext, plaintext)
+
+	out := append(iv, plaintext...)
+	return base64.RawURLEncoding.EncodeToString(out), nil
+}
+
+func AESCFBDecrypt(encoded string, key []byte) ([]byte, error) {
+	key, err := normalizeKey(key)
+	if err != nil {
+		return nil, err
+	}
+
+	data, err := base64.RawURLEncoding.DecodeString(encoded)
+	if err != nil {
+		return nil, err
+	}
+
+	block, err := aes.NewCipher(key)
+	if err != nil {
+		return nil, err
+	}
+
+	if len(data) < block.BlockSize() {
+		return nil, errors.New("ciphertext too short")
+	}
+
+	iv := data[:block.BlockSize()]
+	data = data[block.BlockSize():]
+
+	stream := cipher.NewCFBDecrypter(block, iv)
+	stream.XORKeyStream(data, data)
+
+	return data, nil
+}
--- a/internal/cryptography/bcrypt.go
+++ b/internal/cryptography/bcrypt.go
@@ -0,0 +1,22 @@
+package cryptography
+
+import "golang.org/x/crypto/bcrypt"
+
+func BcryptHash(input string) (string, error) {
+	hash, err := bcrypt.GenerateFromPassword(
+		[]byte(input),
+		bcrypt.DefaultCost,
+	)
+	if err != nil {
+		return "", err
+	}
+	return string(hash), nil
+}
+
+func BcryptVerify(input string, hashed string) bool {
+	err := bcrypt.CompareHashAndPassword(
+		[]byte(hashed),
+		[]byte(input),
+	)
+	return err == nil
+}
--- a/40
+++ b/40
@@ -0,0 +1,40 @@
+project_name := "nixcn-cms"
+project_dir := justfile_directory()
+server_enrty := "main.go"
+output_dir := join(project_dir, ".outputs")
+client_dir := join(project_dir, "client")
+exec_path := join(output_dir, project_name)
+go_cmd := `realpath $(which go)`
+bun_cmd := `realpath $(which bun)`
+
+default: install clean build-back build-client run-back
+
+backend: clean build-back run-back
+
+install:
+    cd {{ client_dir }} && {{ bun_cmd }} install
+
+clean:
+    mkdir -p .outputs
+    find .outputs -mindepth 1 ! -path .outputs/config.yaml -exec rm -rf {} +
+
+client:
+    cd {{ client_dir }} && {{ bun_cmd }} dev
+
+build-client:
+    cd {{ client_dir }} && {{ bun_cmd }} run build --outDir {{ join(output_dir, "static") }}
+
+build-back:
+    {{ go_cmd }} build -o {{ exec_path }}{{ if os() == "windows" { ".exe" } else { "" } }} {{ server_enrty }}
+
+run-back:
+    cd {{ output_dir }} && CONFIG_PATH={{ output_dir }} {{ exec_path }}{{ if os() == "windows" { ".exe" } else { "" } }}
+
+test-back:
+    cd {{ output_dir }} && CONFIG_PATH={{ output_dir }} GO_ENV=test go test -C .. ./...
+
+dev-back: clean
+    watchexec -r -e go,yaml,tpl -i '.devenv/**' -i '.direnv/**' -i 'client/**' -i 'vendor/**' 'go build -o {{ join(output_dir, "nixcn-cms") }} . && cd {{ output_dir }} && CONFIG_PATH={{ output_dir }} {{ exec_path }}'
+
+dev:
+    devenv up --verbose
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
Noa Virellia	af43b86a61	feat(client): refactor auth/login Some checks failed Build Backend (NixCN CMS) TeamCity build finished Details Build Frontend (NixCN CMS) TeamCity build failed Details Signed-off-by: Noa Virellia <noa@requiem.garden>	2026-01-02 16:48:16 +08:00
Noa Virellia	0a4f459188	feat(client): profile-wip Signed-off-by: Noa Virellia <noa@requiem.garden>	2026-01-02 16:47:37 +08:00
Asai Neko	61d2d2aef3	Sign new code for new redirect All checks were successful Build Backend (NixCN CMS) TeamCity build finished Details Build Frontend (NixCN CMS) TeamCity build finished Details Signed-off-by: Asai Neko <sugar@sne.moe>	2026-01-02 16:47:15 +08:00
Asai Neko	0b710fd538	Change magic_link_ttl old name to auth_code_ttl All checks were successful Build Backend (NixCN CMS) TeamCity build finished Details Build Frontend (NixCN CMS) TeamCity build finished Details Signed-off-by: Asai Neko <sugar@sne.moe>	2026-01-02 16:37:30 +08:00
Asai Neko	d70ade4907	Change resend to using smtp All checks were successful Build Backend (NixCN CMS) TeamCity build finished Details Build Frontend (NixCN CMS) TeamCity build finished Details Signed-off-by: Asai Neko <sugar@sne.moe>	2026-01-02 16:26:21 +08:00
Asai Neko	a98ab26fa4	Add oauth2 like auth service All checks were successful Build Backend (NixCN CMS) TeamCity build finished Details Build Frontend (NixCN CMS) TeamCity build finished Details Signed-off-by: Asai Neko <sugar@sne.moe>	2026-01-02 15:57:42 +08:00
Asai Neko	62da1e096e	Fix default config All checks were successful Build Backend (NixCN CMS) TeamCity build finished Details Build Frontend (NixCN CMS) TeamCity build finished Details Signed-off-by: Asai Neko <sugar@sne.moe>	2026-01-02 13:59:43 +08:00
Asai Neko	fd1c89392f	Add abort for jwt middleware All checks were successful Build Backend (NixCN CMS) TeamCity build finished Details Build Frontend (NixCN CMS) TeamCity build finished Details Signed-off-by: Asai Neko <sugar@sne.moe>	2026-01-02 13:55:47 +08:00
Asai Neko	ae93f49691	Fix jwt middleware cnext All checks were successful Build Backend (NixCN CMS) TeamCity build finished Details Build Frontend (NixCN CMS) TeamCity build finished Details Signed-off-by: Asai Neko <sugar@sne.moe>	2026-01-02 13:52:04 +08:00
Asai Neko	743f8373b0	Fix request return All checks were successful Build Backend (NixCN CMS) TeamCity build finished Details Build Frontend (NixCN CMS) TeamCity build finished Details Signed-off-by: Asai Neko <sugar@sne.moe>	2026-01-02 13:34:13 +08:00
Asai Neko	4796653896	Fix jwt middleware All checks were successful Build Backend (NixCN CMS) TeamCity build finished Details Build Frontend (NixCN CMS) TeamCity build finished Details Signed-off-by: Asai Neko <sugar@sne.moe>	2026-01-02 13:17:25 +08:00
Asai Neko	4dfd4cd529	Modify auth middleware All checks were successful Build Backend (NixCN CMS) TeamCity build finished Details Build Frontend (NixCN CMS) TeamCity build finished Details Signed-off-by: Asai Neko <sugar@sne.moe>	2026-01-02 13:00:02 +08:00
Asai Neko	bd8eecbc7d	Fix dup err logic All checks were successful Build Backend (NixCN CMS) TeamCity build finished Details Build Frontend (NixCN CMS) TeamCity build finished Details Signed-off-by: Asai Neko <sugar@sne.moe>	2026-01-02 12:37:27 +08:00
Asai Neko	cbec9bf2b3	Modify jwt middleware logic Signed-off-by: Asai Neko <sugar@sne.moe>	2026-01-02 12:36:07 +08:00
Asai Neko	3d685b5a86	Add hot reload for backend All checks were successful Build Backend (NixCN CMS) TeamCity build finished Details Build Frontend (NixCN CMS) TeamCity build finished Details Signed-off-by: Asai Neko <sugar@sne.moe>	2026-01-01 20:22:55 +08:00
Asai Neko	83fe326962	Add event type for event table All checks were successful Build Backend (NixCN CMS) TeamCity build finished Details Build Frontend (NixCN CMS) TeamCity build finished Details Signed-off-by: Asai Neko <sugar@sne.moe>	2026-01-01 14:59:57 +08:00
Asai Neko	5b6bc9ce42	Return user bio in user info service All checks were successful Build Backend (NixCN CMS) TeamCity build finished Details Build Frontend (NixCN CMS) TeamCity build finished Details Signed-off-by: Asai Neko <sugar@sne.moe>	2026-01-01 14:54:43 +08:00
Asai Neko	e0e1abab93	Add Bio to user table, set varchar for role in attendance table All checks were successful Build Backend (NixCN CMS) TeamCity build finished Details Build Frontend (NixCN CMS) TeamCity build finished Details Signed-off-by: Asai Neko <sugar@sne.moe>	2026-01-01 14:52:24 +08:00
Asai Neko	9f927c907a	Fix a bug All checks were successful Build Backend (NixCN CMS) TeamCity build finished Details Build Frontend (NixCN CMS) TeamCity build finished Details Signed-off-by: Asai Neko <sugar@sne.moe>	2026-01-01 14:27:00 +08:00
Asai Neko	27ba3b7bef	Add aes cryptography library All checks were successful Build Backend (NixCN CMS) TeamCity build finished Details Build Frontend (NixCN CMS) TeamCity build finished Details Signed-off-by: Asai Neko <sugar@sne.moe>	2026-01-01 14:25:44 +08:00
Asai Neko	63f71d3b81	Add bcrypt and aes crypto lib Some checks failed Build Backend (NixCN CMS) TeamCity build failed Details Build Frontend (NixCN CMS) TeamCity build finished Details Signed-off-by: Asai Neko <sugar@sne.moe>	2026-01-01 14:24:41 +08:00
Asai Neko	e40d175c8e	Remove user.type from auth/magic service All checks were successful Build Backend (NixCN CMS) TeamCity build finished Details Build Frontend (NixCN CMS) TeamCity build finished Details Signed-off-by: Asai Neko <sugar@sne.moe>	2026-01-01 14:12:05 +08:00
Asai Neko	304e1d95ed	Refactor checkin table to attendance table Some checks failed Build Backend (NixCN CMS) TeamCity build failed Details Build Frontend (NixCN CMS) TeamCity build finished Details Signed-off-by: Asai Neko <sugar@sne.moe>	2026-01-01 14:08:59 +08:00
Asai Neko	acd3c95c80	Refactor mass data structure Some checks failed Build Backend (NixCN CMS) TeamCity build failed Details Build Frontend (NixCN CMS) TeamCity build finished Details Signed-off-by: Asai Neko <sugar@sne.moe>	2026-01-01 13:31:28 +08:00
Noa Virellia	8973d518a2	refactor(client): qr dialog skeleton All checks were successful Build Backend (NixCN CMS) TeamCity build finished Details Build Frontend (NixCN CMS) TeamCity build finished Details Signed-off-by: Noa Virellia <noa@requiem.garden>	2026-01-01 03:47:55 +00:00
Noa Virellia	b5b4bb9d66	refactor(client): optimize suspense components Signed-off-by: Noa Virellia <noa@requiem.garden>	2026-01-01 03:47:55 +00:00
Asai Neko	4c438cf4e4	Add contributing guide to README Some checks failed Build Development (NixCN CMS) TeamCity build failed Details Build Frontend (NixCN CMS) TeamCity build finished Details Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-28 19:13:45 +08:00
Noa Virellia	d44eef6bb7	chore(just): do not run frontend install in backend commands Signed-off-by: Noa Virellia <noa@requiem.garden>	2025-12-28 17:41:30 +08:00
Noa Virellia	a49450bf9e	feat(auth/magic): log to console instead of sending email in debug mode Signed-off-by: Noa Virellia <noa@requiem.garden>	2025-12-28 17:41:13 +08:00
Noa Virellia	228d838c37	fix(devenv): use correct just command Signed-off-by: Noa Virellia <noa@requiem.garden>	2025-12-28 17:11:31 +08:00
Noa Virellia	580402a5c2	feat(devenv)!: integrate all services and tasks Signed-off-by: Noa Virellia <noa@requiem.garden>	2025-12-28 09:07:19 +00:00
Noa Virellia	d46af028dc	chore(client): specify dev server host Signed-off-by: Noa Virellia <noa@requiem.garden>	2025-12-28 09:07:19 +00:00
Noa Virellia	cdcd05ea52	feat(.zed/settings): set tab size for nix and ts files Signed-off-by: Noa Virellia <noa@requiem.garden>	2025-12-28 09:07:19 +00:00
Asai Neko	3f05dbe1e6	Rename client-dev to client Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-28 16:33:46 +08:00
Asai Neko	7d76b85055	Expend justfile functions Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-28 16:23:24 +08:00
Noa Virellia	af66dc6155	chore(client): remove unused files Signed-off-by: Noa Virellia <noa@requiem.garden>	2025-12-28 15:04:43 +08:00
Asai Neko	8bafd52f43	Merge branch 'develop' of ssh://git.sne.moe:2222/sugar/nixcn-cms into develop	2025-12-28 01:29:34 +08:00
Asai Neko	0a861fa674	Fix code duplicate bug Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-28 01:28:46 +08:00
Noa Virellia	a48f5ad2fa	feat(client): qrcode checkin dialog Signed-off-by: Noa Virellia <noa@requiem.garden>	2025-12-28 01:20:13 +08:00
Asai Neko	f89a483380	Fix checkin time zero json error Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-28 01:11:51 +08:00
Asai Neko	fb7ecaffe9	Move event query to user query Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-28 01:07:49 +08:00
Asai Neko	b3fe91444d	Add event query api Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-28 01:05:47 +08:00
Asai Neko	b6003544c8	Add renew refresh token Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-27 23:59:20 +08:00
Asai Neko	959bb8be0b	Fix typo error Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-27 23:41:55 +08:00
Asai Neko	10f148a07f	Remove a space Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-27 10:54:06 +08:00
Asai Neko	e6492eeb94	Fix JWT ttl failed Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-27 10:53:03 +08:00
Asai Neko	e87bda4f33	Modify condig file Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-27 04:24:19 +08:00
Asai Neko	afc62f311b	Add event service, caddy test domain Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-27 03:45:31 +08:00
Noa Virellia	2b99d415de	chore(client): eslint format Signed-off-by: Noa Virellia <noa@requiem.garden>	2025-12-27 00:25:57 +08:00
Noa Virellia	a06248f3be	refactor(client): use updated interface Signed-off-by: Noa Virellia <noa@requiem.garden>	2025-12-27 00:25:57 +08:00
Asai Neko	81a518a98b	Add search full for event table Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-26 03:49:28 +08:00
Asai Neko	98e32b67e1	Add full search for user table Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-26 03:46:54 +08:00
Asai Neko	6681ffccdf	Add meilisearch for user and event Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-26 02:16:23 +08:00
Asai Neko	3dbcc00a2d	Mod event and user table, add event CURD Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-25 21:55:08 +08:00
Asai Neko	8e43d6699c	Remove user create api Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-25 21:32:20 +08:00
Asai Neko	b30d9db69d	Auto reg user, event map Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-25 21:30:26 +08:00
Asai Neko	c7cefb3898	Remove error router Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-25 20:46:49 +08:00
Asai Neko	d3d823c85f	Add user update service Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-25 20:42:34 +08:00
Asai Neko	bfeb46a61f	Migrate checkin to user service Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-25 20:30:21 +08:00
Asai Neko	9e649d83e5	Add user permission level notes Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-25 16:52:49 +08:00
Asai Neko	c672d174f6	Set default user permission level to 10 Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-25 16:48:15 +08:00
Asai Neko	9135edbd60	Add user CRUD actions, add permission level for user Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-25 16:40:26 +08:00
Asai Neko	5b571f7a84	Add meilisearch service to devenv Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-25 16:17:07 +08:00
Asai Neko	3a86d387bd	Add full refresh token and access token function Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-25 16:13:05 +08:00
Asai Neko	32a27d974a	Add redis driver Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-25 14:52:12 +08:00
Noa Virellia	9e51414a13	feat(client): logout Signed-off-by: Noa Virellia <noa@requiem.garden>	2025-12-25 13:29:51 +08:00
Noa Virellia	f94220dcc3	chore(client): remove internal devshell Signed-off-by: Noa Virellia <noa@requiem.garden>	2025-12-25 13:19:33 +08:00
Asai Neko	9c7cfb3da6	Fix caddy api proxy Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-25 13:14:30 +08:00
Asai Neko	942767aed3	Fix unreturned error Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-25 11:51:42 +08:00
Asai Neko	a5a354e929	Real email send after login Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-25 11:50:53 +08:00
Asai Neko	43f95ba4af	Modify justfile for bun build Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-25 03:01:15 +08:00
Noa Virellia	be3d778420	feat(client): user info Signed-off-by: Noa Virellia <noa@requiem.garden>	2025-12-24 18:51:25 +00:00
Noa Virellia	9ac598cd98	feat(client): check in Signed-off-by: Noa Virellia <noa@requiem.garden>	2025-12-24 18:51:25 +00:00
Noa Virellia	606c74c587	feat(client): magic link sign-in Signed-off-by: Noa Virellia <noa@requiem.garden>	2025-12-24 18:51:25 +00:00
Noa Virellia	e4e15b2f6e	feat(client): workspace Signed-off-by: Noa Virellia <noa@requiem.garden>	2025-12-24 18:51:25 +00:00
Noa Virellia	1d387a33c5	refactor(client): token helper Signed-off-by: Noa Virellia <noa@requiem.garden>	2025-12-24 18:51:25 +00:00
Noa Virellia	634c922903	feat(client): login page Signed-off-by: Noa Virellia <noa@requiem.garden>	2025-12-24 18:51:25 +00:00
Noa Virellia	3e9656db23	feat(client): setup axios client Signed-off-by: Noa Virellia <noa@requiem.garden>	2025-12-24 18:51:25 +00:00
Noa Virellia	06c51e599d	feat(client): setup tanstack query and axios Signed-off-by: Noa Virellia <noa@requiem.garden>	2025-12-24 18:51:25 +00:00
Noa Virellia	b888bb25b0	feat(client): setup tanstack router Signed-off-by: Noa Virellia <noa@requiem.garden>	2025-12-24 18:51:25 +00:00
Noa Virellia	44616895cf	feat(client): add shadcn theme - Added Nix theme - Defaults to dark mode Signed-off-by: Noa Virellia <noa@requiem.garden>	2025-12-24 18:51:25 +00:00
Noa Virellia	2148e47b10	feat(client): setup tailwindcss and shadcn Signed-off-by: Noa Virellia <noa@requiem.garden>	2025-12-24 18:51:25 +00:00
Noa Virellia	f5a811a6a2	feat(client): setup formatting - Installed @antfu/eslint-config for formatting - Installed lint-staged for pre-commit formatting compliance Signed-off-by: Noa Virellia <noa@requiem.garden>	2025-12-24 18:51:25 +00:00
Noa Virellia	1302a5ea03	feat(client): initial commit - Initialized vite project - Added bun devshell config Signed-off-by: Noa Virellia <noa@requiem.garden>	2025-12-24 18:51:25 +00:00
Asai Neko	f8b6c1b1df	Add user info service Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-25 02:50:27 +08:00
Asai Neko	396ab10469	Checkin time data column, checkin module Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-25 02:17:28 +08:00
Asai Neko	ca08c997c8	Fix User database struct Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-25 01:38:25 +08:00
Asai Neko	bd726f80ea	Impl magic login logic && checkin logic Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-25 00:37:02 +08:00
Asai Neko	cd2bcd597c	Add authentication function Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-24 20:43:19 +08:00
Asai Neko	fd4da4f1a1	Replace menual env replacer to auto env replacer Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-23 23:53:32 +08:00
Asai Neko	485d0de64b	Fix grabage codes 5 years ago Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-23 23:46:00 +08:00
Asai Neko	b933522123	Fix config module for unit test Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-23 20:31:25 +08:00
Asai Neko	2d92d5fba7	Remove env settings in unit test Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-23 18:22:25 +08:00
Asai Neko	d314942c08	Add jwt crypto module, support unit test for config module Signed-off-by: Asai Neko<sugar@sne.moe>	2025-12-23 18:11:31 +08:00
Asai Neko	1505783c62	Add user service checkin func - User service SetCheckinState NOTE: Not Tested Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-20 02:04:45 +08:00
Asai Neko	f130401ff8	Add dev services - Development dotenvs - Caddy service - Redis service - Postgres service - Fix env parser error Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-20 01:27:11 +08:00
Asai Neko	0fb5c8b758	Add user db search - Search user by email Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-19 18:10:04 +08:00
Asai Neko	dc128c0392	Add database driver and config module Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-19 17:38:51 +08:00
Asai Neko	e2345a8d4a	Add static router & mod justfile - default, run, build actions in justfile Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-19 16:33:43 +08:00
Asai Neko	55e7d3520a	Add justfile to project NOTE: only go build added Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-19 16:22:17 +08:00
Asai Neko	b81a43019a	Init golang project - Gin - Gorm - Viper - Logrus Signed-off-by: Asai Neko <sugar@sne.moe>	2025-12-19 15:40:34 +08:00