app/(auth)/login/page.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { useState, useEffect } from "react";
+import { useState, useEffect, Suspense } from "react";
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import {
@@ -26,7 +26,7 @@ import { toast } from "sonner";
 
 type Step = "login" | "signup" | "verify";
 
-export default function Login() {
+function LoginContent() {
   const { theme } = useAppTheme();
   const isDark = theme === "dark";
   const [step, setStep] = useState<Step>("login");
@@ -794,3 +794,15 @@ export default function Login() {
     </div>
   );
 }
+
+export default function Login() {
+  return (
+    <Suspense fallback={
+      <div className="min-h-screen flex items-center justify-center">
+        <Loader2 className="w-8 h-8 animate-spin text-rose-600" />
+      </div>
+    }>
+      <LoginContent />
+    </Suspense>
+  );
+}

app/(auth)/signup/page.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { useState, useEffect } from "react";
+import { useState, useEffect, Suspense } from "react";
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import {
@@ -17,7 +17,7 @@ import { useAuth } from "@/hooks/useAuth";
 import { registerSchema, verifyOtpSchema, type RegisterInput, type VerifyOtpInput } from "@/lib/schema/auth";
 import { toast } from "sonner";
 
-export default function Signup() {
+function SignupContent() {
   const { theme } = useAppTheme();
   const isDark = theme === "dark";
   const [showPassword, setShowPassword] = useState(false);
@@ -456,3 +456,15 @@ export default function Signup() {
   );
 }
 
+export default function Signup() {
+  return (
+    <Suspense fallback={
+      <div className="min-h-screen flex items-center justify-center">
+        <Loader2 className="w-8 h-8 animate-spin text-rose-600" />
+      </div>
+    }>
+      <SignupContent />
+    </Suspense>
+  );
+}
+

components/LoginDialog.tsx

@@ -54,7 +54,7 @@ export function LoginDialog({ open, onOpenChange, onLoginSuccess }: LoginDialogP
     // Validate form
     const validation = loginSchema.safeParse(loginData);
     if (!validation.success) {
-      const firstError = validation.error.errors[0];
+      const firstError = validation.error.issues[0];
       setError(firstError.message);
       return;
     }
@@ -82,7 +82,7 @@ export function LoginDialog({ open, onOpenChange, onLoginSuccess }: LoginDialogP
     // Validate form
     const validation = registerSchema.safeParse(signupData);
     if (!validation.success) {
-      const firstError = validation.error.errors[0];
+      const firstError = validation.error.issues[0];
       setError(firstError.message);
       return;
     }

lib/actions/appointments.ts

@@ -62,7 +62,7 @@ export async function createAppointment(
   const data: AppointmentResponse = await response.json();
 
   if (!response.ok) {
-    const errorMessage = extractErrorMessage(data as ApiError);
+    const errorMessage = extractErrorMessage(data as unknown as ApiError);
     throw new Error(errorMessage);
   }
 
@@ -90,7 +90,7 @@ export async function getAvailableDates(): Promise<string[]> {
   const data: AvailableDatesResponse | string[] = await response.json();
 
   if (!response.ok) {
-    const errorMessage = extractErrorMessage(data as ApiError);
+    const errorMessage = extractErrorMessage(data as unknown as ApiError);
     throw new Error(errorMessage);
   }
 
@@ -124,7 +124,7 @@ export async function listAppointments(email?: string): Promise<Appointment[]> {
   const data = await response.json();
 
   if (!response.ok) {
-    const errorMessage = extractErrorMessage(data as ApiError);
+    const errorMessage = extractErrorMessage(data as unknown as ApiError);
     throw new Error(errorMessage);
   }
 
@@ -162,7 +162,7 @@ export async function getUserAppointments(): Promise<Appointment[]> {
   const data = await response.json();
 
   if (!response.ok) {
-    const errorMessage = extractErrorMessage(data as ApiError);
+    const errorMessage = extractErrorMessage(data as unknown as ApiError);
     throw new Error(errorMessage);
   }
 
@@ -200,7 +200,7 @@ export async function getAppointmentDetail(id: string): Promise<Appointment> {
   const data: AppointmentResponse = await response.json();
 
   if (!response.ok) {
-    const errorMessage = extractErrorMessage(data as ApiError);
+    const errorMessage = extractErrorMessage(data as unknown as ApiError);
     throw new Error(errorMessage);
   }
 
@@ -234,7 +234,7 @@ export async function scheduleAppointment(
   const data: AppointmentResponse = await response.json();
 
   if (!response.ok) {
-    const errorMessage = extractErrorMessage(data as ApiError);
+    const errorMessage = extractErrorMessage(data as unknown as ApiError);
     throw new Error(errorMessage);
   }
 
@@ -268,7 +268,7 @@ export async function rejectAppointment(
   const data: AppointmentResponse = await response.json();
 
   if (!response.ok) {
-    const errorMessage = extractErrorMessage(data as ApiError);
+    const errorMessage = extractErrorMessage(data as unknown as ApiError);
     throw new Error(errorMessage);
   }
 
@@ -298,7 +298,7 @@ export async function getAdminAvailability(): Promise<AdminAvailability> {
   const data: AdminAvailability = await response.json();
 
   if (!response.ok) {
-    const errorMessage = extractErrorMessage(data as ApiError);
+    const errorMessage = extractErrorMessage(data as unknown as ApiError);
     throw new Error(errorMessage);
   }
 
@@ -327,7 +327,7 @@ export async function updateAdminAvailability(
   const data: AdminAvailability = await response.json();
 
   if (!response.ok) {
-    const errorMessage = extractErrorMessage(data as ApiError);
+    const errorMessage = extractErrorMessage(data as unknown as ApiError);
     throw new Error(errorMessage);
   }
 
@@ -353,7 +353,7 @@ export async function getAppointmentStats(): Promise<AppointmentStats> {
   const data: AppointmentStats = await response.json();
 
   if (!response.ok) {
-    const errorMessage = extractErrorMessage(data as ApiError);
+    const errorMessage = extractErrorMessage(data as unknown as ApiError);
     throw new Error(errorMessage);
   }
 
@@ -379,7 +379,7 @@ export async function getJitsiMeetingInfo(id: string): Promise<JitsiMeetingInfo>
   const data: JitsiMeetingInfo = await response.json();
 
   if (!response.ok) {
-    const errorMessage = extractErrorMessage(data as ApiError);
+    const errorMessage = extractErrorMessage(data as unknown as ApiError);
     throw new Error(errorMessage);
   }