.

Author: kantord

src/app/catalog/page.tsx

@@ -17,7 +17,7 @@ export default async function CatalogPage() {
     count: number;
     titles: string[];
     sample: Array<{ title: string; name: string; version?: string }>;
-  } | null = null;
+  } = { count: 0, titles: [], sample: [] };
   try {
     const base =
       process.env.MOCK_SERVER_ORIGIN ||
@@ -54,7 +54,7 @@ export default async function CatalogPage() {
       serversSummary = { count: items.length, titles, sample };
     }
   } catch {
-    // ignore in dev if backend is not available
+    // Leave serversSummary at its default empty state
   }
 
   return (
@@ -86,29 +86,21 @@ export default async function CatalogPage() {
           <p className="font-semibold text-zinc-800 dark:text-zinc-200">
             Registry
           </p>
-          {serversSummary ? (
-            <>
-              <div className="text-zinc-700 dark:text-zinc-300">
-                Servers available: <strong>{serversSummary.count}</strong>
-              </div>
-              {serversSummary.sample.length > 0 && (
-                <ul className="mt-2 list-disc pl-5 text-zinc-700 dark:text-zinc-300">
-                  {serversSummary.sample.map((s) => (
-                    <li key={`${s.name}-${s.title}`}>
-                      <strong>{s.title}</strong>
-                      <span className="ml-2 text-zinc-500 dark:text-zinc-400">
-                        ({s.name}
-                        {s.version ? ` @ ${s.version}` : ""})
-                      </span>
-                    </li>
-                  ))}
-                </ul>
-              )}
-            </>
-          ) : (
-            <div className="italic text-zinc-500 dark:text-zinc-400">
-              Registry unavailable in dev (expected)
-            </div>
+          <div className="text-zinc-700 dark:text-zinc-300">
+            Servers available: <strong>{serversSummary.count}</strong>
+          </div>
+          {serversSummary.sample.length > 0 && (
+            <ul className="mt-2 list-disc pl-5 text-zinc-700 dark:text-zinc-300">
+              {serversSummary.sample.map((s) => (
+                <li key={`${s.name}-${s.title}`}>
+                  <strong>{s.title}</strong>
+                  <span className="ml-2 text-zinc-500 dark:text-zinc-400">
+                    ({s.name}
+                    {s.version ? ` @ ${s.version}` : ""})
+                  </span>
+                </li>
+              ))}
+            </ul>
           )}
         </div>
 

src/app/page.tsx

@@ -14,7 +14,10 @@ export default async function Home() {
 
   // Try to load servers list from the registry API (SSR).
   // In dev, prefer the standalone mock server to validate server-side fetches.
-  let serversSummary: { count: number; titles: string[] } | null = null;
+  let serversSummary: { count: number; titles: string[] } = {
+    count: 0,
+    titles: [],
+  };
   try {
     const base =
       process.env.MOCK_SERVER_ORIGIN ||
@@ -44,7 +47,7 @@ export default async function Home() {
       serversSummary = { count: items.length, titles };
     }
   } catch {
-    // ignore; likely no backend in dev
+    // Leave serversSummary at its default { count: 0, titles: [] }
   }
 
   return (
@@ -67,20 +70,12 @@ export default async function Home() {
           </Link>
 
           <div className="mt-6 text-sm text-zinc-600 dark:text-zinc-400">
-            {serversSummary ? (
-              <>
-                <div>
-                  Registry servers available:{" "}
-                  <strong>{serversSummary.count}</strong>
-                </div>
-                {serversSummary.titles.length > 0 && (
-                  <div>Sample: {serversSummary.titles.join(", ")}</div>
-                )}
-              </>
-            ) : (
-              <div className="italic">
-                Registry unavailable in dev (expected)
-              </div>
+            <div>
+              Registry servers available:{" "}
+              <strong>{serversSummary.count}</strong>
+            </div>
+            {serversSummary.titles.length > 0 && (
+              <div>Sample: {serversSummary.titles.join(", ")}</div>
             )}
           </div>
         </div>