feat(app): add error/loading boundaries and update dashboard routes

- Add error.tsx and loading.tsx boundaries for admin, parent, student, teacher routes

- Add dashboard-error-fallback and dashboard-loading-skeleton components

- Add student/learning page, parent/leave routes, teacher textbook components

- Update existing app routes across auth, dashboard, and API endpoints

- Update proxy middleware and next-auth type declarations

src/app/(dashboard)/profile/page.tsx

@@ -6,10 +6,10 @@ import { User, Mail, Phone, MapPin, Calendar, Clock, Shield } from "lucide-react
 
 import { requireAuth } from "@/shared/lib/auth-guard"
 import { getUserProfile } from "@/modules/users/data-access"
+import { AvatarUpload } from "@/modules/settings/components/avatar-upload"
 import { ProfileStudentOverview, ProfileStudentOverviewSkeleton } from "@/modules/settings/components/profile-student-overview"
 import { ProfileTeacherOverview, ProfileTeacherOverviewSkeleton } from "@/modules/settings/components/profile-teacher-overview"
 import { SettingsSectionErrorBoundary } from "@/modules/settings/components/settings-section-error-boundary"
-import { Avatar, AvatarFallback, AvatarImage } from "@/shared/components/ui/avatar"
 import { Badge } from "@/shared/components/ui/badge"
 import { Button } from "@/shared/components/ui/button"
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/shared/components/ui/card"
@@ -50,18 +50,11 @@ export default async function ProfilePage(): Promise<ReactElement> {
         }
       />
 
-      <div className="flex items-center gap-4">
-        <Avatar className="h-20 w-20">
-          {userProfile.image ? <AvatarImage src={userProfile.image} alt={userProfile.name ?? t("title")} /> : null}
-          <AvatarFallback className="text-xl font-semibold">
-            {(userProfile.name ?? userProfile.email).slice(0, 2).toUpperCase()}
-          </AvatarFallback>
-        </Avatar>
-        <div className="space-y-1">
-          <div className="text-xl font-semibold tracking-tight">{userProfile.name ?? "-"}</div>
-          <div className="text-sm text-muted-foreground">{userProfile.email}</div>
-        </div>
-      </div>
+      <AvatarUpload
+        currentImage={userProfile.image}
+        name={userProfile.name}
+        email={userProfile.email}
+      />
 
       <div className="grid gap-6 md:grid-cols-2">
         <Card>