From e934770a039ef543dbd6bc79824539450c86f7b2 Mon Sep 17 00:00:00 2001
From: sjcoetzeesj-coder <sjcoetzeesj@gmail.com>
Date: Wed, 16 Sep 2026 14:58:43 +0200
Subject: [PATCH] fix(notes): render collection-missing error inline instead of
 throwing

---
 Workflow/app/notes/page.tsx | 31 ++++++++++++++++++++-----------
 1 file changed, 20 insertions(+), 11 deletions(-)

diff --git a/Workflow/app/notes/page.tsx b/Workflow/app/notes/page.tsx
index 03f2fef..ad1b646 100644
--- a/Workflow/app/notes/page.tsx
+++ b/Workflow/app/notes/page.tsx
@@ -3,8 +3,8 @@
 // the Client Component <NotesList> which owns the CRUD UI state.
 //
 // Notes live in the ysterbaard_notes collection. If the collection is
-// missing (PB returns 404) the page renders an actionable error so the
-// user knows to create it in the admin UI.
+// missing (PB returns 404) or any other load error happens, the page
+// renders an inline error banner instead of crashing with a generic 500.
 
 import { fetchCollection } from "@/lib/pb";
 import type { YsterbaardNote } from "@/lib/types";
@@ -13,30 +13,31 @@ import NotesList from "./NotesList";
 
 export const dynamic = "force-dynamic";
 
-async function loadNotes(): Promise<YsterbaardNote[]> {
+async function loadNotes(): Promise<{ notes: YsterbaardNote[]; error: string | null }> {
   try {
     const list = await fetchCollection<YsterbaardNote>("ysterbaard_notes", {
       page: 1,
       perPage: 500,
       sort: "-created",
     });
-    return list.items ?? [];
+    return { notes: list.items ?? [], error: null };
   } catch (err) {
-    // Surface the failure to the client so the page can show guidance.
     const msg = err instanceof Error ? err.message : "Unknown PB error";
     if (msg.includes("404") || msg.toLowerCase().includes("not found")) {
-      throw new Error(
-        "The ysterbaard_notes collection is missing on PocketBase. " +
+      return {
+        notes: [],
+        error:
+          "The ysterbaard_notes collection is missing on PocketBase. " +
           "Open https://pb.agent.apphub.co.za/_/ and create it before " +
           "using this tab. See docs/superpowers/specs/2026-09-16-notes-tab-design.md for the field spec.",
-      );
+      };
     }
-    throw err;
+    return { notes: [], error: `Could not load notes: ${msg}` };
   }
 }
 
 export default async function NotesPage() {
-  const notes = await loadNotes();
+  const { notes, error } = await loadNotes();
   return (
     <>
       <PageHeader
@@ -44,7 +45,15 @@ export default async function NotesPage() {
         title="Notes"
         subtitle="Things to do. Tick when done, edit, or delete."
       />
-      <NotesList initialNotes={notes} />
+      {error ? (
+        <div className="container-x py-6">
+          <div className="rounded-md border border-amber-300 bg-amber-50 text-amber-900 px-4 py-3 text-sm whitespace-pre-line">
+            {error}
+          </div>
+        </div>
+      ) : (
+        <NotesList initialNotes={notes} />
+      )}
     </>
   );
 }
\ No newline at end of file