From 927c1fc8f7ae1f07d364bc30a959f4c579c5d5d2 Mon Sep 17 00:00:00 2001
From: Luiz Gustavo <gutomec@gmail.com>
Date: Fri, 29 May 2026 01:27:55 -0300
Subject: [PATCH] ux(home): replace duplicate 122-doc bento with compact CTA to
 /documents
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The mobile home was ~68,900 px tall — the bottom section rendered the full
filterable list of 122 documents below every other section, and that
already exists at /documents (linked from the Documents portal tile).

- Drop DocListFilters from app/page.tsx (and its preloading of all doc
  bodies + summaries, which was the costliest server work on the route).
- Replace with a single gold-bordered CTA card linking to /documents.
- Inline `Link` imported; the listDocuments call is kept only for the
  counts banner.

Mobile home height now 7,379 px (~9.3× shorter). Desktop fold unchanged.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 web/app/page.tsx | 64 +++++++++++++++++++++++-------------------------
 1 file changed, 31 insertions(+), 33 deletions(-)

diff --git a/web/app/page.tsx b/web/app/page.tsx
index 5e260e1..de0a98f 100644
--- a/web/app/page.tsx
+++ b/web/app/page.tsx
@@ -1,9 +1,8 @@
-import { listDocuments, readDocument } from "@/lib/wiki";
+import Link from "next/link";
+import { listDocuments } from "@/lib/wiki";
 import { ChatBubble } from "@/components/chat-bubble";
 import { BatchProgressBanner } from "@/components/batch-progress-banner";
 import { getLocale } from "@/components/locale-toggle";
-import { summarize, pickPitch } from "@/lib/doc-summary";
-import { DocListFilters } from "@/components/doc-list-filters";
 import { SiteHeader } from "@/components/site-header";
 import { HeroBanner } from "@/components/hero-banner";
 import { FeaturedCase } from "@/components/featured-case";
@@ -36,24 +35,7 @@ async function loadCounts(documentsCount: number): Promise<PortalCounts> {
 export default async function Home() {
   const ids = await listDocuments();
   const locale = (await getLocale()) === "en" ? "en" : "pt-br";
-
-  const docs = await Promise.all(
-    ids.map(async (id) => {
-      const f = await readDocument(id);
-      const summaryLang: "pt" | "en" = locale === "en" ? "en" : "pt";
-      return {
-        id,
-        title: (f?.fm.canonical_title as string) ?? id,
-        pages: (f?.fm.page_count as number) ?? 0,
-        collection: (f?.fm.collection as string) ?? "uncategorized",
-        classification: (f?.fm.highest_classification as string) ?? "—",
-        summary: pickPitch(f?.fm as Record<string, unknown> | undefined, summaryLang) ?? (f?.body ? summarize(f.body, summaryLang) : ""),
-      };
-    }),
-  );
-
   const counts = await loadCounts(ids.length);
-  const totalPages = docs.reduce((s, d) => s + d.pages, 0);
 
   return (
     <div className="min-h-screen">
@@ -82,20 +64,36 @@ export default async function Home() {
 
       <BatchProgressBanner />
 
-      {/* Document list — kept but reframed as "the primary record" */}
+      {/* "The primary record" — compact CTA into /documents instead of
+          re-rendering the full filterable list on the homepage. The
+          previous in-home bento of 122 cards stretched mobile to ~68k px
+          tall on its own. */}
       <section className="mx-auto max-w-7xl px-4 md:px-8 py-12 md:py-16 border-t border-[rgba(224,192,128,0.10)]">
-        <div className="text-[10px] font-mono uppercase tracking-[0.18em] text-[#5a6678] mb-2">
-          {locale === "en" ? "// The primary record" : "// O registro primário"}
-        </div>
-        <h2 className="font-display text-2xl md:text-3xl text-[#e7ecf3] mb-1">
-          {locale === "en" ? "Every document, indexed and searchable" : "Cada documento, indexado e buscável"}
-        </h2>
-        <p className="text-[#9aa6b8] text-sm mb-6">
-          {locale === "en"
-            ? `${ids.length} declassified files · ${totalPages.toLocaleString("pt-BR")} pages`
-            : `${ids.length} arquivos desclassificados · ${totalPages.toLocaleString("pt-BR")} páginas`}
-        </p>
-        <DocListFilters docs={docs} />
+        <Link
+          href="/documents"
+          className="group block rounded-2xl border border-[rgba(224,192,128,0.20)] bg-[rgba(224,192,128,0.03)] hover:border-[#e0c080] p-6 md:p-8 transition-colors"
+        >
+          <div className="text-[10px] font-mono uppercase tracking-[0.18em] text-[#e0c080] mb-2">
+            {locale === "en" ? "// The primary record" : "// O registro primário"}
+          </div>
+          <div className="flex flex-col md:flex-row md:items-end md:justify-between gap-4">
+            <div>
+              <h2 className="font-display text-2xl md:text-3xl text-[#e7ecf3] mb-1 group-hover:text-[#e0c080] transition-colors">
+                {locale === "en"
+                  ? "Every document, indexed and searchable"
+                  : "Cada documento, indexado e buscável"}
+              </h2>
+              <p className="text-[#cbd2dd] text-[14px] md:text-[15px]">
+                {locale === "en"
+                  ? `${ids.length} declassified files — memos, telegrams, intelligence reports.`
+                  : `${ids.length} arquivos desclassificados — memorandos, telegramas, relatórios de inteligência.`}
+              </p>
+            </div>
+            <span className="font-mono text-[13px] text-[#e0c080] whitespace-nowrap">
+              {locale === "en" ? "Browse documents →" : "Ver documentos →"}
+            </span>
+          </div>
+        </Link>
       </section>
       </main>