diff --git a/admin/src/App.tsx b/admin/src/App.tsx
index 24249a9..947aa12 100644
--- a/admin/src/App.tsx
+++ b/admin/src/App.tsx
@@ -1,18 +1,18 @@
-import { Routes, Route, Navigate } from 'react-router-dom'
-import { useAuthStore } from './stores/authStore'
+import { Navigate, Route, Routes } from 'react-router-dom'
+import DashboardLayout from './components/DashboardLayout'
 import ErrorBoundary from './components/ErrorBoundary'
 import ProtectedRoute from './components/ProtectedRoute'
+import Categories from './pages/Categories'
+import Dashboard from './pages/Dashboard'
 import LoginPage from './pages/LoginPage'
 import NotFound from './pages/NotFound'
-import DashboardLayout from './components/DashboardLayout'
-import Dashboard from './pages/Dashboard'
 import Photos from './pages/Photos'
 import PhotoUpload from './pages/PhotoUpload'
-import Categories from './pages/Categories'
-import Tags from './pages/Tags'
-import Users from './pages/Users'
 import Settings from './pages/Settings'
+import Tags from './pages/Tags'
 import TestApi from './pages/TestApi'
+import Users from './pages/Users'
+import { useAuthStore } from './stores/authStore'
 
 function App() {
   const { isAuthenticated } = useAuthStore()
@@ -36,21 +36,21 @@ function App() {
           <Route path="/categories" element={<Categories />} />
           <Route path="/tags" element={<Tags />} />
           <Route path="/test-api" element={<TestApi />} />
-          <Route 
-            path="/users" 
+          <Route
+            path="/users"
             element={
               <ProtectedRoute requiredRole="admin">
                 <Users />
               </ProtectedRoute>
-            } 
+            }
           />
-          <Route 
-            path="/settings" 
+          <Route
+            path="/settings"
             element={
               <ProtectedRoute requiredRole="admin">
                 <Settings />
               </ProtectedRoute>
-            } 
+            }
           />
           <Route path="*" element={<NotFound />} />
         </Routes>
@@ -59,4 +59,4 @@ function App() {
   )
 }
 
-export default App
\ No newline at end of file
+export default App
diff --git a/admin/src/components/DashboardLayout.tsx b/admin/src/components/DashboardLayout.tsx
index 1f327bd..7849384 100644
--- a/admin/src/components/DashboardLayout.tsx
+++ b/admin/src/components/DashboardLayout.tsx
@@ -1,28 +1,35 @@
-import React, { useState } from 'react'
-import { Link, useLocation, useNavigate } from 'react-router-dom'
-import { useQuery } from '@tanstack/react-query'
-import { Button } from '@/components/ui/button'
 import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar'
 import { Badge } from '@/components/ui/badge'
+import { Button } from '@/components/ui/button'
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuLabel,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger,
+} from '@/components/ui/dropdown-menu'
 import { Separator } from '@/components/ui/separator'
-import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger } from '@/components/ui/dropdown-menu'
 import { Sheet, SheetContent, SheetTrigger } from '@/components/ui/sheet'
-import { 
-  LayoutDashboard, 
-  Camera, 
-  FolderOpen, 
-  Tags, 
-  Users, 
-  Settings, 
+import { cn } from '@/lib/utils'
+import { authService } from '@/services/authService'
+import { useAuthStore } from '@/stores/authStore'
+import { useQuery } from '@tanstack/react-query'
+import {
+  Bell,
+  Camera,
+  FolderOpen,
+  LayoutDashboard,
   LogOut,
   Menu,
+  Search,
+  Settings,
+  Tags,
   User,
-  Bell,
-  Search
+  Users,
 } from 'lucide-react'
-import { cn } from '@/lib/utils'
-import { useAuthStore } from '@/stores/authStore'
-import { authService } from '@/services/authService'
+import React, { useState } from 'react'
+import { Link, useLocation, useNavigate } from 'react-router-dom'
 import { toast } from 'sonner'
 
 interface DashboardLayoutProps {
@@ -81,10 +88,10 @@ export default function DashboardLayout({ children }: DashboardLayoutProps) {
 
       {/* Navigation */}
       <nav className="flex-1 space-y-1 px-2 py-4">
-        {navigation.map((item) => {
+        {navigation.map(item => {
           const Icon = item.icon
           const isActive = isCurrentPath(item.href)
-          
+
           return (
             <Link
               key={item.name}
@@ -109,17 +116,16 @@ export default function DashboardLayout({ children }: DashboardLayoutProps) {
         <div className="flex items-center space-x-3">
           <Avatar className="h-8 w-8">
             <AvatarImage src={undefined} />
-            <AvatarFallback>
-              {currentUser?.username?.charAt(0).toUpperCase()}
-            </AvatarFallback>
+            <AvatarFallback>{currentUser?.username?.charAt(0).toUpperCase()}</AvatarFallback>
           </Avatar>
           <div className="flex-1 min-w-0">
-            <p className="text-sm font-medium text-gray-900 truncate">
-              {currentUser?.username}
-            </p>
+            <p className="text-sm font-medium text-gray-900 truncate">{currentUser?.username}</p>
             <Badge variant="secondary" className="text-xs">
-              {currentUser?.role === 'admin' ? '管理员' : 
-               currentUser?.role === 'editor' ? '编辑者' : '用户'}
+              {currentUser?.role === 'admin'
+                ? '管理员'
+                : currentUser?.role === 'editor'
+                  ? '编辑者'
+                  : '用户'}
             </Badge>
           </div>
         </div>
@@ -153,7 +159,7 @@ export default function DashboardLayout({ children }: DashboardLayoutProps) {
                 </Button>
               </SheetTrigger>
             </Sheet>
-            
+
             <div className="flex items-center space-x-2">
               <Search className="h-5 w-5 text-gray-400" />
               <input
@@ -168,9 +174,9 @@ export default function DashboardLayout({ children }: DashboardLayoutProps) {
             <Button variant="ghost" size="sm">
               <Bell className="h-5 w-5" />
             </Button>
-            
+
             <Separator orientation="vertical" className="h-6" />
-            
+
             <DropdownMenu>
               <DropdownMenuTrigger asChild>
                 <Button variant="ghost" className="flex items-center space-x-2">
@@ -208,10 +214,8 @@ export default function DashboardLayout({ children }: DashboardLayoutProps) {
         </header>
 
         {/* Page content */}
-        <main className="flex-1 overflow-auto">
-          {children}
-        </main>
+        <main className="flex-1 overflow-auto">{children}</main>
       </div>
     </div>
   )
-}
\ No newline at end of file
+}
diff --git a/admin/src/components/ErrorBoundary.tsx b/admin/src/components/ErrorBoundary.tsx
index 7b65215..4226129 100644
--- a/admin/src/components/ErrorBoundary.tsx
+++ b/admin/src/components/ErrorBoundary.tsx
@@ -1,8 +1,8 @@
-import { Component, ErrorInfo, ReactNode } from 'react'
-import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
-import { Button } from '@/components/ui/button'
 import { Alert, AlertDescription } from '@/components/ui/alert'
-import { AlertTriangle, RefreshCw, Home } from 'lucide-react'
+import { Button } from '@/components/ui/button'
+import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
+import { AlertTriangle, Home, RefreshCw } from 'lucide-react'
+import { Component, ErrorInfo, ReactNode } from 'react'
 
 interface Props {
   children: ReactNode
@@ -28,9 +28,9 @@ export class ErrorBoundary extends Component<Props, State> {
   componentDidCatch(error: Error, errorInfo: ErrorInfo) {
     this.setState({
       error,
-      errorInfo
+      errorInfo,
     })
-    
+
     // 这里可以将错误发送到日志服务
     // eslint-disable-next-line no-console
     console.error('ErrorBoundary caught an error:', error, errorInfo)
@@ -66,7 +66,7 @@ export class ErrorBoundary extends Component<Props, State> {
                   页面遇到了一个错误，无法正常显示。请尝试刷新页面或返回首页。
                 </AlertDescription>
               </Alert>
-              
+
               {import.meta.env.DEV && this.state.error && (
                 <div className="p-4 bg-gray-100 rounded-md">
                   <h4 className="font-medium text-sm mb-2">错误详情：</h4>
@@ -80,20 +80,13 @@ export class ErrorBoundary extends Component<Props, State> {
                   )}
                 </div>
               )}
-              
+
               <div className="flex gap-2">
-                <Button 
-                  onClick={this.handleRetry}
-                  className="flex-1"
-                  variant="outline"
-                >
+                <Button onClick={this.handleRetry} className="flex-1" variant="outline">
                   <RefreshCw className="h-4 w-4 mr-2" />
                   重试
                 </Button>
-                <Button 
-                  onClick={this.handleGoHome}
-                  className="flex-1"
-                >
+                <Button onClick={this.handleGoHome} className="flex-1">
                   <Home className="h-4 w-4 mr-2" />
                   返回首页
                 </Button>
@@ -108,4 +101,4 @@ export class ErrorBoundary extends Component<Props, State> {
   }
 }
 
-export default ErrorBoundary
\ No newline at end of file
+export default ErrorBoundary
diff --git a/admin/src/components/Loading.tsx b/admin/src/components/Loading.tsx
index ff1c00e..d4b9878 100644
--- a/admin/src/components/Loading.tsx
+++ b/admin/src/components/Loading.tsx
@@ -1,5 +1,5 @@
-import { Loader2 } from 'lucide-react'
 import { cn } from '@/lib/utils'
+import { Loader2 } from 'lucide-react'
 
 interface LoadingProps {
   size?: 'sm' | 'md' | 'lg'
@@ -8,53 +8,57 @@ interface LoadingProps {
   fullscreen?: boolean
 }
 
-export function Loading({ 
-  size = 'md', 
-  text = '加载中...', 
+export function Loading({
+  size = 'md',
+  text = '加载中...',
   className,
-  fullscreen = false 
+  fullscreen = false,
 }: LoadingProps) {
   const sizeClasses = {
     sm: 'h-4 w-4',
     md: 'h-6 w-6',
-    lg: 'h-8 w-8'
+    lg: 'h-8 w-8',
   }
 
   const textSizeClasses = {
     sm: 'text-sm',
     md: 'text-base',
-    lg: 'text-lg'
+    lg: 'text-lg',
   }
 
   if (fullscreen) {
     return (
       <div className="fixed inset-0 z-50 flex items-center justify-center bg-background/80 backdrop-blur-sm">
         <div className="flex flex-col items-center gap-3">
-          <Loader2 className={cn(sizeClasses[size], "animate-spin text-primary")} />
-          <p className={cn(textSizeClasses[size], "text-muted-foreground")}>{text}</p>
+          <Loader2 className={cn(sizeClasses[size], 'animate-spin text-primary')} />
+          <p className={cn(textSizeClasses[size], 'text-muted-foreground')}>{text}</p>
         </div>
       </div>
     )
   }
 
   return (
-    <div className={cn("flex items-center justify-center gap-2", className)}>
-      <Loader2 className={cn(sizeClasses[size], "animate-spin text-primary")} />
-      <span className={cn(textSizeClasses[size], "text-muted-foreground")}>{text}</span>
+    <div className={cn('flex items-center justify-center gap-2', className)}>
+      <Loader2 className={cn(sizeClasses[size], 'animate-spin text-primary')} />
+      <span className={cn(textSizeClasses[size], 'text-muted-foreground')}>{text}</span>
     </div>
   )
 }
 
-export function LoadingSpinner({ size = 'md', className }: { size?: 'sm' | 'md' | 'lg', className?: string }) {
+export function LoadingSpinner({
+  size = 'md',
+  className,
+}: {
+  size?: 'sm' | 'md' | 'lg'
+  className?: string
+}) {
   const sizeClasses = {
     sm: 'h-4 w-4',
     md: 'h-6 w-6',
-    lg: 'h-8 w-8'
+    lg: 'h-8 w-8',
   }
 
-  return (
-    <Loader2 className={cn(sizeClasses[size], "animate-spin text-primary", className)} />
-  )
+  return <Loader2 className={cn(sizeClasses[size], 'animate-spin text-primary', className)} />
 }
 
 export function PageLoading({ text = '页面加载中...' }: { text?: string }) {
@@ -77,4 +81,4 @@ export function InlineLoading({ text = '加载中...' }: { text?: string }) {
   )
 }
 
-export default Loading
\ No newline at end of file
+export default Loading
diff --git a/admin/src/components/ProtectedRoute.tsx b/admin/src/components/ProtectedRoute.tsx
index f2524c1..c62529c 100644
--- a/admin/src/components/ProtectedRoute.tsx
+++ b/admin/src/components/ProtectedRoute.tsx
@@ -1,8 +1,8 @@
-import { ReactNode } from 'react'
-import { useAuthStore } from '@/stores/authStore'
-import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
 import { Button } from '@/components/ui/button'
-import { Shield, Home } from 'lucide-react'
+import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
+import { useAuthStore } from '@/stores/authStore'
+import { Home, Shield } from 'lucide-react'
+import { ReactNode } from 'react'
 import { useNavigate } from 'react-router-dom'
 
 interface ProtectedRouteProps {
@@ -11,11 +11,7 @@ interface ProtectedRouteProps {
   fallback?: ReactNode
 }
 
-export function ProtectedRoute({ 
-  children, 
-  requiredRole,
-  fallback 
-}: ProtectedRouteProps) {
+export function ProtectedRoute({ children, requiredRole, fallback }: ProtectedRouteProps) {
   const { user, isAuthenticated } = useAuthStore()
   const navigate = useNavigate()
 
@@ -27,9 +23,9 @@ export function ProtectedRoute({
   // 角色权限检查
   if (requiredRole) {
     const roleHierarchy = {
-      'user': 0,
-      'editor': 1,
-      'admin': 2
+      user: 0,
+      editor: 1,
+      admin: 2,
     }
 
     const userRoleLevel = roleHierarchy[user.role] || 0
@@ -50,25 +46,19 @@ export function ProtectedRoute({
               <CardTitle className="text-xl">权限不足</CardTitle>
             </CardHeader>
             <CardContent className="space-y-4">
-              <p className="text-muted-foreground">
-                抱歉，您没有访问此页面的权限。
-              </p>
+              <p className="text-muted-foreground">抱歉，您没有访问此页面的权限。</p>
               <p className="text-sm text-muted-foreground">
-                当前角色: <span className="font-medium">{getRoleText(user.role)}</span><br />
+                当前角色: <span className="font-medium">{getRoleText(user.role)}</span>
+                <br />
                 需要角色: <span className="font-medium">{getRoleText(requiredRole)}</span>
               </p>
-              
-              <Button 
-                onClick={() => navigate('/dashboard')}
-                className="w-full"
-              >
+
+              <Button onClick={() => navigate('/dashboard')} className="w-full">
                 <Home className="h-4 w-4 mr-2" />
                 返回首页
               </Button>
-              
-              <div className="text-sm text-muted-foreground">
-                错误代码: 403
-              </div>
+
+              <div className="text-sm text-muted-foreground">错误代码: 403</div>
             </CardContent>
           </Card>
         </div>
@@ -81,11 +71,11 @@ export function ProtectedRoute({
 
 function getRoleText(role: string) {
   const roleTexts = {
-    'admin': '管理员',
-    'editor': '编辑者',
-    'user': '用户'
+    admin: '管理员',
+    editor: '编辑者',
+    user: '用户',
   }
   return roleTexts[role as keyof typeof roleTexts] || role
 }
 
-export default ProtectedRoute
\ No newline at end of file
+export default ProtectedRoute
diff --git a/admin/src/components/Toaster.tsx b/admin/src/components/Toaster.tsx
index 55a96a1..0e890dc 100644
--- a/admin/src/components/Toaster.tsx
+++ b/admin/src/components/Toaster.tsx
@@ -21,4 +21,4 @@ export function Toaster() {
   )
 }
 
-export default Toaster
\ No newline at end of file
+export default Toaster
diff --git a/admin/src/components/ui/alert.tsx b/admin/src/components/ui/alert.tsx
index 5a7ba0f..b5ea832 100644
--- a/admin/src/components/ui/alert.tsx
+++ b/admin/src/components/ui/alert.tsx
@@ -1,20 +1,20 @@
-import * as React from "react"
-import { cva, type VariantProps } from "class-variance-authority"
+import { cva, type VariantProps } from 'class-variance-authority'
+import * as React from 'react'
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils'
 
 const alertVariants = cva(
-  "relative w-full rounded-lg border p-4 [&>svg~*]:pl-7 [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:text-foreground",
+  'relative w-full rounded-lg border p-4 [&>svg~*]:pl-7 [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:text-foreground',
   {
     variants: {
       variant: {
-        default: "bg-background text-foreground",
+        default: 'bg-background text-foreground',
         destructive:
-          "border-destructive/50 text-destructive dark:border-destructive [&>svg]:text-destructive",
+          'border-destructive/50 text-destructive dark:border-destructive [&>svg]:text-destructive',
       },
     },
     defaultVariants: {
-      variant: "default",
+      variant: 'default',
     },
   }
 )
@@ -23,37 +23,27 @@ const Alert = React.forwardRef<
   HTMLDivElement,
   React.HTMLAttributes<HTMLDivElement> & VariantProps<typeof alertVariants>
 >(({ className, variant, ...props }, ref) => (
-  <div
-    ref={ref}
-    role="alert"
-    className={cn(alertVariants({ variant }), className)}
-    {...props}
-  />
+  <div ref={ref} role="alert" className={cn(alertVariants({ variant }), className)} {...props} />
 ))
-Alert.displayName = "Alert"
+Alert.displayName = 'Alert'
 
-const AlertTitle = React.forwardRef<
-  HTMLParagraphElement,
-  React.HTMLAttributes<HTMLHeadingElement>
->(({ className, ...props }, ref) => (
-  <h5
-    ref={ref}
-    className={cn("mb-1 font-medium leading-none tracking-tight", className)}
-    {...props}
-  />
-))
-AlertTitle.displayName = "AlertTitle"
+const AlertTitle = React.forwardRef<HTMLParagraphElement, React.HTMLAttributes<HTMLHeadingElement>>(
+  ({ className, ...props }, ref) => (
+    <h5
+      ref={ref}
+      className={cn('mb-1 font-medium leading-none tracking-tight', className)}
+      {...props}
+    />
+  )
+)
+AlertTitle.displayName = 'AlertTitle'
 
 const AlertDescription = React.forwardRef<
   HTMLParagraphElement,
   React.HTMLAttributes<HTMLParagraphElement>
 >(({ className, ...props }, ref) => (
-  <div
-    ref={ref}
-    className={cn("text-sm [&_p]:leading-relaxed", className)}
-    {...props}
-  />
+  <div ref={ref} className={cn('text-sm [&_p]:leading-relaxed', className)} {...props} />
 ))
-AlertDescription.displayName = "AlertDescription"
+AlertDescription.displayName = 'AlertDescription'
 
-export { Alert, AlertTitle, AlertDescription }
\ No newline at end of file
+export { Alert, AlertDescription, AlertTitle }
diff --git a/admin/src/components/ui/avatar.tsx b/admin/src/components/ui/avatar.tsx
index c85badc..4696d63 100644
--- a/admin/src/components/ui/avatar.tsx
+++ b/admin/src/components/ui/avatar.tsx
@@ -1,7 +1,7 @@
-import * as React from "react"
-import * as AvatarPrimitive from "@radix-ui/react-avatar"
+import * as AvatarPrimitive from '@radix-ui/react-avatar'
+import * as React from 'react'
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils'
 
 const Avatar = React.forwardRef<
   React.ElementRef<typeof AvatarPrimitive.Root>,
@@ -9,10 +9,7 @@ const Avatar = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <AvatarPrimitive.Root
     ref={ref}
-    className={cn(
-      "relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full",
-      className
-    )}
+    className={cn('relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full', className)}
     {...props}
   />
 ))
@@ -24,7 +21,7 @@ const AvatarImage = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <AvatarPrimitive.Image
     ref={ref}
-    className={cn("aspect-square h-full w-full", className)}
+    className={cn('aspect-square h-full w-full', className)}
     {...props}
   />
 ))
@@ -37,7 +34,7 @@ const AvatarFallback = React.forwardRef<
   <AvatarPrimitive.Fallback
     ref={ref}
     className={cn(
-      "flex h-full w-full items-center justify-center rounded-full bg-muted",
+      'flex h-full w-full items-center justify-center rounded-full bg-muted',
       className
     )}
     {...props}
@@ -45,4 +42,4 @@ const AvatarFallback = React.forwardRef<
 ))
 AvatarFallback.displayName = AvatarPrimitive.Fallback.displayName
 
-export { Avatar, AvatarImage, AvatarFallback }
\ No newline at end of file
+export { Avatar, AvatarFallback, AvatarImage }
diff --git a/admin/src/components/ui/badge.tsx b/admin/src/components/ui/badge.tsx
index 12daad7..70bd979 100644
--- a/admin/src/components/ui/badge.tsx
+++ b/admin/src/components/ui/badge.tsx
@@ -1,24 +1,23 @@
-import * as React from "react"
-import { cva, type VariantProps } from "class-variance-authority"
+import { cva, type VariantProps } from 'class-variance-authority'
+import * as React from 'react'
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils'
 
 const badgeVariants = cva(
-  "inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
+  'inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2',
   {
     variants: {
       variant: {
-        default:
-          "border-transparent bg-primary text-primary-foreground hover:bg-primary/80",
+        default: 'border-transparent bg-primary text-primary-foreground hover:bg-primary/80',
         secondary:
-          "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80",
+          'border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80',
         destructive:
-          "border-transparent bg-destructive text-destructive-foreground hover:bg-destructive/80",
-        outline: "text-foreground",
+          'border-transparent bg-destructive text-destructive-foreground hover:bg-destructive/80',
+        outline: 'text-foreground',
       },
     },
     defaultVariants: {
-      variant: "default",
+      variant: 'default',
     },
   }
 )
@@ -28,9 +27,7 @@ export interface BadgeProps
     VariantProps<typeof badgeVariants> {}
 
 function Badge({ className, variant, ...props }: BadgeProps) {
-  return (
-    <div className={cn(badgeVariants({ variant }), className)} {...props} />
-  )
+  return <div className={cn(badgeVariants({ variant }), className)} {...props} />
 }
 
-export { Badge, badgeVariants }
\ No newline at end of file
+export { Badge, badgeVariants }
diff --git a/admin/src/components/ui/button.tsx b/admin/src/components/ui/button.tsx
index c9c71de..334b859 100644
--- a/admin/src/components/ui/button.tsx
+++ b/admin/src/components/ui/button.tsx
@@ -1,34 +1,31 @@
-import * as React from "react"
-import { Slot } from "@radix-ui/react-slot"
-import { cva, type VariantProps } from "class-variance-authority"
+import { Slot } from '@radix-ui/react-slot'
+import { cva, type VariantProps } from 'class-variance-authority'
+import * as React from 'react'
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils'
 
 const buttonVariants = cva(
-  "inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
+  'inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50',
   {
     variants: {
       variant: {
-        default: "bg-primary text-primary-foreground hover:bg-primary/90",
-        destructive:
-          "bg-destructive text-destructive-foreground hover:bg-destructive/90",
-        outline:
-          "border border-input bg-background hover:bg-accent hover:text-accent-foreground",
-        secondary:
-          "bg-secondary text-secondary-foreground hover:bg-secondary/80",
-        ghost: "hover:bg-accent hover:text-accent-foreground",
-        link: "text-primary underline-offset-4 hover:underline",
+        default: 'bg-primary text-primary-foreground hover:bg-primary/90',
+        destructive: 'bg-destructive text-destructive-foreground hover:bg-destructive/90',
+        outline: 'border border-input bg-background hover:bg-accent hover:text-accent-foreground',
+        secondary: 'bg-secondary text-secondary-foreground hover:bg-secondary/80',
+        ghost: 'hover:bg-accent hover:text-accent-foreground',
+        link: 'text-primary underline-offset-4 hover:underline',
       },
       size: {
-        default: "h-10 px-4 py-2",
-        sm: "h-9 rounded-md px-3",
-        lg: "h-11 rounded-md px-8",
-        icon: "h-10 w-10",
+        default: 'h-10 px-4 py-2',
+        sm: 'h-9 rounded-md px-3',
+        lg: 'h-11 rounded-md px-8',
+        icon: 'h-10 w-10',
       },
     },
     defaultVariants: {
-      variant: "default",
-      size: "default",
+      variant: 'default',
+      size: 'default',
     },
   }
 )
@@ -41,16 +38,12 @@ export interface ButtonProps
 
 const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
   ({ className, variant, size, asChild = false, ...props }, ref) => {
-    const Comp = asChild ? Slot : "button"
+    const Comp = asChild ? Slot : 'button'
     return (
-      <Comp
-        className={cn(buttonVariants({ variant, size, className }))}
-        ref={ref}
-        {...props}
-      />
+      <Comp className={cn(buttonVariants({ variant, size, className }))} ref={ref} {...props} />
     )
   }
 )
-Button.displayName = "Button"
+Button.displayName = 'Button'
 
-export { Button, buttonVariants }
\ No newline at end of file
+export { Button, buttonVariants }
diff --git a/admin/src/components/ui/card.tsx b/admin/src/components/ui/card.tsx
index 938aa22..ac98469 100644
--- a/admin/src/components/ui/card.tsx
+++ b/admin/src/components/ui/card.tsx
@@ -1,79 +1,56 @@
-import * as React from "react"
+import * as React from 'react'
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils'
 
-const Card = React.forwardRef<
-  HTMLDivElement,
-  React.HTMLAttributes<HTMLDivElement>
->(({ className, ...props }, ref) => (
-  <div
-    ref={ref}
-    className={cn(
-      "rounded-lg border bg-card text-card-foreground shadow-sm",
-      className
-    )}
-    {...props}
-  />
-))
-Card.displayName = "Card"
+const Card = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+  ({ className, ...props }, ref) => (
+    <div
+      ref={ref}
+      className={cn('rounded-lg border bg-card text-card-foreground shadow-sm', className)}
+      {...props}
+    />
+  )
+)
+Card.displayName = 'Card'
 
-const CardHeader = React.forwardRef<
-  HTMLDivElement,
-  React.HTMLAttributes<HTMLDivElement>
->(({ className, ...props }, ref) => (
-  <div
-    ref={ref}
-    className={cn("flex flex-col space-y-1.5 p-6", className)}
-    {...props}
-  />
-))
-CardHeader.displayName = "CardHeader"
+const CardHeader = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+  ({ className, ...props }, ref) => (
+    <div ref={ref} className={cn('flex flex-col space-y-1.5 p-6', className)} {...props} />
+  )
+)
+CardHeader.displayName = 'CardHeader'
 
-const CardTitle = React.forwardRef<
-  HTMLParagraphElement,
-  React.HTMLAttributes<HTMLHeadingElement>
->(({ className, ...props }, ref) => (
-  <h3
-    ref={ref}
-    className={cn(
-      "text-2xl font-semibold leading-none tracking-tight",
-      className
-    )}
-    {...props}
-  />
-))
-CardTitle.displayName = "CardTitle"
+const CardTitle = React.forwardRef<HTMLParagraphElement, React.HTMLAttributes<HTMLHeadingElement>>(
+  ({ className, ...props }, ref) => (
+    <h3
+      ref={ref}
+      className={cn('text-2xl font-semibold leading-none tracking-tight', className)}
+      {...props}
+    />
+  )
+)
+CardTitle.displayName = 'CardTitle'
 
 const CardDescription = React.forwardRef<
   HTMLParagraphElement,
   React.HTMLAttributes<HTMLParagraphElement>
 >(({ className, ...props }, ref) => (
-  <p
-    ref={ref}
-    className={cn("text-sm text-muted-foreground", className)}
-    {...props}
-  />
+  <p ref={ref} className={cn('text-sm text-muted-foreground', className)} {...props} />
 ))
-CardDescription.displayName = "CardDescription"
+CardDescription.displayName = 'CardDescription'
 
-const CardContent = React.forwardRef<
-  HTMLDivElement,
-  React.HTMLAttributes<HTMLDivElement>
->(({ className, ...props }, ref) => (
-  <div ref={ref} className={cn("p-6 pt-0", className)} {...props} />
-))
-CardContent.displayName = "CardContent"
+const CardContent = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+  ({ className, ...props }, ref) => (
+    <div ref={ref} className={cn('p-6 pt-0', className)} {...props} />
+  )
+)
+CardContent.displayName = 'CardContent'
 
-const CardFooter = React.forwardRef<
-  HTMLDivElement,
-  React.HTMLAttributes<HTMLDivElement>
->(({ className, ...props }, ref) => (
-  <div
-    ref={ref}
-    className={cn("flex items-center p-6 pt-0", className)}
-    {...props}
-  />
-))
-CardFooter.displayName = "CardFooter"
+const CardFooter = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+  ({ className, ...props }, ref) => (
+    <div ref={ref} className={cn('flex items-center p-6 pt-0', className)} {...props} />
+  )
+)
+CardFooter.displayName = 'CardFooter'
 
-export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent }
\ No newline at end of file
+export { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle }
diff --git a/admin/src/components/ui/checkbox.tsx b/admin/src/components/ui/checkbox.tsx
index 43ac6c4..31e1e08 100644
--- a/admin/src/components/ui/checkbox.tsx
+++ b/admin/src/components/ui/checkbox.tsx
@@ -1,8 +1,8 @@
-import * as React from "react"
-import * as CheckboxPrimitive from "@radix-ui/react-checkbox"
-import { Check } from "lucide-react"
+import * as CheckboxPrimitive from '@radix-ui/react-checkbox'
+import { Check } from 'lucide-react'
+import * as React from 'react'
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils'
 
 const Checkbox = React.forwardRef<
   React.ElementRef<typeof CheckboxPrimitive.Root>,
@@ -11,18 +11,16 @@ const Checkbox = React.forwardRef<
   <CheckboxPrimitive.Root
     ref={ref}
     className={cn(
-      "peer h-4 w-4 shrink-0 rounded-sm border border-primary ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground",
+      'peer h-4 w-4 shrink-0 rounded-sm border border-primary ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground',
       className
     )}
     {...props}
   >
-    <CheckboxPrimitive.Indicator
-      className={cn("flex items-center justify-center text-current")}
-    >
+    <CheckboxPrimitive.Indicator className={cn('flex items-center justify-center text-current')}>
       <Check className="h-4 w-4" />
     </CheckboxPrimitive.Indicator>
   </CheckboxPrimitive.Root>
 ))
 Checkbox.displayName = CheckboxPrimitive.Root.displayName
 
-export { Checkbox }
\ No newline at end of file
+export { Checkbox }
diff --git a/admin/src/components/ui/dialog.tsx b/admin/src/components/ui/dialog.tsx
index 9e81a62..3319320 100644
--- a/admin/src/components/ui/dialog.tsx
+++ b/admin/src/components/ui/dialog.tsx
@@ -1,8 +1,8 @@
-import * as React from "react"
-import * as DialogPrimitive from "@radix-ui/react-dialog"
-import { X } from "lucide-react"
+import * as DialogPrimitive from '@radix-ui/react-dialog'
+import { X } from 'lucide-react'
+import * as React from 'react'
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils'
 
 const Dialog = DialogPrimitive.Root
 
@@ -19,7 +19,7 @@ const DialogOverlay = React.forwardRef<
   <DialogPrimitive.Overlay
     ref={ref}
     className={cn(
-      "fixed inset-0 z-50 bg-background/80 backdrop-blur-sm 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-background/80 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',
       className
     )}
     {...props}
@@ -36,7 +36,7 @@ const DialogContent = React.forwardRef<
     <DialogPrimitive.Content
       ref={ref}
       className={cn(
-        "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 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-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg",
+        'fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 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-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg',
         className
       )}
       {...props}
@@ -51,33 +51,18 @@ const DialogContent = React.forwardRef<
 ))
 DialogContent.displayName = DialogPrimitive.Content.displayName
 
-const DialogHeader = ({
-  className,
-  ...props
-}: React.HTMLAttributes<HTMLDivElement>) => (
-  <div
-    className={cn(
-      "flex flex-col space-y-1.5 text-center sm:text-left",
-      className
-    )}
-    {...props}
-  />
+const DialogHeader = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (
+  <div className={cn('flex flex-col space-y-1.5 text-center sm:text-left', className)} {...props} />
 )
-DialogHeader.displayName = "DialogHeader"
+DialogHeader.displayName = 'DialogHeader'
 
-const DialogFooter = ({
-  className,
-  ...props
-}: React.HTMLAttributes<HTMLDivElement>) => (
+const DialogFooter = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (
   <div
-    className={cn(
-      "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
-      className
-    )}
+    className={cn('flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2', className)}
     {...props}
   />
 )
-DialogFooter.displayName = "DialogFooter"
+DialogFooter.displayName = 'DialogFooter'
 
 const DialogTitle = React.forwardRef<
   React.ElementRef<typeof DialogPrimitive.Title>,
@@ -85,10 +70,7 @@ const DialogTitle = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <DialogPrimitive.Title
     ref={ref}
-    className={cn(
-      "text-lg font-semibold leading-none tracking-tight",
-      className
-    )}
+    className={cn('text-lg font-semibold leading-none tracking-tight', className)}
     {...props}
   />
 ))
@@ -100,7 +82,7 @@ const DialogDescription = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <DialogPrimitive.Description
     ref={ref}
-    className={cn("text-sm text-muted-foreground", className)}
+    className={cn('text-sm text-muted-foreground', className)}
     {...props}
   />
 ))
@@ -108,13 +90,13 @@ DialogDescription.displayName = DialogPrimitive.Description.displayName
 
 export {
   Dialog,
-  DialogPortal,
-  DialogOverlay,
   DialogClose,
-  DialogTrigger,
   DialogContent,
-  DialogHeader,
-  DialogFooter,
-  DialogTitle,
   DialogDescription,
-}
\ No newline at end of file
+  DialogFooter,
+  DialogHeader,
+  DialogOverlay,
+  DialogPortal,
+  DialogTitle,
+  DialogTrigger,
+}
diff --git a/admin/src/components/ui/dropdown-menu.tsx b/admin/src/components/ui/dropdown-menu.tsx
index 3a79f44..6d53f82 100644
--- a/admin/src/components/ui/dropdown-menu.tsx
+++ b/admin/src/components/ui/dropdown-menu.tsx
@@ -1,8 +1,8 @@
-import * as React from "react"
-import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu"
-import { Check, ChevronRight, Circle } from "lucide-react"
+import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu'
+import { Check, ChevronRight, Circle } from 'lucide-react'
+import * as React from 'react'
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils'
 
 const DropdownMenu = DropdownMenuPrimitive.Root
 
@@ -25,8 +25,8 @@ const DropdownMenuSubTrigger = React.forwardRef<
   <DropdownMenuPrimitive.SubTrigger
     ref={ref}
     className={cn(
-      "flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent data-[state=open]:bg-accent",
-      inset && "pl-8",
+      'flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent data-[state=open]:bg-accent',
+      inset && 'pl-8',
       className
     )}
     {...props}
@@ -35,8 +35,7 @@ const DropdownMenuSubTrigger = React.forwardRef<
     <ChevronRight className="ml-auto h-4 w-4" />
   </DropdownMenuPrimitive.SubTrigger>
 ))
-DropdownMenuSubTrigger.displayName =
-  DropdownMenuPrimitive.SubTrigger.displayName
+DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName
 
 const DropdownMenuSubContent = React.forwardRef<
   React.ElementRef<typeof DropdownMenuPrimitive.SubContent>,
@@ -45,14 +44,13 @@ const DropdownMenuSubContent = React.forwardRef<
   <DropdownMenuPrimitive.SubContent
     ref={ref}
     className={cn(
-      "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg 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] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg 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',
       className
     )}
     {...props}
   />
 ))
-DropdownMenuSubContent.displayName =
-  DropdownMenuPrimitive.SubContent.displayName
+DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName
 
 const DropdownMenuContent = React.forwardRef<
   React.ElementRef<typeof DropdownMenuPrimitive.Content>,
@@ -63,7 +61,7 @@ const DropdownMenuContent = React.forwardRef<
       ref={ref}
       sideOffset={sideOffset}
       className={cn(
-        "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md 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] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md 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',
         className
       )}
       {...props}
@@ -81,8 +79,8 @@ const DropdownMenuItem = React.forwardRef<
   <DropdownMenuPrimitive.Item
     ref={ref}
     className={cn(
-      "relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
-      inset && "pl-8",
+      'relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
+      inset && 'pl-8',
       className
     )}
     {...props}
@@ -97,7 +95,7 @@ const DropdownMenuCheckboxItem = React.forwardRef<
   <DropdownMenuPrimitive.CheckboxItem
     ref={ref}
     className={cn(
-      "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      'relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
       className
     )}
     checked={checked}
@@ -111,8 +109,7 @@ const DropdownMenuCheckboxItem = React.forwardRef<
     {children}
   </DropdownMenuPrimitive.CheckboxItem>
 ))
-DropdownMenuCheckboxItem.displayName =
-  DropdownMenuPrimitive.CheckboxItem.displayName
+DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName
 
 const DropdownMenuRadioItem = React.forwardRef<
   React.ElementRef<typeof DropdownMenuPrimitive.RadioItem>,
@@ -121,7 +118,7 @@ const DropdownMenuRadioItem = React.forwardRef<
   <DropdownMenuPrimitive.RadioItem
     ref={ref}
     className={cn(
-      "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      'relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
       className
     )}
     {...props}
@@ -144,11 +141,7 @@ const DropdownMenuLabel = React.forwardRef<
 >(({ className, inset, ...props }, ref) => (
   <DropdownMenuPrimitive.Label
     ref={ref}
-    className={cn(
-      "px-2 py-1.5 text-sm font-semibold",
-      inset && "pl-8",
-      className
-    )}
+    className={cn('px-2 py-1.5 text-sm font-semibold', inset && 'pl-8', className)}
     {...props}
   />
 ))
@@ -160,39 +153,31 @@ const DropdownMenuSeparator = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <DropdownMenuPrimitive.Separator
     ref={ref}
-    className={cn("-mx-1 my-1 h-px bg-muted", className)}
+    className={cn('-mx-1 my-1 h-px bg-muted', className)}
     {...props}
   />
 ))
 DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName
 
