Module Update

2025-12-30 14:42:30 +08:00
parent f1797265b2
commit e7c902e8e1
148 changed files with 19317 additions and 113 deletions
--- a/src/app/(auth)/error.tsx
+++ b/src/app/(auth)/error.tsx
@@ -0,0 +1,34 @@
+"use client"
+
+import { useEffect } from "react"
+import { Button } from "@/shared/components/ui/button"
+import { AlertCircle } from "lucide-react"
+
+export default function AuthError({
+  error,
+  reset,
+}: {
+  error: Error & { digest?: string }
+  reset: () => void
+}) {
+  useEffect(() => {
+    console.error(error)
+  }, [error])
+
+  return (
+    <div className="flex h-full w-full flex-col items-center justify-center gap-4 p-4 text-center">
+      <div className="flex h-16 w-16 items-center justify-center rounded-full bg-destructive/10">
+        <AlertCircle className="h-8 w-8 text-destructive" />
+      </div>
+      <div className="space-y-2">
+        <h2 className="text-xl font-bold tracking-tight">Authentication Error</h2>
+        <p className="text-sm text-muted-foreground">
+          There was a problem signing you in. Please try again.
+        </p>
+      </div>
+      <Button onClick={() => reset()} variant="default" size="sm">
+        Try again
+      </Button>
+    </div>
+  )
+}
--- a/src/app/(auth)/layout.tsx
+++ b/src/app/(auth)/layout.tsx
@@ -0,0 +1,5 @@
+import { AuthLayout } from "@/modules/auth/components/auth-layout"
+
+export default function Layout({ children }: { children: React.ReactNode }) {
+  return <AuthLayout>{children}</AuthLayout>
+}
--- a/src/app/(auth)/login/page.tsx
+++ b/src/app/(auth)/login/page.tsx
@@ -0,0 +1,11 @@
+import { Metadata } from "next"
+import { LoginForm } from "@/modules/auth/components/login-form"
+
+export const metadata: Metadata = {
+  title: "Login - Next_Edu",
+  description: "Login to your account",
+}
+
+export default function LoginPage() {
+  return <LoginForm />
+}
--- a/src/app/(auth)/not-found.tsx
+++ b/src/app/(auth)/not-found.tsx
@@ -0,0 +1,22 @@
+import Link from "next/link"
+import { Button } from "@/shared/components/ui/button"
+import { FileQuestion } from "lucide-react"
+
+export default function AuthNotFound() {
+  return (
+    <div className="flex h-full w-full flex-col items-center justify-center gap-4 p-4 text-center">
+      <div className="flex h-16 w-16 items-center justify-center rounded-full bg-muted">
+        <FileQuestion className="h-8 w-8 text-muted-foreground" />
+      </div>
+      <div className="space-y-2">
+        <h2 className="text-xl font-bold tracking-tight">Page Not Found</h2>
+        <p className="text-sm text-muted-foreground">
+          The authentication page you are looking for does not exist.
+        </p>
+      </div>
+      <Button asChild variant="outline" size="sm">
+        <Link href="/login">Return to Login</Link>
+      </Button>
+    </div>
+  )
+}
--- a/src/app/(auth)/register/page.tsx
+++ b/src/app/(auth)/register/page.tsx
@@ -0,0 +1,11 @@
+import { Metadata } from "next"
+import { RegisterForm } from "@/modules/auth/components/register-form"
+
+export const metadata: Metadata = {
+  title: "Register - Next_Edu",
+  description: "Create an account",
+}
+
+export default function RegisterPage() {
+  return <RegisterForm />
+}
--- a/src/app/(dashboard)/admin/dashboard/page.tsx
+++ b/src/app/(dashboard)/admin/dashboard/page.tsx
@@ -0,0 +1,5 @@
+import { AdminDashboard } from "@/modules/dashboard/components/admin-view"
+
+export default function AdminDashboardPage() {
+  return <AdminDashboard />
+}
--- a/src/app/(dashboard)/dashboard/page.tsx
+++ b/src/app/(dashboard)/dashboard/page.tsx
@@ -0,0 +1,72 @@
+"use client"
+
+import { useEffect } from "react";
+import { useRouter } from "next/navigation";
+import { Button } from "@/shared/components/ui/button"
+import Link from "next/link"
+import { Shield, GraduationCap, Users, User } from "lucide-react"
+
+// In a real app, this would be a server component that redirects based on session
+// But for this demo/dev environment, we keep the manual selection or add auto-redirect logic if we had auth state.
+
+export default function DashboardPage() {
+  // Mock Auth Logic (Optional: Uncomment to test auto-redirect)
+  /*
+  const router = useRouter();
+  useEffect(() => {
+    // const role = "teacher"; // Fetch from auth hook
+    // if (role) router.push(`/${role}/dashboard`);
+  }, []);
+  */
+
+  return (
+    <div className="flex flex-col items-center justify-center min-h-[50vh] space-y-8">
+      <div className="text-center space-y-2">
+        <h1 className="text-3xl font-bold">Welcome to Next_Edu</h1>
+        <p className="text-muted-foreground">Select your role to view the corresponding dashboard.</p>
+        <p className="text-xs text-muted-foreground bg-muted p-2 rounded inline-block">
+          [DEV MODE] In production, you would be redirected automatically based on your login session.
+        </p>
+      </div>
+
+      <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
+        <Link href="/admin/dashboard">
+          <Button variant="outline" className="h-40 w-40 flex flex-col gap-4 hover:border-primary hover:bg-primary/5 transition-all">
+            <Shield className="h-10 w-10 text-primary" />
+            <div className="space-y-1">
+                <span className="font-semibold text-lg block">Admin</span>
+                <span className="text-xs text-muted-foreground font-normal">System Management</span>
+            </div>
+          </Button>
+        </Link>
+        <Link href="/teacher/dashboard">
+          <Button variant="outline" className="h-40 w-40 flex flex-col gap-4 hover:border-indigo-500 hover:bg-indigo-50 transition-all">
+            <GraduationCap className="h-10 w-10 text-indigo-600" />
+             <div className="space-y-1">
+                <span className="font-semibold text-lg block">Teacher</span>
+                <span className="text-xs text-muted-foreground font-normal">Class & Exams</span>
+            </div>
+          </Button>
+        </Link>
+        <Link href="/student/dashboard">
+          <Button variant="outline" className="h-40 w-40 flex flex-col gap-4 hover:border-emerald-500 hover:bg-emerald-50 transition-all">
+            <Users className="h-10 w-10 text-emerald-600" />
+             <div className="space-y-1">
+                <span className="font-semibold text-lg block">Student</span>
+                <span className="text-xs text-muted-foreground font-normal">My Learning</span>
+            </div>
+          </Button>
+        </Link>
+        <Link href="/parent/dashboard">
+           <Button variant="outline" className="h-40 w-40 flex flex-col gap-4 hover:border-amber-500 hover:bg-amber-50 transition-all">
+            <User className="h-10 w-10 text-amber-600" />
+             <div className="space-y-1">
+                <span className="font-semibold text-lg block">Parent</span>
+                <span className="text-xs text-muted-foreground font-normal">Family Overview</span>
+            </div>
+          </Button>
+        </Link>
+      </div>
+    </div>
+  )
+}
--- a/src/app/(dashboard)/error.tsx
+++ b/src/app/(dashboard)/error.tsx
@@ -0,0 +1,35 @@
+"use client"
+
+import { useEffect } from "react"
+import { AlertCircle } from "lucide-react"
+
+import { Button } from "@/shared/components/ui/button"
+import { EmptyState } from "@/shared/components/ui/empty-state"
+
+export default function Error({
+  error,
+  reset,
+}: {
+  error: Error & { digest?: string }
+  reset: () => void
+}) {
+  useEffect(() => {
+    // Log the error to an error reporting service
+    console.error(error)
+  }, [error])
+
+  return (
+    <div className="flex h-full flex-col items-center justify-center space-y-4">
+      <EmptyState
+        icon={AlertCircle}
+        title="Something went wrong!"
+        description="We apologize for the inconvenience. An unexpected error occurred."
+        action={{
+          label: "Try Again",
+          onClick: () => reset()
+        }}
+        className="border-none shadow-none h-auto"
+      />
+    </div>
+  )
+}
--- a/src/app/(dashboard)/layout.tsx
+++ b/src/app/(dashboard)/layout.tsx
@@ -0,0 +1,18 @@
+import { AppSidebar } from "@/modules/layout/components/app-sidebar"
+import { SidebarProvider } from "@/modules/layout/components/sidebar-provider"
+import { SiteHeader } from "@/modules/layout/components/site-header"
+
+export default function DashboardLayout({
+  children,
+}: {
+  children: React.ReactNode
+}) {
+  return (
+    <SidebarProvider sidebar={<AppSidebar />}>
+      <SiteHeader />
+      <main className="flex-1 overflow-auto p-6">
+        {children}
+      </main>
+    </SidebarProvider>
+  )
+}
--- a/src/app/(dashboard)/not-found.tsx
+++ b/src/app/(dashboard)/not-found.tsx
@@ -0,0 +1,23 @@
+import Link from "next/link"
+import { FileQuestion } from "lucide-react"
+
+import { EmptyState } from "@/shared/components/ui/empty-state"
+
+export default function NotFound() {
+  return (
+    <div className="flex h-full flex-col items-center justify-center space-y-4">
+      <EmptyState
+        icon={FileQuestion}
+        title="Page Not Found"
+        description="The page you are looking for does not exist or has been moved."
+        className="border-none shadow-none h-auto"
+      />
+      <Link
+        href="/dashboard"
+        className="bg-primary text-primary-foreground hover:bg-primary/90 inline-flex h-9 items-center justify-center rounded-md px-4 text-sm font-medium transition-colors"
+      >
+        Return to Dashboard
+      </Link>
+    </div>
+  )
+}
--- a/src/app/(dashboard)/parent/dashboard/page.tsx
+++ b/src/app/(dashboard)/parent/dashboard/page.tsx
@@ -0,0 +1,8 @@
+export default function ParentDashboardPage() {
+  return (
+    <div className="p-6">
+      <h1 className="text-2xl font-bold">Parent Dashboard</h1>
+      <p className="text-muted-foreground">Welcome, Parent!</p>
+    </div>
+  )
+}
--- a/src/app/(dashboard)/student/dashboard/page.tsx
+++ b/src/app/(dashboard)/student/dashboard/page.tsx
@@ -0,0 +1,5 @@
+import { StudentDashboard } from "@/modules/dashboard/components/student-view"
+
+export default function StudentDashboardPage() {
+  return <StudentDashboard />
+}
--- a/src/app/(dashboard)/teacher/classes/my/page.tsx
+++ b/src/app/(dashboard)/teacher/classes/my/page.tsx
@@ -0,0 +1,22 @@
+import { EmptyState } from "@/shared/components/ui/empty-state"
+import { Users } from "lucide-react"
+
+export default function MyClassesPage() {
+  return (
+    <div className="h-full flex-1 flex-col space-y-8 p-8 md:flex">
+      <div className="flex items-center justify-between space-y-2">
+        <div>
+          <h2 className="text-2xl font-bold tracking-tight">My Classes</h2>
+          <p className="text-muted-foreground">
+            Overview of your classes.
+          </p>
+        </div>
+      </div>
+      <EmptyState
+        title="No classes found"
+        description="You are not assigned to any classes yet."
+        icon={Users}
+      />
+    </div>
+  )
+}
--- a/src/app/(dashboard)/teacher/classes/page.tsx
+++ b/src/app/(dashboard)/teacher/classes/page.tsx
@@ -0,0 +1,5 @@
+import { redirect } from "next/navigation"
+
+export default function ClassesPage() {
+  redirect("/teacher/classes/my")
+}
--- a/src/app/(dashboard)/teacher/classes/schedule/page.tsx
+++ b/src/app/(dashboard)/teacher/classes/schedule/page.tsx
@@ -0,0 +1,22 @@
+import { EmptyState } from "@/shared/components/ui/empty-state"
+import { Calendar } from "lucide-react"
+
+export default function SchedulePage() {
+  return (
+    <div className="h-full flex-1 flex-col space-y-8 p-8 md:flex">
+      <div className="flex items-center justify-between space-y-2">
+        <div>
+          <h2 className="text-2xl font-bold tracking-tight">Schedule</h2>
+          <p className="text-muted-foreground">
+            View class schedule.
+          </p>
+        </div>
+      </div>
+      <EmptyState
+        title="No schedule available"
+        description="Your class schedule has not been set up yet."
+        icon={Calendar}
+      />
+    </div>
+  )
+}
--- a/src/app/(dashboard)/teacher/classes/students/page.tsx
+++ b/src/app/(dashboard)/teacher/classes/students/page.tsx
@@ -0,0 +1,22 @@
+import { EmptyState } from "@/shared/components/ui/empty-state"
+import { User } from "lucide-react"
+
+export default function StudentsPage() {
+  return (
+    <div className="h-full flex-1 flex-col space-y-8 p-8 md:flex">
+      <div className="flex items-center justify-between space-y-2">
+        <div>
+          <h2 className="text-2xl font-bold tracking-tight">Students</h2>
+          <p className="text-muted-foreground">
+            Manage student list.
+          </p>
+        </div>
+      </div>
+      <EmptyState
+        title="No students found"
+        description="There are no students in your classes yet."
+        icon={User}
+      />
+    </div>
+  )
+}
--- a/src/app/(dashboard)/teacher/dashboard/page.tsx
+++ b/src/app/(dashboard)/teacher/dashboard/page.tsx
@@ -0,0 +1,28 @@
+import { TeacherStats } from "@/modules/dashboard/components/teacher-stats";
+import { TeacherSchedule } from "@/modules/dashboard/components/teacher-schedule";
+import { RecentSubmissions } from "@/modules/dashboard/components/recent-submissions";
+import { TeacherQuickActions } from "@/modules/dashboard/components/teacher-quick-actions";
+
+export default function TeacherDashboardPage() {
+  return (
+    <div className="flex-1 space-y-4">
+      <div className="flex items-center justify-between space-y-2">
+        <h2 className="text-3xl font-bold tracking-tight">Teacher Dashboard</h2>
+        <div className="flex items-center space-x-2">
+          <TeacherQuickActions />
+        </div>
+      </div>
+      
+      {/* Overview Stats */}
+      <TeacherStats />
+
+      <div className="grid gap-4 md:grid-cols-2 lg:grid-cols-7">
+        {/* Left Column: Schedule (3/7 width) */}
+        <TeacherSchedule />
+        
+        {/* Right Column: Recent Activity (4/7 width) */}
+        <RecentSubmissions />
+      </div>
+    </div>
+  );
+}
--- a/src/app/(dashboard)/teacher/exams/[id]/build/page.tsx
+++ b/src/app/(dashboard)/teacher/exams/[id]/build/page.tsx
@@ -0,0 +1,76 @@
+import { notFound } from "next/navigation"
+import { ExamAssembly } from "@/modules/exams/components/exam-assembly"
+import { getExamById } from "@/modules/exams/data-access"
+import { getQuestions } from "@/modules/questions/data-access"
+import type { Question } from "@/modules/questions/types"
+import type { ExamNode } from "@/modules/exams/components/assembly/selected-question-list"
+import { createId } from "@paralleldrive/cuid2"
+
+export default async function BuildExamPage({ params }: { params: Promise<{ id: string }> }) {
+  const { id } = await params
+  
+  const exam = await getExamById(id)
+  if (!exam) return notFound()
+
+  // Fetch all available questions (for selection pool)
+  // In a real app, this might be paginated or filtered by exam subject/grade
+  const { data: questionsData } = await getQuestions({ pageSize: 100 })
+  
+  const questionOptions: Question[] = questionsData.map((q) => ({
+    id: q.id,
+    content: q.content as any,
+    type: q.type as any,
+    difficulty: q.difficulty ?? 1,
+    createdAt: new Date(q.createdAt),
+    updatedAt: new Date(q.updatedAt),
+    author: q.author ? {
+      id: q.author.id,
+      name: q.author.name || "Unknown",
+      image: q.author.image || null
+    } : null,
+    knowledgePoints: (q.questionsToKnowledgePoints || []).map((kp) => ({
+      id: kp.knowledgePoint.id,
+      name: kp.knowledgePoint.name
+    }))
+  }))
+
+  const initialSelected = (exam.questions || []).map(q => ({
+    id: q.id,
+    score: q.score || 0
+  }))
+
+  // Prepare initialStructure on server side to avoid hydration mismatch with random IDs
+  let initialStructure: ExamNode[] = exam.structure as ExamNode[] || []
+  
+  if (initialStructure.length === 0 && initialSelected.length > 0) {
+    initialStructure = initialSelected.map(s => ({
+      id: createId(), // Generate stable ID on server
+      type: 'question',
+      questionId: s.id,
+      score: s.score
+    }))
+  }
+
+  return (
+    <div className="flex h-full flex-col space-y-8 p-8">
+      <div className="flex items-center justify-between">
+        <div>
+          <h2 className="text-2xl font-bold tracking-tight">Build Exam</h2>
+          <p className="text-muted-foreground">Add questions and adjust scores.</p>
+        </div>
+      </div>
+      <ExamAssembly
+        examId={exam.id}
+        title={exam.title}
+        subject={exam.subject}
+        grade={exam.grade}
+        difficulty={exam.difficulty}
+        totalScore={exam.totalScore}
+        durationMin={exam.durationMin}
+        initialSelected={initialSelected}
+        initialStructure={initialStructure}
+        questionOptions={questionOptions}
+      />
+    </div>
+  )
+}
--- a/src/app/(dashboard)/teacher/exams/all/loading.tsx
+++ b/src/app/(dashboard)/teacher/exams/all/loading.tsx
@@ -0,0 +1,25 @@
+import { Skeleton } from "@/shared/components/ui/skeleton"
+
+export default function Loading() {
+  return (
+    <div className="flex h-full flex-col space-y-8 p-8">
+      <div className="space-y-2">
+        <Skeleton className="h-7 w-40" />
+        <Skeleton className="h-4 w-72" />
+      </div>
+      <div className="space-y-3">
+        <Skeleton className="h-10 w-full" />
+        <div className="rounded-md border p-4">
+          <div className="space-y-2">
+            <Skeleton className="h-4 w-full" />
+            <Skeleton className="h-4 w-[95%]" />
+            <Skeleton className="h-4 w-[90%]" />
+            <Skeleton className="h-4 w-[85%]" />
+            <Skeleton className="h-4 w-[80%]" />
+          </div>
+        </div>
+      </div>
+    </div>
+  )
+}
+
--- a/src/app/(dashboard)/teacher/exams/all/page.tsx
+++ b/src/app/(dashboard)/teacher/exams/all/page.tsx
@@ -0,0 +1,47 @@
+import { Suspense } from "react"
+import Link from "next/link"
+import { Button } from "@/shared/components/ui/button"
+import { ExamDataTable } from "@/modules/exams/components/exam-data-table"
+import { examColumns } from "@/modules/exams/components/exam-columns"
+import { ExamFilters } from "@/modules/exams/components/exam-filters"
+import { getExams } from "@/modules/exams/data-access"
+
+export default async function AllExamsPage({
+  searchParams,
+}: {
+  searchParams: Promise<{ [key: string]: string | string[] | undefined }>
+}) {
+  const params = await searchParams
+  
+  const exams = await getExams({
+    q: params.q as string,
+    status: params.status as string,
+    difficulty: params.difficulty as string,
+  })
+
+  return (
+    <div className="flex h-full flex-col space-y-8 p-8">
+      <div className="flex flex-col justify-between space-y-4 md:flex-row md:items-center md:space-y-0">
+        <div>
+          <h2 className="text-2xl font-bold tracking-tight">All Exams</h2>
+          <p className="text-muted-foreground">View and manage all your exams.</p>
+        </div>
+        <div className="flex items-center space-x-2">
+          <Button asChild>
+            <Link href="/teacher/exams/create">Create Exam</Link>
+          </Button>
+        </div>
+      </div>
+
+      <div className="space-y-4">
+        <Suspense fallback={<div className="h-10 w-full animate-pulse rounded-md bg-muted" />}> 
+          <ExamFilters />
+        </Suspense>
+
+        <div className="rounded-md border bg-card">
+          <ExamDataTable columns={examColumns} data={exams} />
+        </div>
+      </div>
+    </div>
+  )
+}
--- a/src/app/(dashboard)/teacher/exams/create/loading.tsx
+++ b/src/app/(dashboard)/teacher/exams/create/loading.tsx
@@ -0,0 +1,17 @@
+import { Skeleton } from "@/shared/components/ui/skeleton"
+
+export default function Loading() {
+  return (
+    <div className="flex h-full flex-col space-y-8 p-8">
+      <div className="space-y-2">
+        <Skeleton className="h-7 w-40" />
+        <Skeleton className="h-4 w-72" />
+      </div>
+      <div className="space-y-4">
+        <Skeleton className="h-10 w-full" />
+        <Skeleton className="h-[240px] w-full" />
+      </div>
+    </div>
+  )
+}
+
--- a/src/app/(dashboard)/teacher/exams/create/page.tsx
+++ b/src/app/(dashboard)/teacher/exams/create/page.tsx
@@ -0,0 +1,15 @@
+import { ExamForm } from "@/modules/exams/components/exam-form"
+
+export default function CreateExamPage() {
+  return (
+    <div className="flex h-full flex-col space-y-8 p-8">
+      <div className="flex items-center justify-between">
+        <div>
+          <h2 className="text-2xl font-bold tracking-tight">Create Exam</h2>
+          <p className="text-muted-foreground">Design a new exam for your students.</p>
+        </div>
+      </div>
+      <ExamForm />
+    </div>
+  )
+}
--- a/src/app/(dashboard)/teacher/exams/grading/[submissionId]/page.tsx
+++ b/src/app/(dashboard)/teacher/exams/grading/[submissionId]/page.tsx
@@ -0,0 +1,40 @@
+import { notFound } from "next/navigation"
+import { GradingView } from "@/modules/exams/components/grading-view"
+import { getSubmissionDetails } from "@/modules/exams/data-access"
+import { formatDate } from "@/shared/lib/utils"
+
+export default async function SubmissionGradingPage({ params }: { params: Promise<{ submissionId: string }> }) {
+  const { submissionId } = await params
+  const submission = await getSubmissionDetails(submissionId)
+
+  if (!submission) {
+    return notFound()
+  }
+
+  return (
+    <div className="flex h-full flex-col space-y-4 p-6">
+      <div className="flex items-center justify-between">
+        <div>
+          <h2 className="text-2xl font-bold tracking-tight">{submission.examTitle}</h2>
+          <div className="flex items-center gap-4 text-sm text-muted-foreground mt-1">
+            <span>Student: <span className="font-medium text-foreground">{submission.studentName}</span></span>
+            <span>•</span>
+            <span>Submitted: {submission.submittedAt ? formatDate(submission.submittedAt) : "-"}</span>
+            <span>•</span>
+            <span className="capitalize">Status: {submission.status}</span>
+          </div>
+        </div>
+      </div>
+
+      <GradingView 
+        submissionId={submission.id}
+        studentName={submission.studentName}
+        examTitle={submission.examTitle}
+        submittedAt={submission.submittedAt}
+        status={submission.status || "started"}
+        totalScore={submission.totalScore}
+        answers={submission.answers}
+      />
+    </div>
+  )
+}
--- a/src/app/(dashboard)/teacher/exams/grading/loading.tsx
+++ b/src/app/(dashboard)/teacher/exams/grading/loading.tsx
@@ -0,0 +1,21 @@
+import { Skeleton } from "@/shared/components/ui/skeleton"
+
+export default function Loading() {
+  return (
+    <div className="flex h-full flex-col space-y-8 p-8">
+      <div className="space-y-2">
+        <Skeleton className="h-7 w-40" />
+        <Skeleton className="h-4 w-72" />
+      </div>
+      <div className="rounded-md border p-4">
+        <div className="space-y-2">
+          <Skeleton className="h-4 w-full" />
+          <Skeleton className="h-4 w-[95%]" />
+          <Skeleton className="h-4 w-[90%]" />
+          <Skeleton className="h-4 w-[85%]" />
+        </div>
+      </div>
+    </div>
+  )
+}
+
--- a/src/app/(dashboard)/teacher/exams/grading/page.tsx
+++ b/src/app/(dashboard)/teacher/exams/grading/page.tsx
@@ -0,0 +1,22 @@
+import { SubmissionDataTable } from "@/modules/exams/components/submission-data-table"
+import { submissionColumns } from "@/modules/exams/components/submission-columns"
+import { getExamSubmissions } from "@/modules/exams/data-access"
+
+export default async function ExamGradingPage() {
+  const submissions = await getExamSubmissions()
+
+  return (
+    <div className="flex h-full flex-col space-y-8 p-8">
+      <div className="flex items-center justify-between">
+        <div>
+          <h2 className="text-2xl font-bold tracking-tight">Grading</h2>
+          <p className="text-muted-foreground">Grade student exam submissions.</p>
+        </div>
+      </div>
+
+      <div className="rounded-md border bg-card">
+        <SubmissionDataTable columns={submissionColumns} data={submissions} />
+      </div>
+    </div>
+  )
+}
--- a/src/app/(dashboard)/teacher/exams/page.tsx
+++ b/src/app/(dashboard)/teacher/exams/page.tsx
@@ -0,0 +1,5 @@
+import { redirect } from "next/navigation"
+
+export default function ExamsPage() {
+  redirect("/teacher/exams/all")
+}
--- a/src/app/(dashboard)/teacher/homework/assignments/page.tsx
+++ b/src/app/(dashboard)/teacher/homework/assignments/page.tsx
@@ -0,0 +1,26 @@
+import { EmptyState } from "@/shared/components/ui/empty-state"
+import { PenTool } from "lucide-react"
+
+export default function AssignmentsPage() {
+  return (
+    <div className="h-full flex-1 flex-col space-y-8 p-8 md:flex">
+      <div className="flex items-center justify-between space-y-2">
+        <div>
+          <h2 className="text-2xl font-bold tracking-tight">Assignments</h2>
+          <p className="text-muted-foreground">
+            Manage homework assignments.
+          </p>
+        </div>
+      </div>
+      <EmptyState
+        title="No assignments"
+        description="You haven't created any assignments yet."
+        icon={PenTool}
+        action={{
+          label: "Create Assignment",
+          href: "#"
+        }}
+      />
+    </div>
+  )
+}
--- a/src/app/(dashboard)/teacher/homework/page.tsx
+++ b/src/app/(dashboard)/teacher/homework/page.tsx
@@ -0,0 +1,5 @@
+import { redirect } from "next/navigation"
+
+export default function HomeworkPage() {
+  redirect("/teacher/homework/assignments")
+}
--- a/src/app/(dashboard)/teacher/homework/submissions/page.tsx
+++ b/src/app/(dashboard)/teacher/homework/submissions/page.tsx
@@ -0,0 +1,22 @@
+import { EmptyState } from "@/shared/components/ui/empty-state"
+import { Inbox } from "lucide-react"
+
+export default function SubmissionsPage() {
+  return (
+    <div className="h-full flex-1 flex-col space-y-8 p-8 md:flex">
+      <div className="flex items-center justify-between space-y-2">
+        <div>
+          <h2 className="text-2xl font-bold tracking-tight">Submissions</h2>
+          <p className="text-muted-foreground">
+            Review student homework submissions.
+          </p>
+        </div>
+      </div>
+      <EmptyState
+        title="No submissions"
+        description="There are no homework submissions to review."
+        icon={Inbox}
+      />
+    </div>
+  )
+}
--- a/src/app/(dashboard)/teacher/questions/page.tsx
+++ b/src/app/(dashboard)/teacher/questions/page.tsx
@@ -0,0 +1,74 @@
+import { Suspense } from "react"
+import { Plus } from "lucide-react"
+
+import { Button } from "@/shared/components/ui/button"
+import { QuestionDataTable } from "@/modules/questions/components/question-data-table"
+import { columns } from "@/modules/questions/components/question-columns"
+import { QuestionFilters } from "@/modules/questions/components/question-filters"
+import { CreateQuestionButton } from "@/modules/questions/components/create-question-button"
+import { MOCK_QUESTIONS } from "@/modules/questions/mock-data"
+import { Question } from "@/modules/questions/types"
+
+// Simulate backend delay and filtering
+async function getQuestions(searchParams: { [key: string]: string | string[] | undefined }) {
+  // In a real app, you would call your DB or API here
+  // await new Promise((resolve) => setTimeout(resolve, 500)) // Simulate network latency
+
+  let filtered = [...MOCK_QUESTIONS]
+
+  const q = searchParams.q as string
+  const type = searchParams.type as string
+  const difficulty = searchParams.difficulty as string
+
+  if (q) {
+    filtered = filtered.filter((item) => 
+      (typeof item.content === 'string' && item.content.toLowerCase().includes(q.toLowerCase())) ||
+      (typeof item.content === 'object' && JSON.stringify(item.content).toLowerCase().includes(q.toLowerCase()))
+    )
+  }
+
+  if (type && type !== "all") {
+    filtered = filtered.filter((item) => item.type === type)
+  }
+
+  if (difficulty && difficulty !== "all") {
+    filtered = filtered.filter((item) => item.difficulty === parseInt(difficulty))
+  }
+
+  return filtered
+}
+
+export default async function QuestionBankPage({
+  searchParams,
+}: {
+  searchParams: Promise<{ [key: string]: string | string[] | undefined }>
+}) {
+  const params = await searchParams
+  const questions = await getQuestions(params)
+
+  return (
+    <div className="flex h-full flex-col space-y-8 p-8">
+      <div className="flex flex-col justify-between space-y-4 md:flex-row md:items-center md:space-y-0">
+        <div>
+          <h2 className="text-2xl font-bold tracking-tight">Question Bank</h2>
+          <p className="text-muted-foreground">
+            Manage your question repository for exams and assignments.
+          </p>
+        </div>
+        <div className="flex items-center space-x-2">
+          <CreateQuestionButton />
+        </div>
+      </div>
+
+      <div className="space-y-4">
+        <Suspense fallback={<div className="h-10 w-full animate-pulse rounded-md bg-muted" />}>
+           <QuestionFilters />
+        </Suspense>
+        
+        <div className="rounded-md border bg-card">
+          <QuestionDataTable columns={columns} data={questions} />
+        </div>
+      </div>
+    </div>
+  )
+}
--- a/src/app/(dashboard)/teacher/textbooks/[id]/loading.tsx
+++ b/src/app/(dashboard)/teacher/textbooks/[id]/loading.tsx
@@ -0,0 +1,66 @@
+import { Skeleton } from "@/shared/components/ui/skeleton";
+import { Separator } from "@/shared/components/ui/separator";
+
+export default function Loading() {
+  return (
+    <div className="space-y-6 max-w-5xl mx-auto">
+      {/* Header Skeleton */}
+      <div className="flex items-center gap-4">
+        <Skeleton className="h-10 w-10 rounded-md" /> {/* Back Button */}
+        <div className="flex-1 space-y-2">
+          <div className="flex items-center gap-2">
+            <Skeleton className="h-5 w-16" />
+            <Skeleton className="h-4 w-24" />
+          </div>
+          <Skeleton className="h-8 w-64" />
+        </div>
+        <Skeleton className="h-10 w-32" /> {/* Edit Button */}
+      </div>
+
+      <div className="grid grid-cols-1 md:grid-cols-3 gap-8">
+        {/* Main Content Skeleton */}
+        <div className="md:col-span-2 space-y-6">
+          <div className="flex items-center justify-between">
+            <Skeleton className="h-6 w-40" />
+            <Skeleton className="h-8 w-24" />
+          </div>
+          
+          <div className="rounded-lg border bg-card p-6 space-y-4">
+             {Array.from({ length: 5 }).map((_, i) => (
+                <div key={i} className="flex items-center gap-4">
+                    <Skeleton className="h-6 w-6 rounded-md" />
+                    <Skeleton className="h-6 w-full rounded-md" />
+                </div>
+             ))}
+          </div>
+        </div>
+
+        {/* Sidebar Skeleton */}
+        <div className="space-y-6">
+          <div className="rounded-lg border bg-card p-6 space-y-4">
+             <Skeleton className="h-6 w-32 mb-4" />
+             <div className="space-y-2">
+                <Skeleton className="h-4 w-16" />
+                <Skeleton className="h-5 w-32" />
+             </div>
+             <div className="space-y-2">
+                <Skeleton className="h-4 w-20" />
+                <Skeleton className="h-20 w-full" />
+             </div>
+             <Separator />
+             <div className="grid grid-cols-2 gap-4">
+                <div className="space-y-2">
+                    <Skeleton className="h-3 w-12" />
+                    <Skeleton className="h-4 w-24" />
+                </div>
+                <div className="space-y-2">
+                    <Skeleton className="h-3 w-12" />
+                    <Skeleton className="h-4 w-24" />
+                </div>
+             </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
--- a/src/app/(dashboard)/teacher/textbooks/[id]/page.tsx
+++ b/src/app/(dashboard)/teacher/textbooks/[id]/page.tsx
@@ -0,0 +1,80 @@
+import { notFound } from "next/navigation";
+import { ArrowLeft, Edit } from "lucide-react";
+import Link from "next/link";
+import { Button } from "@/shared/components/ui/button";
+import { Badge } from "@/shared/components/ui/badge";
+import { getTextbookById, getChaptersByTextbookId, getKnowledgePointsByChapterId } from "@/modules/textbooks/data-access";
+import { TextbookContentLayout } from "@/modules/textbooks/components/textbook-content-layout";
+import { TextbookSettingsDialog } from "@/modules/textbooks/components/textbook-settings-dialog";
+
+export default async function TextbookDetailPage({
+  params,
+}: {
+  params: Promise<{ id: string }>;
+}) {
+  const { id } = await params;
+  
+  const [textbook, chapters] = await Promise.all([
+    getTextbookById(id),
+    getChaptersByTextbookId(id),
+  ]);
+
+  if (!textbook) {
+    notFound();
+  }
+
+  // Fetch all KPs for these chapters. In a real app, this might be optimized to fetch only needed or use a different query strategy.
+  // For now, we simulate fetching KPs for all chapters to pass down, or we could fetch on demand.
+  // Given the layout loads everything client-side for interactivity, let's fetch all KPs associated with any chapter in this textbook.
+  // We'll need to extend the data access for this specific query pattern or loop.
+  // For simplicity in this mock, let's assume getKnowledgePointsByChapterId can handle fetching all KPs for a textbook if we had such a function,
+  // or we iterate. Let's create a helper to get all KPs for the textbook's chapters.
+  
+  // Actually, let's update data-access to support getting KPs by Textbook ID directly or just fetch all for mock.
+  // Since we don't have getKnowledgePointsByTextbookId, we will map over chapters.
+  
+  const allKnowledgePoints = (await Promise.all(
+    chapters.map(c => getKnowledgePointsByChapterId(c.id))
+  )).flat();
+
+  // Also need to get KPs for children chapters if any
+  const childrenKPs = (await Promise.all(
+    chapters.flatMap(c => c.children || []).map(child => getKnowledgePointsByChapterId(child.id))
+  )).flat();
+
+  const knowledgePoints = [...allKnowledgePoints, ...childrenKPs];
+
+  return (
+    <div className="flex flex-col h-[calc(100vh-4rem)] overflow-hidden">
+      {/* Header / Nav (Fixed height) */}
+      <div className="flex items-center gap-4 py-4 border-b shrink-0 bg-background z-10">
+        <Button variant="ghost" size="icon" asChild>
+          <Link href="/teacher/textbooks">
+            <ArrowLeft className="h-4 w-4" />
+          </Link>
+        </Button>
+        <div className="flex-1">
+          <div className="flex items-center gap-2 mb-1">
+             <Badge variant="outline">{textbook.subject}</Badge>
+             <span className="text-xs text-muted-foreground uppercase tracking-wider font-medium">
+                {textbook.grade}
+             </span>
+          </div>
+          <h1 className="text-xl font-bold tracking-tight line-clamp-1">{textbook.title}</h1>
+        </div>
+        <div className="flex gap-2">
+            <TextbookSettingsDialog textbook={textbook} />
+        </div>
+      </div>
+
+      {/* Main Content Layout (Flex grow) */}
+      <div className="flex-1 overflow-hidden pt-6">
+        <TextbookContentLayout 
+            chapters={chapters} 
+            knowledgePoints={knowledgePoints}
+            textbookId={id} 
+        />
+      </div>
+    </div>
+  );
+}
--- a/src/app/(dashboard)/teacher/textbooks/loading.tsx
+++ b/src/app/(dashboard)/teacher/textbooks/loading.tsx
@@ -0,0 +1,48 @@
+import { Skeleton } from "@/shared/components/ui/skeleton";
+import { Card, CardContent, CardFooter, CardHeader } from "@/shared/components/ui/card";
+
+export default function Loading() {
+  return (
+    <div className="space-y-6">
+      {/* Header Skeleton */}
+      <div className="flex flex-col gap-4 md:flex-row md:items-center md:justify-between">
+        <div className="space-y-2">
+          <Skeleton className="h-8 w-48" />
+          <Skeleton className="h-4 w-96" />
+        </div>
+        <Skeleton className="h-10 w-32" />
+      </div>
+
+      {/* Toolbar Skeleton */}
+      <div className="flex flex-col gap-4 md:flex-row md:items-center justify-between bg-card p-4 rounded-lg border shadow-sm">
+        <Skeleton className="h-10 w-full md:w-96" />
+        <div className="flex gap-2 w-full md:w-auto">
+          <Skeleton className="h-10 w-[140px]" />
+          <Skeleton className="h-10 w-[140px]" />
+        </div>
+      </div>
+
+      {/* Grid Content Skeleton */}
+      <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-6">
+        {Array.from({ length: 8 }).map((_, i) => (
+          <Card key={i} className="h-full overflow-hidden">
+            <div className="aspect-[4/3] w-full bg-muted/30 p-6 flex items-center justify-center">
+              <Skeleton className="h-24 w-20 rounded-sm" />
+            </div>
+            <CardHeader className="p-4 pb-2 space-y-2">
+              <Skeleton className="h-5 w-16" />
+              <Skeleton className="h-6 w-full" />
+            </CardHeader>
+            <CardContent className="p-4 pt-0 space-y-2">
+               <Skeleton className="h-4 w-24" />
+               <Skeleton className="h-4 w-32" />
+            </CardContent>
+            <CardFooter className="p-4 pt-0 mt-auto">
+               <Skeleton className="h-6 w-full rounded-md" />
+            </CardFooter>
+          </Card>
+        ))}
+      </div>
+    </div>
+  );
+}
--- a/src/app/(dashboard)/teacher/textbooks/page.tsx
+++ b/src/app/(dashboard)/teacher/textbooks/page.tsx
@@ -0,0 +1,78 @@
+import { Search, Filter } from "lucide-react";
+import { Button } from "@/shared/components/ui/button";
+import { Input } from "@/shared/components/ui/input";
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from "@/shared/components/ui/select";
+import { TextbookCard } from "@/modules/textbooks/components/textbook-card";
+import { TextbookFormDialog } from "@/modules/textbooks/components/textbook-form-dialog";
+import { getTextbooks } from "@/modules/textbooks/data-access";
+
+export default async function TextbooksPage() {
+  // In a real app, we would parse searchParams here
+  const textbooks = await getTextbooks();
+
+  return (
+    <div className="space-y-6">
+      {/* Page Header */}
+      <div className="flex flex-col gap-4 md:flex-row md:items-center md:justify-between">
+        <div>
+          <h1 className="text-2xl font-bold tracking-tight">Textbooks</h1>
+          <p className="text-muted-foreground">
+            Manage your digital curriculum resources and chapters.
+          </p>
+        </div>
+        <TextbookFormDialog />
+      </div>
+
+      {/* Toolbar */}
+      <div className="flex flex-col gap-4 md:flex-row md:items-center justify-between bg-card p-4 rounded-lg border shadow-sm">
+        <div className="relative w-full md:w-96">
+          <Search className="absolute left-2.5 top-2.5 h-4 w-4 text-muted-foreground" />
+          <Input
+            placeholder="Search textbooks..."
+            className="pl-9 bg-background"
+          />
+        </div>
+        <div className="flex gap-2 w-full md:w-auto">
+          <Select>
+            <SelectTrigger className="w-[140px] bg-background">
+              <Filter className="mr-2 h-4 w-4 text-muted-foreground" />
+              <SelectValue placeholder="Subject" />
+            </SelectTrigger>
+            <SelectContent>
+              <SelectItem value="all">All Subjects</SelectItem>
+              <SelectItem value="math">Mathematics</SelectItem>
+              <SelectItem value="physics">Physics</SelectItem>
+              <SelectItem value="history">History</SelectItem>
+              <SelectItem value="english">English</SelectItem>
+            </SelectContent>
+          </Select>
+          
+          <Select>
+            <SelectTrigger className="w-[140px] bg-background">
+              <SelectValue placeholder="Grade" />
+            </SelectTrigger>
+            <SelectContent>
+              <SelectItem value="all">All Grades</SelectItem>
+              <SelectItem value="10">Grade 10</SelectItem>
+              <SelectItem value="11">Grade 11</SelectItem>
+              <SelectItem value="12">Grade 12</SelectItem>
+            </SelectContent>
+          </Select>
+        </div>
+      </div>
+
+      {/* Grid Content */}
+      <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-6">
+        {textbooks.map((textbook) => (
+          <TextbookCard key={textbook.id} textbook={textbook} />
+        ))}
+      </div>
+    </div>
+  );
+}
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -1,26 +1,177 @@
@import "tailwindcss";

+@plugin "tailwindcss-animate";
+
+@custom-variant dark (&:where(.dark, .dark *));
+
 :root {
-  --background: #ffffff;
-  --foreground: #171717;
+  /* Neutral: Zinc - Clean, Professional, International Style */
+  --background: 0 0% 100%;
+  --foreground: 240 10% 3.9%;
+  
+  --card: 0 0% 100%;
+  --card-foreground: 240 10% 3.9%;
+  
+  --popover: 0 0% 100%;
+  --popover-foreground: 240 10% 3.9%;
+  
+  /* Brand: Deep Indigo */
+  --primary: 240 5.9% 10%;
+  --primary-foreground: 0 0% 98%;
+  
+  --secondary: 240 4.8% 95.9%;
+  --secondary-foreground: 240 5.9% 10%;
+  
+  --muted: 240 4.8% 95.9%;
+  --muted-foreground: 240 3.8% 46.1%;
+  
+  --accent: 240 4.8% 95.9%;
+  --accent-foreground: 240 5.9% 10%;
+  
+  /* Destructive: Subtle Red */
+  --destructive: 0 84.2% 60.2%;
+  --destructive-foreground: 0 0% 98%;
+
+  /* Borders & UI */
+  --border: 240 5.9% 90%;
+  --input: 240 5.9% 90%;
+  --ring: 240 5.9% 10%;
+  
+  --radius: 0.5rem;
+
+  /* Chart / Data Visualization Colors */
+  --chart-1: 12 76% 61%;
+  --chart-2: 173 58% 39%;
+  --chart-3: 197 37% 24%;
+  --chart-4: 43 74% 66%;
+  --chart-5: 27 87% 67%;
+  
+  /* Sidebar Specific */
+  --sidebar-background: 0 0% 98%;
+  --sidebar-foreground: 240 5.3% 26.1%;
+  --sidebar-primary: 240 5.9% 10%;
+  --sidebar-primary-foreground: 0 0% 98%;
+  --sidebar-accent: 240 4.8% 95.9%;
+  --sidebar-accent-foreground: 240 5.9% 10%;
+  --sidebar-border: 220 13% 91%;
+  --sidebar-ring: 217.2 91.2% 59.8%;
+}
+
+.dark {
+  /* Dark Mode: Deep Zinc Base */
+  --background: 240 10% 3.9%;
+  --foreground: 0 0% 98%;
+  
+  --card: 240 10% 3.9%;
+  --card-foreground: 0 0% 98%;
+  
+  --popover: 240 10% 3.9%;
+  --popover-foreground: 0 0% 98%;
+  
+  /* Brand Dark: Adjusted for contrast */
+  --primary: 0 0% 98%;
+  --primary-foreground: 240 5.9% 10%;
+  
+  --secondary: 240 3.7% 15.9%;
+  --secondary-foreground: 0 0% 98%;
+  
+  --muted: 240 3.7% 15.9%;
+  --muted-foreground: 240 5% 64.9%;
+  
+  --accent: 240 3.7% 15.9%;
+  --accent-foreground: 0 0% 98%;
+  
+  --destructive: 0 62.8% 30.6%;
+  --destructive-foreground: 0 0% 98%;
+  
+  --border: 240 3.7% 15.9%;
+  --input: 240 3.7% 15.9%;
+  --ring: 240 4.9% 83.9%;
+  
+  --chart-1: 220 70% 50%;
+  --chart-2: 160 60% 45%;
+  --chart-3: 30 80% 55%;
+  --chart-4: 280 65% 60%;
+  --chart-5: 340 75% 55%;
+
+  --sidebar-background: 240 5.9% 10%;
+  --sidebar-foreground: 240 4.8% 95.9%;
+  --sidebar-primary: 224.3 76.3% 48%;
+  --sidebar-primary-foreground: 0 0% 100%;
+  --sidebar-accent: 240 3.7% 15.9%;
+  --sidebar-accent-foreground: 240 4.8% 95.9%;
+  --sidebar-border: 240 3.7% 15.9%;
+  --sidebar-ring: 217.2 91.2% 59.8%;
 }

@theme inline {
-  --color-background: var(--background);
-  --color-foreground: var(--foreground);
-  --font-sans: var(--font-geist-sans);
-  --font-mono: var(--font-geist-mono);
-}
+  --color-background: hsl(var(--background));
+  --color-foreground: hsl(var(--foreground));
+  
+  --color-card: hsl(var(--card));
+  --color-card-foreground: hsl(var(--card-foreground));
+  
+  --color-popover: hsl(var(--popover));
+  --color-popover-foreground: hsl(var(--popover-foreground));
+  
+  --color-primary: hsl(var(--primary));
+  --color-primary-foreground: hsl(var(--primary-foreground));
+  
+  --color-secondary: hsl(var(--secondary));
+  --color-secondary-foreground: hsl(var(--secondary-foreground));
+  
+  --color-muted: hsl(var(--muted));
+  --color-muted-foreground: hsl(var(--muted-foreground));
+  
+  --color-accent: hsl(var(--accent));
+  --color-accent-foreground: hsl(var(--accent-foreground));
+  
+  --color-destructive: hsl(var(--destructive));
+  --color-destructive-foreground: hsl(var(--destructive-foreground));
+  
+  --color-border: hsl(var(--border));
+  --color-input: hsl(var(--input));
+  --color-ring: hsl(var(--ring));
+  
+  --color-chart-1: hsl(var(--chart-1));
+  --color-chart-2: hsl(var(--chart-2));
+  --color-chart-3: hsl(var(--chart-3));
+  --color-chart-4: hsl(var(--chart-4));
+  --color-chart-5: hsl(var(--chart-5));
+  
+  --color-sidebar: hsl(var(--sidebar-background));
+  --color-sidebar-foreground: hsl(var(--sidebar-foreground));
+  --color-sidebar-primary: hsl(var(--sidebar-primary));
+  --color-sidebar-primary-foreground: hsl(var(--sidebar-primary-foreground));
+  --color-sidebar-accent: hsl(var(--sidebar-accent));
+  --color-sidebar-accent-foreground: hsl(var(--sidebar-accent-foreground));
+  --color-sidebar-border: hsl(var(--sidebar-border));
+  --color-sidebar-ring: hsl(var(--sidebar-ring));

-@media (prefers-color-scheme: dark) {
-  :root {
-    --background: #0a0a0a;
-    --foreground: #ededed;
+  --radius-lg: var(--radius);
+  --radius-md: calc(var(--radius) - 2px);
+  --radius-sm: calc(var(--radius) - 4px);
+  
+  --animate-accordion-down: accordion-down 0.2s ease-out;
+  --animate-accordion-up: accordion-up 0.2s ease-out;
+  
+  @keyframes accordion-down {
+    from { height: 0; }
+    to { height: var(--radix-accordion-content-height); }
+  }
+  @keyframes accordion-up {
+    from { height: var(--radix-accordion-content-height); }
+    to { height: 0; }
  }
 }

-body {
-  background: var(--background);
-  color: var(--foreground);
-  font-family: Arial, Helvetica, sans-serif;
+/* Base Styles */
+@layer base {
+  * {
+    @apply border-border;
+  }
+  body {
+    @apply bg-background text-foreground;
+    font-feature-settings: "rlig" 1, "calt" 1;
+  }
 }
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -1,20 +1,12 @@
 import type { Metadata } from "next";
-import { Geist, Geist_Mono } from "next/font/google";
+import { ThemeProvider } from "@/shared/components/theme-provider";
+import { Toaster } from "@/shared/components/ui/sonner";
+import { NuqsAdapter } from 'nuqs/adapters/next/app'
 import "./globals.css";

-const geistSans = Geist({
-  variable: "--font-geist-sans",
-  subsets: ["latin"],
-});
-
-const geistMono = Geist_Mono({
-  variable: "--font-geist-mono",
-  subsets: ["latin"],
-});
-
 export const metadata: Metadata = {
-  title: "Create Next App",
-  description: "Generated by create next app",
+  title: "Next_Edu - K12 智慧教务系统",
+  description: "Enterprise Grade K12 Education Management System",
 };

 export default function RootLayout({
@@ -23,11 +15,21 @@ export default function RootLayout({
  children: React.ReactNode;
 }>) {
  return (
-    <html lang="en">
+    <html lang="en" suppressHydrationWarning>
      <body
-        className={`${geistSans.variable} ${geistMono.variable} antialiased`}
+        className={`antialiased`}
      >
-        {children}
+        <ThemeProvider
+            attribute="class"
+            defaultTheme="system"
+            enableSystem
+            disableTransitionOnChange
+          >
+          <NuqsAdapter>
+            {children}
+          </NuqsAdapter>
+          <Toaster />
+        </ThemeProvider>
      </body>
    </html>
  );
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -1,66 +1,5 @@
-import Image from "next/image";
+import { redirect } from "next/navigation";

 export default function Home() {
-  return (
-    <div className="flex min-h-screen items-center justify-center bg-zinc-50 font-sans dark:bg-black">
-      <main className="flex min-h-screen w-full max-w-3xl flex-col items-center justify-between py-32 px-16 bg-white dark:bg-black sm:items-start">
-        <Image
-          className="dark:invert"
-          src="/next.svg"
-          alt="Next.js logo"
-          width={100}
-          height={20}
-          priority
-        />
-        <div className="flex flex-col items-center gap-6 text-center sm:items-start sm:text-left">
-          <h1 className="max-w-xs text-3xl font-semibold leading-10 tracking-tight text-black dark:text-zinc-50">
-            To get started, edit the page.tsx file.
-            This is Update.
-          </h1>
-          <p className="max-w-md text-lg leading-8 text-zinc-600 dark:text-zinc-400">
-            Looking for a starting point or more instructions? Head over to{" "}
-            <a
-              href="https://vercel.com/templates?framework=next.js&utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
-              className="font-medium text-zinc-950 dark:text-zinc-50"
-            >
-              Templates
-            </a>{" "}
-            or the{" "}
-            <a
-              href="https://nextjs.org/learn?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
-              className="font-medium text-zinc-950 dark:text-zinc-50"
-            >
-              Learning
-            </a>{" "}
-            center.
-          </p>
-        </div>
-        <div className="flex flex-col gap-4 text-base font-medium sm:flex-row">
-          <a
-            className="flex h-12 w-full items-center justify-center gap-2 rounded-full bg-foreground px-5 text-background transition-colors hover:bg-[#383838] dark:hover:bg-[#ccc] md:w-[158px]"
-            href="https://vercel.com/new?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
-            target="_blank"
-            rel="noopener noreferrer"
-          >
-            <Image
-              className="dark:invert"
-              src="/vercel.svg"
-              alt="Vercel logomark"
-              width={16}
-              height={16}
-            />
-            Deploy Now
-          </a>
-          <a
-            className="flex h-12 w-full items-center justify-center rounded-full border border-solid border-black/[.08] px-5 transition-colors hover:border-transparent hover:bg-black/[.04] dark:border-white/[.145] dark:hover:bg-[#1a1a1a] md:w-[158px]"
-            href="https://nextjs.org/docs?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
-            target="_blank"
-            rel="noopener noreferrer"
-          >
-            Documentation
-          </a>
-        </div>
-      </main>
-    </div>
-  );
+  redirect("/dashboard");
 }