feat(app): add lesson-plans, practice, and grade dashboard routes

- Add admin/lesson-plans, parent/lesson-plans, student/lesson-plans routes

- Add student/practice and teacher/practice routes for adaptive practice

- Add management/grade/dashboard and management/grade/practice routes

- Add teacher/lesson-plans error and loading boundaries

- Update existing admin, parent, student, teacher pages with new features

- Update globals.css and proxy middleware

src/app/(dashboard)/teacher/lesson-plans/[planId]/edit/error.tsx

@@ -0,0 +1,20 @@
+"use client"
+
+import { useTranslations } from "next-intl"
+import { BookOpen } from "lucide-react"
+import { EmptyState } from "@/shared/components/ui/empty-state"
+
+export default function EditLessonPlanError() {
+  const t = useTranslations("lessonPreparation")
+  return (
+    <div className="p-8">
+      <EmptyState
+        icon={BookOpen}
+        title={t("error.loadFailed")}
+        description={t("error.loadFailedDesc")}
+        action={{ label: t("error.retry"), onClick: () => window.location.reload() }}
+        className="border-none shadow-none"
+      />
+    </div>
+  )
+}

src/app/(dashboard)/teacher/lesson-plans/[planId]/edit/loading.tsx

@@ -0,0 +1,11 @@
+import { Skeleton } from "@/shared/components/ui/skeleton"
+
+export default function TeacherEditLessonPlanLoading() {
+  return (
+    <div className="h-[calc(100vh-4rem)]">
+      <div className="flex h-full items-center justify-center">
+        <Skeleton className="h-[80%] w-[80%]" />
+      </div>
+    </div>
+  )
+}

src/app/(dashboard)/teacher/lesson-plans/[planId]/edit/page.tsx

@@ -3,6 +3,7 @@ import { Suspense } from "react"
 import { notFound } from "next/navigation"
 import { getLessonPlanById } from "@/modules/lesson-preparation/data-access"
 import { LessonPlanEditor } from "@/modules/lesson-preparation/components/lesson-plan-editor"
+import { LessonPlanProviderSetup } from "@/modules/lesson-preparation/providers/lesson-plan-provider-setup"
 import { getTeacherClasses } from "@/modules/classes/data-access"
 import { getTextbookById, getChaptersByTextbookId } from "@/modules/textbooks/data-access"
 import { getAuthContext } from "@/shared/lib/auth-guard"