-const DropdownMenuShortcut = ({
-  className,
-  ...props
-}: React.HTMLAttributes<HTMLSpanElement>) => {
-  return (
-    <span
-      className={cn("ml-auto text-xs tracking-widest opacity-60", className)}
-      {...props}
-    />
-  )
+const DropdownMenuShortcut = ({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>) => {
+  return <span className={cn('ml-auto text-xs tracking-widest opacity-60', className)} {...props} />
 }
-DropdownMenuShortcut.displayName = "DropdownMenuShortcut"
+DropdownMenuShortcut.displayName = 'DropdownMenuShortcut'
 
 export {
   DropdownMenu,
-  DropdownMenuTrigger,
-  DropdownMenuContent,
-  DropdownMenuItem,
   DropdownMenuCheckboxItem,
-  DropdownMenuRadioItem,
+  DropdownMenuContent,
+  DropdownMenuGroup,
+  DropdownMenuItem,
   DropdownMenuLabel,
+  DropdownMenuPortal,
+  DropdownMenuRadioGroup,
+  DropdownMenuRadioItem,
   DropdownMenuSeparator,
   DropdownMenuShortcut,
-  DropdownMenuGroup,
-  DropdownMenuPortal,
   DropdownMenuSub,
   DropdownMenuSubContent,
   DropdownMenuSubTrigger,
-  DropdownMenuRadioGroup,
-}
\ No newline at end of file
+  DropdownMenuTrigger,
+}
diff --git a/admin/src/components/ui/form.tsx b/admin/src/components/ui/form.tsx
index dd6a49a..33e8dd4 100644
--- a/admin/src/components/ui/form.tsx
+++ b/admin/src/components/ui/form.tsx
@@ -1,6 +1,6 @@
-import * as React from "react"
-import * as LabelPrimitive from "@radix-ui/react-label"
-import { Slot } from "@radix-ui/react-slot"
+import * as LabelPrimitive from '@radix-ui/react-label'
+import { Slot } from '@radix-ui/react-slot'
+import * as React from 'react'
 import {
   Controller,
   ControllerProps,
@@ -8,27 +8,25 @@ import {
   FieldValues,
   FormProvider,
   useFormContext,
-} from "react-hook-form"
+} from 'react-hook-form'
 
-import { cn } from "@/lib/utils"
-import { Label } from "@/components/ui/label"
+import { Label } from '@/components/ui/label'
+import { cn } from '@/lib/utils'
 
 const Form = FormProvider
 
 type FormFieldContextValue<
   TFieldValues extends FieldValues = FieldValues,
-  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>
+  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,
 > = {
   name: TName
 }
 
-const FormFieldContext = React.createContext<FormFieldContextValue>(
-  {} as FormFieldContextValue
-)
+const FormFieldContext = React.createContext<FormFieldContextValue>({} as FormFieldContextValue)
 
 const FormField = <
   TFieldValues extends FieldValues = FieldValues,
-  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>
+  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,
 >({
   ...props
 }: ControllerProps<TFieldValues, TName>) => {
@@ -47,7 +45,7 @@ const useFormField = () => {
   const fieldState = getFieldState(fieldContext.name, formState)
 
   if (!fieldContext) {
-    throw new Error("useFormField should be used within <FormField>")
+    throw new Error('useFormField should be used within <FormField>')
   }
 
   const { id } = itemContext
@@ -66,23 +64,20 @@ type FormItemContextValue = {
   id: string
 }
 
-const FormItemContext = React.createContext<FormItemContextValue>(
-  {} as FormItemContextValue
+const FormItemContext = React.createContext<FormItemContextValue>({} as FormItemContextValue)
+
+const FormItem = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+  ({ className, ...props }, ref) => {
+    const id = React.useId()
+
+    return (
+      <FormItemContext.Provider value={{ id }}>
+        <div ref={ref} className={cn('space-y-2', className)} {...props} />
+      </FormItemContext.Provider>
+    )
+  }
 )
-
-const FormItem = React.forwardRef<
-  HTMLDivElement,
-  React.HTMLAttributes<HTMLDivElement>
->(({ className, ...props }, ref) => {
-  const id = React.useId()
-
-  return (
-    <FormItemContext.Provider value={{ id }}>
-      <div ref={ref} className={cn("space-y-2", className)} {...props} />
-    </FormItemContext.Provider>
-  )
-})
-FormItem.displayName = "FormItem"
+FormItem.displayName = 'FormItem'
 
 const FormLabel = React.forwardRef<
   React.ElementRef<typeof LabelPrimitive.Root>,
@@ -93,13 +88,13 @@ const FormLabel = React.forwardRef<
   return (
     <Label
       ref={ref}
-      className={cn(error && "text-destructive", className)}
+      className={cn(error && 'text-destructive', className)}
       htmlFor={formItemId}
       {...props}
     />
   )
 })
-FormLabel.displayName = "FormLabel"
+FormLabel.displayName = 'FormLabel'
 
 const FormControl = React.forwardRef<
   React.ElementRef<typeof Slot>,
@@ -111,17 +106,13 @@ const FormControl = React.forwardRef<
     <Slot
       ref={ref}
       id={formItemId}
-      aria-describedby={
-        !error
-          ? `${formDescriptionId}`
-          : `${formDescriptionId} ${formMessageId}`
-      }
+      aria-describedby={!error ? `${formDescriptionId}` : `${formDescriptionId} ${formMessageId}`}
       aria-invalid={!!error}
       {...props}
     />
   )
 })
-FormControl.displayName = "FormControl"
+FormControl.displayName = 'FormControl'
 
 const FormDescription = React.forwardRef<
   HTMLParagraphElement,
@@ -133,12 +124,12 @@ const FormDescription = React.forwardRef<
     <p
       ref={ref}
       id={formDescriptionId}
-      className={cn("text-sm text-muted-foreground", className)}
+      className={cn('text-sm text-muted-foreground', className)}
       {...props}
     />
   )
 })
-FormDescription.displayName = "FormDescription"
+FormDescription.displayName = 'FormDescription'
 
 const FormMessage = React.forwardRef<
   HTMLParagraphElement,
@@ -155,22 +146,22 @@ const FormMessage = React.forwardRef<
     <p
       ref={ref}
       id={formMessageId}
-      className={cn("text-sm font-medium text-destructive", className)}
+      className={cn('text-sm font-medium text-destructive', className)}
       {...props}
     >
       {body}
     </p>
   )
 })
-FormMessage.displayName = "FormMessage"
+FormMessage.displayName = 'FormMessage'
 
 export {
-  useFormField,
   Form,
-  FormItem,
-  FormLabel,
   FormControl,
   FormDescription,
-  FormMessage,
   FormField,
-}
\ No newline at end of file
+  FormItem,
+  FormLabel,
+  FormMessage,
+  useFormField,
+}
diff --git a/admin/src/components/ui/input.tsx b/admin/src/components/ui/input.tsx
index 522915b..f396e4b 100644
--- a/admin/src/components/ui/input.tsx
+++ b/admin/src/components/ui/input.tsx
@@ -1,9 +1,8 @@
-import * as React from "react"
+import * as React from 'react'
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils'
 
-export interface InputProps
-  extends React.InputHTMLAttributes<HTMLInputElement> {}
+export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {}
 
 const Input = React.forwardRef<HTMLInputElement, InputProps>(
   ({ className, type, ...props }, ref) => {
@@ -11,7 +10,7 @@ const Input = React.forwardRef<HTMLInputElement, InputProps>(
       <input
         type={type}
         className={cn(
-          "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
+          'flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',
           className
         )}
         ref={ref}
@@ -20,6 +19,6 @@ const Input = React.forwardRef<HTMLInputElement, InputProps>(
     )
   }
 )
-Input.displayName = "Input"
+Input.displayName = 'Input'
 
-export { Input }
\ No newline at end of file
+export { Input }
diff --git a/admin/src/components/ui/label.tsx b/admin/src/components/ui/label.tsx
index a7cafcd..a6dfb02 100644
--- a/admin/src/components/ui/label.tsx
+++ b/admin/src/components/ui/label.tsx
@@ -1,24 +1,19 @@
-import * as React from "react"
-import * as LabelPrimitive from "@radix-ui/react-label"
-import { cva, type VariantProps } from "class-variance-authority"
+import * as LabelPrimitive from '@radix-ui/react-label'
+import { cva, type VariantProps } from 'class-variance-authority'
+import * as React from 'react'
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils'
 
 const labelVariants = cva(
-  "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+  'text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70'
 )
 
 const Label = React.forwardRef<
   React.ElementRef<typeof LabelPrimitive.Root>,
-  React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root> &
-    VariantProps<typeof labelVariants>
+  React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root> & VariantProps<typeof labelVariants>
 >(({ className, ...props }, ref) => (
-  <LabelPrimitive.Root
-    ref={ref}
-    className={cn(labelVariants(), className)}
-    {...props}
-  />
+  <LabelPrimitive.Root ref={ref} className={cn(labelVariants(), className)} {...props} />
 ))
 Label.displayName = LabelPrimitive.Root.displayName
 
-export { Label }
\ No newline at end of file
+export { Label }
diff --git a/admin/src/components/ui/progress.tsx b/admin/src/components/ui/progress.tsx
index e5ae975..c7cad06 100644
--- a/admin/src/components/ui/progress.tsx
+++ b/admin/src/components/ui/progress.tsx
@@ -1,7 +1,7 @@
-import * as React from "react"
-import * as ProgressPrimitive from "@radix-ui/react-progress"
+import * as ProgressPrimitive from '@radix-ui/react-progress'
+import * as React from 'react'
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils'
 
 const Progress = React.forwardRef<
   React.ElementRef<typeof ProgressPrimitive.Root>,
@@ -9,10 +9,7 @@ const Progress = React.forwardRef<
 >(({ className, value, ...props }, ref) => (
   <ProgressPrimitive.Root
     ref={ref}
-    className={cn(
-      "relative h-4 w-full overflow-hidden rounded-full bg-secondary",
-      className
-    )}
+    className={cn('relative h-4 w-full overflow-hidden rounded-full bg-secondary', className)}
     {...props}
   >
     <ProgressPrimitive.Indicator
@@ -23,4 +20,4 @@ const Progress = React.forwardRef<
 ))
 Progress.displayName = ProgressPrimitive.Root.displayName
 
-export { Progress }
\ No newline at end of file
+export { Progress }
diff --git a/admin/src/components/ui/select.tsx b/admin/src/components/ui/select.tsx
index 2b99b27..bff568a 100644
--- a/admin/src/components/ui/select.tsx
+++ b/admin/src/components/ui/select.tsx
@@ -1,8 +1,8 @@
-import * as React from "react"
-import * as SelectPrimitive from "@radix-ui/react-select"
-import { Check, ChevronDown, ChevronUp } from "lucide-react"
+import * as SelectPrimitive from '@radix-ui/react-select'
+import { Check, ChevronDown, ChevronUp } from 'lucide-react'
+import * as React from 'react'
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils'
 
 const Select = SelectPrimitive.Root
 
@@ -17,7 +17,7 @@ const SelectTrigger = React.forwardRef<
   <SelectPrimitive.Trigger
     ref={ref}
     className={cn(
-      "flex h-10 w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
+      'flex h-10 w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1',
       className
     )}
     {...props}
@@ -36,10 +36,7 @@ const SelectScrollUpButton = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <SelectPrimitive.ScrollUpButton
     ref={ref}
-    className={cn(
-      "flex cursor-default items-center justify-center py-1",
-      className
-    )}
+    className={cn('flex cursor-default items-center justify-center py-1', className)}
     {...props}
   >
     <ChevronUp className="h-4 w-4" />
@@ -53,29 +50,25 @@ const SelectScrollDownButton = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <SelectPrimitive.ScrollDownButton
     ref={ref}
-    className={cn(
-      "flex cursor-default items-center justify-center py-1",
-      className
-    )}
+    className={cn('flex cursor-default items-center justify-center py-1', className)}
     {...props}
   >
     <ChevronDown className="h-4 w-4" />
   </SelectPrimitive.ScrollDownButton>
 ))
