feat: 新增备课模块并修复全模块 P0/P1/P2 缺陷

主要变更:

- 新增 lesson-preparation 模块: 备课编辑器、节点编辑、AI 建议、知识点选择、版本历史、作业发布

- 新增 shared 通用组件: charts/question-bank-filters/schedule-list/ui (chip-nav/filter-bar/page-header/stat-card/stat-item)

- 新增 student/admin 端 loading.tsx 与 error.tsx, 优化加载与错误态体验

- 新增 teacher/lesson-plans 页面 (列表/新建/编辑)

- 新增 drizzle 迁移 0002_tiny_lionheart 及 snapshot

- 新增 textbooks/schema.ts 与 exams/utils/normalize-structure.ts

- 修复 Tiptap v3 SSR hydration 崩溃 (rich-text-block immediatelyRender: false)

- 重构多模块 data-access/actions/组件, 修复权限校验与类型规范

- 同步架构文档 004/005 反映新增模块、导出、依赖关系

- 归档 bugs/* 测试报告与 e2e 测试脚本 (admin/parent/student/teacher web_test)

src/modules/settings/actions.ts

@@ -57,9 +57,15 @@ const normalizeBaseUrl = (value: string | undefined): string | null => {
     .replace(/\/chat\/completions$/i, "")
 }
 
-export async function getAiProviderSummaries(): Promise<AiProviderSummary[]> {
-  await ensureUser()
-  return fetchAiProviderSummaries()
+export async function getAiProviderSummaries(): Promise<ActionState<AiProviderSummary[]>> {
+  try {
+    await ensureUser()
+    const data = await fetchAiProviderSummaries()
+    return { success: true, data }
+  } catch (error) {
+    if (error instanceof PermissionDeniedError) return { success: false, message: error.message }
+    return { success: false, message: "Failed to load AI providers" }
+  }
 }
 
 export async function upsertAiProviderAction(

src/modules/settings/components/admin-settings-view.tsx

@@ -1,21 +1,16 @@
 "use client"
 
 import Link from "next/link"
-import { Shield, User, Building2, Lock, Bell } from "lucide-react"
-import { signOut } from "next-auth/react"
+import { Building2 } from "lucide-react"
 
+import { SettingsView } from "@/modules/settings/components/settings-view"
 import { Button } from "@/shared/components/ui/button"
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/shared/components/ui/card"
 import { Input } from "@/shared/components/ui/input"
 import { Label } from "@/shared/components/ui/label"
 import { Separator } from "@/shared/components/ui/separator"
-import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/shared/components/ui/tabs"
-import { ThemePreferencesCard } from "./theme-preferences-card"
-import { ProfileSettingsForm } from "@/modules/settings/components/profile-settings-form"
-import { PasswordChangeForm } from "@/modules/settings/components/password-change-form"
-import { NotificationPreferencesForm } from "@/modules/settings/components/notification-preferences-form"
 import { UserProfile } from "@/modules/users/data-access"
-import type { NotificationPreferences } from "@/modules/messaging/types"
+import type { NotificationPreferences } from "@/modules/notifications/types"
 
 interface AdminSettingsViewProps {
   user: UserProfile
@@ -23,107 +18,51 @@ interface AdminSettingsViewProps {
 }
 
 export function AdminSettingsView({ user, notificationPreferences }: AdminSettingsViewProps) {
-  return (
-    <div className="flex h-full flex-col gap-8 p-8">
-      <div className="flex flex-col justify-between gap-4 md:flex-row md:items-center">
-        <div className="space-y-1">
-          <h1 className="text-3xl font-bold tracking-tight">Settings</h1>
-          <div className="text-sm text-muted-foreground">Manage admin preferences and system defaults.</div>
+  const generalExtra = (
+    <Card>
+      <CardHeader>
+        <CardTitle>Organization</CardTitle>
+        <CardDescription>School identity shown across admin surfaces.</CardDescription>
+      </CardHeader>
+      <CardContent>
+        <div className="grid gap-4 sm:grid-cols-2">
+          <div className="space-y-2">
+            <Label htmlFor="schoolName">School name</Label>
+            <Input id="schoolName" defaultValue="Next_Edu School" disabled />
+          </div>
+          <div className="space-y-2">
+            <Label htmlFor="timezone">Timezone</Label>
+            <Input id="timezone" defaultValue="System default" disabled />
+          </div>
         </div>
-        <div className="flex items-center gap-2">
-          <Button asChild variant="outline">
-            <Link href="/admin/dashboard">Back to dashboard</Link>
+
+        <Separator className="my-6" />
+
+        <div className="flex items-start gap-3 rounded-lg border bg-muted/30 p-4">
+          <div className="flex h-9 w-9 items-center justify-center rounded-md bg-background">
+            <Building2 className="h-4 w-4 text-muted-foreground" />
+          </div>
+          <div className="flex-1 space-y-1">
+            <div className="text-sm font-medium">Managed in School Management</div>
+            <div className="text-sm text-muted-foreground">
+              Departments, classes, and academic year settings live under the School Management section.
+            </div>
+          </div>
+          <Button variant="outline" size="sm" asChild>
+            <Link href="/admin/school">Manage</Link>
           </Button>
         </div>
-      </div>
+      </CardContent>
+    </Card>
+  )
 
-      <Tabs defaultValue="general" className="w-full">
-        <TabsList className="w-full justify-start">
-          <TabsTrigger value="general" className="gap-2">
-            <User className="h-4 w-4" />
-            General
-          </TabsTrigger>
-          <TabsTrigger value="notifications" className="gap-2">
-            <Bell className="h-4 w-4" />
-            Notifications
-          </TabsTrigger>
-          <TabsTrigger value="appearance" className="gap-2">
-            <Shield className="h-4 w-4" />
-            Appearance
-          </TabsTrigger>
-          <TabsTrigger value="security" className="gap-2">
-            <Lock className="h-4 w-4" />
-            Security
-          </TabsTrigger>
-        </TabsList>
-
-        <TabsContent value="general" className="mt-6 space-y-6">
-          <ProfileSettingsForm user={user} />
-
-          <Card>
-            <CardHeader>
-              <CardTitle>Organization</CardTitle>
-              <CardDescription>School identity shown across admin surfaces.</CardDescription>
-            </CardHeader>
-            <CardContent>
-              <div className="grid gap-4 sm:grid-cols-2">
-                <div className="space-y-2">
-                  <Label htmlFor="schoolName">School name</Label>
-                  <Input id="schoolName" defaultValue="Next_Edu School" disabled />
-                </div>
-                <div className="space-y-2">
-                  <Label htmlFor="timezone">Timezone</Label>
-                  <Input id="timezone" defaultValue="System default" disabled />
-                </div>
-              </div>
-
-              <Separator className="my-6" />
-
-              <div className="flex items-start gap-3 rounded-lg border bg-muted/30 p-4">
-                <div className="flex h-9 w-9 items-center justify-center rounded-md bg-background">
-                  <Building2 className="h-4 w-4 text-muted-foreground" />
-                </div>
-                <div className="flex-1 space-y-1">
-                  <div className="text-sm font-medium">Managed in School Management</div>
-                  <div className="text-sm text-muted-foreground">
-                    Departments, classes, and academic year settings live under the School Management section.
-                  </div>
-                </div>
-                <Button variant="outline" size="sm" asChild>
-                  <Link href="/admin/school">Manage</Link>
-                </Button>
-              </div>
-            </CardContent>
-          </Card>
-        </TabsContent>
-
-        <TabsContent value="notifications" className="mt-6 space-y-6">
-          <NotificationPreferencesForm preferences={notificationPreferences} />
-        </TabsContent>
-
-        <TabsContent value="appearance" className="mt-6 space-y-6">
-          <ThemePreferencesCard />
-        </TabsContent>
-
-        <TabsContent value="security" className="mt-6 space-y-6">
-          <PasswordChangeForm />
-          <Card>
-            <CardHeader>
-              <CardTitle>Session</CardTitle>
-              <CardDescription>Account access and session controls.</CardDescription>
-            </CardHeader>
-            <CardContent className="flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between">
-              <div className="space-y-1">
-                <div className="text-sm font-medium">Sign out</div>
-                <div className="text-sm text-muted-foreground">Return to the login screen.</div>
-              </div>
-              <Button variant="outline" onClick={() => signOut({ callbackUrl: "/login" })}>
-                Log out
-              </Button>
-            </CardContent>
-          </Card>
-        </TabsContent>
-      </Tabs>
-    </div>
+  return (
+    <SettingsView
+      description="Manage admin preferences and system defaults."
+      backHref="/admin/dashboard"
+      user={user}
+      notificationPreferences={notificationPreferences}
+      generalExtra={generalExtra}
+    />
   )
 }

src/modules/settings/components/ai-provider-settings-card.tsx

@@ -43,7 +43,7 @@ const AiProviderFormSchema = z.object({
 type AiProviderFormValues = z.infer<typeof AiProviderFormSchema>
 
 const providerLabels: Record<z.infer<typeof ProviderSchema>, string> = {
-  zhipu: "智谱",
+  zhipu: "Zhipu",
   openai: "OpenAI",
   gemini: "Gemini",
   custom: "Custom",
@@ -110,7 +110,12 @@ export function AiProviderSettingsCard({
     loadedRef.current = true
     startTransition(async () => {
       try {
-        const rows = await getAiProviderSummaries()
+        const result = await getAiProviderSummaries()
+        if (!result.success || !result.data) {
+          toast.error(result.message ?? "Failed to load AI providers")
+          return
+        }
+        const rows = result.data
         setProviders(rows)
         onProvidersChanged?.(rows)
         if (initialMode === "new") {
@@ -215,7 +220,12 @@ export function AiProviderSettingsCard({
         toast.success(result.message ?? "Saved")
         setTestStatus("idle")
         setLastTestedSignature("")
-        const rows = await getAiProviderSummaries()
+        const summariesResult = await getAiProviderSummaries()
+        if (!summariesResult.success || !summariesResult.data) {
+          toast.error(summariesResult.message ?? "Failed to load AI providers")
+          return
+        }
+        const rows = summariesResult.data
         setProviders(rows)
         onProvidersChanged?.(rows)
         const nextId = result.data ?? payload.id ?? ""
@@ -295,7 +305,7 @@ export function AiProviderSettingsCard({
                 name="provider"
                 render={({ field }) => (
                   <FormItem>
-                    <FormLabel>品牌方</FormLabel>
+                    <FormLabel>Provider</FormLabel>
                     <Select value={field.value} onValueChange={field.onChange}>
                       <FormControl>
                         <SelectTrigger>
@@ -303,7 +313,7 @@ export function AiProviderSettingsCard({
                         </SelectTrigger>
                       </FormControl>
                       <SelectContent>
-                        <SelectItem value="zhipu">智谱</SelectItem>
+                        <SelectItem value="zhipu">Zhipu</SelectItem>
                         <SelectItem value="openai">OpenAI</SelectItem>
                         <SelectItem value="gemini">Gemini</SelectItem>
                         <SelectItem value="custom">Custom</SelectItem>
@@ -322,7 +332,7 @@ export function AiProviderSettingsCard({
                     <FormControl>
                       <Input {...field} placeholder="https://open.bigmodel.cn/api/paas/v4" />
                     </FormControl>
-                    <FormDescription>填写基础地址，不要包含 /chat/completions。</FormDescription>
+                    <FormDescription>Enter base URL without /chat/completions suffix.</FormDescription>
                     <FormMessage />
                   </FormItem>
                 )}
@@ -349,7 +359,7 @@ export function AiProviderSettingsCard({
                     <FormControl>
                       <Input type="password" {...field} placeholder="Paste new key to replace" />
                     </FormControl>
-                    <FormDescription>不会回显历史 Key，留空表示不更新。</FormDescription>
+                    <FormDescription>Existing key won&apos;t be displayed. Leave blank to keep current.</FormDescription>
                     <FormMessage />
                   </FormItem>
                 )}
@@ -364,7 +374,7 @@ export function AiProviderSettingsCard({
                   <FormControl>
                     <Checkbox checked={!!field.value} onCheckedChange={(value) => field.onChange(value === true)} />
                   </FormControl>
-                  <FormLabel>设为默认</FormLabel>
+                  <FormLabel>Set as default</FormLabel>
                 </FormItem>
               )}
             />

src/modules/settings/components/notification-preferences-form.tsx

@@ -12,7 +12,7 @@ import { Switch } from "@/shared/components/ui/switch"
 import { Label } from "@/shared/components/ui/label"
 import { Separator } from "@/shared/components/ui/separator"
 import { updateNotificationPreferencesAction } from "@/modules/messaging/actions"
-import type { NotificationPreferences } from "@/modules/messaging/types"
+import type { NotificationPreferences } from "@/modules/notifications/types"
 
 interface NotificationPreferencesFormProps {
   preferences: NotificationPreferences
@@ -118,7 +118,7 @@ function SubmitButton() {
 export function NotificationPreferencesForm({ preferences }: NotificationPreferencesFormProps) {
   const [state, formAction] = useActionState(updateNotificationPreferencesAction, null)
 
-  // 本地状态用于即时反馈 Switch 切换
+  // Local state for immediate Switch toggle feedback
   const [channels, setChannels] = React.useState({
     emailEnabled: preferences.emailEnabled,
     smsEnabled: preferences.smsEnabled,
@@ -158,7 +158,7 @@ export function NotificationPreferencesForm({ preferences }: NotificationPrefere
       </CardHeader>
       <form action={formAction}>
         <CardContent className="space-y-6">
-          {/* 通知渠道 */}
+          {/* Delivery channels */}
           <div className="space-y-4">
             <div>
               <h4 className="text-sm font-medium">Delivery Channels</h4>
