From 4da42b2d27bdfa93e3db02da4ba3af58699308fe Mon Sep 17 00:00:00 2001
From: saravanakumardb1 <saravanakumardb1@users.noreply.github.com>
Date: Thu, 12 Mar 2026 17:18:12 -0700
Subject: [PATCH] fix(web): wrap search + workspaces pages in Suspense for
 useSearchParams prerendering

---
 web/src/app/(app)/search/page.tsx     | 10 +++++++++-
 web/src/app/(app)/workspaces/page.tsx | 10 +++++++++-
 2 files changed, 18 insertions(+), 2 deletions(-)

diff --git a/web/src/app/(app)/search/page.tsx b/web/src/app/(app)/search/page.tsx
index 1479640..eb5a1a5 100644
--- a/web/src/app/(app)/search/page.tsx
+++ b/web/src/app/(app)/search/page.tsx
@@ -2,7 +2,7 @@
 
 import Link from "next/link";
 import { useSearchParams } from "next/navigation";
-import { useCallback, useEffect, useMemo, useState } from "react";
+import { Suspense, useCallback, useEffect, useMemo, useState } from "react";
 import { AppShell } from "@/components/AppShell";
 import { searchNoteSummaries } from "@/lib/notes-client";
 import { listSavedViews, createSavedView, deleteSavedView, type SavedView } from "@/lib/saved-views-client";
@@ -10,6 +10,14 @@ import { useDebounce } from "@/lib/use-debounce";
 import type { NoteSummary } from "@/lib/types";
 
 export default function SearchPage() {
+  return (
+    <Suspense fallback={<AppShell title="Search" description="Search notes"><p>Loading...</p></AppShell>}>
+      <SearchPageInner />
+    </Suspense>
+  );
+}
+
+function SearchPageInner() {
   const searchParams = useSearchParams();
   const [notes, setNotes] = useState<NoteSummary[]>([]);
   const [query, setQuery] = useState(() => searchParams?.get("q") ?? "");
diff --git a/web/src/app/(app)/workspaces/page.tsx b/web/src/app/(app)/workspaces/page.tsx
index 9bd7f70..1d06e60 100644
--- a/web/src/app/(app)/workspaces/page.tsx
+++ b/web/src/app/(app)/workspaces/page.tsx
@@ -2,12 +2,20 @@
 
 import Link from "next/link";
 import { useSearchParams } from "next/navigation";
-import { useEffect, useMemo, useState } from "react";
+import { Suspense, useEffect, useMemo, useState } from "react";
 import { AppShell } from "@/components/AppShell";
 import { listNoteSummaries, listWorkspaceSummaries } from "@/lib/notes-client";
 import type { NoteSummary, WorkspaceSummary } from "@/lib/types";
 
 export default function WorkspacesPage() {
+  return (
+    <Suspense fallback={<AppShell title="Workspaces" description="Manage workspaces"><p>Loading...</p></AppShell>}>
+      <WorkspacesPageInner />
+    </Suspense>
+  );
+}
+
+function WorkspacesPageInner() {
   const searchParams = useSearchParams();
   const [notes, setNotes] = useState<NoteSummary[]>([]);
   const [workspaces, setWorkspaces] = useState<WorkspaceSummary[]>([]);