-SelectScrollDownButton.displayName =
-  SelectPrimitive.ScrollDownButton.displayName
+SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName
 
 const SelectContent = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.Content>,
   React.ComponentPropsWithoutRef<typeof SelectPrimitive.Content>
->(({ className, children, position = "popper", ...props }, ref) => (
+>(({ className, children, position = 'popper', ...props }, ref) => (
   <SelectPrimitive.Portal>
     <SelectPrimitive.Content
       ref={ref}
       className={cn(
-        "relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md 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",
-        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",
+        'relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md 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',
+        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}
@@ -84,9 +77,9 @@ const SelectContent = React.forwardRef<
       <SelectScrollUpButton />
       <SelectPrimitive.Viewport
         className={cn(
-          "p-1",
-          position === "popper" &&
-            "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
+          'p-1',
+          position === 'popper' &&
+            'h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]'
         )}
       >
         {children}
@@ -103,7 +96,7 @@ const SelectLabel = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <SelectPrimitive.Label
     ref={ref}
-    className={cn("py-1.5 pl-8 pr-2 text-sm font-semibold", className)}
+    className={cn('py-1.5 pl-8 pr-2 text-sm font-semibold', className)}
     {...props}
   />
 ))
@@ -116,7 +109,7 @@ const SelectItem = React.forwardRef<
   <SelectPrimitive.Item
     ref={ref}
     className={cn(
-      "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      'relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
       className
     )}
     {...props}
@@ -138,7 +131,7 @@ const SelectSeparator = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <SelectPrimitive.Separator
     ref={ref}
-    className={cn("-mx-1 my-1 h-px bg-muted", className)}
+    className={cn('-mx-1 my-1 h-px bg-muted', className)}
     {...props}
   />
 ))
@@ -146,13 +139,13 @@ SelectSeparator.displayName = SelectPrimitive.Separator.displayName
 
 export {
   Select,
-  SelectGroup,
-  SelectValue,
-  SelectTrigger,
   SelectContent,
-  SelectLabel,
+  SelectGroup,
   SelectItem,
-  SelectSeparator,
-  SelectScrollUpButton,
+  SelectLabel,
   SelectScrollDownButton,
-}
\ No newline at end of file
+  SelectScrollUpButton,
+  SelectSeparator,
+  SelectTrigger,
+  SelectValue,
+}
diff --git a/admin/src/components/ui/separator.tsx b/admin/src/components/ui/separator.tsx
index ac15d7b..50085e9 100644
--- a/admin/src/components/ui/separator.tsx
+++ b/admin/src/components/ui/separator.tsx
@@ -1,29 +1,24 @@
-import * as React from "react"
-import * as SeparatorPrimitive from "@radix-ui/react-separator"
+import * as SeparatorPrimitive from '@radix-ui/react-separator'
+import * as React from 'react'
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils'
 
 const Separator = React.forwardRef<
   React.ElementRef<typeof SeparatorPrimitive.Root>,
   React.ComponentPropsWithoutRef<typeof SeparatorPrimitive.Root>
->(
-  (
-    { className, orientation = "horizontal", decorative = true, ...props },
-    ref
-  ) => (
-    <SeparatorPrimitive.Root
-      ref={ref}
-      decorative={decorative}
-      orientation={orientation}
-      className={cn(
-        "shrink-0 bg-border",
-        orientation === "horizontal" ? "h-[1px] w-full" : "h-full w-[1px]",
-        className
-      )}
-      {...props}
-    />
-  )
-)
+>(({ className, orientation = 'horizontal', decorative = true, ...props }, ref) => (
+  <SeparatorPrimitive.Root
+    ref={ref}
+    decorative={decorative}
+    orientation={orientation}
+    className={cn(
+      'shrink-0 bg-border',
+      orientation === 'horizontal' ? 'h-[1px] w-full' : 'h-full w-[1px]',
+      className
+    )}
+    {...props}
+  />
+))
 Separator.displayName = SeparatorPrimitive.Root.displayName
 
-export { Separator }
\ No newline at end of file
+export { Separator }
diff --git a/admin/src/components/ui/sheet.tsx b/admin/src/components/ui/sheet.tsx
index 6796d80..a1f5da8 100644
--- a/admin/src/components/ui/sheet.tsx
+++ b/admin/src/components/ui/sheet.tsx
@@ -1,9 +1,9 @@
-import * as React from "react"
-import * as SheetPrimitive from "@radix-ui/react-dialog"
-import { cva, type VariantProps } from "class-variance-authority"
-import { X } from "lucide-react"
+import * as SheetPrimitive from '@radix-ui/react-dialog'
+import { cva, type VariantProps } from 'class-variance-authority'
+import { X } from 'lucide-react'
+import * as React from 'react'
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils'
 
 const Sheet = SheetPrimitive.Root
 
@@ -19,7 +19,7 @@ const SheetOverlay = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <SheetPrimitive.Overlay
     className={cn(
-      "fixed inset-0 z-50 bg-background/80 backdrop-blur-sm 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-background/80 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',
       className
     )}
     {...props}
@@ -29,20 +29,20 @@ const SheetOverlay = React.forwardRef<
 SheetOverlay.displayName = SheetPrimitive.Overlay.displayName
 
 const sheetVariants = cva(
-  "fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:duration-500",
+  'fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:duration-500',
   {
     variants: {
       side: {
-        top: "inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",
+        top: 'inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top',
         bottom:
-          "inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom",
-        left: "inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm",
+          'inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom',
+        left: 'inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm',
         right:
-          "inset-y-0 right-0 h-full w-3/4  border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm",
+          'inset-y-0 right-0 h-full w-3/4  border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm',
       },
     },
     defaultVariants: {
-      side: "right",
+      side: 'right',
     },
   }
 )
@@ -54,14 +54,10 @@ interface SheetContentProps
 const SheetContent = React.forwardRef<
   React.ElementRef<typeof SheetPrimitive.Content>,
   SheetContentProps
->(({ side = "right", className, children, ...props }, ref) => (
+>(({ side = 'right', className, children, ...props }, ref) => (
   <SheetPortal>
     <SheetOverlay />
-    <SheetPrimitive.Content
-      ref={ref}
-      className={cn(sheetVariants({ side }), className)}
-      {...props}
-    >
+    <SheetPrimitive.Content ref={ref} className={cn(sheetVariants({ side }), className)} {...props}>
       {children}
       <SheetPrimitive.Close className="absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary">
         <X className="h-4 w-4" />
@@ -72,33 +68,18 @@ const SheetContent = React.forwardRef<
 ))
 SheetContent.displayName = SheetPrimitive.Content.displayName
 
-const SheetHeader = ({
-  className,
-  ...props
-}: React.HTMLAttributes<HTMLDivElement>) => (
-  <div
-    className={cn(
-      "flex flex-col space-y-2 text-center sm:text-left",
-      className
-    )}
-    {...props}
-  />
+const SheetHeader = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (
+  <div className={cn('flex flex-col space-y-2 text-center sm:text-left', className)} {...props} />
 )
-SheetHeader.displayName = "SheetHeader"
+SheetHeader.displayName = 'SheetHeader'
 
-const SheetFooter = ({
-  className,
-  ...props
-}: React.HTMLAttributes<HTMLDivElement>) => (
+const SheetFooter = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (
   <div
-    className={cn(
-      "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
-      className
-    )}
+    className={cn('flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2', className)}
     {...props}
   />
 )
-SheetFooter.displayName = "SheetFooter"
+SheetFooter.displayName = 'SheetFooter'
 
 const SheetTitle = React.forwardRef<
   React.ElementRef<typeof SheetPrimitive.Title>,
@@ -106,7 +87,7 @@ const SheetTitle = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <SheetPrimitive.Title
     ref={ref}
-    className={cn("text-lg font-semibold text-foreground", className)}
+    className={cn('text-lg font-semibold text-foreground', className)}
     {...props}
   />
 ))
@@ -118,7 +99,7 @@ const SheetDescription = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <SheetPrimitive.Description
     ref={ref}
-    className={cn("text-sm text-muted-foreground", className)}
+    className={cn('text-sm text-muted-foreground', className)}
     {...props}
   />
 ))
@@ -126,13 +107,13 @@ SheetDescription.displayName = SheetPrimitive.Description.displayName
 
 export {
   Sheet,
-  SheetPortal,
-  SheetOverlay,
-  SheetTrigger,
   SheetClose,
   SheetContent,
-  SheetHeader,
-  SheetFooter,
-  SheetTitle,
   SheetDescription,
-}
\ No newline at end of file
+  SheetFooter,
+  SheetHeader,
+  SheetOverlay,
+  SheetPortal,
+  SheetTitle,
+  SheetTrigger,
+}
diff --git a/admin/src/components/ui/skeleton.tsx b/admin/src/components/ui/skeleton.tsx
index 96f9725..cfaa70b 100644
--- a/admin/src/components/ui/skeleton.tsx
+++ b/admin/src/components/ui/skeleton.tsx
@@ -1,16 +1,8 @@
-import React from "react"
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils'
+import React from 'react'
 
-function Skeleton({
-  className,
-  ...props
-}: React.HTMLAttributes<HTMLDivElement>) {
-  return (
-    <div
-      className={cn("animate-pulse rounded-md bg-muted", className)}
-      {...props}
-    />
-  )
+function Skeleton({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) {
+  return <div className={cn('animate-pulse rounded-md bg-muted', className)} {...props} />
 }
 
-export { Skeleton }
\ No newline at end of file
+export { Skeleton }
diff --git a/admin/src/components/ui/switch.tsx b/admin/src/components/ui/switch.tsx
index 16c7b50..cceff60 100644
--- a/admin/src/components/ui/switch.tsx
+++ b/admin/src/components/ui/switch.tsx
@@ -1,7 +1,7 @@
-import * as React from "react"
-import * as SwitchPrimitives from "@radix-ui/react-switch"
+import * as SwitchPrimitives from '@radix-ui/react-switch'
+import * as React from 'react'
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils'
 
 const Switch = React.forwardRef<
   React.ElementRef<typeof SwitchPrimitives.Root>,
@@ -9,7 +9,7 @@ const Switch = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <SwitchPrimitives.Root
     className={cn(
-      "peer inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input",
+      'peer inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input',
       className
     )}
     {...props}
@@ -17,11 +17,11 @@ const Switch = React.forwardRef<
   >
     <SwitchPrimitives.Thumb
       className={cn(
-        "pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0"
+        'pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0'
       )}
     />
   </SwitchPrimitives.Root>
 ))
 Switch.displayName = SwitchPrimitives.Root.displayName
 
-export { Switch }
\ No newline at end of file
+export { Switch }
diff --git a/admin/src/components/ui/table.tsx b/admin/src/components/ui/table.tsx
index f0be58f..f5b0e5e 100644
--- a/admin/src/components/ui/table.tsx
+++ b/admin/src/components/ui/table.tsx
@@ -1,40 +1,31 @@
-import * as React from "react"
+import * as React from 'react'
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils'
 
-const Table = React.forwardRef<
-  HTMLTableElement,
-  React.HTMLAttributes<HTMLTableElement>
->(({ className, ...props }, ref) => (
-  <div className="relative w-full overflow-auto">
-    <table
-      ref={ref}
-      className={cn("w-full caption-bottom text-sm", className)}
-      {...props}
-    />
-  </div>
-))
-Table.displayName = "Table"
+const Table = React.forwardRef<HTMLTableElement, React.HTMLAttributes<HTMLTableElement>>(
+  ({ className, ...props }, ref) => (
+    <div className="relative w-full overflow-auto">
+      <table ref={ref} className={cn('w-full caption-bottom text-sm', className)} {...props} />
+    </div>
+  )
+)
+Table.displayName = 'Table'
 
 const TableHeader = React.forwardRef<
   HTMLTableSectionElement,
   React.HTMLAttributes<HTMLTableSectionElement>
 >(({ className, ...props }, ref) => (
-  <thead ref={ref} className={cn("[&_tr]:border-b", className)} {...props} />
+  <thead ref={ref} className={cn('[&_tr]:border-b', className)} {...props} />
 ))
-TableHeader.displayName = "TableHeader"
+TableHeader.displayName = 'TableHeader'
 
 const TableBody = React.forwardRef<
   HTMLTableSectionElement,
   React.HTMLAttributes<HTMLTableSectionElement>
 >(({ className, ...props }, ref) => (
-  <tbody
-    ref={ref}
-    className={cn("[&_tr:last-child]:border-0", className)}
-    {...props}
-  />
+  <tbody ref={ref} className={cn('[&_tr:last-child]:border-0', className)} {...props} />
 ))
-TableBody.displayName = "TableBody"
+TableBody.displayName = 'TableBody'
 
 const TableFooter = React.forwardRef<
   HTMLTableSectionElement,
@@ -42,29 +33,25 @@ const TableFooter = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <tfoot
     ref={ref}
-    className={cn(
-      "border-t bg-muted/50 font-medium [&>tr]:last:border-b-0",
-      className
-    )}
+    className={cn('border-t bg-muted/50 font-medium [&>tr]:last:border-b-0', className)}
     {...props}
   />
 ))
-TableFooter.displayName = "TableFooter"
+TableFooter.displayName = 'TableFooter'
 
-const TableRow = React.forwardRef<
-  HTMLTableRowElement,
-  React.HTMLAttributes<HTMLTableRowElement>
->(({ className, ...props }, ref) => (
-  <tr
-    ref={ref}
-    className={cn(
-      "border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted",
-      className
-    )}
-    {...props}
-  />
-))
-TableRow.displayName = "TableRow"
+const TableRow = React.forwardRef<HTMLTableRowElement, React.HTMLAttributes<HTMLTableRowElement>>(
+  ({ className, ...props }, ref) => (
+    <tr
+      ref={ref}
+      className={cn(
+        'border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted',
+        className
+      )}
+      {...props}
+    />
+  )
+)
+TableRow.displayName = 'TableRow'
 
 const TableHead = React.forwardRef<
   HTMLTableCellElement,
@@ -73,13 +60,13 @@ const TableHead = React.forwardRef<
   <th
     ref={ref}
     className={cn(
-      "h-12 px-4 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0",
+      'h-12 px-4 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0',
       className
     )}
     {...props}
   />
 ))
-TableHead.displayName = "TableHead"
+TableHead.displayName = 'TableHead'
 
 const TableCell = React.forwardRef<
   HTMLTableCellElement,
@@ -87,31 +74,18 @@ const TableCell = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <td
     ref={ref}
-    className={cn("p-4 align-middle [&:has([role=checkbox])]:pr-0", className)}
+    className={cn('p-4 align-middle [&:has([role=checkbox])]:pr-0', className)}
     {...props}
   />
 ))
-TableCell.displayName = "TableCell"
+TableCell.displayName = 'TableCell'
 
 const TableCaption = React.forwardRef<
   HTMLTableCaptionElement,
   React.HTMLAttributes<HTMLTableCaptionElement>
 >(({ className, ...props }, ref) => (
-  <caption
-    ref={ref}
-    className={cn("mt-4 text-sm text-muted-foreground", className)}
-    {...props}
-  />
+  <caption ref={ref} className={cn('mt-4 text-sm text-muted-foreground', className)} {...props} />
 ))
-TableCaption.displayName = "TableCaption"
+TableCaption.displayName = 'TableCaption'
 
-export {
-  Table,
-  TableHeader,
-  TableBody,
-  TableFooter,
-  TableHead,
-  TableRow,
-  TableCell,
-  TableCaption,
-}
\ No newline at end of file
+export { Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow }
diff --git a/admin/src/components/ui/textarea.tsx b/admin/src/components/ui/textarea.tsx
index 83caa9b..7417d6c 100644
--- a/admin/src/components/ui/textarea.tsx
+++ b/admin/src/components/ui/textarea.tsx
@@ -1,16 +1,15 @@
-import * as React from "react"
+import * as React from 'react'
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils'
 
-export interface TextareaProps
-  extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {}
+export interface TextareaProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {}
 
 const Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(
   ({ className, ...props }, ref) => {
     return (
       <textarea
         className={cn(
-          "flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
+          'flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',
           className
         )}
         ref={ref}
@@ -19,6 +18,6 @@ const Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(
     )
   }
 )
-Textarea.displayName = "Textarea"
+Textarea.displayName = 'Textarea'
 
-export { Textarea }
\ No newline at end of file
+export { Textarea }
diff --git a/admin/src/components/ui/toast.tsx b/admin/src/components/ui/toast.tsx
index d01317f..918a702 100644
--- a/admin/src/components/ui/toast.tsx
+++ b/admin/src/components/ui/toast.tsx
@@ -1,9 +1,9 @@
-import * as React from "react"
-import * as ToastPrimitives from "@radix-ui/react-toast"
-import { cva, type VariantProps } from "class-variance-authority"
-import { X } from "lucide-react"
+import * as ToastPrimitives from '@radix-ui/react-toast'
+import { cva, type VariantProps } from 'class-variance-authority'
+import { X } from 'lucide-react'
+import * as React from 'react'
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils'
 
 const ToastProvider = ToastPrimitives.Provider
 
@@ -14,7 +14,7 @@ const ToastViewport = React.forwardRef<
   <ToastPrimitives.Viewport
     ref={ref}
     className={cn(
-      "fixed top-0 z-[100] flex max-h-screen w-full flex-col-reverse p-4 sm:bottom-0 sm:right-0 sm:top-auto sm:flex-col md:max-w-[420px]",
+      'fixed top-0 z-[100] flex max-h-screen w-full flex-col-reverse p-4 sm:bottom-0 sm:right-0 sm:top-auto sm:flex-col md:max-w-[420px]',
       className
     )}
     {...props}
@@ -23,25 +23,23 @@ const ToastViewport = React.forwardRef<
 ToastViewport.displayName = ToastPrimitives.Viewport.displayName
 
 const toastVariants = cva(
-  "group pointer-events-auto relative flex w-full items-center justify-between space-x-4 overflow-hidden rounded-md border p-6 pr-8 shadow-lg transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-top-full data-[state=open]:sm:slide-in-from-bottom-full",
+  'group pointer-events-auto relative flex w-full items-center justify-between space-x-4 overflow-hidden rounded-md border p-6 pr-8 shadow-lg transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-top-full data-[state=open]:sm:slide-in-from-bottom-full',
   {
     variants: {
       variant: {
-        default: "border bg-background text-foreground",
-        destructive:
-          "destructive border-destructive bg-destructive text-destructive-foreground",
+        default: 'border bg-background text-foreground',
+        destructive: 'destructive border-destructive bg-destructive text-destructive-foreground',
       },
     },
     defaultVariants: {
-      variant: "default",
+      variant: 'default',
     },
   }
 )
 
 const Toast = React.forwardRef<
   React.ElementRef<typeof ToastPrimitives.Root>,
-  React.ComponentPropsWithoutRef<typeof ToastPrimitives.Root> &
-    VariantProps<typeof toastVariants>
+  React.ComponentPropsWithoutRef<typeof ToastPrimitives.Root> & VariantProps<typeof toastVariants>
 >(({ className, variant, ...props }, ref) => {
   return (
     <ToastPrimitives.Root
@@ -60,7 +58,7 @@ const ToastAction = React.forwardRef<
   <ToastPrimitives.Action
     ref={ref}
     className={cn(
-      "inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 text-sm font-medium ring-offset-background transition-colors hover:bg-secondary focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 group-[.destructive]:border-muted/40 group-[.destructive]:hover:border-destructive/30 group-[.destructive]:hover:bg-destructive group-[.destructive]:hover:text-destructive-foreground group-[.destructive]:focus:ring-destructive",
+      'inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 text-sm font-medium ring-offset-background transition-colors hover:bg-secondary focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 group-[.destructive]:border-muted/40 group-[.destructive]:hover:border-destructive/30 group-[.destructive]:hover:bg-destructive group-[.destructive]:hover:text-destructive-foreground group-[.destructive]:focus:ring-destructive',
       className
     )}
     {...props}
@@ -75,7 +73,7 @@ const ToastClose = React.forwardRef<
   <ToastPrimitives.Close
     ref={ref}
     className={cn(
-      "absolute right-2 top-2 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-2 group-hover:opacity-100 group-[.destructive]:text-red-300 group-[.destructive]:hover:text-red-50 group-[.destructive]:focus:ring-red-400 group-[.destructive]:focus:ring-offset-red-600",
+      'absolute right-2 top-2 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-2 group-hover:opacity-100 group-[.destructive]:text-red-300 group-[.destructive]:hover:text-red-50 group-[.destructive]:focus:ring-red-400 group-[.destructive]:focus:ring-offset-red-600',
       className
     )}
     toast-close=""
@@ -90,11 +88,7 @@ const ToastTitle = React.forwardRef<
   React.ElementRef<typeof ToastPrimitives.Title>,
   React.ComponentPropsWithoutRef<typeof ToastPrimitives.Title>
 >(({ className, ...props }, ref) => (
-  <ToastPrimitives.Title
-    ref={ref}
-    className={cn("text-sm font-semibold", className)}
-    {...props}
-  />
+  <ToastPrimitives.Title ref={ref} className={cn('text-sm font-semibold', className)} {...props} />
 ))
 ToastTitle.displayName = ToastPrimitives.Title.displayName
 
@@ -104,7 +98,7 @@ const ToastDescription = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <ToastPrimitives.Description
     ref={ref}
-    className={cn("text-sm opacity-90", className)}
+    className={cn('text-sm opacity-90', className)}
     {...props}
   />
 ))
@@ -115,13 +109,13 @@ type ToastProps = React.ComponentPropsWithoutRef<typeof Toast>
 type ToastActionElement = React.ReactElement<typeof ToastAction>
 
 export {
-  type ToastProps,
-  type ToastActionElement,
-  ToastProvider,
-  ToastViewport,
   Toast,
-  ToastTitle,
-  ToastDescription,
-  ToastClose,
   ToastAction,
-}
\ No newline at end of file
+  ToastClose,
+  ToastDescription,
+  ToastProvider,
+  ToastTitle,
+  ToastViewport,
+  type ToastActionElement,
+  type ToastProps,
+}
diff --git a/admin/src/index.css b/admin/src/index.css
index efc8b94..1a4037e 100644
--- a/admin/src/index.css
+++ b/admin/src/index.css
@@ -56,4 +56,4 @@
   body {
     @apply bg-background text-foreground;
   }
-}
\ No newline at end of file
+}
diff --git a/admin/src/lib/utils.ts b/admin/src/lib/utils.ts
index a670a38..8a290d5 100644
--- a/admin/src/lib/utils.ts
+++ b/admin/src/lib/utils.ts
@@ -1,5 +1,5 @@
-import { type ClassValue, clsx } from "clsx"
-import { twMerge } from "tailwind-merge"
+import { type ClassValue, clsx } from 'clsx'
+import { twMerge } from 'tailwind-merge'
 
 export function cn(...inputs: ClassValue[]) {
   return twMerge(clsx(inputs))
@@ -7,11 +7,11 @@ export function cn(...inputs: ClassValue[]) {
 
 export function formatFileSize(bytes: number): string {
   if (bytes === 0) return '0 Bytes'
-  
+
   const k = 1024
   const sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB']
   const i = Math.floor(Math.log(bytes) / Math.log(k))
-  
+
   return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i]
 }
 
@@ -54,7 +54,7 @@ export function debounce<T extends (...args: any[]) => any>(
   wait: number
 ): (...args: Parameters<T>) => void {
   let timeout: ReturnType<typeof setTimeout> | null = null
-  
+
   return (...args: Parameters<T>) => {
     if (timeout) clearTimeout(timeout)
     timeout = setTimeout(() => func(...args), wait)
@@ -62,7 +62,14 @@ export function debounce<T extends (...args: any[]) => any>(
 }
 
 export function isImageFile(file: File): boolean {
-  const imageTypes = ['image/jpeg', 'image/jpg', 'image/png', 'image/gif', 'image/webp', 'image/bmp']
+  const imageTypes = [
+    'image/jpeg',
+    'image/jpg',
+    'image/png',
+    'image/gif',
+    'image/webp',
+    'image/bmp',
+  ]
   return imageTypes.includes(file.type)
 }
 
@@ -70,17 +77,17 @@ export function getImageDimensions(file: File): Promise<{ width: number; height:
   return new Promise((resolve, reject) => {
     const img = new Image()
     const url = URL.createObjectURL(file)
-    
+
     img.onload = () => {
       URL.revokeObjectURL(url)
       resolve({ width: img.naturalWidth, height: img.naturalHeight })
     }
-    
+
     img.onerror = () => {
       URL.revokeObjectURL(url)
       reject(new Error('Failed to load image'))
     }
-    
+
     img.src = url
   })
-}
\ No newline at end of file
+}
diff --git a/admin/src/main.tsx b/admin/src/main.tsx
index cc80a45..9a1e45b 100644
--- a/admin/src/main.tsx
+++ b/admin/src/main.tsx
@@ -1,8 +1,8 @@
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
+import { ReactQueryDevtools } from '@tanstack/react-query-devtools'
 import React from 'react'
 import ReactDOM from 'react-dom/client'
 import { BrowserRouter } from 'react-router-dom'
-import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
-import { ReactQueryDevtools } from '@tanstack/react-query-devtools'
 import App from './App'
 import Toaster from './components/Toaster'
 import './index.css'
@@ -25,5 +25,5 @@ ReactDOM.createRoot(document.getElementById('root')!).render(
         <ReactQueryDevtools initialIsOpen={false} />
       </BrowserRouter>
     </QueryClientProvider>
-  </React.StrictMode>,
-)
\ No newline at end of file
+  </React.StrictMode>
+)
diff --git a/admin/src/pages/Categories.tsx b/admin/src/pages/Categories.tsx
index 6fbfb52..17f5599 100644
--- a/admin/src/pages/Categories.tsx
+++ b/admin/src/pages/Categories.tsx
@@ -1,32 +1,43 @@
-import { useState } from 'react'
-import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query'
-import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
-import { Button } from '@/components/ui/button'
-import { Input } from '@/components/ui/input'
 import { Badge } from '@/components/ui/badge'
-import { Skeleton } from '@/components/ui/skeleton'
-import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from '@/components/ui/dropdown-menu'
-import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription } from '@/components/ui/dialog'
+import { Button } from '@/components/ui/button'
+import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogHeader,
+  DialogTitle,
+} from '@/components/ui/dialog'
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from '@/components/ui/dropdown-menu'
+import { Input } from '@/components/ui/input'
 import { Label } from '@/components/ui/label'