@@ -183,7 +183,7 @@ export function NotificationPreferencesForm({ preferences }: NotificationPrefere
                     </div>
                   </div>
                   <div className="flex items-center gap-2">
-                    {/* 隐藏的 checkbox 用于表单提交 */}
+                    {/* Hidden checkbox for form submission */}
                     <input
                       type="checkbox"
                       name={item.key}
@@ -206,7 +206,7 @@ export function NotificationPreferencesForm({ preferences }: NotificationPrefere
 
           <Separator />
 
-          {/* 通知类别 */}
+          {/* Notification categories */}
           <div className="space-y-4">
             <div>
               <h4 className="text-sm font-medium">Notification Categories</h4>

src/modules/settings/components/password-change-form.tsx

@@ -1,6 +1,6 @@
 "use client"
 
-import { useActionState, useEffect, useMemo, useState } from "react"
+import { useActionState, useEffect, useMemo, useRef, useState } from "react"
 import { useFormStatus } from "react-dom"
 import { Eye, EyeOff, KeyRound, Loader2 } from "lucide-react"
 import { toast } from "sonner"
@@ -18,10 +18,10 @@ import {
 } from "@/shared/lib/password-policy"
 import type { ActionState } from "@/shared/types/action-state"
 
-const STRENGTH_META: Record<PasswordStrength, { value: number; label: string; color: string }> = {
-  weak: { value: 33, label: "Weak", color: "bg-red-500" },
-  medium: { value: 66, label: "Medium", color: "bg-yellow-500" },
-  strong: { value: 100, label: "Strong", color: "bg-green-500" },
+const STRENGTH_META: Record<PasswordStrength, { value: number; label: string; barClass: string }> = {
+  weak: { value: 33, label: "Weak", barClass: "h-2 [&>div]:bg-red-500" },
+  medium: { value: 66, label: "Medium", barClass: "h-2 [&>div]:bg-yellow-500" },
+  strong: { value: 100, label: "Strong", barClass: "h-2 [&>div]:bg-green-500" },
 }
 
 function SubmitButton() {
@@ -52,6 +52,7 @@ export function PasswordChangeForm() {
   const [showCurrent, setShowCurrent] = useState(false)
   const [showNew, setShowNew] = useState(false)
   const [showConfirm, setShowConfirm] = useState(false)
+  const formRef = useRef<HTMLFormElement>(null)
 
   const strength = useMemo(() => getPasswordStrength(newPassword), [newPassword])
   const meta = STRENGTH_META[strength]
@@ -59,8 +60,7 @@ export function PasswordChangeForm() {
   useEffect(() => {
     if (state?.success) {
       toast.success(state.message ?? "Password changed successfully")
-      const form = document.getElementById("password-change-form") as HTMLFormElement | null
-      form?.reset()
+      formRef.current?.reset()
     } else if (state?.message) {
       toast.error(state.message)
     }
@@ -74,7 +74,7 @@ export function PasswordChangeForm() {
           Choose a strong password to keep your account secure.
         </CardDescription>
       </CardHeader>
-      <form id="password-change-form" action={formAction} onReset={() => setNewPassword("")}>
+      <form ref={formRef} id="password-change-form" action={formAction} onReset={() => setNewPassword("")}>
         <CardContent className="space-y-4">
           <div className="space-y-2">
             <Label htmlFor="currentPassword">Current Password</Label>
@@ -130,7 +130,7 @@ export function PasswordChangeForm() {
                   <span className="text-muted-foreground">Password strength</span>
                   <span className="font-medium">{meta.label}</span>
                 </div>
-                <Progress value={meta.value} className={`h-2 [&>div]:${meta.color}`} />
+                <Progress value={meta.value} className={meta.barClass} />
               </div>
             )}
           </div>

src/modules/settings/components/profile-settings-form.tsx

@@ -2,7 +2,7 @@
 
 import { useTransition } from "react"
 import { zodResolver } from "@hookform/resolvers/zod"
-import { useForm } from "react-hook-form"
+import { useForm, type Resolver } from "react-hook-form"
 import { z } from "zod"
 import { Loader2, Save } from "lucide-react"
 import { toast } from "sonner"
@@ -22,7 +22,10 @@ const profileFormSchema = z.object({
   phone: z.string().optional(),
   address: z.string().optional(),
   gender: z.string().optional(),
-  age: z.coerce.number().min(0).optional(),
+  age: z.preprocess(
+    (v) => (v === "" || v === null || v === undefined ? undefined : Number(v)),
+    z.number().min(0).optional()
+  ),
 })
 
 type ProfileFormValues = z.infer<typeof profileFormSchema>
@@ -31,8 +34,7 @@ export function ProfileSettingsForm({ user }: { user: UserProfile }) {
   const [isPending, startTransition] = useTransition()
 
   const form = useForm<ProfileFormValues>({
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    resolver: zodResolver(profileFormSchema) as any,
+    resolver: zodResolver(profileFormSchema) as Resolver<ProfileFormValues>,
     defaultValues: {
       name: user.name ?? "",
       email: user.email ?? "",
@@ -59,9 +61,8 @@ export function ProfileSettingsForm({ user }: { user: UserProfile }) {
         } else {
           toast.error(result.message || "Failed to update profile")
         }
-      } catch (error) {
+      } catch {
         toast.error("Failed to update profile")
-        console.error(error)
       }
     })
   }

src/modules/settings/components/settings-view.tsx

@@ -0,0 +1,117 @@
+"use client"
+
+import Link from "next/link"
+import type { ReactNode } from "react"
+import { User, Palette, Lock, Bell } from "lucide-react"
+import { signOut } from "next-auth/react"
+
+import { ThemePreferencesCard } from "@/modules/settings/components/theme-preferences-card"
+import { ProfileSettingsForm } from "@/modules/settings/components/profile-settings-form"
+import { PasswordChangeForm } from "@/modules/settings/components/password-change-form"
+import { NotificationPreferencesForm } from "@/modules/settings/components/notification-preferences-form"
+import { Button } from "@/shared/components/ui/button"
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/shared/components/ui/card"
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/shared/components/ui/tabs"
+import { UserProfile } from "@/modules/users/data-access"
+import type { NotificationPreferences } from "@/modules/notifications/types"
+
+interface SettingsViewProps {
+  /** 页面副标题描述 */
+  description: string
+  /** 返回仪表盘的链接 */
+  backHref: string
+  /** 当前用户 */
+  user: UserProfile
+  /** 通知偏好 */
+  notificationPreferences: NotificationPreferences
+  /** General 标签页中 ProfileSettingsForm 下方的内容（角色专属快捷链接/组织信息等） */
+  generalExtra?: ReactNode
+}
+
+/**
+ * 统一设置页视图
+ *
+ * 消除 admin / teacher / student 三个设置视图的重复布局：
+ * - 相同的页面头部（标题 + 描述 + 返回按钮）
+ * - 相同的 4 个标签页（General / Notifications / Appearance / Security）
+ * - 相同的 Notifications / Appearance / Security 标签页内容
+ * - 相同的 Session 卡片（登出）
+ *
+ * 角色差异通过 `description`、`backHref` 和 `generalExtra` 三个 props 注入。
+ */
+export function SettingsView({
+  description,
+  backHref,
+  user,
+  notificationPreferences,
+  generalExtra,
+}: SettingsViewProps) {
+  return (
+    <div className="flex h-full flex-col gap-8 p-8">
+      <div className="flex flex-col justify-between gap-4 md:flex-row md:items-center">
+        <div className="space-y-1">
+          <h1 className="text-3xl font-bold tracking-tight">Settings</h1>
+          <div className="text-sm text-muted-foreground">{description}</div>
+        </div>
+        <div className="flex items-center gap-2">
+          <Button asChild variant="outline">
+            <Link href={backHref}>Back to dashboard</Link>
+          </Button>
+        </div>
+      </div>
+
+      <Tabs defaultValue="general" className="w-full">
+        <TabsList className="w-full justify-start">
+          <TabsTrigger value="general" className="gap-2">
+            <User className="h-4 w-4" />
+            General
+          </TabsTrigger>
+          <TabsTrigger value="notifications" className="gap-2">
+            <Bell className="h-4 w-4" />
+            Notifications
+          </TabsTrigger>
+          <TabsTrigger value="appearance" className="gap-2">
+            <Palette className="h-4 w-4" />
+            Appearance
+          </TabsTrigger>
+          <TabsTrigger value="security" className="gap-2">
+            <Lock className="h-4 w-4" />
+            Security
+          </TabsTrigger>
+        </TabsList>
+
+        <TabsContent value="general" className="mt-6 space-y-6">
+          <ProfileSettingsForm user={user} />
+          {generalExtra}
+        </TabsContent>
+
+        <TabsContent value="notifications" className="mt-6 space-y-6">
+          <NotificationPreferencesForm preferences={notificationPreferences} />
+        </TabsContent>
+
+        <TabsContent value="appearance" className="mt-6 space-y-6">
+          <ThemePreferencesCard />
+        </TabsContent>
+
+        <TabsContent value="security" className="mt-6 space-y-6">
+          <PasswordChangeForm />
+          <Card>
+            <CardHeader>
+              <CardTitle>Session</CardTitle>
+              <CardDescription>Account access and session controls.</CardDescription>
+            </CardHeader>
+            <CardContent className="flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between">
+              <div className="space-y-1">
+                <div className="text-sm font-medium">Sign out</div>
+                <div className="text-sm text-muted-foreground">Return to the login screen.</div>
+              </div>
+              <Button variant="outline" onClick={() => signOut({ callbackUrl: "/login" })}>
+                Log out
+              </Button>
+            </CardContent>
+          </Card>
+        </TabsContent>
+      </Tabs>
+    </div>
+  )
+}

src/modules/settings/components/student-settings-view.tsx

@@ -1,18 +1,13 @@
 "use client"
 
 import Link from "next/link"
-import { User, Palette, Lock, LayoutDashboard, PenTool, CalendarDays, Bell } from "lucide-react"
-import { signOut } from "next-auth/react"
+import { LayoutDashboard, PenTool, CalendarDays } from "lucide-react"
 
-import { ThemePreferencesCard } from "@/modules/settings/components/theme-preferences-card"
-import { ProfileSettingsForm } from "@/modules/settings/components/profile-settings-form"
-import { PasswordChangeForm } from "@/modules/settings/components/password-change-form"
-import { NotificationPreferencesForm } from "@/modules/settings/components/notification-preferences-form"
+import { SettingsView } from "@/modules/settings/components/settings-view"
 import { Button } from "@/shared/components/ui/button"
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/shared/components/ui/card"
-import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/shared/components/ui/tabs"
 import { UserProfile } from "@/modules/users/data-access"
-import type { NotificationPreferences } from "@/modules/messaging/types"
+import type { NotificationPreferences } from "@/modules/notifications/types"
 
 interface StudentSettingsViewProps {
   user: UserProfile
@@ -20,101 +15,45 @@ interface StudentSettingsViewProps {
 }
 
 export function StudentSettingsView({ user, notificationPreferences }: StudentSettingsViewProps) {
+  const generalExtra = (
+    <Card>
+      <CardHeader>
+        <CardTitle>Quick links</CardTitle>
+        <CardDescription>Common places you may want to visit.</CardDescription>
+      </CardHeader>
+      <CardContent className="flex flex-wrap gap-2">
+        <Button asChild variant="outline">
+          <Link href="/profile">Profile</Link>
+        </Button>
+        <Button asChild variant="outline" className="gap-2">
+          <Link href="/student/dashboard">
+            <LayoutDashboard className="h-4 w-4" />
+            Dashboard
+          </Link>
+        </Button>
+        <Button asChild variant="outline" className="gap-2">
+          <Link href="/student/learning/assignments">
+            <PenTool className="h-4 w-4" />
+            Assignments
+          </Link>
+        </Button>
+        <Button asChild variant="outline" className="gap-2">
+          <Link href="/student/schedule">
+            <CalendarDays className="h-4 w-4" />
+            Schedule
+          </Link>
+        </Button>
+      </CardContent>
+    </Card>
+  )
+
   return (
-    <div className="flex h-full flex-col gap-8 p-8">
-      <div className="flex flex-col justify-between gap-4 md:flex-row md:items-center">
-        <div className="space-y-1">
-          <h1 className="text-3xl font-bold tracking-tight">Settings</h1>
-          <div className="text-sm text-muted-foreground">Manage your preferences and account access.</div>
-        </div>
-        <div className="flex items-center gap-2">
-          <Button asChild variant="outline">
-            <Link href="/student/dashboard">Back to dashboard</Link>
-          </Button>
-        </div>
-      </div>
-
-      <Tabs defaultValue="general" className="w-full">
-        <TabsList className="w-full justify-start">
-          <TabsTrigger value="general" className="gap-2">
-            <User className="h-4 w-4" />
-            General
-          </TabsTrigger>
-          <TabsTrigger value="notifications" className="gap-2">
-            <Bell className="h-4 w-4" />
-            Notifications
-          </TabsTrigger>
-          <TabsTrigger value="appearance" className="gap-2">
-            <Palette className="h-4 w-4" />
-            Appearance
-          </TabsTrigger>
-          <TabsTrigger value="security" className="gap-2">
-            <Lock className="h-4 w-4" />
-            Security
-          </TabsTrigger>
-        </TabsList>
-
-        <TabsContent value="general" className="mt-6 space-y-6">
-          <ProfileSettingsForm user={user} />
-
-          <Card>
-            <CardHeader>
-              <CardTitle>Quick links</CardTitle>
-              <CardDescription>Common places you may want to visit.</CardDescription>
-            </CardHeader>
-            <CardContent className="flex flex-wrap gap-2">
-              <Button asChild variant="outline">
-                <Link href="/profile">Profile</Link>
-              </Button>
-              <Button asChild variant="outline" className="gap-2">
-                <Link href="/student/dashboard">
-                  <LayoutDashboard className="h-4 w-4" />
-                  Dashboard
-                </Link>
-              </Button>
-              <Button asChild variant="outline" className="gap-2">
-                <Link href="/student/learning/assignments">
-                  <PenTool className="h-4 w-4" />
-                  Assignments
-                </Link>
-              </Button>
-              <Button asChild variant="outline" className="gap-2">
-                <Link href="/student/schedule">
-                  <CalendarDays className="h-4 w-4" />
-                  Schedule
-                </Link>
-              </Button>
-            </CardContent>
-          </Card>
-        </TabsContent>
-
-        <TabsContent value="notifications" className="mt-6 space-y-6">
-          <NotificationPreferencesForm preferences={notificationPreferences} />
-        </TabsContent>
-
-        <TabsContent value="appearance" className="mt-6 space-y-6">
-          <ThemePreferencesCard />
-        </TabsContent>
-
-        <TabsContent value="security" className="mt-6 space-y-6">
-          <PasswordChangeForm />
-          <Card>
-            <CardHeader>
-              <CardTitle>Session</CardTitle>
-              <CardDescription>Account access and session controls.</CardDescription>
-            </CardHeader>
-            <CardContent className="flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between">
-              <div className="space-y-1">
-                <div className="text-sm font-medium">Sign out</div>
-                <div className="text-sm text-muted-foreground">Return to the login screen.</div>
-              </div>
-              <Button variant="outline" onClick={() => signOut({ callbackUrl: "/login" })}>
-                Log out
-              </Button>
-            </CardContent>
-          </Card>
-        </TabsContent>
-      </Tabs>
-    </div>
+    <SettingsView
+      description="Manage your preferences and account access."
+      backHref="/student/dashboard"
+      user={user}
+      notificationPreferences={notificationPreferences}
+      generalExtra={generalExtra}
+    />
   )
 }

src/modules/settings/components/teacher-settings-view.tsx

@@ -1,18 +1,13 @@
 "use client"
 
 import Link from "next/link"
-import { User, Palette, Lock, LayoutDashboard, PenTool, CalendarDays, Library, FileQuestion, Bell } from "lucide-react"
-import { signOut } from "next-auth/react"
+import { LayoutDashboard, PenTool, CalendarDays, Library, FileQuestion } from "lucide-react"
 
-import { ThemePreferencesCard } from "@/modules/settings/components/theme-preferences-card"
-import { ProfileSettingsForm } from "@/modules/settings/components/profile-settings-form"
-import { PasswordChangeForm } from "@/modules/settings/components/password-change-form"
-import { NotificationPreferencesForm } from "@/modules/settings/components/notification-preferences-form"
+import { SettingsView } from "@/modules/settings/components/settings-view"
 import { Button } from "@/shared/components/ui/button"
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/shared/components/ui/card"
-import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/shared/components/ui/tabs"
 import { UserProfile } from "@/modules/users/data-access"
-import type { NotificationPreferences } from "@/modules/messaging/types"
+import type { NotificationPreferences } from "@/modules/notifications/types"
 
 interface TeacherSettingsViewProps {
   user: UserProfile
@@ -20,113 +15,57 @@ interface TeacherSettingsViewProps {
 }
 
 export function TeacherSettingsView({ user, notificationPreferences }: TeacherSettingsViewProps) {
+  const generalExtra = (
+    <Card>
+      <CardHeader>
+        <CardTitle>Quick links</CardTitle>
+        <CardDescription>Jump to common teacher areas.</CardDescription>
+      </CardHeader>
+      <CardContent className="flex flex-wrap gap-2">
+        <Button asChild variant="outline">
+          <Link href="/profile">Profile</Link>
+        </Button>
+        <Button asChild variant="outline" className="gap-2">
+          <Link href="/teacher/dashboard">
+            <LayoutDashboard className="h-4 w-4" />
+            Dashboard
+          </Link>
+        </Button>
+        <Button asChild variant="outline" className="gap-2">
+          <Link href="/teacher/textbooks">
+            <Library className="h-4 w-4" />
+            Textbooks
+          </Link>
+        </Button>
+        <Button asChild variant="outline" className="gap-2">
+          <Link href="/teacher/exams/all">
+            <FileQuestion className="h-4 w-4" />
+            Exams
+          </Link>
+        </Button>
+        <Button asChild variant="outline" className="gap-2">
+          <Link href="/teacher/homework/assignments">
+            <PenTool className="h-4 w-4" />
+            Homework
+          </Link>
+        </Button>
+        <Button asChild variant="outline" className="gap-2">
+          <Link href="/teacher/classes/schedule">
+            <CalendarDays className="h-4 w-4" />
+            Schedule
+          </Link>
+        </Button>
+      </CardContent>
+    </Card>
+  )
+
   return (
-    <div className="flex h-full flex-col gap-8 p-8">
-      <div className="flex flex-col justify-between gap-4 md:flex-row md:items-center">
-        <div className="space-y-1">
-          <h1 className="text-3xl font-bold tracking-tight">Settings</h1>
-          <div className="text-sm text-muted-foreground">Manage your preferences and teaching workspace.</div>
-        </div>
-        <div className="flex items-center gap-2">
-          <Button asChild variant="outline">
-            <Link href="/teacher/dashboard">Back to dashboard</Link>
-          </Button>
-        </div>
-      </div>
-
-      <Tabs defaultValue="general" className="w-full">
-        <TabsList className="w-full justify-start">
-          <TabsTrigger value="general" className="gap-2">
-            <User className="h-4 w-4" />
-            General
-          </TabsTrigger>
-          <TabsTrigger value="notifications" className="gap-2">
-            <Bell className="h-4 w-4" />
-            Notifications
-          </TabsTrigger>
-          <TabsTrigger value="appearance" className="gap-2">
-            <Palette className="h-4 w-4" />
-            Appearance
-          </TabsTrigger>
-          <TabsTrigger value="security" className="gap-2">
-            <Lock className="h-4 w-4" />
-            Security
-          </TabsTrigger>
-        </TabsList>
-
-        <TabsContent value="general" className="mt-6 space-y-6">
-          <ProfileSettingsForm user={user} />
-
-          <Card>
-            <CardHeader>
-              <CardTitle>Quick links</CardTitle>
-              <CardDescription>Jump to common teacher areas.</CardDescription>
-            </CardHeader>
-            <CardContent className="flex flex-wrap gap-2">
-              <Button asChild variant="outline">
-                <Link href="/profile">Profile</Link>
-              </Button>
-              <Button asChild variant="outline" className="gap-2">
-                <Link href="/teacher/dashboard">
-                  <LayoutDashboard className="h-4 w-4" />
-                  Dashboard
-                </Link>
-              </Button>
-              <Button asChild variant="outline" className="gap-2">
-                <Link href="/teacher/textbooks">
-                  <Library className="h-4 w-4" />
-                  Textbooks
-                </Link>
-              </Button>
-              <Button asChild variant="outline" className="gap-2">
-                <Link href="/teacher/exams/all">
-                  <FileQuestion className="h-4 w-4" />
-                  Exams
-                </Link>
-              </Button>
-              <Button asChild variant="outline" className="gap-2">
-                <Link href="/teacher/homework/assignments">
-                  <PenTool className="h-4 w-4" />
-                  Homework
-                </Link>
-              </Button>
-              <Button asChild variant="outline" className="gap-2">
-                <Link href="/teacher/classes/schedule">
-                  <CalendarDays className="h-4 w-4" />
-                  Schedule
-                </Link>
-              </Button>
-            </CardContent>
-          </Card>
-        </TabsContent>
-
-        <TabsContent value="notifications" className="mt-6 space-y-6">
-          <NotificationPreferencesForm preferences={notificationPreferences} />
-        </TabsContent>
-
-        <TabsContent value="appearance" className="mt-6 space-y-6">
-          <ThemePreferencesCard />
-        </TabsContent>
-
-        <TabsContent value="security" className="mt-6 space-y-6">
-          <PasswordChangeForm />
-          <Card>
-            <CardHeader>
-              <CardTitle>Session</CardTitle>
-              <CardDescription>Account access and session controls.</CardDescription>
-            </CardHeader>
-            <CardContent className="flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between">
-              <div className="space-y-1">
-                <div className="text-sm font-medium">Sign out</div>
-                <div className="text-sm text-muted-foreground">Return to the login screen.</div>
-              </div>
-              <Button variant="outline" onClick={() => signOut({ callbackUrl: "/login" })}>
-                Log out
-              </Button>
-            </CardContent>
-          </Card>
-        </TabsContent>
-      </Tabs>
-    </div>
+    <SettingsView
+      description="Manage your preferences and teaching workspace."
+      backHref="/teacher/dashboard"
+      user={user}
+      notificationPreferences={notificationPreferences}
+      generalExtra={generalExtra}
+    />
   )
 }