# Google AI Studio prompt — SEC Report dashboard (Next.js 15) Paste everything between the lines into AI Studio. Do **not** paste the token; set it as a server environment variable after the app is generated. --- Build a Next.js 15 App Router app in TypeScript called "SEC Report — Albert Lane". It shows a read-only records index from an existing API. **API (already live, do not mock it)** - `GET https://api.albertlane.net/v1/sec/report` with `Authorization: Bearer ${process.env.SEC_REPORT_TOKEN}`. Query params: `limit` (1–100, default 25), `cursor` (opaque, from `page.next_cursor`), `category`, `since` (YYYY-MM-DD = midnight Pacific, or ISO date-time). - `GET https://api.albertlane.net/v1/sec/report/{id}` for one record. - OpenAPI 3.1: `https://api.albertlane.net/v1/sec/openapi.json` (public). JSON Schema: `https://api.albertlane.net/v1/sec/report.schema.json` (public). Generate TypeScript types from these. - Response: `{ ok, meta, query, page, records[] }`. `meta` has `generated_at_pt`, `version`, `seal { value, label }`, `contact`, `disclaimer`, `filing_status`, `record_count_total`, `categories {name: count}`. Each record has `id, title, date_pt, date_iso, category, summary, submitted_by, collector, url|null, custody_steps[{time_pt, actor, action}], notes, stated_claims[], primary_file, sha256, files[{filename, path, bytes, sha256, role?}], source`. **Security (required)** - The token is server-only. Read it only from `process.env.SEC_REPORT_TOKEN` (never `NEXT_PUBLIC_`). Never send it to the browser, never log it, never put it in client components. - Create `app/api/sec-report/route.ts`: a GET route handler that proxies to the API above, forwarding only `limit`, `cursor`, `category`, `since` and an optional `id` (validate `id` against `^[A-Za-z0-9-]{1,120}$`), with `cache: "no-store"`, returning the upstream status and JSON with `Cache-Control: no-store` and the upstream `ETag`. - Put the fetch in `lib/sec-report.ts` with `import "server-only"`. The dashboard page is a Server Component that calls that helper directly. Do not call api.albertlane.net from the browser. - Add `.env.example` containing only `SEC_REPORT_TOKEN=`. **Dashboard page (`app/page.tsx`)** - Lead with a human-readable records table: columns Date (PT), Record (title), Category (plain-English label: evidence_record → "Evidence record", evidence_upload_receipt → "Evidence upload", website_deployment_receipt → "Website change", api_deployment_receipt → "API change", manifest_filing → "Manifest filing", workorder_record → "Work order"). - Every row expands (native `
`/`` is fine) to show the forensic fields: summary, submitted by, collector, recorded time, public URL if any, notes, stated claims, custody steps (time · actor · action, in order), files with filename, size, role and stated SHA-256, then record ID and primary-file SHA-256. Human-readable fields first, hashes last, in a small monospace style that wraps. - Category filter chips with counts from `meta.categories`; "Next page" using `page.next_cursor`; "Showing X–Y of N". - Footer: `meta.disclaimer` ("Informational record; not an SEC filing; not legal advice"), `meta.filing_status`, "Seal {meta.seal.value} — {meta.seal.label}", contact `lane.albert@pm.me`, generated time in PT, "© Albert Lane. All rights reserved." - Show a plain error box if the API fails; never show stack traces or the token. **Design** - White/black: background #FFFFFF, text #000000; accents only #337DEF (links, expanded-row left border) and #C1DA08 (category badges with black text). No neon, no gradients, no dark mode. - Fonts: Plus Jakarta Sans (headings) and DM Sans (body) via `next/font/google` (self-hosted at build time). - Phone-first: readable at 390 px wide with no zoom and no sideways scrolling (base font 16 px; on phones each row stacks date / title / badge; long hashes and URLs wrap with `overflow-wrap:anywhere`). On ≥760 px use a three-column grid. - `robots: noindex` metadata. **Constraints** - No Google Analytics, no analytics or tracking scripts of any kind, no external CDNs. - No database, no writes, no forms that submit anywhere. Read-only. - Put this header at the top of every source file: ``` /* * Copyright © Albert Lane. All Rights Reserved. * Proprietary and Confidential — Albert Lane Proprietary Software License. * Unauthorized use, copying, modification, or distribution is prohibited. * License inquiries: https://albertlane.net — Contact: lane.albert@pm.me */ ``` - Keep dependencies to `next`, `react`, `react-dom`, `server-only`, `typescript` (5.x) and `@types/*`. --- ## After AI Studio generates it 1. In the deployment's environment settings, add `SEC_REPORT_TOKEN` (server-side secret). The value is in `/workspace/.lane/secrets/sec-report-token` on Albert's box. 2. Locally: `cp .env.example .env.local`, fill in the token, `npm run dev`, open http://localhost:3000. 3. A tested reference implementation is in `example/` next to this file (`app/api/sec-report/route.ts`, `app/page.tsx`, `app/layout.tsx`, `lib/sec-report.ts`). It was built with Next.js 15.5 and checked against the live API.