+import { Skeleton } from '@/components/ui/skeleton'
 import { Textarea } from '@/components/ui/textarea'
-import { 
-  FolderOpen, 
-  FolderPlus, 
-  MoreVertical,
-  Edit,
-  Trash,
-  Plus,
-  Search,
-  TreePine,
+import { categoryService } from '@/services/categoryService'
+import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'
+import {
   ChevronDown,
   ChevronRight,
-  Folder,
-  RefreshCw,
+  Edit,
   Eye,
   EyeOff,
+  Folder,
+  FolderOpen,
+  FolderPlus,
+  MoreVertical,
+  Plus,
+  RefreshCw,
+  Search,
+  Trash,
+  TreePine,
 } from 'lucide-react'
+import { useState } from 'react'
 import { toast } from 'sonner'
-import { categoryService } from '@/services/categoryService'
 
 interface CategoryWithChildren {
   id: number
@@ -43,28 +54,28 @@ export default function Categories() {
   const queryClient = useQueryClient()
   const [search, setSearch] = useState('')
   const [expandedCategories, setExpandedCategories] = useState<Set<number>>(new Set())
-  
+
   // Dialog states
   const [isCreateDialogOpen, setIsCreateDialogOpen] = useState(false)
   const [isEditDialogOpen, setIsEditDialogOpen] = useState(false)
   const [editingCategory, setEditingCategory] = useState<CategoryWithChildren | null>(null)
-  
+
   // Form state
   const [categoryForm, setCategoryForm] = useState({
     name: '',
-    description: ''
+    description: '',
   })
 
   // 获取分类树
   const { data: categories, isLoading: categoriesLoading } = useQuery({
     queryKey: ['categories-tree'],
-    queryFn: categoryService.getCategoryTree
+    queryFn: categoryService.getCategoryTree,
   })
 
   // 获取分类统计
   const { data: stats, isLoading: statsLoading } = useQuery({
     queryKey: ['category-stats'],
-    queryFn: categoryService.getStats
+    queryFn: categoryService.getStats,
   })
 
   // 删除分类
@@ -78,9 +89,9 @@ export default function Categories() {
     },
     onError: (error: any) => {
       toast.error(error?.message || '删除失败')
-    }
+    },
   })
-  
+
   // 创建分类
   const createCategoryMutation = useMutation({
     mutationFn: categoryService.createCategory,
@@ -94,12 +105,12 @@ export default function Categories() {
     },
     onError: (error: any) => {
       toast.error(error?.message || '创建失败')
-    }
+    },
   })
-  
+
   // 更新分类
   const updateCategoryMutation = useMutation({
-    mutationFn: ({ id, data }: { id: number, data: any }) => 
+    mutationFn: ({ id, data }: { id: number; data: any }) =>
       categoryService.updateCategory(id, data),
     onSuccess: () => {
       queryClient.invalidateQueries({ queryKey: ['categories-tree'] })
@@ -112,72 +123,71 @@ export default function Categories() {
     },
     onError: (error: any) => {
       toast.error(error?.message || '更新失败')
-    }
+    },
   })
 
   // 重置表单
   const resetForm = () => {
     setCategoryForm({
       name: '',
-      description: ''
+      description: '',
     })
   }
-  
+
   // 处理删除分类
   const handleDeleteCategory = (categoryId: number) => {
     if (confirm('确定要删除这个分类吗？删除后不可恢复！')) {
       deleteCategoryMutation.mutate(categoryId)
     }
   }
-  
+
   // 处理创建分类
   const handleCreateCategory = () => {
     resetForm()
     setIsCreateDialogOpen(true)
   }
-  
+
   // 处理编辑分类
   const handleEditCategory = (category: CategoryWithChildren) => {
     setEditingCategory(category)
     setCategoryForm({
       name: category.name,
-      description: category.description
+      description: category.description,
     })
     setIsEditDialogOpen(true)
   }
-  
+
   // 提交创建
   const handleSubmitCreate = () => {
     if (!categoryForm.name.trim()) {
       toast.error('请输入分类名称')
       return
     }
-    
+
     createCategoryMutation.mutate({
       name: categoryForm.name,
-      description: categoryForm.description
+      description: categoryForm.description,
     })
   }
-  
+
   // 提交编辑
   const handleSubmitEdit = () => {
     if (!editingCategory) return
-    
+
     if (!categoryForm.name.trim()) {
       toast.error('请输入分类名称')
       return
     }
-    
+
     updateCategoryMutation.mutate({
       id: editingCategory.id,
       data: {
         name: categoryForm.name,
-        description: categoryForm.description
-      }
+        description: categoryForm.description,
+      },
     })
   }
-  
-  
+
   // 切换展开状态
   const toggleExpanded = (categoryId: number) => {
     const newExpanded = new Set(expandedCategories)
@@ -188,7 +198,7 @@ export default function Categories() {
     }
     setExpandedCategories(newExpanded)
   }
