fix(suspense): use suspense boundary

Author: parthokr

src/app/layout.tsx

@@ -10,6 +10,8 @@ import { getCurrentUser } from "@/lib/auth";
 import { Toaster } from "@/components/ui/sonner";
 import { getNotifications, getUnreadCount } from "@/lib/notifications";
 
+export const dynamic = "force-dynamic";
+
 const geistSans = Geist({
     variable: "--font-geist-sans",
     subsets: ["latin"],

src/app/organizations/[slug]/members/invitations/page.tsx

@@ -4,6 +4,7 @@ import { OrganizationInvitation } from "@/lib/types/organization";
 import { PaginatedData } from "@/lib/types/api";
 import { InvitationsView } from "./invitations-view";
 import { cookies } from "next/headers";
+import { Suspense } from "react";
 
 async function getInvitations(slug: string, page: number, size: number) {
   try {
@@ -56,5 +57,9 @@ export default async function InvitationsPage({ params, searchParams }: PageProp
 
   const data = await getInvitations(slug, page, size);
 
-  return <InvitationsView organizationSlug={slug} initialData={data} currentUserRole={role} />;
+  return (
+    <Suspense fallback={<div>Loading invitations...</div>}>
+      <InvitationsView organizationSlug={slug} initialData={data} currentUserRole={role} />
+    </Suspense>
+  );
 }

src/app/organizations/[slug]/members/page.tsx

@@ -4,6 +4,7 @@ import { OrganizationMember } from "@/lib/types/organization";
 import { PaginatedData } from "@/lib/types/api";
 import { MembersView } from "./members-view";
 import { cookies } from "next/headers";
+import { Suspense } from "react";
 
 async function getMembers(slug: string, page: number, size: number) {
   try {
@@ -61,5 +62,9 @@ export default async function MembersPage({ params, searchParams }: PageProps) {
       )
   }
 
-  return <MembersView data={data} />;
+  return (
+    <Suspense fallback={<div>Loading members...</div>}>
+      <MembersView data={data} />
+    </Suspense>
+  );
 }

src/app/signin/page.tsx

@@ -2,6 +2,7 @@ import { getCurrentUser } from "@/lib/auth";
 import { redirect } from "next/navigation";
 import SigninPage from "./signin-page";
 import { Metadata } from "next";
+import { Suspense } from "react";
 
 export const metadata: Metadata = {
   title: "Sign In | HeapDog",
@@ -20,5 +21,9 @@ export default async function Page(props: {
     redirect(redirectUrl);
   }
 
-  return <SigninPage />;
+  return (
+    <Suspense fallback={<div>Loading...</div>}>
+      <SigninPage />
+    </Suspense>
+  );
 }

src/app/verify/page.tsx

@@ -2,6 +2,7 @@ import { getCurrentUser } from "@/lib/auth";
 import { redirect } from "next/navigation";
 import VerifyPage from "./verify-page";
 import { Metadata } from "next";
+import { Suspense } from "react";
 
 export const metadata: Metadata = {
   title: "Verify Email | HeapDog",
@@ -15,6 +16,10 @@ export default async function Page() {
     redirect("/");
   }
 
-  return <VerifyPage />;
+  return (
+    <Suspense fallback={<div>Loading...</div>}>
+      <VerifyPage />
+    </Suspense>
+  );
 }