@@ -82,26 +83,29 @@ export default async function EditLessonPlanPage({
 
   return (
     <AiClientProvider service={aiClientService}>
-      <div className="h-[calc(100vh-4rem)]">
-        <Suspense
-          fallback={
-            <div className="flex h-full items-center justify-center">
-              <Skeleton className="h-[80%] w-[80%]" />
-            </div>
-          }
-        >
-          <LessonPlanEditor
-            planId={plan.id}
-            initialTitle={plan.title}
-            initialDoc={plan.content}
-            textbookId={plan.textbookId ?? undefined}
-            chapterId={plan.chapterId ?? undefined}
-            textbookTitle={textbookTitle}
-            chapterTitle={chapterTitle}
-            classes={classes}
-          />
-        </Suspense>
-      </div>
+      <LessonPlanProviderSetup>
+        <div className="h-[calc(100vh-4rem)]">
+          <Suspense
+            fallback={
+              <div className="flex h-full items-center justify-center">
+                <Skeleton className="h-[80%] w-[80%]" />
+              </div>
+            }
+          >
+            <LessonPlanEditor
+              planId={plan.id}
+              initialTitle={plan.title}
+              initialDoc={plan.content}
+              initialStatus={plan.status}
+              textbookId={plan.textbookId ?? undefined}
+              chapterId={plan.chapterId ?? undefined}
+              textbookTitle={textbookTitle}
+              chapterTitle={chapterTitle}
+              classes={classes}
+            />
+          </Suspense>
+        </div>
+      </LessonPlanProviderSetup>
     </AiClientProvider>
   )
 }

src/app/(dashboard)/teacher/lesson-plans/error.tsx

@@ -0,0 +1,20 @@
+"use client"
+
+import { useTranslations } from "next-intl"
+import { BookOpen } from "lucide-react"
+import { EmptyState } from "@/shared/components/ui/empty-state"
+
+export default function LessonPlansError() {
+  const t = useTranslations("lessonPreparation")
+  return (
+    <div className="p-8">
+      <EmptyState
+        icon={BookOpen}
+        title={t("error.loadFailed")}
+        description={t("error.loadFailedDesc")}
+        action={{ label: t("error.retry"), onClick: () => window.location.reload() }}
+        className="border-none shadow-none"
+      />
+    </div>
+  )
+}

src/app/(dashboard)/teacher/lesson-plans/loading.tsx

@@ -0,0 +1,25 @@
+import { Skeleton } from "@/shared/components/ui/skeleton"
+
+export default function TeacherLessonPlansLoading() {
+  return (
+    <div className="p-6 space-y-4">
+      <div className="flex justify-between items-center">
+        <div className="space-y-2">
+          <Skeleton className="h-8 w-[180px]" />
+          <Skeleton className="h-4 w-[300px]" />
+        </div>
+        <Skeleton className="h-9 w-[120px]" />
+      </div>
+      <div className="flex gap-2 flex-wrap items-center">
+        <Skeleton className="h-9 w-[240px]" />
+        <Skeleton className="h-9 w-[160px]" />
+        <Skeleton className="h-9 w-[160px]" />
+      </div>
+      <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
+        {Array.from({ length: 6 }).map((_, i) => (
+          <Skeleton key={i} className="h-[180px] w-full" />
+        ))}
+      </div>
+    </div>
+  )
+}

src/app/(dashboard)/teacher/lesson-plans/new/error.tsx

@@ -0,0 +1,20 @@
+"use client"
+
+import { useTranslations } from "next-intl"
+import { BookOpen } from "lucide-react"
+import { EmptyState } from "@/shared/components/ui/empty-state"
+
+export default function NewLessonPlanError() {
+  const t = useTranslations("lessonPreparation")
+  return (
+    <div className="p-8">
+      <EmptyState
+        icon={BookOpen}
+        title={t("error.loadFailed")}
+        description={t("error.loadFailedDesc")}
+        action={{ label: t("error.retry"), onClick: () => window.location.reload() }}
+        className="border-none shadow-none"
+      />
+    </div>
+  )
+}

src/app/(dashboard)/teacher/lesson-plans/new/loading.tsx

@@ -0,0 +1,20 @@
+import { Skeleton } from "@/shared/components/ui/skeleton"
+
+export default function TeacherNewLessonPlanLoading() {
+  return (
+    <div className="p-6">
+      <div className="mb-6 flex items-center gap-4">
+        <Skeleton className="h-9 w-[120px]" />
+        <Skeleton className="h-8 w-[180px]" />
+      </div>
+      <div className="max-w-3xl mx-auto p-6 space-y-6">
+        <Skeleton className="h-10 w-full" />
+        <div className="grid grid-cols-1 md:grid-cols-2 gap-3">
+          {Array.from({ length: 4 }).map((_, i) => (
+            <Skeleton key={i} className="h-[100px] w-full" />
+          ))}
+        </div>
+      </div>
+    </div>
+  )
+}

src/app/(dashboard)/teacher/lesson-plans/new/page.tsx

@@ -6,6 +6,7 @@ import { getTranslations } from "next-intl/server"
 import { Button } from "@/shared/components/ui/button"
 import { Skeleton } from "@/shared/components/ui/skeleton"
 import { TemplatePicker } from "@/modules/lesson-preparation/components/template-picker"
+import { LessonPlanProviderSetup } from "@/modules/lesson-preparation/providers/lesson-plan-provider-setup"
 
 export const dynamic = "force-dynamic"
 
@@ -22,20 +23,22 @@ export default async function NewLessonPlanPage(): Promise<JSX.Element> {
         </Button>
         <h1 className="text-2xl font-bold tracking-tight">{t("title.new")}</h1>
       </div>
-      <Suspense
-        fallback={
-          <div className="max-w-3xl mx-auto p-6 space-y-6">
-            <Skeleton className="h-10 w-full" />
-            <div className="grid grid-cols-1 md:grid-cols-2 gap-3">
-              {Array.from({ length: 4 }).map((_, i) => (
-                <Skeleton key={i} className="h-[100px] w-full" />
-              ))}
+      <LessonPlanProviderSetup>
+        <Suspense
+          fallback={
+            <div className="max-w-3xl mx-auto p-6 space-y-6">
+              <Skeleton className="h-10 w-full" />
+              <div className="grid grid-cols-1 md:grid-cols-2 gap-3">
+                {Array.from({ length: 4 }).map((_, i) => (
+                  <Skeleton key={i} className="h-[100px] w-full" />
+                ))}
+              </div>
             </div>
-          </div>
-        }
-      >
-        <TemplatePicker />
-      </Suspense>
+          }
+        >
+          <TemplatePicker />
+        </Suspense>
+      </LessonPlanProviderSetup>
     </div>
   )
 }

src/app/(dashboard)/teacher/lesson-plans/page.tsx

@@ -9,6 +9,7 @@ import { getAuthContext } from "@/shared/lib/auth-guard"
 import { getLessonPlans } from "@/modules/lesson-preparation/data-access"
 import { getSubjectOptions } from "@/modules/school/data-access"
 import { LessonPlanList } from "@/modules/lesson-preparation/components/lesson-plan-list"
+import { LessonPlanProviderSetup } from "@/modules/lesson-preparation/providers/lesson-plan-provider-setup"
 
 export const dynamic = "force-dynamic"
 
@@ -37,24 +38,26 @@ export default async function LessonPlansPage(): Promise<JSX.Element> {
           </Link>
         </Button>
       </div>
-      <Suspense
-        fallback={
-          <div className="space-y-4">
-            <div className="flex gap-2 flex-wrap items-center">
-              <Skeleton className="h-9 w-[240px]" />
-              <Skeleton className="h-9 w-[160px]" />
-              <Skeleton className="h-9 w-[160px]" />
+      <LessonPlanProviderSetup>
+        <Suspense
+          fallback={
+            <div className="space-y-4">
+              <div className="flex gap-2 flex-wrap items-center">
+                <Skeleton className="h-9 w-[240px]" />
+                <Skeleton className="h-9 w-[160px]" />
+                <Skeleton className="h-9 w-[160px]" />
+              </div>
+              <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
+                {Array.from({ length: 6 }).map((_, i) => (
+                  <Skeleton key={i} className="h-[180px] w-full" />
+                ))}
+              </div>
             </div>
-            <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
-              {Array.from({ length: 6 }).map((_, i) => (
-                <Skeleton key={i} className="h-[180px] w-full" />
-              ))}
-            </div>
-          </div>
-        }
-      >
-        <LessonPlanList initialItems={items} subjects={subjects} />
-      </Suspense>
+          }
+        >
+          <LessonPlanList initialItems={items} subjects={subjects} />
+        </Suspense>
+      </LessonPlanProviderSetup>
     </div>
   )
 }