-  
+
   // 刷新数据
   const handleRefresh = () => {
     queryClient.invalidateQueries({ queryKey: ['categories-tree'] })
@@ -197,21 +207,24 @@ export default function Categories() {
   }
 
   const renderCategoryTree = (categories: CategoryWithChildren[], level = 0) => {
-    const filteredCategories = categories?.filter(category => 
-      search === '' || 
-      category.name.toLowerCase().includes(search.toLowerCase()) ||
-      category.description.toLowerCase().includes(search.toLowerCase())
+    const filteredCategories = categories?.filter(
+      category =>
+        search === '' ||
+        category.name.toLowerCase().includes(search.toLowerCase()) ||
+        category.description.toLowerCase().includes(search.toLowerCase())
     )
-    
-    return filteredCategories?.map((category) => {
+
+    return filteredCategories?.map(category => {
       const hasChildren = category.children && category.children.length > 0
       const isExpanded = expandedCategories.has(category.id)
-      
+
       return (
         <div key={category.id} className="mb-2">
-          <div className={`flex items-center justify-between p-3 border rounded-lg hover:shadow-sm transition-shadow ${
-            level > 0 ? 'ml-6 border-l-4 border-l-primary/20' : ''
-          } ${category.isActive === false ? 'opacity-60 bg-gray-50' : ''}`}>
+          <div
+            className={`flex items-center justify-between p-3 border rounded-lg hover:shadow-sm transition-shadow ${
+              level > 0 ? 'ml-6 border-l-4 border-l-primary/20' : ''
+            } ${category.isActive === false ? 'opacity-60 bg-gray-50' : ''}`}
+          >
             <div className="flex items-center space-x-3">
               {/* 展开/收起按钮 */}
               {hasChildren ? (
@@ -230,14 +243,14 @@ export default function Categories() {
               ) : (
                 <div className="w-6" />
               )}
-              
+
               {/* 分类图标 */}
               {hasChildren ? (
                 <Folder className="h-5 w-5 text-blue-500" />
               ) : (
                 <FolderOpen className="h-5 w-5 text-green-500" />
               )}
-              
+
               {/* 分类信息 */}
               <div className="flex-1">
                 <div className="flex items-center space-x-2">
@@ -253,26 +266,18 @@ export default function Categories() {
                       禁用
                     </Badge>
                   )}
-                  <Badge variant="outline">
-                    {category.photoCount || 0} 张照片
-                  </Badge>
-                  {level > 0 && (
-                    <Badge variant="secondary">
-                      子分类
-                    </Badge>
-                  )}
+                  <Badge variant="outline">{category.photoCount || 0} 张照片</Badge>
+                  {level > 0 && <Badge variant="secondary">子分类</Badge>}
                 </div>
                 {category.description && (
                   <p className="text-sm text-muted-foreground mt-1">{category.description}</p>
                 )}
                 {category.slug && (
-                  <p className="text-xs text-muted-foreground mt-1">
-                    Slug: {category.slug}
-                  </p>
+                  <p className="text-xs text-muted-foreground mt-1">Slug: {category.slug}</p>
                 )}
               </div>
             </div>
-            
+
             <DropdownMenu>
               <DropdownMenuTrigger asChild>
                 <Button variant="ghost" size="sm">
@@ -288,9 +293,12 @@ export default function Categories() {
                   <FolderPlus className="h-4 w-4 mr-2" />
                   添加子分类
                 </DropdownMenuItem>
-                <DropdownMenuItem 
+                <DropdownMenuItem
                   onClick={() => handleDeleteCategory(category.id)}
-                  disabled={(category.photoCount || 0) > 0 || (category.children && category.children.length > 0)}
+                  disabled={
+                    (category.photoCount || 0) > 0 ||
+                    (category.children && category.children.length > 0)
+                  }
                   className="text-destructive"
                 >
                   <Trash className="h-4 w-4 mr-2" />
@@ -299,11 +307,9 @@ export default function Categories() {
               </DropdownMenuContent>
             </DropdownMenu>
           </div>
-          
+
           {hasChildren && isExpanded && (
-            <div className="mt-2">
-              {renderCategoryTree(category.children || [], level + 1)}
-            </div>
+            <div className="mt-2">{renderCategoryTree(category.children || [], level + 1)}</div>
           )}
         </div>
       )
@@ -316,9 +322,7 @@ export default function Categories() {
       <div className="flex items-center justify-between mb-8">
         <div>
           <h1 className="text-3xl font-bold">分类管理</h1>
-          <p className="text-muted-foreground mt-1">
-            管理照片分类和相册结构
-          </p>
+          <p className="text-muted-foreground mt-1">管理照片分类和相册结构</p>
         </div>
         <div className="flex gap-2">
           <Button onClick={() => handleCreateCategory()} className="flex items-center gap-2">
@@ -385,7 +389,12 @@ export default function Categories() {
               <Skeleton className="h-8 w-20" />
             ) : (
               <div className="text-2xl font-bold text-purple-600">
-                {stats?.data?.total ? Math.round(Object.values(stats.data.photoCounts || {}).reduce((a, b) => a + b, 0) / stats.data.total) : 0}
+                {stats?.data?.total
+                  ? Math.round(
+                      Object.values(stats.data.photoCounts || {}).reduce((a, b) => a + b, 0) /
+                        stats.data.total
+                    )
+                  : 0}
               </div>
             )}
           </CardContent>
@@ -401,21 +410,20 @@ export default function Categories() {
               <Input
                 placeholder="搜索分类..."
                 value={search}
-                onChange={(e) => setSearch(e.target.value)}
+                onChange={e => setSearch(e.target.value)}
                 className="pl-10"
               />
             </div>
             <div className="flex gap-2">
-              <Button 
-                variant="outline" 
-                onClick={() => setExpandedCategories(new Set((categories?.data || []).map((c: any) => c.id)))}
+              <Button
+                variant="outline"
+                onClick={() =>
+                  setExpandedCategories(new Set((categories?.data || []).map((c: any) => c.id)))
+                }
               >
                 展开全部
               </Button>
-              <Button 
-                variant="outline" 
-                onClick={() => setExpandedCategories(new Set())}
-              >
+              <Button variant="outline" onClick={() => setExpandedCategories(new Set())}>
                 收起全部
               </Button>
             </div>
@@ -450,9 +458,7 @@ export default function Categories() {
             <div className="text-center py-12">
               <FolderOpen className="h-16 w-16 mx-auto mb-4 text-gray-300" />
               <h3 className="text-lg font-medium mb-2">暂无分类</h3>
-              <p className="text-muted-foreground mb-4">
-                创建您的第一个分类来组织照片
-              </p>
+              <p className="text-muted-foreground mb-4">创建您的第一个分类来组织照片</p>
               <Button onClick={() => handleCreateCategory()}>
                 <Plus className="h-4 w-4 mr-2" />
                 创建分类
@@ -461,95 +467,85 @@ export default function Categories() {
           )}
         </CardContent>
       </Card>
-      
+
       {/* 创建分类对话框 */}
       <Dialog open={isCreateDialogOpen} onOpenChange={setIsCreateDialogOpen}>
         <DialogContent className="sm:max-w-[425px]">
           <DialogHeader>
             <DialogTitle>创建分类</DialogTitle>
-            <DialogDescription>
-              添加新的照片分类来组织您的作品
-            </DialogDescription>
+            <DialogDescription>添加新的照片分类来组织您的作品</DialogDescription>
           </DialogHeader>
-          
+
           <div className="space-y-4 py-4">
             <div>
               <Label htmlFor="create-name">分类名称 *</Label>
               <Input
                 id="create-name"
                 value={categoryForm.name}
-                onChange={(e) => setCategoryForm(prev => ({ ...prev, name: e.target.value }))}
+                onChange={e => setCategoryForm(prev => ({ ...prev, name: e.target.value }))}
                 placeholder="输入分类名称"
               />
             </div>
-            
+
             <div>
               <Label htmlFor="create-description">描述</Label>
               <Textarea
                 id="create-description"
                 value={categoryForm.description}
-                onChange={(e) => setCategoryForm(prev => ({ ...prev, description: e.target.value }))}
+                onChange={e => setCategoryForm(prev => ({ ...prev, description: e.target.value }))}
                 placeholder="分类描述（可选）"
                 rows={3}
               />
             </div>
           </div>
-          
+
           <div className="flex justify-end gap-2">
             <Button variant="outline" onClick={() => setIsCreateDialogOpen(false)}>
               取消
             </Button>
-            <Button 
-              onClick={handleSubmitCreate} 
-              disabled={createCategoryMutation.isPending}
-            >
+            <Button onClick={handleSubmitCreate} disabled={createCategoryMutation.isPending}>
               {createCategoryMutation.isPending ? '创建中...' : '创建分类'}
             </Button>
           </div>
         </DialogContent>
       </Dialog>
-      
+
       {/* 编辑分类对话框 */}
       <Dialog open={isEditDialogOpen} onOpenChange={setIsEditDialogOpen}>
         <DialogContent className="sm:max-w-[425px]">
           <DialogHeader>
             <DialogTitle>编辑分类</DialogTitle>
-            <DialogDescription>
-              修改分类的基本信息
-            </DialogDescription>
+            <DialogDescription>修改分类的基本信息</DialogDescription>
           </DialogHeader>
-          
+
           <div className="space-y-4 py-4">
             <div>
               <Label htmlFor="edit-name">分类名称 *</Label>
               <Input
                 id="edit-name"
                 value={categoryForm.name}
-                onChange={(e) => setCategoryForm(prev => ({ ...prev, name: e.target.value }))}
+                onChange={e => setCategoryForm(prev => ({ ...prev, name: e.target.value }))}
                 placeholder="输入分类名称"
               />
             </div>
-            
+
             <div>
               <Label htmlFor="edit-description">描述</Label>
               <Textarea
                 id="edit-description"
                 value={categoryForm.description}
-                onChange={(e) => setCategoryForm(prev => ({ ...prev, description: e.target.value }))}
+                onChange={e => setCategoryForm(prev => ({ ...prev, description: e.target.value }))}
                 placeholder="分类描述（可选）"
                 rows={3}
               />
             </div>
           </div>
-          
+
           <div className="flex justify-end gap-2">
             <Button variant="outline" onClick={() => setIsEditDialogOpen(false)}>
               取消
             </Button>
-            <Button 
-              onClick={handleSubmitEdit} 
-              disabled={updateCategoryMutation.isPending}
-            >
+            <Button onClick={handleSubmitEdit} disabled={updateCategoryMutation.isPending}>
               {updateCategoryMutation.isPending ? '保存中...' : '保存更改'}
             </Button>
           </div>
@@ -557,4 +553,4 @@ export default function Categories() {
       </Dialog>
     </div>
   )
-}
\ No newline at end of file
+}
diff --git a/admin/src/pages/Dashboard.tsx b/admin/src/pages/Dashboard.tsx
index 9ad309a..4aa9ba0 100644
--- a/admin/src/pages/Dashboard.tsx
+++ b/admin/src/pages/Dashboard.tsx
@@ -1,46 +1,47 @@
 // Dashboard page
-import { useQuery } from '@tanstack/react-query'
-import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
 import { Badge } from '@/components/ui/badge'
 import { Button } from '@/components/ui/button'
+import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
 import { Skeleton } from '@/components/ui/skeleton'
-import { Camera, Folder, Tag, Plus, TrendingUp } from 'lucide-react'
-import { useNavigate } from 'react-router-dom'
-import { photoService } from '@/services/photoService'
 import { categoryService } from '@/services/categoryService'
+import { photoService } from '@/services/photoService'
 import { tagService } from '@/services/tagService'
+import { useQuery } from '@tanstack/react-query'
+import { Camera, Folder, Plus, Tag, TrendingUp } from 'lucide-react'
+import { useNavigate } from 'react-router-dom'
 
 export default function Dashboard() {
   const navigate = useNavigate()
-  
+
   // 获取统计数据
   const { data: photoStats, isLoading: photoStatsLoading } = useQuery({
     queryKey: ['photo-stats'],
-    queryFn: photoService.getStats
+    queryFn: photoService.getStats,
   })
-  
+
   const { data: categoryStats, isLoading: categoryStatsLoading } = useQuery({
     queryKey: ['category-stats'],
-    queryFn: categoryService.getStats
+    queryFn: categoryService.getStats,
   })
-  
+
   const { data: tagStats, isLoading: tagStatsLoading } = useQuery({
     queryKey: ['tag-stats'],
-    queryFn: tagService.getStats
+    queryFn: tagService.getStats,
   })
-  
+
   // 获取最近照片
   const { data: recentPhotos, isLoading: recentPhotosLoading } = useQuery({
     queryKey: ['recent-photos'],
-    queryFn: () => photoService.getPhotos({ page: 1, limit: 5, sort_by: 'created_at', sort_order: 'desc' })
+    queryFn: () =>
+      photoService.getPhotos({ page: 1, limit: 5, sort_by: 'created_at', sort_order: 'desc' }),
   })
-  
+
   // 获取热门标签
   const { data: popularTags, isLoading: popularTagsLoading } = useQuery({
     queryKey: ['popular-tags'],
-    queryFn: () => tagService.getPopularTags(10)
+    queryFn: () => tagService.getPopularTags(10),
   })
-  
+
   const formatFileSize = (bytes: number) => {
     if (bytes === 0) return '0 Bytes'
     const k = 1024
@@ -48,27 +49,37 @@ export default function Dashboard() {
     const i = Math.floor(Math.log(bytes) / Math.log(k))
     return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i]
   }
-  
+
   const getStatusColor = (status: string) => {
     switch (status) {
-      case 'published': return 'bg-green-100 text-green-800'
-      case 'draft': return 'bg-yellow-100 text-yellow-800'
-      case 'archived': return 'bg-gray-100 text-gray-800'
-      case 'processing': return 'bg-blue-100 text-blue-800'
-      default: return 'bg-gray-100 text-gray-800'
+      case 'published':
+        return 'bg-green-100 text-green-800'
+      case 'draft':
+        return 'bg-yellow-100 text-yellow-800'
+      case 'archived':
+        return 'bg-gray-100 text-gray-800'
+      case 'processing':
+        return 'bg-blue-100 text-blue-800'
+      default:
+        return 'bg-gray-100 text-gray-800'
     }
   }
-  
+
   const getStatusText = (status: string) => {
     switch (status) {
-      case 'published': return '已发布'
-      case 'draft': return '草稿'
-      case 'archived': return '已归档'
-      case 'processing': return '处理中'
-      default: return status
+      case 'published':
+        return '已发布'
+      case 'draft':
+        return '草稿'
+      case 'archived':
+        return '已归档'
+      case 'processing':
+        return '处理中'
+      default:
+        return status
     }
   }
-  
+
   return (
     <div className="container mx-auto px-4 py-8">
       <div className="flex items-center justify-between mb-8">
@@ -78,7 +89,7 @@ export default function Dashboard() {
           上传照片
         </Button>
       </div>
-      
+
       {/* 统计卡片 */}
       <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 mb-8">
         <Card>
@@ -97,7 +108,7 @@ export default function Dashboard() {
             </div>
           </CardContent>
         </Card>
-        
+
         <Card>
           <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
             <CardTitle className="text-sm font-medium">本月新增</CardTitle>
@@ -107,14 +118,16 @@ export default function Dashboard() {
             {photoStatsLoading ? (
               <Skeleton className="h-8 w-20" />
             ) : (
-              <div className="text-2xl font-bold text-green-600">{photoStats?.data?.thisMonth || 0}</div>
+              <div className="text-2xl font-bold text-green-600">
+                {photoStats?.data?.thisMonth || 0}
+              </div>
             )}
             <div className="text-xs text-muted-foreground mt-1">
               今日: {photoStats?.data?.today || 0}
             </div>
           </CardContent>
         </Card>
-        
+
         <Card>
           <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
             <CardTitle className="text-sm font-medium">总分类数</CardTitle>
@@ -124,14 +137,16 @@ export default function Dashboard() {
             {categoryStatsLoading ? (
               <Skeleton className="h-8 w-20" />
             ) : (
-              <div className="text-2xl font-bold text-blue-600">{categoryStats?.data?.total || 0}</div>
+              <div className="text-2xl font-bold text-blue-600">
+                {categoryStats?.data?.total || 0}
+              </div>
             )}
             <div className="text-xs text-muted-foreground mt-1">
               活跃: {categoryStats?.data?.active || 0}
             </div>
           </CardContent>
         </Card>
-        
+
         <Card>
           <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
             <CardTitle className="text-sm font-medium">总标签数</CardTitle>
@@ -149,7 +164,7 @@ export default function Dashboard() {
           </CardContent>
         </Card>
       </div>
-      
+
       {/* 照片状态统计 */}
       {photoStats?.data?.statusStats && (
         <Card className="mb-8">
@@ -160,9 +175,7 @@ export default function Dashboard() {
             <div className="flex flex-wrap gap-4">
               {Object.entries(photoStats.data.statusStats).map(([status, count]) => (
                 <div key={status} className="flex items-center gap-2">
-                  <Badge className={getStatusColor(status)}>
-                    {getStatusText(status)}
-                  </Badge>
+                  <Badge className={getStatusColor(status)}>{getStatusText(status)}</Badge>
                   <span className="text-sm text-muted-foreground">{count}</span>
                 </div>
               ))}
@@ -170,7 +183,7 @@ export default function Dashboard() {
           </CardContent>
         </Card>
       )}
-      
+
       <div className="grid grid-cols-1 lg:grid-cols-2 gap-6">
         {/* 最近上传 */}
         <Card>
@@ -195,7 +208,7 @@ export default function Dashboard() {
               </div>
             ) : recentPhotos?.photos?.length ? (
               <div className="space-y-4">
-                {recentPhotos.photos.map((photo) => (
+                {recentPhotos.photos.map(photo => (
                   <div key={photo.id} className="flex items-center gap-4">
                     <div className="h-12 w-12 bg-gray-100 rounded flex items-center justify-center">
                       <Camera className="h-6 w-6 text-gray-400" />
@@ -216,9 +229,9 @@ export default function Dashboard() {
               <div className="text-center py-8 text-muted-foreground">
                 <Camera className="h-12 w-12 mx-auto mb-4 text-gray-300" />
                 <p>暂无照片</p>
-                <Button 
-                  variant="outline" 
-                  className="mt-4" 
+                <Button
+                  variant="outline"
+                  className="mt-4"
                   onClick={() => navigate('/photos/upload')}
                 >
                   上传第一张照片
@@ -227,7 +240,7 @@ export default function Dashboard() {
             )}
           </CardContent>
         </Card>
-        
+
         {/* 热门标签 */}
         <Card>
           <CardHeader className="flex flex-row items-center justify-between">
@@ -245,8 +258,12 @@ export default function Dashboard() {
               </div>
             ) : popularTags?.length ? (
               <div className="flex flex-wrap gap-2">
-                {popularTags.map((tag) => (
-                  <Badge key={tag.id} variant="secondary" className="cursor-pointer hover:bg-secondary/80">
+                {popularTags.map(tag => (
+                  <Badge
+                    key={tag.id}
+                    variant="secondary"
+                    className="cursor-pointer hover:bg-secondary/80"
+                  >
                     {tag.name} ({tag.photoCount})
                   </Badge>
                 ))}
@@ -255,11 +272,7 @@ export default function Dashboard() {
               <div className="text-center py-8 text-muted-foreground">
                 <Tag className="h-12 w-12 mx-auto mb-4 text-gray-300" />
                 <p>暂无标签</p>
-                <Button 
-                  variant="outline" 
-                  className="mt-4" 
-                  onClick={() => navigate('/tags')}
-                >
+                <Button variant="outline" className="mt-4" onClick={() => navigate('/tags')}>
                   创建标签
                 </Button>
               </div>
@@ -269,4 +282,4 @@ export default function Dashboard() {
       </div>
     </div>
   )
-}
\ No newline at end of file
+}
diff --git a/admin/src/pages/LoginPage.tsx b/admin/src/pages/LoginPage.tsx
index 44eb5f2..480bdd9 100644
--- a/admin/src/pages/LoginPage.tsx
+++ b/admin/src/pages/LoginPage.tsx
@@ -1,30 +1,30 @@
-import React, { useState } from 'react'
-import { useNavigate } from 'react-router-dom'
-import { useMutation } from '@tanstack/react-query'
-import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'
+import { Alert, AlertDescription } from '@/components/ui/alert'
 import { Button } from '@/components/ui/button'
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'
 import { Input } from '@/components/ui/input'
 import { Label } from '@/components/ui/label'
-import { Alert, AlertDescription } from '@/components/ui/alert'
-import { Loader2, Eye, EyeOff, Camera } from 'lucide-react'
-import { useAuthStore } from '@/stores/authStore'
 import { authService } from '@/services/authService'
+import { useAuthStore } from '@/stores/authStore'
+import { useMutation } from '@tanstack/react-query'
+import { Camera, Eye, EyeOff, Loader2 } from 'lucide-react'
+import React, { useState } from 'react'
+import { useNavigate } from 'react-router-dom'
 import { toast } from 'sonner'
 
 export default function LoginPage() {
   const navigate = useNavigate()
   const { login } = useAuthStore()
-  
+
   const [formData, setFormData] = useState({
     username: '',
-    password: ''
+    password: '',
   })
   const [showPassword, setShowPassword] = useState(false)
   const [error, setError] = useState('')
 
   const loginMutation = useMutation({
     mutationFn: authService.login,
-    onSuccess: (data) => {
+    onSuccess: data => {
       // 转换后端用户数据到前端格式
       const user = {
         id: data.data.user.id,
@@ -34,9 +34,9 @@ export default function LoginPage() {
         role: 'admin' as const, // 暂时固定为 admin
         status: data.data.user.status,
         created_at: data.data.user.created_at,
-        updated_at: data.data.user.updated_at
+        updated_at: data.data.user.updated_at,
       }
-      
+
       login(data.data.token, user)
       toast.success(data.message || '登录成功')
       navigate('/')
@@ -45,18 +45,18 @@ export default function LoginPage() {
       const message = error?.response?.data?.message || error.message || '登录失败'
       setError(message)
       toast.error(message)
-    }
+    },
   })
 
   const handleSubmit = (e: React.FormEvent) => {
     e.preventDefault()
     setError('')
-    
+
     if (!formData.username || !formData.password) {
       setError('请输入用户名和密码')
       return
     }
-    
+
     loginMutation.mutate(formData)
   }
 
@@ -83,9 +83,7 @@ export default function LoginPage() {
         <Card className="shadow-lg">
           <CardHeader className="space-y-1">
             <CardTitle className="text-2xl font-bold text-center">登录</CardTitle>
-            <CardDescription className="text-center">
-              使用您的账户登录管理后台
-            </CardDescription>
+            <CardDescription className="text-center">使用您的账户登录管理后台</CardDescription>
           </CardHeader>
           <CardContent>
             <form onSubmit={handleSubmit} className="space-y-4">
@@ -94,7 +92,7 @@ export default function LoginPage() {
                   <AlertDescription>{error}</AlertDescription>
                 </Alert>
               )}
-              
+
               <div className="space-y-2">
                 <Label htmlFor="username">用户名</Label>
                 <Input
@@ -108,7 +106,7 @@ export default function LoginPage() {
                   className="h-11"
                 />
               </div>
-              
+
               <div className="space-y-2">
                 <Label htmlFor="password">密码</Label>
                 <div className="relative">
@@ -130,15 +128,11 @@ export default function LoginPage() {
                     onClick={() => setShowPassword(!showPassword)}
                     disabled={loginMutation.isPending}
                   >
-                    {showPassword ? (
-                      <EyeOff className="h-4 w-4" />
-                    ) : (
-                      <Eye className="h-4 w-4" />
-                    )}
+                    {showPassword ? <EyeOff className="h-4 w-4" /> : <Eye className="h-4 w-4" />}
                   </Button>
                 </div>
               </div>
-              
+
               <Button
                 type="submit"
                 className="w-full h-11 text-base"
@@ -154,21 +148,21 @@ export default function LoginPage() {
                 )}
               </Button>
             </form>
-            
+
             <div className="mt-6 text-center text-sm text-gray-600">
               <p>默认管理员账户</p>
               <p className="mt-1">
-                用户名: <span className="font-medium">admin</span> | 
-                密码: <span className="font-medium">admin123</span>
+                用户名: <span className="font-medium">admin</span> | 密码:{' '}
+                <span className="font-medium">admin123</span>
               </p>
             </div>
           </CardContent>
         </Card>
-        
+
         <div className="mt-8 text-center text-sm text-gray-500">
           <p>© 2024 摄影作品集. 保留所有权利.</p>
         </div>
       </div>
     </div>
   )
-}
\ No newline at end of file
+}
diff --git a/admin/src/pages/NotFound.tsx b/admin/src/pages/NotFound.tsx
index fa0c3ba..8c1466f 100644
--- a/admin/src/pages/NotFound.tsx
+++ b/admin/src/pages/NotFound.tsx
@@ -1,7 +1,7 @@
-import { useNavigate } from 'react-router-dom'
-import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
 import { Button } from '@/components/ui/button'
-import { FileQuestion, Home, ArrowLeft } from 'lucide-react'
+import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
+import { ArrowLeft, FileQuestion, Home } from 'lucide-react'
+import { useNavigate } from 'react-router-dom'
 
 export default function NotFound() {
   const navigate = useNavigate()
@@ -16,33 +16,22 @@ export default function NotFound() {
           <CardTitle className="text-2xl">页面未找到</CardTitle>
         </CardHeader>
         <CardContent className="space-y-4">
-          <p className="text-muted-foreground">
-            抱歉，您访问的页面不存在或已被移动。
-          </p>
-          
+          <p className="text-muted-foreground">抱歉，您访问的页面不存在或已被移动。</p>
+
           <div className="space-y-2">
-            <Button 
-              onClick={() => navigate('/dashboard')}
-              className="w-full"
-            >
+            <Button onClick={() => navigate('/dashboard')} className="w-full">
               <Home className="h-4 w-4 mr-2" />
               返回首页
             </Button>
-            <Button 
-              onClick={() => navigate(-1)}
-              variant="outline"
-              className="w-full"
-            >
+            <Button onClick={() => navigate(-1)} variant="outline" className="w-full">
               <ArrowLeft className="h-4 w-4 mr-2" />
               返回上一页
             </Button>
           </div>
-          
-          <div className="text-sm text-muted-foreground">
-            错误代码: 404
-          </div>
+
+          <div className="text-sm text-muted-foreground">错误代码: 404</div>
         </CardContent>
       </Card>
     </div>
   )
-}
\ No newline at end of file
+}
diff --git a/admin/src/pages/PhotoUpload.tsx b/admin/src/pages/PhotoUpload.tsx
index 9244936..9bc35de 100644
--- a/admin/src/pages/PhotoUpload.tsx
+++ b/admin/src/pages/PhotoUpload.tsx
@@ -1,31 +1,37 @@
-import React, { useState, useCallback, useRef, useEffect } from 'react'
-import { useNavigate } from 'react-router-dom'
-import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'
-import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
+import { Alert, AlertDescription } from '@/components/ui/alert'
+import { Badge } from '@/components/ui/badge'
 import { Button } from '@/components/ui/button'
+import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
+import { Checkbox } from '@/components/ui/checkbox'
 import { Input } from '@/components/ui/input'
 import { Label } from '@/components/ui/label'
-import { Textarea } from '@/components/ui/textarea'
-import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select'
-import { Badge } from '@/components/ui/badge'
 import { Progress } from '@/components/ui/progress'
-import { Alert, AlertDescription } from '@/components/ui/alert'
-import { Checkbox } from '@/components/ui/checkbox'
-import { 
-  Upload, 
-  X, 
-  Image as ImageIcon, 
-  Check, 
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from '@/components/ui/select'
+import { Textarea } from '@/components/ui/textarea'
+import { categoryService } from '@/services/categoryService'
+import { photoService } from '@/services/photoService'
+import { tagService } from '@/services/tagService'
+import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'
+import {
   AlertTriangle,
   ArrowLeft,
-  Save,
+  Check,
   FileImage,
-  Trash2
+  Image as ImageIcon,
+  Save,
+  Trash2,
+  Upload,
+  X,
 } from 'lucide-react'
+import React, { useCallback, useEffect, useRef, useState } from 'react'
+import { useNavigate } from 'react-router-dom'
 import { toast } from 'sonner'
-import { photoService } from '@/services/photoService'
-import { categoryService } from '@/services/categoryService'
-import { tagService } from '@/services/tagService'
 
 interface UploadFile extends File {
   id: string
@@ -38,101 +44,111 @@ interface UploadFile extends File {
 export default function PhotoUpload() {
   const navigate = useNavigate()
   const queryClient = useQueryClient()
-  
+
   const [files, setFiles] = useState<UploadFile[]>([])
   const [uploadProgress, setUploadProgress] = useState(0)
   const [isUploading, setIsUploading] = useState(false)
   const [dragOver, setDragOver] = useState(false)
   const fileInputRef = useRef<HTMLInputElement>(null)
   const dropAreaRef = useRef<HTMLDivElement>(null)
-  
+
   // 表单数据
   const [formData, setFormData] = useState({
     title: '',
     description: '',
     categoryIds: [] as number[],
     tagIds: [] as number[],
-    status: 'draft' as 'draft' | 'published'
+    status: 'draft' as 'draft' | 'published',
   })
 
   // 获取分类和标签
   const { data: categories } = useQuery({
     queryKey: ['categories-all'],
-    queryFn: () => categoryService.getCategories()
+    queryFn: () => categoryService.getCategories(),
   })
 
   const { data: tags } = useQuery({
     queryKey: ['tags-all'],
-    queryFn: () => tagService.getAllTags()
+    queryFn: () => tagService.getAllTags(),
   })
 
   // 上传照片
   const uploadMutation = useMutation({
-    mutationFn: async (uploadData: { files: UploadFile[], metadata: any }) => {
+    mutationFn: async (uploadData: { files: UploadFile[]; metadata: any }) => {
       setIsUploading(true)
       const results = []
-      
+
       for (let i = 0; i < uploadData.files.length; i++) {
         const file = uploadData.files[i]
         try {
           // 更新文件状态
-          setFiles(prev => prev.map(f => 
-            f.id === file.id ? { ...f, status: 'uploading' as const } : f
-          ))
-          
+          setFiles(prev =>
+            prev.map(f => (f.id === file.id ? { ...f, status: 'uploading' as const } : f))
+          )
+
           // 模拟上传进度 - 创建进度更新函数
           const progressUpdateInterval = setInterval(() => {
-            setFiles(prev => prev.map(f => {
-              if (f.id === file.id && f.status === 'uploading') {
-                const newProgress = Math.min((f.progress || 0) + Math.random() * 10, 90)
-                return { ...f, progress: newProgress }
-              }
-              return f
-            }))
+            setFiles(prev =>
+              prev.map(f => {
+                if (f.id === file.id && f.status === 'uploading') {
+                  const newProgress = Math.min((f.progress || 0) + Math.random() * 10, 90)
+                  return { ...f, progress: newProgress }
+                }
+                return f
+              })
+            )
           }, 200)
-          
+
           const result = await photoService.uploadPhoto(file, {
             ...uploadData.metadata,
-            title: uploadData.metadata.title || file.name.split('.')[0]
+            title: uploadData.metadata.title || file.name.split('.')[0],
           })
-          
+
           // 清除进度更新定时器
           clearInterval(progressUpdateInterval)
-          
+
           // 更新文件状态为完成
-          setFiles(prev => prev.map(f => 
-            f.id === file.id ? { ...f, status: 'completed' as const, progress: 100 } : f
-          ))
-          
+          setFiles(prev =>
+            prev.map(f =>
+              f.id === file.id ? { ...f, status: 'completed' as const, progress: 100 } : f
+            )
+          )
+
           // 更新总进度
           const totalProgress = ((i + 1) / uploadData.files.length) * 100
           setUploadProgress(totalProgress)
-          
+
           results.push(result)
         } catch (error: any) {
           // 更新文件状态为错误
-          setFiles(prev => prev.map(f => 
-            f.id === file.id ? { 
-              ...f, 
-              status: 'error' as const, 
-              error: error.message || '上传失败' 
-            } : f
-          ))
+          setFiles(prev =>
+            prev.map(f =>
+              f.id === file.id
+                ? {
+                    ...f,
+                    status: 'error' as const,
+                    error: error.message || '上传失败',
+                  }
+                : f
+            )
+          )
         }
       }
-      
+
       setIsUploading(false)
       return results
     },
-    onSuccess: (results) => {
+    onSuccess: results => {
       queryClient.invalidateQueries({ queryKey: ['photos'] })
       const successCount = results.length
       const failedCount = files.length - successCount
-      
+
       if (successCount > 0) {
-        toast.success(`成功上传 ${successCount} 张照片${failedCount > 0 ? `，${failedCount} 张失败` : ''}`)
+        toast.success(
+          `成功上传 ${successCount} 张照片${failedCount > 0 ? `，${failedCount} 张失败` : ''}`
+        )
       }
-      
+
       if (failedCount === 0) {
         // 全部成功，返回列表页
         setTimeout(() => navigate('/photos'), 1000)
@@ -141,7 +157,7 @@ export default function PhotoUpload() {
     onError: (error: any) => {
       setIsUploading(false)
       toast.error(error?.message || '上传失败')
-    }
+    },
   })
 
   // 文件拖放处理
@@ -150,30 +166,30 @@ export default function PhotoUpload() {
     const validFiles = acceptedFiles.filter(file => {
       const validTypes = ['image/jpeg', 'image/png', 'image/gif', 'image/webp']
       const maxSize = 10 * 1024 * 1024 // 10MB
-      
+
       if (!validTypes.includes(file.type)) {
         toast.error(`文件 "${file.name}" 格式不支持，仅支持 JPG、PNG、GIF、WebP 格式`)
         return false
       }
-      
+
       if (file.size > maxSize) {
         toast.error(`文件 "${file.name}" 太大，最大支持 10MB`)
         return false
       }
-      
+
       return true
     })
-    
+
     const newFiles = validFiles.map(file => ({
       ...file,
       id: Math.random().toString(36),
       preview: URL.createObjectURL(file),
       status: 'pending' as const,
-      progress: 0
+      progress: 0,
     }))
-    
+
     setFiles(prev => [...prev, ...newFiles])
-    
+
     if (validFiles.length > 0) {
       toast.success(`成功添加 ${validFiles.length} 个文件`)
     }
@@ -199,29 +215,32 @@ export default function PhotoUpload() {
       fileInputRef.current.value = ''
     }
   }
-  
+
   // 拖拽事件处理
   const handleDragOver = useCallback((e: React.DragEvent) => {
     e.preventDefault()
     e.stopPropagation()
     setDragOver(true)
   }, [])
-  
+
   const handleDragLeave = useCallback((e: React.DragEvent) => {
     e.preventDefault()
     e.stopPropagation()
     setDragOver(false)
   }, [])
-  
-  const handleDrop = useCallback((e: React.DragEvent) => {
-    e.preventDefault()
-    e.stopPropagation()
-    setDragOver(false)
-    
-    const droppedFiles = Array.from(e.dataTransfer.files)
-    onDrop(droppedFiles)
-  }, [onDrop])
-  
+
+  const handleDrop = useCallback(
+    (e: React.DragEvent) => {
+      e.preventDefault()
+      e.stopPropagation()
+      setDragOver(false)
+
+      const droppedFiles = Array.from(e.dataTransfer.files)
+      onDrop(droppedFiles)
+    },
+    [onDrop]
+  )
+
   // 清理预览图片
   useEffect(() => {
     return () => {
@@ -242,7 +261,7 @@ export default function PhotoUpload() {
 
     uploadMutation.mutate({
       files,
-      metadata: formData
+      metadata: formData,
     })
   }
 
@@ -250,24 +269,24 @@ export default function PhotoUpload() {
   const updateFormData = (field: string, value: any) => {
     setFormData(prev => ({ ...prev, [field]: value }))
   }
-  
+
   // 切换分类选择
   const toggleCategory = (categoryId: number) => {
     setFormData(prev => ({
       ...prev,
       categoryIds: prev.categoryIds.includes(categoryId)
         ? prev.categoryIds.filter(id => id !== categoryId)
-        : [...prev.categoryIds, categoryId]
+        : [...prev.categoryIds, categoryId],
     }))
   }
-  
+
   // 切换标签选择
   const toggleTag = (tagId: number) => {
     setFormData(prev => ({
       ...prev,
       tagIds: prev.tagIds.includes(tagId)
         ? prev.tagIds.filter(id => id !== tagId)
-        : [...prev.tagIds, tagId]
+        : [...prev.tagIds, tagId],
     }))
   }
 
@@ -276,11 +295,7 @@ export default function PhotoUpload() {
       {/* 页面头部 */}
       <div className="flex items-center justify-between mb-8">
         <div className="flex items-center gap-4">
-          <Button 
-            variant="outline" 
-            size="sm"
-            onClick={() => navigate('/photos')}
-          >
+          <Button variant="outline" size="sm" onClick={() => navigate('/photos')}>
             <ArrowLeft className="h-4 w-4 mr-2" />
             返回
           </Button>
@@ -299,12 +314,10 @@ export default function PhotoUpload() {
               <CardTitle>选择文件</CardTitle>
             </CardHeader>
             <CardContent>
-              <div 
+              <div
                 ref={dropAreaRef}
                 className={`border-2 border-dashed rounded-lg p-8 text-center transition-colors cursor-pointer ${
-                  dragOver 
-                    ? 'border-primary bg-primary/5' 
-                    : 'border-gray-300 hover:border-gray-400'
+                  dragOver ? 'border-primary bg-primary/5' : 'border-gray-300 hover:border-gray-400'
                 }`}
                 onDragOver={handleDragOver}
                 onDragLeave={handleDragLeave}
@@ -350,11 +363,11 @@ export default function PhotoUpload() {
               </CardHeader>
               <CardContent>
                 <div className="space-y-4">
-                  {files.map((file) => (
+                  {files.map(file => (
                     <div key={file.id} className="flex items-center gap-4 p-4 border rounded-lg">
                       {file.preview ? (
-                        <img 
-                          src={file.preview} 
+                        <img
+                          src={file.preview}
                           alt={file.name}
                           className="w-12 h-12 object-cover rounded"
                         />
@@ -363,27 +376,27 @@ export default function PhotoUpload() {
                           <ImageIcon className="h-6 w-6 text-gray-400" />
                         </div>
                       )}
-                      
+
                       <div className="flex-1 min-w-0">
-                        <p className="text-sm font-medium truncate" title={file.name}>{file.name}</p>
+                        <p className="text-sm font-medium truncate" title={file.name}>
+                          {file.name}
+                        </p>
                         <p className="text-xs text-muted-foreground">
                           {(file.size / 1024 / 1024).toFixed(2)} MB
                         </p>
-                        
+
                         {file.status === 'uploading' && file.progress !== undefined && (
                           <Progress value={file.progress} className="mt-2" />
                         )}
-                        
+
                         {file.status === 'error' && file.error && (
                           <Alert variant="destructive" className="mt-2">
                             <AlertTriangle className="h-4 w-4" />
-                            <AlertDescription className="text-xs">
-                              {file.error}
-                            </AlertDescription>
+                            <AlertDescription className="text-xs">{file.error}</AlertDescription>
                           </Alert>
                         )}
                       </div>
-                      
+
                       <div className="flex items-center gap-2">
                         {file.status === 'completed' && (
                           <Badge variant="default">
@@ -449,25 +462,28 @@ export default function PhotoUpload() {
                 <Input
                   id="title"
                   value={formData.title}
-                  onChange={(e) => updateFormData('title', e.target.value)}
+                  onChange={e => updateFormData('title', e.target.value)}
                   placeholder="照片标题"
                 />
               </div>
-              
+
               <div>
                 <Label htmlFor="description">描述</Label>
                 <Textarea
                   id="description"
                   value={formData.description}
-                  onChange={(e) => updateFormData('description', e.target.value)}
+                  onChange={e => updateFormData('description', e.target.value)}
                   placeholder="照片描述"
                   rows={3}
                 />
               </div>
-              
+
               <div>
                 <Label htmlFor="status">状态</Label>
-                <Select value={formData.status} onValueChange={(value) => updateFormData('status', value)}>
+                <Select
+                  value={formData.status}
+                  onValueChange={value => updateFormData('status', value)}
+                >
                   <SelectTrigger>
                     <SelectValue />
                   </SelectTrigger>
@@ -477,15 +493,16 @@ export default function PhotoUpload() {
                   </SelectContent>
                 </Select>
               </div>
-              
+
               <div>
                 <Label>分类</Label>
-                <div className="text-sm text-muted-foreground mb-2">
-                  可选择多个分类
-                </div>
+                <div className="text-sm text-muted-foreground mb-2">可选择多个分类</div>
                 <div className="max-h-40 overflow-y-auto border rounded-lg p-2">
                   {categories?.data?.categories?.map((category: any) => (
-                    <div key={category.id} className="flex items-center space-x-2 p-2 hover:bg-muted rounded">
+                    <div
+                      key={category.id}
+                      className="flex items-center space-x-2 p-2 hover:bg-muted rounded"
+                    >
                       <Checkbox
                         id={`category-${category.id}`}
                         checked={formData.categoryIds.includes(category.id)}
@@ -498,15 +515,16 @@ export default function PhotoUpload() {
                   )) || <p className="text-sm text-muted-foreground p-2">暂无分类</p>}
                 </div>
               </div>
-              
+
               <div>
                 <Label>标签</Label>
-                <div className="text-sm text-muted-foreground mb-2">
-                  可选择多个标签
-                </div>
+                <div className="text-sm text-muted-foreground mb-2">可选择多个标签</div>
                 <div className="max-h-40 overflow-y-auto border rounded-lg p-2">
                   {tags?.map((tag: any) => (
-                    <div key={tag.id} className="flex items-center space-x-2 p-2 hover:bg-muted rounded">
+                    <div
+                      key={tag.id}
+                      className="flex items-center space-x-2 p-2 hover:bg-muted rounded"
+                    >
                       <Checkbox
                         id={`tag-${tag.id}`}
                         checked={formData.tagIds.includes(tag.id)}
@@ -524,7 +542,7 @@ export default function PhotoUpload() {
 
           <Card>
             <CardContent className="pt-6">
-              <Button 
+              <Button
                 onClick={handleUpload}
                 disabled={files.length === 0 || isUploading}
                 className="w-full"
@@ -541,9 +559,9 @@ export default function PhotoUpload() {
                   </>
                 )}
               </Button>
-              
+
               {files.length > 0 && !isUploading && (
-                <Button 
+                <Button
                   variant="outline"
                   onClick={() => {
                     files.forEach(file => {
@@ -565,4 +583,4 @@ export default function PhotoUpload() {
       </div>
     </div>
   )
-}
\ No newline at end of file
+}
diff --git a/admin/src/pages/Photos.tsx b/admin/src/pages/Photos.tsx
index 4af3cae..a94324a 100644
--- a/admin/src/pages/Photos.tsx
+++ b/admin/src/pages/Photos.tsx
@@ -1,35 +1,52 @@
-import { useState } from 'react'
-import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query'
-import { Card, CardContent } from '@/components/ui/card'
-import { Button } from '@/components/ui/button'
-import { Input } from '@/components/ui/input'
 import { Badge } from '@/components/ui/badge'
-import { Skeleton } from '@/components/ui/skeleton'
+import { Button } from '@/components/ui/button'
+import { Card, CardContent } from '@/components/ui/card'
 import { Checkbox } from '@/components/ui/checkbox'
-import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select'
-import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from '@/components/ui/dropdown-menu'
-import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription } from '@/components/ui/dialog'
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogHeader,
+  DialogTitle,
+} from '@/components/ui/dialog'
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from '@/components/ui/dropdown-menu'
+import { Input } from '@/components/ui/input'
 import { Label } from '@/components/ui/label'
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from '@/components/ui/select'
+import { Skeleton } from '@/components/ui/skeleton'
 import { Textarea } from '@/components/ui/textarea'
-import { 
-  Camera, 
-  Plus, 
-  Search, 
-  MoreVertical,
+import { categoryService } from '@/services/categoryService'
+import { Photo, photoService } from '@/services/photoService'
+import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'
+import {
+  Camera,
   Edit,
-  Trash,
   Eye,
+  Folder,
   Grid,
-  List,
-  RefreshCw,
   ImageIcon,
+  List,
+  MoreVertical,
+  Plus,
+  RefreshCw,
+  Search,
   Tag,
-  Folder
+  Trash,
 } from 'lucide-react'
+import { useState } from 'react'
 import { useNavigate } from 'react-router-dom'
 import { toast } from 'sonner'
-import { photoService, Photo } from '@/services/photoService'
-import { categoryService } from '@/services/categoryService'
 
 type ViewMode = 'grid' | 'list'
 
@@ -44,7 +61,7 @@ interface PhotoFilters {
 export default function Photos() {
   const navigate = useNavigate()
   const queryClient = useQueryClient()
-  
+
   // 状态管理
   const [viewMode, setViewMode] = useState<ViewMode>('grid')
   const [selectedPhotos, setSelectedPhotos] = useState<number[]>([])
@@ -54,43 +71,43 @@ export default function Photos() {
     status: '',
     categoryId: '',
     tagId: '',
-    dateRange: ''
+    dateRange: '',
   })
-  
+
   // 编辑对话框状态
   const [editingPhoto, setEditingPhoto] = useState<Photo | null>(null)
   const [isEditDialogOpen, setIsEditDialogOpen] = useState(false)
   const [editForm, setEditForm] = useState({
     title: '',
     description: '',
-    status: 'draft' as 'draft' | 'published' | 'archived' | 'processing'
+    status: 'draft' as 'draft' | 'published' | 'archived' | 'processing',
   })
-  
+
   // 详情对话框状态
   const [viewingPhoto, setViewingPhoto] = useState<Photo | null>(null)
   const [isViewDialogOpen, setIsViewDialogOpen] = useState(false)
-  
+
   // 获取照片列表
   const { data: photosData, isLoading: photosLoading } = useQuery({
     queryKey: ['photos', { page, ...filters }],
-    queryFn: () => photoService.getPhotos({
-      page,
-      limit: 20,
-      search: filters.search || undefined,
-      status: filters.status || undefined,
-      category_id: filters.categoryId ? parseInt(filters.categoryId) : undefined,
-      sort_by: 'created_at',
-      sort_order: 'desc'
-    })
+    queryFn: () =>
+      photoService.getPhotos({
+        page,
+        limit: 20,
+        search: filters.search || undefined,
+        status: filters.status || undefined,
+        category_id: filters.categoryId ? parseInt(filters.categoryId) : undefined,
+        sort_by: 'created_at',
+        sort_order: 'desc',
+      }),
   })
-  
+
   // 获取分类列表
   const { data: categories } = useQuery({
     queryKey: ['categories-all'],
-    queryFn: () => categoryService.getCategories()
+    queryFn: () => categoryService.getCategories(),
   })
-  
-  
+
   // 删除照片
   const deletePhotoMutation = useMutation({
     mutationFn: photoService.deletePhoto,
@@ -100,9 +117,9 @@ export default function Photos() {
     },
     onError: (error: any) => {
       toast.error(error?.message || '删除失败')
-    }
+    },
   })
-  
+
   // 批量删除照片
   const batchDeleteMutation = useMutation({
     mutationFn: photoService.batchDelete,
@@ -113,12 +130,12 @@ export default function Photos() {
     },
     onError: (error: any) => {
       toast.error(error?.message || '批量删除失败')
-    }
+    },
   })
-  
+
   // 批量更新状态
   const batchUpdateMutation = useMutation({
-    mutationFn: ({ ids, status }: { ids: number[], status: string }) => 
+    mutationFn: ({ ids, status }: { ids: number[]; status: string }) =>
       photoService.batchUpdate(ids, { status }),
     onSuccess: () => {
       queryClient.invalidateQueries({ queryKey: ['photos'] })
@@ -127,13 +144,12 @@ export default function Photos() {
     },
     onError: (error: any) => {
       toast.error(error?.message || '状态更新失败')
-    }
+    },
   })
-  
+
   // 编辑照片
   const editPhotoMutation = useMutation({
-    mutationFn: ({ id, data }: { id: number, data: any }) => 
-      photoService.updatePhoto(id, data),
+    mutationFn: ({ id, data }: { id: number; data: any }) => photoService.updatePhoto(id, data),
     onSuccess: () => {
       queryClient.invalidateQueries({ queryKey: ['photos'] })
       setIsEditDialogOpen(false)
@@ -142,9 +158,9 @@ export default function Photos() {
     },
     onError: (error: any) => {
       toast.error(error?.message || '更新失败')
-    }
+    },
   })
-  
+
   const handleSelectAll = (checked: boolean) => {
     if (checked) {
       setSelectedPhotos(photosData?.photos.map(photo => photo.id) || [])
@@ -152,7 +168,7 @@ export default function Photos() {
       setSelectedPhotos([])
     }
   }
-  
+
   const handleSelectPhoto = (photoId: number, checked: boolean) => {
     if (checked) {
       setSelectedPhotos([...selectedPhotos, photoId])
@@ -160,13 +176,13 @@ export default function Photos() {
       setSelectedPhotos(selectedPhotos.filter(id => id !== photoId))
     }
   }
-  
+
   const handleBatchAction = (action: string, value?: string) => {
     if (selectedPhotos.length === 0) {
       toast.error('请先选择照片')
       return
     }
-    
+
     if (action === 'delete') {
       if (confirm('确定要删除选中的照片吗？')) {
         batchDeleteMutation.mutate(selectedPhotos)
@@ -175,33 +191,43 @@ export default function Photos() {
       batchUpdateMutation.mutate({ ids: selectedPhotos, status: value })
     }
   }
-  
+
   const handleDeletePhoto = (photoId: number) => {
     if (confirm('确定要删除这张照片吗？')) {
       deletePhotoMutation.mutate(photoId)
     }
   }
-  
+
   const getStatusColor = (status: string) => {
     switch (status) {
-      case 'published': return 'bg-green-100 text-green-800'
-      case 'draft': return 'bg-yellow-100 text-yellow-800'
-      case 'archived': return 'bg-gray-100 text-gray-800'
-      case 'processing': return 'bg-blue-100 text-blue-800'
-      default: return 'bg-gray-100 text-gray-800'
+      case 'published':
+        return 'bg-green-100 text-green-800'
+      case 'draft':
+        return 'bg-yellow-100 text-yellow-800'
+      case 'archived':
+        return 'bg-gray-100 text-gray-800'
+      case 'processing':
+        return 'bg-blue-100 text-blue-800'
+      default:
+        return 'bg-gray-100 text-gray-800'
     }
   }
-  
+
   const getStatusText = (status: string) => {
     switch (status) {
-      case 'published': return '已发布'
-      case 'draft': return '草稿'
-      case 'archived': return '已归档'
-      case 'processing': return '处理中'
-      default: return status
+      case 'published':
+        return '已发布'
+      case 'draft':
+        return '草稿'
+      case 'archived':
+        return '已归档'
+      case 'processing':
+        return '处理中'
+      default:
+        return status
     }
   }
-  
+
   const formatFileSize = (bytes: number) => {
     if (bytes === 0) return '0 Bytes'
     const k = 1024
@@ -209,57 +235,54 @@ export default function Photos() {
     const i = Math.floor(Math.log(bytes) / Math.log(k))
     return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i]
   }
-  
+
   // 处理编辑照片
   const handleEditPhoto = (photo: Photo) => {
     setEditingPhoto(photo)
     setEditForm({
       title: photo.title,
       description: photo.description,
-      status: photo.status
+      status: photo.status,
     })
     setIsEditDialogOpen(true)
   }
-  
+
   // 处理查看照片详情
   const handleViewPhoto = (photo: Photo) => {
     setViewingPhoto(photo)
     setIsViewDialogOpen(true)
   }
-  
+
   // 提交编辑
   const handleSubmitEdit = () => {
     if (!editingPhoto) return
-    
+
     editPhotoMutation.mutate({
       id: editingPhoto.id,
-      data: editForm
+      data: editForm,
     })
   }
-  
-  
+
   // 刷新列表
   const handleRefresh = () => {
     queryClient.invalidateQueries({ queryKey: ['photos'] })
     toast.success('列表已刷新')
   }
-  
+
   return (
     <div className="container mx-auto px-4 py-8">
       {/* 页面头部 */}
       <div className="flex items-center justify-between mb-8">
         <div>
           <h1 className="text-3xl font-bold">照片管理</h1>
-          <p className="text-muted-foreground mt-1">
-            共 {photosData?.total || 0} 张照片
-          </p>
+          <p className="text-muted-foreground mt-1">共 {photosData?.total || 0} 张照片</p>
         </div>
         <Button onClick={() => navigate('/photos/upload')} className="flex items-center gap-2">
           <Plus className="h-4 w-4" />
           上传照片
         </Button>
       </div>
-      
+
       {/* 工具栏 */}
       <Card className="mb-6">
         <CardContent className="pt-6">
@@ -270,14 +293,17 @@ export default function Photos() {
               <Input
                 placeholder="搜索照片..."
                 value={filters.search}
-                onChange={(e) => setFilters({ ...filters, search: e.target.value })}
+                onChange={e => setFilters({ ...filters, search: e.target.value })}
                 className="pl-10"
               />
             </div>
-            
+
             {/* 过滤器 */}
             <div className="flex gap-2">
-              <Select value={filters.status} onValueChange={(value) => setFilters({ ...filters, status: value })}>
+              <Select
+                value={filters.status}
+                onValueChange={value => setFilters({ ...filters, status: value })}
+              >
                 <SelectTrigger className="w-32">
                   <SelectValue placeholder="状态" />
                 </SelectTrigger>
@@ -289,14 +315,17 @@ export default function Photos() {
                   <SelectItem value="processing">处理中</SelectItem>
                 </SelectContent>
               </Select>
-              
-              <Select value={filters.categoryId} onValueChange={(value) => setFilters({ ...filters, categoryId: value })}>
+
+              <Select
+                value={filters.categoryId}
+                onValueChange={value => setFilters({ ...filters, categoryId: value })}
+              >
                 <SelectTrigger className="w-32">
                   <SelectValue placeholder="分类" />
                 </SelectTrigger>
                 <SelectContent>
                   <SelectItem value="">全部分类</SelectItem>
-                  {categories?.data?.categories?.map((category) => (
+                  {categories?.data?.categories?.map(category => (
                     <SelectItem key={category.id} value={category.id.toString()}>
                       {category.name}
                     </SelectItem>
@@ -304,7 +333,7 @@ export default function Photos() {
                 </SelectContent>
               </Select>
             </div>
-            
+
             {/* 视图模式 */}
             <div className="flex gap-1 border rounded-md">
               <Button
@@ -325,16 +354,14 @@ export default function Photos() {
           </div>
         </CardContent>
       </Card>
-      
+
       {/* 批量操作栏 */}
       {selectedPhotos.length > 0 && (
         <Card className="mb-6 border-primary">
           <CardContent className="pt-6">
             <div className="flex items-center justify-between">
               <div className="flex items-center gap-4">
-                <span className="text-sm">
-                  已选择 {selectedPhotos.length} 张照片
-                </span>
+                <span className="text-sm">已选择 {selectedPhotos.length} 张照片</span>
                 <Button variant="outline" size="sm" onClick={() => setSelectedPhotos([])}>
                   取消选择
                 </Button>
@@ -358,8 +385,8 @@ export default function Photos() {
                     </DropdownMenuItem>
                   </DropdownMenuContent>
                 </DropdownMenu>
-                <Button 
-                  variant="destructive" 
+                <Button
+                  variant="destructive"
                   size="sm"
                   onClick={() => handleBatchAction('delete')}
                   disabled={batchDeleteMutation.isPending}
@@ -371,14 +398,22 @@ export default function Photos() {
           </CardContent>
         </Card>
       )}
-      
+
       {/* 照片列表 */}
       {photosLoading ? (
-        <div className={viewMode === 'grid' ? 'grid grid-cols-1 md:grid-cols-3 lg:grid-cols-4 gap-6' : 'space-y-4'}>
+        <div
+          className={
+            viewMode === 'grid'
+              ? 'grid grid-cols-1 md:grid-cols-3 lg:grid-cols-4 gap-6'
+              : 'space-y-4'
+          }
+        >
           {[...Array(8)].map((_, i) => (
             <Card key={i}>
               <CardContent className="p-4">
-                <Skeleton className={viewMode === 'grid' ? 'aspect-square mb-4' : 'h-20 w-20 mb-4'} />
+                <Skeleton
+                  className={viewMode === 'grid' ? 'aspect-square mb-4' : 'h-20 w-20 mb-4'}
+                />
                 <Skeleton className="h-4 w-3/4 mb-2" />
                 <Skeleton className="h-3 w-1/2" />
               </CardContent>
@@ -390,31 +425,35 @@ export default function Photos() {
           {/* 全选复选框 */}
           <div className="flex items-center gap-2 mb-4">
             <Checkbox
-              checked={selectedPhotos.length === photosData.photos.length && photosData.photos.length > 0}
+              checked={
+                selectedPhotos.length === photosData.photos.length && photosData.photos.length > 0
+              }
               onCheckedChange={handleSelectAll}
             />
             <span className="text-sm text-muted-foreground">全选</span>
           </div>
-          
+
           {viewMode === 'grid' ? (
             <div className="grid grid-cols-1 md:grid-cols-3 lg:grid-cols-4 gap-6">
-              {photosData.photos.map((photo) => (
+              {photosData.photos.map(photo => (
                 <Card key={photo.id} className="group">
                   <CardContent className="p-4">
                     <div className="relative mb-4">
                       <div className="aspect-square bg-gray-100 rounded-lg flex items-center justify-center">
                         <Camera className="h-12 w-12 text-gray-400" />
                       </div>
-                      
+
                       {/* 复选框 */}
                       <div className="absolute top-2 left-2">
                         <Checkbox
                           checked={selectedPhotos.includes(photo.id)}
-                          onCheckedChange={(checked) => handleSelectPhoto(photo.id, checked as boolean)}
+                          onCheckedChange={checked =>
+                            handleSelectPhoto(photo.id, checked as boolean)
+                          }
                           className="bg-white"
                         />
                       </div>
-                      
+
                       {/* 操作按钮 */}
                       <div className="absolute top-2 right-2 opacity-0 group-hover:opacity-100 transition-opacity">
                         <DropdownMenu>
@@ -440,7 +479,7 @@ export default function Photos() {
                         </DropdownMenu>
                       </div>
                     </div>
-                    
+
                     <div>
                       <h3 className="font-medium truncate mb-2">{photo.title}</h3>
                       <div className="flex items-center justify-between mb-2">
@@ -461,19 +500,19 @@ export default function Photos() {
             </div>
           ) : (
             <div className="space-y-4">
-              {photosData.photos.map((photo) => (
+              {photosData.photos.map(photo => (
                 <Card key={photo.id}>
                   <CardContent className="p-4">
                     <div className="flex items-center gap-4">
                       <Checkbox
                         checked={selectedPhotos.includes(photo.id)}
-                        onCheckedChange={(checked) => handleSelectPhoto(photo.id, checked as boolean)}
+                        onCheckedChange={checked => handleSelectPhoto(photo.id, checked as boolean)}
                       />
-                      
+
                       <div className="h-16 w-16 bg-gray-100 rounded flex items-center justify-center flex-shrink-0">
                         <Camera className="h-8 w-8 text-gray-400" />
                       </div>
-                      
+
                       <div className="flex-1 min-w-0">
                         <h3 className="font-medium truncate">{photo.title}</h3>
                         <p className="text-sm text-muted-foreground truncate">
@@ -491,7 +530,7 @@ export default function Photos() {
                           </span>
                         </div>
                       </div>
-                      
+
                       <DropdownMenu>
                         <DropdownMenuTrigger asChild>
                           <Button variant="outline" size="sm">
@@ -519,16 +558,12 @@ export default function Photos() {
               ))}
             </div>
           )}
-          
+
           {/* 分页 */}
           {photosData.pages > 1 && (
             <div className="flex justify-center mt-8">
               <div className="flex gap-2">
-                <Button
-                  variant="outline"
-                  disabled={page === 1}
-                  onClick={() => setPage(page - 1)}
-                >
+                <Button variant="outline" disabled={page === 1} onClick={() => setPage(page - 1)}>
                   上一页
                 </Button>
                 <div className="flex items-center gap-2">
@@ -565,9 +600,7 @@ export default function Photos() {
                 <ImageIcon className="h-16 w-16 text-gray-300" />
               </div>
               <h3 className="text-xl font-medium mb-2">暂无照片</h3>
-              <p className="text-muted-foreground mb-6">
-                开始上传您的第一张照片，构建精美的作品集
-              </p>
+              <p className="text-muted-foreground mb-6">开始上传您的第一张照片，构建精美的作品集</p>
               <div className="flex justify-center gap-4">
                 <Button onClick={() => navigate('/photos/upload')}>
                   <Plus className="h-4 w-4 mr-2" />
@@ -582,42 +615,43 @@ export default function Photos() {
           </CardContent>
         </Card>
       )}
-      
+
       {/* 编辑对话框 */}
       <Dialog open={isEditDialogOpen} onOpenChange={setIsEditDialogOpen}>
         <DialogContent className="sm:max-w-[425px]">
           <DialogHeader>
             <DialogTitle>编辑照片</DialogTitle>
-            <DialogDescription>
-              修改照片的基本信息
-            </DialogDescription>
+            <DialogDescription>修改照片的基本信息</DialogDescription>
           </DialogHeader>
-          
+
           <div className="space-y-4 py-4">
             <div>
               <Label htmlFor="edit-title">标题</Label>
               <Input
                 id="edit-title"
                 value={editForm.title}
-                onChange={(e) => setEditForm({ ...editForm, title: e.target.value })}
+                onChange={e => setEditForm({ ...editForm, title: e.target.value })}
                 placeholder="照片标题"
               />
             </div>
-            
+
             <div>
               <Label htmlFor="edit-description">描述</Label>
               <Textarea
                 id="edit-description"
                 value={editForm.description}
-                onChange={(e) => setEditForm({ ...editForm, description: e.target.value })}
+                onChange={e => setEditForm({ ...editForm, description: e.target.value })}
                 placeholder="照片描述"
                 rows={3}
               />
             </div>
-            
+
             <div>
               <Label htmlFor="edit-status">状态</Label>
-              <Select value={editForm.status} onValueChange={(value) => setEditForm({ ...editForm, status: value as any })}>
+              <Select
+                value={editForm.status}
+                onValueChange={value => setEditForm({ ...editForm, status: value as any })}
+              >
                 <SelectTrigger>
                   <SelectValue />
                 </SelectTrigger>
@@ -629,7 +663,7 @@ export default function Photos() {
               </Select>
             </div>
           </div>
-          
+
           <div className="flex justify-end gap-2">
             <Button variant="outline" onClick={() => setIsEditDialogOpen(false)}>
               取消
@@ -640,23 +674,21 @@ export default function Photos() {
           </div>
         </DialogContent>
       </Dialog>
-      
+
       {/* 详情查看对话框 */}
       <Dialog open={isViewDialogOpen} onOpenChange={setIsViewDialogOpen}>
         <DialogContent className="sm:max-w-[600px]">
           <DialogHeader>
             <DialogTitle>{viewingPhoto?.title}</DialogTitle>
-            <DialogDescription>
-              照片详细信息
-            </DialogDescription>
+            <DialogDescription>照片详细信息</DialogDescription>
           </DialogHeader>
-          
+
           {viewingPhoto && (
             <div className="space-y-4 py-4">
               <div className="aspect-video bg-gray-100 rounded-lg flex items-center justify-center">
                 <ImageIcon className="h-16 w-16 text-gray-400" />
               </div>
-              
+
               <div className="grid grid-cols-2 gap-4">
                 <div>
                   <Label className="text-sm font-medium">状态</Label>
@@ -664,19 +696,21 @@ export default function Photos() {
                     {getStatusText(viewingPhoto.status)}
                   </Badge>
                 </div>
-                
+
                 <div>
                   <Label className="text-sm font-medium">文件大小</Label>
-                  <p className="text-sm text-muted-foreground">{formatFileSize(viewingPhoto.fileSize)}</p>
+                  <p className="text-sm text-muted-foreground">
+                    {formatFileSize(viewingPhoto.fileSize)}
+                  </p>
                 </div>
-                
+
                 <div>
                   <Label className="text-sm font-medium">创建时间</Label>
                   <p className="text-sm text-muted-foreground">
                     {new Date(viewingPhoto.createdAt).toLocaleString()}
                   </p>
                 </div>
-                
+
                 <div>
                   <Label className="text-sm font-medium">更新时间</Label>
                   <p className="text-sm text-muted-foreground">
@@ -684,19 +718,19 @@ export default function Photos() {
                   </p>
                 </div>
               </div>
-              
+
               {viewingPhoto.description && (
                 <div>
                   <Label className="text-sm font-medium">描述</Label>
                   <p className="text-sm text-muted-foreground mt-1">{viewingPhoto.description}</p>
                 </div>
               )}
-              
+
               {viewingPhoto.categories && viewingPhoto.categories.length > 0 && (
                 <div>
                   <Label className="text-sm font-medium">分类</Label>
                   <div className="flex flex-wrap gap-2 mt-1">
-                    {viewingPhoto.categories.map((category) => (
+                    {viewingPhoto.categories.map(category => (
                       <Badge key={category.id} variant="secondary">
                         <Folder className="h-3 w-3 mr-1" />
                         {category.name}
@@ -705,12 +739,12 @@ export default function Photos() {
                   </div>
                 </div>
               )}
-              
+
               {viewingPhoto.tags && viewingPhoto.tags.length > 0 && (
                 <div>
                   <Label className="text-sm font-medium">标签</Label>
                   <div className="flex flex-wrap gap-2 mt-1">
-                    {viewingPhoto.tags.map((tag) => (
+                    {viewingPhoto.tags.map(tag => (
                       <Badge key={tag.id} variant="outline">
                         <Tag className="h-3 w-3 mr-1" />
                         {tag.name}
@@ -721,7 +755,7 @@ export default function Photos() {
               )}
             </div>
           )}
-          
+
           <div className="flex justify-end gap-2">
             <Button variant="outline" onClick={() => setIsViewDialogOpen(false)}>
               关闭
@@ -735,4 +769,4 @@ export default function Photos() {
       </Dialog>
     </div>
   )
-}
\ No newline at end of file
+}
diff --git a/admin/src/pages/Settings.tsx b/admin/src/pages/Settings.tsx
index 5e22f91..c793215 100644
--- a/admin/src/pages/Settings.tsx
+++ b/admin/src/pages/Settings.tsx
@@ -1,28 +1,28 @@
-import { useState } from 'react'
-import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query'
-import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
+import { Badge } from '@/components/ui/badge'
 import { Button } from '@/components/ui/button'
+import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
 import { Input } from '@/components/ui/input'
 import { Label } from '@/components/ui/label'
-import { Textarea } from '@/components/ui/textarea'
 import { Switch } from '@/components/ui/switch'
-import { Badge } from '@/components/ui/badge'
-import { 
-  Settings as SettingsIcon,
-  Globe,
-  Database,
-  Shield,
+import { Textarea } from '@/components/ui/textarea'
+import { settingsService } from '@/services/settingsService'
+import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'
+import {
   Bell,
-  Upload,
-  Server,
+  Cpu,
+  Database,
+  Globe,
+  HardDrive,
   RefreshCw,
   Save,
+  Server,
+  Settings as SettingsIcon,
+  Shield,
   Trash2,
-  HardDrive,
-  Cpu,
+  Upload,
 } from 'lucide-react'
+import { useState } from 'react'
 import { toast } from 'sonner'
-import { settingsService } from '@/services/settingsService'
 
 interface SystemSettings {
   site: {
@@ -103,20 +103,22 @@ interface SystemStatus {
 
 export default function Settings() {
   const queryClient = useQueryClient()
-  const [activeTab, setActiveTab] = useState<'general' | 'upload' | 'security' | 'performance' | 'notifications' | 'backup' | 'system'>('general')
+  const [activeTab, setActiveTab] = useState<
+    'general' | 'upload' | 'security' | 'performance' | 'notifications' | 'backup' | 'system'
+  >('general')
   const [isDirty, setIsDirty] = useState(false)
 
   // 获取系统设置
   const { data: settings } = useQuery<SystemSettings>({
     queryKey: ['settings'],
-    queryFn: settingsService.getSettings
+    queryFn: settingsService.getSettings,
   })
 
   // 获取系统状态
   const { data: status } = useQuery<SystemStatus>({
     queryKey: ['system-status'],
     queryFn: settingsService.getSystemStatus,
-    refetchInterval: 30000 // 30秒刷新一次
+    refetchInterval: 30000, // 30秒刷新一次
   })
 
   // 更新设置
@@ -129,7 +131,7 @@ export default function Settings() {
     },
     onError: (error: any) => {
       toast.error(error?.message || '保存失败')
-    }
+    },
   })
 
   // 系统操作
@@ -141,7 +143,7 @@ export default function Settings() {
     },
     onError: (error: any) => {
       toast.error(error?.message || '操作失败')
-    }
+    },
   })
 
   const handleSaveSettings = () => {
@@ -168,7 +170,7 @@ export default function Settings() {
     { id: 'performance', label: '性能设置', icon: Cpu },
     { id: 'notifications', label: '通知设置', icon: Bell },
     { id: 'backup', label: '备份设置', icon: Database },
-    { id: 'system', label: '系统状态', icon: Server }
+    { id: 'system', label: '系统状态', icon: Server },
   ]
 
   const renderGeneralSettings = () => (
@@ -184,7 +186,7 @@ export default function Settings() {
               <Input
                 id="site-title"
                 value={settings?.site.title || ''}
-                onChange={(e) => updateSetting('site', 'title', e.target.value)}
+                onChange={e => updateSetting('site', 'title', e.target.value)}
                 placeholder="摄影作品集"
               />
             </div>
@@ -194,39 +196,39 @@ export default function Settings() {
                 id="contact-email"
                 type="email"
                 value={settings?.site.contactEmail || ''}
-                onChange={(e) => updateSetting('site', 'contactEmail', e.target.value)}
+                onChange={e => updateSetting('site', 'contactEmail', e.target.value)}
                 placeholder="contact@example.com"
               />
             </div>
           </div>
-          
+
           <div>
             <Label htmlFor="site-description">网站描述</Label>
             <Textarea
               id="site-description"
               value={settings?.site.description || ''}
-              onChange={(e) => updateSetting('site', 'description', e.target.value)}
+              onChange={e => updateSetting('site', 'description', e.target.value)}
               placeholder="分享摄影作品，记录美好时光"
               rows={3}
             />
           </div>
-          
+
           <div>
             <Label htmlFor="site-keywords">关键词</Label>
             <Input
               id="site-keywords"
               value={settings?.site.keywords || ''}
-              onChange={(e) => updateSetting('site', 'keywords', e.target.value)}
+              onChange={e => updateSetting('site', 'keywords', e.target.value)}
               placeholder="摄影, 作品集, 艺术, 照片"
             />
           </div>
-          
+
           <div>
             <Label htmlFor="copyright">版权信息</Label>
             <Input
               id="copyright"
               value={settings?.site.copyright || ''}
-              onChange={(e) => updateSetting('site', 'copyright', e.target.value)}
+              onChange={e => updateSetting('site', 'copyright', e.target.value)}
               placeholder="© 2024 摄影作品集. All rights reserved."
             />
           </div>
@@ -249,7 +251,7 @@ export default function Settings() {
                 id="max-file-size"
                 type="number"
                 value={settings?.upload.maxFileSize || 10}
-                onChange={(e) => updateSetting('upload', 'maxFileSize', parseInt(e.target.value))}
+                onChange={e => updateSetting('upload', 'maxFileSize', parseInt(e.target.value))}
                 min="1"
                 max="100"
               />
@@ -260,13 +262,15 @@ export default function Settings() {
                 id="compression-quality"
                 type="number"
                 value={settings?.upload.compressionQuality || 85}
-                onChange={(e) => updateSetting('upload', 'compressionQuality', parseInt(e.target.value))}
+                onChange={e =>
+                  updateSetting('upload', 'compressionQuality', parseInt(e.target.value))
+                }
                 min="1"
                 max="100"
               />
             </div>
           </div>
-          
+
           <div>
             <Label>允许的文件类型</Label>
             <div className="flex flex-wrap gap-2 mt-2">
@@ -279,7 +283,7 @@ export default function Settings() {
           </div>
         </CardContent>
       </Card>
-      
+
       <Card>
         <CardHeader>
           <CardTitle>水印设置</CardTitle>
@@ -289,11 +293,11 @@ export default function Settings() {
             <Switch
               id="watermark-enabled"
               checked={settings?.upload.watermarkEnabled || false}
-              onCheckedChange={(checked) => updateSetting('upload', 'watermarkEnabled', checked)}
+              onCheckedChange={checked => updateSetting('upload', 'watermarkEnabled', checked)}
             />
             <Label htmlFor="watermark-enabled">启用水印</Label>
           </div>
-          
+
           {settings?.upload.watermarkEnabled && (
             <div className="grid grid-cols-2 gap-4">
               <div>
@@ -301,7 +305,7 @@ export default function Settings() {
                 <Input
                   id="watermark-text"
                   value={settings?.upload.watermarkText || ''}
-                  onChange={(e) => updateSetting('upload', 'watermarkText', e.target.value)}
+                  onChange={e => updateSetting('upload', 'watermarkText', e.target.value)}
                   placeholder="© 摄影师名字"
                 />
               </div>
@@ -310,7 +314,7 @@ export default function Settings() {
                 <select
                   id="watermark-position"
                   value={settings?.upload.watermarkPosition || 'bottom-right'}
-                  onChange={(e) => updateSetting('upload', 'watermarkPosition', e.target.value)}
+                  onChange={e => updateSetting('upload', 'watermarkPosition', e.target.value)}
                   className="w-full p-2 border rounded"
                 >
                   <option value="top-left">左上角</option>
@@ -341,7 +345,7 @@ export default function Settings() {
                 id="jwt-expiration"
                 type="number"
                 value={settings?.security.jwtExpiration || 24}
-                onChange={(e) => updateSetting('security', 'jwtExpiration', parseInt(e.target.value))}
+                onChange={e => updateSetting('security', 'jwtExpiration', parseInt(e.target.value))}
                 min="1"
                 max="168"
               />
@@ -352,28 +356,30 @@ export default function Settings() {
                 id="max-login-attempts"
                 type="number"
                 value={settings?.security.maxLoginAttempts || 5}
-                onChange={(e) => updateSetting('security', 'maxLoginAttempts', parseInt(e.target.value))}
+                onChange={e =>
+                  updateSetting('security', 'maxLoginAttempts', parseInt(e.target.value))
+                }
                 min="1"
                 max="10"
               />
             </div>
           </div>
-          
+
           <div className="space-y-3">
             <div className="flex items-center space-x-2">
               <Switch
                 id="enable-2fa"
                 checked={settings?.security.enableTwoFactor || false}
-                onCheckedChange={(checked) => updateSetting('security', 'enableTwoFactor', checked)}
+                onCheckedChange={checked => updateSetting('security', 'enableTwoFactor', checked)}
               />
               <Label htmlFor="enable-2fa">启用两步验证</Label>
             </div>
-            
+
             <div className="flex items-center space-x-2">
               <Switch
                 id="enable-audit-log"
                 checked={settings?.security.enableAuditLog || false}
-                onCheckedChange={(checked) => updateSetting('security', 'enableAuditLog', checked)}
+                onCheckedChange={checked => updateSetting('security', 'enableAuditLog', checked)}
               />
               <Label htmlFor="enable-audit-log">启用审计日志</Label>
             </div>
@@ -424,7 +430,9 @@ export default function Settings() {
             <div className="space-y-3">
               <div className="flex items-center justify-between">
                 <span>连接状态</span>
-                <Badge variant={status?.database.status === 'connected' ? 'default' : 'destructive'}>
+                <Badge
+                  variant={status?.database.status === 'connected' ? 'default' : 'destructive'}
+                >
                   {status?.database.status === 'connected' ? '已连接' : '断开连接'}
                 </Badge>
               </div>
@@ -467,7 +475,7 @@ export default function Settings() {
                   <span>{status?.storage.usage}%</span>
                 </div>
                 <div className="w-full bg-gray-200 rounded-full h-2">
-                  <div 
+                  <div
                     className="bg-blue-600 h-2 rounded-full transition-all duration-300"
                     style={{ width: `${status?.storage.usage}%` }}
                   />
@@ -496,11 +504,15 @@ export default function Settings() {
               </div>
               <div className="flex items-center justify-between">
                 <span>活跃连接</span>
-                <span className="text-sm text-muted-foreground">{status?.performance.activeConnections}</span>
+                <span className="text-sm text-muted-foreground">
+                  {status?.performance.activeConnections}
+                </span>
               </div>
               <div className="flex items-center justify-between">
                 <span>响应时间</span>
-                <span className="text-sm text-muted-foreground">{status?.performance.responseTime}ms</span>
+                <span className="text-sm text-muted-foreground">
+                  {status?.performance.responseTime}ms
+                </span>
               </div>
             </div>
           </CardContent>
@@ -565,9 +577,7 @@ export default function Settings() {
         return (
           <Card>
             <CardContent className="py-8">
-              <div className="text-center text-muted-foreground">
-                {activeTab} 设置页面开发中...
-              </div>
+              <div className="text-center text-muted-foreground">{activeTab} 设置页面开发中...</div>
             </CardContent>
           </Card>
         )
@@ -580,12 +590,10 @@ export default function Settings() {
       <div className="flex items-center justify-between mb-8">
         <div>
           <h1 className="text-3xl font-bold">系统设置</h1>
-          <p className="text-muted-foreground mt-1">
-            管理系统配置和运行状态
-          </p>
+          <p className="text-muted-foreground mt-1">管理系统配置和运行状态</p>
         </div>
         {isDirty && (
-          <Button 
+          <Button
             onClick={handleSaveSettings}
             disabled={updateSettingsMutation.isPending}
             className="flex items-center gap-2"
@@ -610,7 +618,9 @@ export default function Settings() {
                     key={tab.id}
                     onClick={() => setActiveTab(tab.id as any)}
                     className={`w-full flex items-center gap-3 px-4 py-3 text-left hover:bg-accent transition-colors ${
-                      activeTab === tab.id ? 'bg-accent text-accent-foreground' : 'text-muted-foreground'
+                      activeTab === tab.id
+                        ? 'bg-accent text-accent-foreground'
+                        : 'text-muted-foreground'
                     }`}
                   >
                     <tab.icon className="h-4 w-4" />
@@ -623,10 +633,8 @@ export default function Settings() {
         </div>
 
         {/* 右侧内容 */}
-        <div className="flex-1">
-          {renderTabContent()}
-        </div>
+        <div className="flex-1">{renderTabContent()}</div>
       </div>
     </div>
   )
-}
\ No newline at end of file
+}
diff --git a/admin/src/pages/Tags.tsx b/admin/src/pages/Tags.tsx
index 0a1b8b8..0fe564f 100644
--- a/admin/src/pages/Tags.tsx
+++ b/admin/src/pages/Tags.tsx
@@ -1,28 +1,33 @@
-import { useState } from 'react'
-import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query'
-import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
-import { Button } from '@/components/ui/button'
-import { Input } from '@/components/ui/input'
 import { Badge } from '@/components/ui/badge'
+import { Button } from '@/components/ui/button'
+import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from '@/components/ui/dropdown-menu'
+import { Input } from '@/components/ui/input'
 import { Skeleton } from '@/components/ui/skeleton'
-import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from '@/components/ui/dropdown-menu'
-import { 
-  Tag as TagIcon, 
-  Hash,
-  MoreVertical,
-  Edit,
-  Trash,
-  Plus,
-  Search,
-  Filter,
-  ArrowUp,
-  ArrowDown,
-  TrendingUp,
-  Hash as HashTag
-} from 'lucide-react'
-import { toast } from 'sonner'
 import { tagService } from '@/services/tagService'
 import { Tag } from '@/types'
+import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'
+import {
+  ArrowDown,
+  ArrowUp,
+  Edit,
+  Filter,
+  Hash,
+  Hash as HashTag,
+  MoreVertical,
+  Plus,
+  Search,
+  Tag as TagIcon,
+  Trash,
+  TrendingUp,
+} from 'lucide-react'
+import { useState } from 'react'
+import { toast } from 'sonner'
 
 export default function Tags() {
   const queryClient = useQueryClient()
@@ -34,19 +39,19 @@ export default function Tags() {
   // 获取标签列表
   const { data: tagsData, isLoading: tagsLoading } = useQuery<Tag[]>({
     queryKey: ['tags', { search, sortBy, sortOrder, filterActive }],
-    queryFn: () => tagService.getAllTags()
-        })
+    queryFn: () => tagService.getAllTags(),
+  })
 
   // 获取标签统计
   const { data: stats, isLoading: statsLoading } = useQuery({
     queryKey: ['tag-stats'],
-    queryFn: tagService.getStats
+    queryFn: tagService.getStats,
   })
-  
+
   // 获取热门标签
   const { data: popularTags } = useQuery({
     queryKey: ['popular-tags'],
-    queryFn: () => tagService.getPopularTags(10)
+    queryFn: () => tagService.getPopularTags(10),
   })
 
   // 删除标签
@@ -59,12 +64,12 @@ export default function Tags() {
     },
     onError: (error: any) => {
       toast.error(error?.message || '删除失败')
-    }
+    },
   })
 
   // 切换标签状态
   const toggleTagStatusMutation = useMutation({
-    mutationFn: ({ id, isActive }: { id: number; isActive: boolean }) => 
+    mutationFn: ({ id, isActive }: { id: number; isActive: boolean }) =>
       tagService.updateTag(id, { isActive }),
     onSuccess: () => {
       queryClient.invalidateQueries({ queryKey: ['tags'] })
@@ -73,7 +78,7 @@ export default function Tags() {
     },
     onError: (error: any) => {
       toast.error(error?.message || '更新失败')
-    }
+    },
   })
 
   const handleDeleteTag = (tagId: number, photoCount: number) => {
@@ -81,7 +86,7 @@ export default function Tags() {
       toast.error('无法删除包含照片的标签')
       return
     }
-    
+
     if (confirm('确定要删除这个标签吗？')) {
       deleteTagMutation.mutate(tagId)
     }
@@ -113,9 +118,7 @@ export default function Tags() {
       <div className="flex items-center justify-between mb-8">
         <div>
           <h1 className="text-3xl font-bold">标签管理</h1>
-          <p className="text-muted-foreground mt-1">
-            管理照片标签和分类标记
-          </p>
+          <p className="text-muted-foreground mt-1">管理照片标签和分类标记</p>
         </div>
         <Button className="flex items-center gap-2">
           <Plus className="h-4 w-4" />
@@ -200,7 +203,10 @@ export default function Tags() {
                   key={index}
                   variant="secondary"
                   className="flex items-center gap-1 px-3 py-1 text-sm"
-                  style={{ backgroundColor: (tag.color || '#666') + '20', color: tag.color || '#666' }}
+                  style={{
+                    backgroundColor: (tag.color || '#666') + '20',
+                    color: tag.color || '#666',
+                  }}
                 >
                   <Hash className="h-3 w-3" />
                   {tag.name}
@@ -221,14 +227,14 @@ export default function Tags() {
               <Input
                 placeholder="搜索标签..."
                 value={search}
-                onChange={(e) => setSearch(e.target.value)}
+                onChange={e => setSearch(e.target.value)}
                 className="pl-10"
               />
             </div>
-            
+
             <div className="flex gap-2">
               <Button
-                variant={filterActive === undefined ? "default" : "outline"}
+                variant={filterActive === undefined ? 'default' : 'outline'}
                 size="sm"
                 onClick={() => setFilterActive(undefined)}
               >
@@ -236,14 +242,14 @@ export default function Tags() {
                 全部
               </Button>
               <Button
-                variant={filterActive === true ? "default" : "outline"}
+                variant={filterActive === true ? 'default' : 'outline'}
                 size="sm"
                 onClick={() => setFilterActive(true)}
               >
                 启用
               </Button>
               <Button
-                variant={filterActive === false ? "default" : "outline"}
+                variant={filterActive === false ? 'default' : 'outline'}
                 size="sm"
                 onClick={() => setFilterActive(false)}
               >
@@ -267,9 +273,12 @@ export default function Tags() {
                 className="flex items-center gap-1"
               >
                 名称
-                {sortBy === 'name' && (
-                  sortOrder === 'asc' ? <ArrowUp className="h-3 w-3" /> : <ArrowDown className="h-3 w-3" />
-                )}
+                {sortBy === 'name' &&
+                  (sortOrder === 'asc' ? (
+                    <ArrowUp className="h-3 w-3" />
+                  ) : (
+                    <ArrowDown className="h-3 w-3" />
+                  ))}
               </Button>
               <Button
                 variant="outline"
@@ -278,9 +287,12 @@ export default function Tags() {
                 className="flex items-center gap-1"
               >
                 照片数
-                {sortBy === 'photoCount' && (
-                  sortOrder === 'asc' ? <ArrowUp className="h-3 w-3" /> : <ArrowDown className="h-3 w-3" />
-                )}
+                {sortBy === 'photoCount' &&
+                  (sortOrder === 'asc' ? (
+                    <ArrowUp className="h-3 w-3" />
+                  ) : (
+                    <ArrowDown className="h-3 w-3" />
+                  ))}
               </Button>
               <Button
                 variant="outline"
@@ -289,9 +301,12 @@ export default function Tags() {
                 className="flex items-center gap-1"
               >
                 创建时间
-                {sortBy === 'createdAt' && (
-                  sortOrder === 'asc' ? <ArrowUp className="h-3 w-3" /> : <ArrowDown className="h-3 w-3" />
-                )}
+                {sortBy === 'createdAt' &&
+                  (sortOrder === 'asc' ? (
+                    <ArrowUp className="h-3 w-3" />
+                  ) : (
+                    <ArrowDown className="h-3 w-3" />
+                  ))}
               </Button>
             </div>
           </div>
@@ -313,10 +328,13 @@ export default function Tags() {
           ) : filteredTags?.length ? (
             <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
               {filteredTags.map((tag: any) => (
-                <div key={tag.id} className="flex items-center justify-between p-4 border rounded-lg hover:bg-accent/50 transition-colors">
+                <div
+                  key={tag.id}
+                  className="flex items-center justify-between p-4 border rounded-lg hover:bg-accent/50 transition-colors"
+                >
                   <div className="flex items-center space-x-3">
-                    <div 
-                      className="w-4 h-4 rounded-full border-2" 
+                    <div
+                      className="w-4 h-4 rounded-full border-2"
                       style={{ backgroundColor: tag.color }}
                     />
                     <div>
@@ -339,7 +357,7 @@ export default function Tags() {
                       )}
                     </div>
                   </div>
-                  
+
                   <DropdownMenu>
                     <DropdownMenuTrigger asChild>
                       <Button variant="ghost" size="sm">
@@ -351,12 +369,10 @@ export default function Tags() {
                         <Edit className="h-4 w-4 mr-2" />
                         编辑
                       </DropdownMenuItem>
-                      <DropdownMenuItem
-                        onClick={() => handleToggleStatus(tag.id, tag.isActive)}
-                      >
+                      <DropdownMenuItem onClick={() => handleToggleStatus(tag.id, tag.isActive)}>
                         {tag.isActive ? '禁用' : '启用'}
                       </DropdownMenuItem>
-                      <DropdownMenuItem 
+                      <DropdownMenuItem
                         onClick={() => handleDeleteTag(tag.id, tag.photoCount)}
                         disabled={tag.photoCount > 0}
                         className="text-red-600"
@@ -388,4 +404,4 @@ export default function Tags() {
       </Card>
     </div>
   )
-}
\ No newline at end of file
+}
diff --git a/admin/src/pages/TestApi.tsx b/admin/src/pages/TestApi.tsx
index 20d4372..0d11782 100644
--- a/admin/src/pages/TestApi.tsx
+++ b/admin/src/pages/TestApi.tsx
@@ -1,7 +1,7 @@
-import React, { useState, useEffect } from 'react'
-import { categoryService } from '@/services/categoryService'
 import { authService } from '@/services/authService'
+import { categoryService } from '@/services/categoryService'
 import { useAuthStore } from '@/stores/authStore'
+import React, { useEffect, useState } from 'react'
 import { toast } from 'sonner'
 
 const TestApi: React.FC = () => {
@@ -16,9 +16,9 @@ const TestApi: React.FC = () => {
       setLoading(true)
       const response = await authService.login({
         username: 'admin',
-        password: 'admin123'
+        password: 'admin123',
       })
-      
+
       if (response.code === 0) {
         login(response.data.token, response.data.user)
         toast.success('登录成功')
@@ -35,7 +35,7 @@ const TestApi: React.FC = () => {
     try {
       setLoading(true)
       const response = await categoryService.getCategories()
-      
+
       if (response.code === 200) {
         setCategories(response.data.categories || [])
         toast.success('获取分类成功')
@@ -57,7 +57,7 @@ const TestApi: React.FC = () => {
     try {
       setLoading(true)
       const response = await categoryService.createCategory(newCategory)
-      
+
       if (response.code === 200) {
         toast.success('创建分类成功')
         setNewCategory({ name: '', description: '' })
@@ -79,7 +79,7 @@ const TestApi: React.FC = () => {
   return (
     <div className="p-6 max-w-4xl mx-auto">
       <h1 className="text-2xl font-bold mb-6">API 测试页面</h1>
-      
+
       {/* 登录测试 */}
       <div className="mb-6 p-4 border rounded-lg">
         <h2 className="text-lg font-semibold mb-2">登录测试</h2>
@@ -96,7 +96,7 @@ const TestApi: React.FC = () => {
       {/* 分类管理测试 */}
       <div className="mb-6 p-4 border rounded-lg">
         <h2 className="text-lg font-semibold mb-4">分类管理测试</h2>
-        
+
         {/* 创建分类 */}
         <div className="mb-4">
           <h3 className="font-medium mb-2">创建分类</h3>
@@ -105,14 +105,14 @@ const TestApi: React.FC = () => {
               type="text"
               placeholder="分类名称"
               value={newCategory.name}
-              onChange={(e) => setNewCategory(prev => ({ ...prev, name: e.target.value }))}
+              onChange={e => setNewCategory(prev => ({ ...prev, name: e.target.value }))}
               className="flex-1 px-3 py-2 border rounded"
             />
             <input
               type="text"
               placeholder="分类描述"
               value={newCategory.description}
-              onChange={(e) => setNewCategory(prev => ({ ...prev, description: e.target.value }))}
+              onChange={e => setNewCategory(prev => ({ ...prev, description: e.target.value }))}
               className="flex-1 px-3 py-2 border rounded"
             />
             <button
@@ -140,12 +140,13 @@ const TestApi: React.FC = () => {
         <div>
           <h3 className="font-medium mb-2">分类列表 ({categories.length})</h3>
           <div className="space-y-2">
-            {categories.map((category) => (
+            {categories.map(category => (
               <div key={category.id} className="p-3 bg-gray-50 rounded">
                 <div className="font-medium">{category.name}</div>
                 <div className="text-sm text-gray-600">{category.description}</div>
                 <div className="text-xs text-gray-500">
-                  ID: {category.id} | 创建时间: {new Date(category.created_at * 1000).toLocaleString()}
+                  ID: {category.id} | 创建时间:{' '}
+                  {new Date(category.created_at * 1000).toLocaleString()}
                 </div>
               </div>
             ))}
@@ -156,4 +157,4 @@ const TestApi: React.FC = () => {
   )
 }
 
-export default TestApi
\ No newline at end of file
+export default TestApi
diff --git a/admin/src/pages/Users.tsx b/admin/src/pages/Users.tsx
index 25298e1..1f801d9 100644
--- a/admin/src/pages/Users.tsx
+++ b/admin/src/pages/Users.tsx
@@ -1,30 +1,35 @@
-import { useState } from 'react'
-import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query'
-import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
-import { Button } from '@/components/ui/button'
-import { Input } from '@/components/ui/input'
-import { Badge } from '@/components/ui/badge'
-import { Skeleton } from '@/components/ui/skeleton'
 import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar'
-import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from '@/components/ui/dropdown-menu'
-import { 
-  Users as UsersIcon, 
-  User,
-  MoreVerticalIcon,
+import { Badge } from '@/components/ui/badge'
+import { Button } from '@/components/ui/button'
+import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from '@/components/ui/dropdown-menu'
+import { Input } from '@/components/ui/input'
+import { Skeleton } from '@/components/ui/skeleton'
+import { userService } from '@/services/userService'
+import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'
+import {
+  CalendarIcon,
+  CrownIcon,
   EditIcon,
-  TrashIcon,
+  FilterIcon,
+  MailIcon,
+  MoreVerticalIcon,
   PlusIcon,
   SearchIcon,
-  FilterIcon,
   ShieldIcon,
+  TrashIcon,
+  User,
   UserCheckIcon,
+  Users as UsersIcon,
   UserXIcon,
-  MailIcon,
-  CalendarIcon,
-  CrownIcon
 } from 'lucide-react'
+import { useState } from 'react'
 import { toast } from 'sonner'
-import { userService } from '@/services/userService'
 
 interface UserData {
   id: number
@@ -60,17 +65,18 @@ export default function Users() {
   // 获取用户列表
   const { data: users, isLoading: usersLoading } = useQuery<UserData[]>({
     queryKey: ['users', { search, roleFilter, statusFilter }],
-    queryFn: () => userService.getUsers({
-      search,
-      role: roleFilter,
-      isActive: statusFilter
-    })
+    queryFn: () =>
+      userService.getUsers({
+        search,
+        role: roleFilter,
+        isActive: statusFilter,
+      }),
   })
 
   // 获取用户统计
   const { data: stats, isLoading: statsLoading } = useQuery<UserStats>({
     queryKey: ['user-stats'],
-    queryFn: userService.getStats
+    queryFn: userService.getStats,
   })
 
   // 删除用户
@@ -83,12 +89,12 @@ export default function Users() {
     },
     onError: (error: any) => {
       toast.error(error?.message || '删除失败')
-    }
+    },
   })
 
   // 切换用户状态
   const toggleUserStatusMutation = useMutation({
-    mutationFn: ({ id, isActive }: { id: number; isActive: boolean }) => 
+    mutationFn: ({ id, isActive }: { id: number; isActive: boolean }) =>
       userService.updateUser(id, { isActive }),
     onSuccess: () => {
       queryClient.invalidateQueries({ queryKey: ['users'] })
@@ -97,12 +103,12 @@ export default function Users() {
     },
     onError: (error: any) => {
       toast.error(error?.message || '更新失败')
-    }
+    },
   })
 
   // 更新用户角色
   const updateRoleMutation = useMutation({
-    mutationFn: ({ id, role }: { id: number; role: string }) => 
+    mutationFn: ({ id, role }: { id: number; role: string }) =>
       userService.updateUser(id, { role }),
     onSuccess: () => {
       queryClient.invalidateQueries({ queryKey: ['users'] })
@@ -111,7 +117,7 @@ export default function Users() {
     },
     onError: (error: any) => {
       toast.error(error?.message || '更新失败')
-    }
+    },
   })
 
   const handleDeleteUser = (userId: number, username: string) => {
@@ -155,8 +161,9 @@ export default function Users() {
   }
 
   const filteredUsers = users?.filter(user => {
-    const matchesSearch = user.username.toLowerCase().includes(search.toLowerCase()) ||
-                         user.email.toLowerCase().includes(search.toLowerCase())
+    const matchesSearch =
+      user.username.toLowerCase().includes(search.toLowerCase()) ||
+      user.email.toLowerCase().includes(search.toLowerCase())
     const matchesRole = roleFilter === null || user.role === roleFilter
     const matchesStatus = statusFilter === null || user.isActive === statusFilter
     return matchesSearch && matchesRole && matchesStatus
@@ -168,9 +175,7 @@ export default function Users() {
       <div className="flex items-center justify-between mb-8">
         <div>
           <h1 className="text-3xl font-bold">用户管理</h1>
-          <p className="text-muted-foreground mt-1">
-            管理系统用户和权限分配
-          </p>
+          <p className="text-muted-foreground mt-1">管理系统用户和权限分配</p>
         </div>
         <Button className="flex items-center gap-2">
           <PlusIcon className="h-4 w-4" />
@@ -274,14 +279,14 @@ export default function Users() {
               <Input
                 placeholder="搜索用户名或邮箱..."
                 value={search}
-                onChange={(e) => setSearch(e.target.value)}
+                onChange={e => setSearch(e.target.value)}
                 className="pl-10"
               />
             </div>
-            
+
             <div className="flex gap-2">
               <Button
-                variant={roleFilter === null ? "default" : "outline"}
+                variant={roleFilter === null ? 'default' : 'outline'}
                 size="sm"
                 onClick={() => setRoleFilter(null)}
               >
@@ -289,7 +294,7 @@ export default function Users() {
                 全部角色
               </Button>
               <Button
-                variant={roleFilter === 'admin' ? "default" : "outline"}
+                variant={roleFilter === 'admin' ? 'default' : 'outline'}
                 size="sm"
                 onClick={() => setRoleFilter('admin')}
               >
@@ -297,7 +302,7 @@ export default function Users() {
                 管理员
               </Button>
               <Button
-                variant={roleFilter === 'editor' ? "default" : "outline"}
+                variant={roleFilter === 'editor' ? 'default' : 'outline'}
                 size="sm"
                 onClick={() => setRoleFilter('editor')}
               >
@@ -305,7 +310,7 @@ export default function Users() {
                 编辑员
               </Button>
               <Button
-                variant={roleFilter === 'viewer' ? "default" : "outline"}
+                variant={roleFilter === 'viewer' ? 'default' : 'outline'}
                 size="sm"
                 onClick={() => setRoleFilter('viewer')}
               >
@@ -313,17 +318,17 @@ export default function Users() {
                 访客
               </Button>
             </div>
-            
+
             <div className="flex gap-2">
               <Button
-                variant={statusFilter === null ? "default" : "outline"}
+                variant={statusFilter === null ? 'default' : 'outline'}
                 size="sm"
                 onClick={() => setStatusFilter(null)}
               >
                 全部状态
               </Button>
               <Button
-                variant={statusFilter === true ? "default" : "outline"}
+                variant={statusFilter === true ? 'default' : 'outline'}
                 size="sm"
                 onClick={() => setStatusFilter(true)}
               >
@@ -331,7 +336,7 @@ export default function Users() {
                 启用
               </Button>
               <Button
-                variant={statusFilter === false ? "default" : "outline"}
+                variant={statusFilter === false ? 'default' : 'outline'}
                 size="sm"
                 onClick={() => setStatusFilter(false)}
               >
@@ -368,8 +373,11 @@ export default function Users() {
             </div>
           ) : filteredUsers?.length ? (
             <div className="space-y-4">
-              {filteredUsers.map((user) => (
-                <div key={user.id} className="flex items-center justify-between p-4 border rounded-lg hover:bg-accent/50 transition-colors">
+              {filteredUsers.map(user => (
+                <div
+                  key={user.id}
+                  className="flex items-center justify-between p-4 border rounded-lg hover:bg-accent/50 transition-colors"
+                >
                   <div className="flex items-center space-x-4">
                     <Avatar className="h-12 w-12">
                       <AvatarImage src={user.profile?.avatar} />
@@ -377,7 +385,7 @@ export default function Users() {
                         {user.profile?.firstName?.[0] || user.username[0].toUpperCase()}
                       </AvatarFallback>
                     </Avatar>
-                    
+
                     <div>
                       <div className="flex items-center space-x-2">
                         <span className="font-medium">{user.username}</span>
@@ -387,12 +395,15 @@ export default function Users() {
                         <Badge className={getRoleColor(user.role)}>
                           {getRoleIcon(user.role)}
                           <span className="ml-1">
-                            {user.role === 'admin' ? '管理员' : 
-                             user.role === 'editor' ? '编辑员' : '访客'}
+                            {user.role === 'admin'
+                              ? '管理员'
+                              : user.role === 'editor'
+                                ? '编辑员'
+                                : '访客'}
                           </span>
                         </Badge>
                       </div>
-                      
+
                       <div className="flex items-center gap-4 mt-1 text-sm text-muted-foreground">
                         <div className="flex items-center gap-1">
                           <MailIcon className="h-3 w-3" />
@@ -411,7 +422,7 @@ export default function Users() {
                       </div>
                     </div>
                   </div>
-                  
+
                   <DropdownMenu>
                     <DropdownMenuTrigger asChild>
                       <Button variant="ghost" size="sm">
@@ -427,9 +438,7 @@ export default function Users() {
                         <ShieldIcon className="h-4 w-4 mr-2" />
                         重置密码
                       </DropdownMenuItem>
-                      <DropdownMenuItem
-                        onClick={() => handleToggleStatus(user.id, user.isActive)}
-                      >
+                      <DropdownMenuItem onClick={() => handleToggleStatus(user.id, user.isActive)}>
                         {user.isActive ? (
                           <>
                             <UserXIcon className="h-4 w-4 mr-2" />
@@ -444,27 +453,21 @@ export default function Users() {
                       </DropdownMenuItem>
                       {user.role !== 'admin' && (
                         <>
-                          <DropdownMenuItem
-                            onClick={() => handleUpdateRole(user.id, 'admin')}
-                          >
+                          <DropdownMenuItem onClick={() => handleUpdateRole(user.id, 'admin')}>
                             <CrownIcon className="h-4 w-4 mr-2" />
                             设为管理员
                           </DropdownMenuItem>
-                          <DropdownMenuItem
-                            onClick={() => handleUpdateRole(user.id, 'editor')}
-                          >
+                          <DropdownMenuItem onClick={() => handleUpdateRole(user.id, 'editor')}>
                             <EditIcon className="h-4 w-4 mr-2" />
                             设为编辑员
                           </DropdownMenuItem>
-                          <DropdownMenuItem
-                            onClick={() => handleUpdateRole(user.id, 'viewer')}
-                          >
+                          <DropdownMenuItem onClick={() => handleUpdateRole(user.id, 'viewer')}>
                             <User className="h-4 w-4 mr-2" />
                             设为访客
                           </DropdownMenuItem>
                         </>
                       )}
-                      <DropdownMenuItem 
+                      <DropdownMenuItem
                         onClick={() => handleDeleteUser(user.id, user.username)}
                         className="text-red-600"
                         disabled={user.role === 'admin'} // 防止删除管理员
@@ -496,4 +499,4 @@ export default function Users() {
       </Card>
     </div>
   )
-}
\ No newline at end of file
+}
diff --git a/admin/src/services/api.ts b/admin/src/services/api.ts
index f07d7c5..ae91002 100644
--- a/admin/src/services/api.ts
+++ b/admin/src/services/api.ts
@@ -1,5 +1,5 @@
-import axios from 'axios'
 import { useAuthStore } from '@/stores/authStore'
+import axios from 'axios'
 import { toast } from 'sonner'
 
 const api = axios.create({
@@ -12,41 +12,41 @@ const api = axios.create({
 
 // 请求拦截器
 api.interceptors.request.use(
-  (config) => {
+  config => {
     const { token } = useAuthStore.getState()
     if (token) {
       config.headers.Authorization = `Bearer ${token}`
     }
     return config
   },
-  (error) => {
+  error => {
     return Promise.reject(error)
   }
 )
 
 // 响应拦截器
 api.interceptors.response.use(
-  (response) => {
+  response => {
     // 处理后端的响应格式
     const data = response.data
-    
+
     // 检查后端的业务状态码
     if (data.code && data.code !== 0 && data.code !== 200) {
       const message = data.message || '请求失败'
       toast.error(message)
       return Promise.reject(new Error(message))
     }
-    
+
     return response
   },
-  (error) => {
+  error => {
     const message = error.response?.data?.message || error.message || '请求失败'
-    
+
     // 显示错误提示
     if (error.response?.status !== 401) {
       toast.error(message)
     }
-    
+
     // 401 错误自动跳转登录
     if (error.response?.status === 401) {
       const { logout } = useAuthStore.getState()
@@ -54,9 +54,9 @@ api.interceptors.response.use(
       window.location.href = '/login'
       toast.error('登录已过期，请重新登录')
     }
-    
+
     return Promise.reject(error)
   }
 )
 
-export default api
\ No newline at end of file
+export default api
diff --git a/admin/src/services/authService.ts b/admin/src/services/authService.ts
index 8a5939e..4838ee2 100644
--- a/admin/src/services/authService.ts
+++ b/admin/src/services/authService.ts
@@ -1,5 +1,5 @@
+import { LoginRequest, LoginResponse, User } from '@/types'
 import api from './api'
-import { User, LoginRequest, LoginResponse } from '@/types'
 
 export interface RefreshTokenRequest {
   refresh_token: string
@@ -62,4 +62,4 @@ class AuthService {
   }
 }
 
-export const authService = new AuthService()
\ No newline at end of file
+export const authService = new AuthService()
diff --git a/admin/src/services/categoryService.ts b/admin/src/services/categoryService.ts
index 1b02280..7b65f2a 100644
--- a/admin/src/services/categoryService.ts
+++ b/admin/src/services/categoryService.ts
@@ -1,5 +1,5 @@
+import { ApiResponse, Category, PaginatedResponse } from '@/types'
 import api from './api'
-import { Category, ApiResponse, PaginatedResponse } from '@/types'
 
 export interface CreateCategoryRequest {
   name: string
@@ -19,7 +19,10 @@ export interface CategoryStats {
 }
 
 class CategoryService {
-  async getCategories(page: number = 1, size: number = 10): Promise<ApiResponse<PaginatedResponse<Category>>> {
+  async getCategories(
+    page: number = 1,
+    size: number = 10
+  ): Promise<ApiResponse<PaginatedResponse<Category>>> {
     const response = await api.get('/categories', { params: { page, size } })
     return response.data
   }
@@ -54,7 +57,7 @@ class CategoryService {
     // 模拟统计数据，实际应该从后端获取
     const categoriesResponse = await this.getCategories(1, 1000)
     const categories = categoriesResponse.data?.categories || []
-    
+
     return {
       code: 0,
       message: 'success',
@@ -62,10 +65,10 @@ class CategoryService {
         total: categories.length,
         active: categories.length,
         topLevel: categories.length,
-        photoCounts: {}
-      }
+        photoCounts: {},
+      },
     }
   }
 }
 
-export const categoryService = new CategoryService()
\ No newline at end of file
+export const categoryService = new CategoryService()
diff --git a/admin/src/services/photoService.ts b/admin/src/services/photoService.ts
index fee38bb..af63c9d 100644
--- a/admin/src/services/photoService.ts
+++ b/admin/src/services/photoService.ts
@@ -1,5 +1,5 @@
-import api from './api'
 import { ApiResponse, PhotoStats } from '@/types'
+import api from './api'
 
 export interface Photo {
   id: number
@@ -139,7 +139,7 @@ class PhotoService {
   async uploadPhoto(file: File, data: CreatePhotoRequest): Promise<Photo> {
     const formData = new FormData()
     formData.append('file', file)
-    
+
     // 添加其他字段
     if (data.title) formData.append('title', data.title)
     if (data.description) formData.append('description', data.description)
@@ -176,4 +176,4 @@ class PhotoService {
   }
 }
 
-export const photoService = new PhotoService()
\ No newline at end of file
+export const photoService = new PhotoService()
diff --git a/admin/src/services/settingsService.ts b/admin/src/services/settingsService.ts
index 6cd5e27..a5d6cba 100644
--- a/admin/src/services/settingsService.ts
+++ b/admin/src/services/settingsService.ts
@@ -133,12 +133,16 @@ export const settingsService = {
     const formData = new FormData()
     formData.append('config', file)
     await api.post('/settings/import', formData, {
-      headers: { 'Content-Type': 'multipart/form-data' }
+      headers: { 'Content-Type': 'multipart/form-data' },
     })
   },
 
   // 获取系统日志
-  getSystemLogs: async (params: { level?: string; limit?: number; offset?: number }): Promise<any[]> => {
+  getSystemLogs: async (params: {
+    level?: string
+    limit?: number
+    offset?: number
+  }): Promise<any[]> => {
     const response = await api.get('/system/logs', { params })
     return response.data
   },
@@ -236,5 +240,5 @@ export const settingsService = {
   getTaskLogs: async (id: string): Promise<any[]> => {
     const response = await api.get(`/system/tasks/${id}/logs`)
     return response.data
-  }
-}
\ No newline at end of file
+  },
+}
diff --git a/admin/src/services/tagService.ts b/admin/src/services/tagService.ts
index 1cc80ec..a252768 100644
--- a/admin/src/services/tagService.ts
+++ b/admin/src/services/tagService.ts
@@ -1,5 +1,5 @@
+import { ApiResponse, Tag, TagStats } from '@/types'
 import api from './api'
-import { Tag, ApiResponse, TagStats } from '@/types'
 
 export interface TagWithCount extends Tag {
   photoCount: number
@@ -109,4 +109,4 @@ class TagService {
   }
 }
 
-export const tagService = new TagService()
\ No newline at end of file
+export const tagService = new TagService()
diff --git a/admin/src/services/userService.ts b/admin/src/services/userService.ts
index 0ae37da..2fca892 100644
--- a/admin/src/services/userService.ts
+++ b/admin/src/services/userService.ts
@@ -153,5 +153,5 @@ export const userService = {
   // 停用用户账号
   deactivateUser: async (id: number): Promise<void> => {
     await api.post(`/users/${id}/deactivate`)
-  }
-}
\ No newline at end of file
+  },
+}
diff --git a/admin/src/stores/authStore.ts b/admin/src/stores/authStore.ts
index d17f8a3..8f02fcb 100644
--- a/admin/src/stores/authStore.ts
+++ b/admin/src/stores/authStore.ts
@@ -1,6 +1,6 @@
+import { User } from '@/types'
 import { create } from 'zustand'
 import { persist } from 'zustand/middleware'
-import { User } from '@/types'
 
 interface AuthState {
   user: User | null
@@ -13,11 +13,11 @@ interface AuthState {
 
 export const useAuthStore = create<AuthState>()(
   persist(
-    (set) => ({
+    set => ({
       user: null,
       token: null,
       isAuthenticated: false,
-      
+
       login: (token: string, user: User) => {
         set({
           token,
@@ -25,7 +25,7 @@ export const useAuthStore = create<AuthState>()(
           isAuthenticated: true,
         })
       },
-      
+
       logout: () => {
         set({
           token: null,
@@ -33,18 +33,18 @@ export const useAuthStore = create<AuthState>()(
           isAuthenticated: false,
         })
       },
-      
+
       updateUser: (user: User) => {
         set({ user })
       },
     }),
     {
       name: 'auth-storage',
-      partialize: (state) => ({
+      partialize: state => ({
         token: state.token,
         user: state.user,
         isAuthenticated: state.isAuthenticated,
       }),
     }
   )
-)
\ No newline at end of file
+)
diff --git a/admin/src/types/index.ts b/admin/src/types/index.ts
index ea5142e..277ebd8 100644
--- a/admin/src/types/index.ts
+++ b/admin/src/types/index.ts
@@ -141,4 +141,4 @@ export interface PhotoFormData {
   categoryIds: string[]
   tagIds: string[]
   status: 'draft' | 'published' | 'archived'
-}
\ No newline at end of file
+}
diff --git a/admin/src/vite-env.d.ts b/admin/src/vite-env.d.ts
index 9363721..59a0b5d 100644
--- a/admin/src/vite-env.d.ts
+++ b/admin/src/vite-env.d.ts
@@ -8,4 +8,4 @@ interface ImportMetaEnv {
 
 interface ImportMeta {
   readonly env: ImportMetaEnv
-}
\ No newline at end of file
+}