@pylonsync/create-pylon 0.3.274 → 0.3.275

package/templates/default/lib/site.ts

@@ -1,261 +1,14 @@
-// Content for the rest of the marketing site — solutions, resources, company,
-// and comparison pages. Each collection drives a dynamic route AND the footer
-// columns, so the links and the pages can never drift. Fictional demo copy —
-// swap it for your own.
-
-export type ContentSection = { title: string; body: string };
-
-export type SitePage = {
-  slug: string;
-  navLabel: string; // label in nav/footer
-  eyebrow: string;
-  title: string; // hero headline
-  summary: string;
-  sections: ContentSection[];
-};
-
-export const SOLUTIONS: SitePage[] = [
-  {
-    slug: "startups",
-    navLabel: "For startups",
-    eyebrow: "Solutions",
-    title: "Move fast without losing the thread.",
-    summary:
-      "Keep a small team aligned as everything changes weekly. Acme gives you one place to plan, build, and ship before the next pivot.",
-    sections: [
-      { title: "One tool, not ten", body: "Projects, tasks, and docs in one place, so you are not paying for or stitching together five apps." },
-      { title: "Set up in minutes", body: "No admin overhead. Invite the team and start working the same day." },
-      { title: "Grows with you", body: "The same workspace works at five people and at fifty." },
-    ],
-  },
-  {
-    slug: "agencies",
-    navLabel: "For agencies",
-    eyebrow: "Solutions",
-    title: "Run every client like clockwork.",
-    summary:
-      "Give each client their own space, keep the work organized, and show progress without a status meeting.",
-    sections: [
-      { title: "A space per client", body: "Separate workspaces keep every engagement tidy and private." },
-      { title: "Shareable views", body: "Send clients a read-only view of exactly what is in flight." },
-      { title: "Reusable templates", body: "Start every new engagement from a proven playbook." },
-    ],
-  },
-  {
-    slug: "enterprise",
-    navLabel: "For enterprise",
-    eyebrow: "Solutions",
-    title: "Scale without the chaos.",
-    summary:
-      "Bring hundreds of people into one system of record, with the controls and visibility a larger org needs.",
-    sections: [
-      { title: "SSO and roles", body: "Single sign-on and granular roles keep access where it belongs." },
-      { title: "Audit log", body: "A complete record of who changed what, and when." },
-      { title: "Rollups", body: "See progress across teams and departments in one view." },
-    ],
-  },
-  {
-    slug: "teams",
-    navLabel: "For teams",
-    eyebrow: "Solutions",
-    title: "Built for how your team works.",
-    summary:
-      "Whether you build, design, market, or support, Acme adapts to your process instead of forcing a new one.",
-    sections: [
-      { title: "Your workflow", body: "Custom statuses and fields match the way your team already works." },
-      { title: "Cross-team work", body: "Hand work between teams without it falling through a crack." },
-      { title: "Less status-chasing", body: "Everyone sees the same live picture, so updates write themselves." },
-    ],
-  },
-];
-
-export const RESOURCES: SitePage[] = [
-  {
-    slug: "docs",
-    navLabel: "Docs",
-    eyebrow: "Resources",
-    title: "Documentation.",
-    summary: "Everything you need to set up Acme and get your team productive.",
-    sections: [
-      { title: "Getting started", body: "Create a workspace, invite your team, and ship your first project." },
-      { title: "Guides", body: "Deep dives on projects, tasks, docs, automations, and analytics." },
-      { title: "API", body: "Build on the typed Acme API and webhooks." },
-    ],
-  },
-  {
-    slug: "guides",
-    navLabel: "Guides",
-    eyebrow: "Resources",
-    title: "Guides and playbooks.",
-    summary: "Practical walkthroughs for getting the most out of Acme.",
-    sections: [
-      { title: "Run a sprint", body: "Plan, track, and review a two-week cycle in Acme." },
-      { title: "Automate intake", body: "Route incoming work to the right team automatically." },
-      { title: "Report to leadership", body: "Build a dashboard that answers the questions you get asked." },
-    ],
-  },
-  {
-    slug: "changelog",
-    navLabel: "Changelog",
-    eyebrow: "Resources",
-    title: "What's new.",
-    summary: "Every improvement we ship, in one place.",
-    sections: [
-      { title: "This week", body: "Faster search, a redesigned task list, and new automation triggers." },
-      { title: "Last week", body: "Timeline view for projects and CSV export for analytics." },
-      { title: "Earlier", body: "Webhooks, custom fields, and version history for docs." },
-    ],
-  },
-  {
-    slug: "api",
-    navLabel: "API reference",
-    eyebrow: "Resources",
-    title: "API reference.",
-    summary: "A typed REST API and webhooks for everything in Acme.",
-    sections: [
-      { title: "Authentication", body: "API keys scoped to a workspace, revocable at any time." },
-      { title: "Resources", body: "Projects, tasks, docs, and automations, all over the same API." },
-      { title: "Webhooks", body: "Subscribe to events and react to changes in real time." },
-    ],
-  },
-  {
-    slug: "status",
-    navLabel: "Status",
-    eyebrow: "Resources",
-    title: "System status.",
-    summary: "Live status for every Acme service.",
-    sections: [
-      { title: "API", body: "Operational — 99.99% over the last 90 days." },
-      { title: "Web app", body: "Operational — no incidents this week." },
-      { title: "Webhooks", body: "Operational — delivering within seconds." },
-    ],
-  },
-];
-
-export const COMPANY: SitePage[] = [
-  {
-    slug: "about",
-    navLabel: "About",
-    eyebrow: "Company",
-    title: "About Acme.",
-    summary: "We build the workspace we always wanted: fast, focused, and a pleasure to use.",
-    sections: [
-      { title: "Our mission", body: "Help teams do their best work without fighting their tools." },
-      { title: "How we work", body: "Small team, weekly releases, every decision close to the user." },
-      { title: "Where we are", body: "Remote-first, with people across a dozen time zones." },
-    ],
-  },
-  {
-    slug: "blog",
-    navLabel: "Blog",
-    eyebrow: "Company",
-    title: "The Acme blog.",
-    summary: "Notes on building Acme, and on building product in general.",
-    sections: [
-      { title: "Why one tool beats ten", body: "The hidden cost of stitching your stack together." },
-      { title: "Shipping weekly", body: "How a small team keeps a steady release cadence." },
-      { title: "Designing for focus", body: "The principles behind the Acme interface." },
-    ],
-  },
-  {
-    slug: "careers",
-    navLabel: "Careers",
-    eyebrow: "Company",
-    title: "Work at Acme.",
-    summary: "We are a small team that ships a lot. If that sounds good, come build with us.",
-    sections: [
-      { title: "Engineering", body: "Full-stack engineers who care about craft and speed." },
-      { title: "Design", body: "Product designers who sweat the details." },
-      { title: "Support", body: "People who love helping customers succeed." },
-    ],
-  },
-  {
-    slug: "contact",
-    navLabel: "Contact",
-    eyebrow: "Company",
-    title: "Get in touch.",
-    summary: "Questions, feedback, or just want to say hi? We would love to hear from you.",
-    sections: [
-      { title: "Sales", body: "Talk through whether Acme is a fit for your team." },
-      { title: "Support", body: "Get help from a human, usually within a few hours." },
-      { title: "Press", body: "Logos, screenshots, and company facts for the press." },
-    ],
-  },
-  {
-    slug: "privacy",
-    navLabel: "Privacy",
-    eyebrow: "Company",
-    title: "Privacy.",
-    summary: "How Acme handles your data, in plain language.",
-    sections: [
-      { title: "What we collect", body: "Only what we need to run the product and support you." },
-      { title: "How we use it", body: "To operate Acme — never sold, never rented." },
-      { title: "Your control", body: "Export or delete your data at any time." },
-    ],
-  },
-];
-
-export type Comparison = {
-  slug: string;
-  navLabel: string;
-  competitor: string;
-  title: string;
-  summary: string;
-  rows: { dim: string; acme: string; them: string }[];
-};
-
-// Generic, made-up competitors so the template ships no real brand names.
-export const COMPARISONS: Comparison[] = [
-  {
-    slug: "beacon",
-    navLabel: "Acme vs Beacon",
-    competitor: "Beacon",
-    title: "Acme vs Beacon",
-    summary:
-      "Beacon is a capable tool, but it splits projects, docs, and automation across separate products. Acme brings them into one fast workspace.",
-    rows: [
-      { dim: "Projects, tasks, and docs", acme: "In one workspace", them: "Separate products" },
-      { dim: "Real-time sync", acme: "Built in", them: "Add-on" },
-      { dim: "Automations", acme: "Included", them: "Higher tier" },
-      { dim: "Typed API", acme: "Yes", them: "Partial" },
-      { dim: "Setup time", acme: "Minutes", them: "Hours" },
-    ],
-  },
-  {
-    slug: "orbit",
-    navLabel: "Acme vs Orbit",
-    competitor: "Orbit",
-    title: "Acme vs Orbit",
-    summary:
-      "Orbit is flexible but slow to set up and heavy to run. Acme gives you the same power with a fraction of the overhead.",
-    rows: [
-      { dim: "Time to first project", acme: "Same day", them: "Onboarding required" },
-      { dim: "Speed", acme: "Instant, real-time", them: "Page reloads" },
-      { dim: "Per-seat pricing", acme: "No surprises", them: "Adds up fast" },
-      { dim: "Analytics", acme: "Built in", them: "Separate tool" },
-      { dim: "Learning curve", acme: "Gentle", them: "Steep" },
-    ],
-  },
-  {
-    slug: "tempo",
-    navLabel: "Acme vs Tempo",
-    competitor: "Tempo",
-    title: "Acme vs Tempo",
-    summary:
-      "Tempo is built for managers; Acme is built for the whole team. Everyone gets a fast, shared view of the work.",
-    rows: [
-      { dim: "Designed for", acme: "The whole team", them: "Managers" },
-      { dim: "Daily driver", acme: "Yes", them: "Reporting layer" },
-      { dim: "Docs included", acme: "Yes", them: "No" },
-      { dim: "Automations", acme: "Included", them: "Limited" },
-      { dim: "Self-serve", acme: "Yes", them: "Sales-led" },
-    ],
-  },
-];
-
-export function bySlug<T extends { slug: string }>(
-  list: T[],
-  slug: string,
-): T | undefined {
-  return list.find((x) => x.slug === slug);
-}
+// The marketing content (solutions, resources, company, comparisons) now lives
+// in the single site config so the whole template can be rebranded from one
+// file. This module re-exports it so existing imports (`@/lib/site`) keep
+// working. Edit lib/site.config.ts.
+export {
+  SOLUTIONS,
+  RESOURCES,
+  COMPANY,
+  COMPARISONS,
+  bySlug,
+  type ContentSection,
+  type SitePage,
+  type Comparison,
+} from "./site.config";

package/templates/directory/.env.example

@@ -0,0 +1,12 @@
+# Copy to `.env` and fill in. `pylon dev` loads `.env` automatically.
+
+# ── Owner / curator (required to use the dashboard) ──────────────────────────
+# A directory is single-tenant: one curator. The /dashboard moderation queue is
+# unlocked only for the account whose email matches this value, and the
+# owner-only function refuses to return submissions (with their PII) otherwise.
+# Set this to the email you'll sign in with, then create that account at /login.
+PYLON_OWNER_EMAIL=you@yourdirectory.com
+
+# ── Site URL (optional) ──────────────────────────────────────────────────────
+# Used by robots.txt + sitemap.xml. Point it at your real domain in production.
+# SITE_URL=https://yourdirectory.com

package/templates/directory/AGENTS.md

@@ -0,0 +1,61 @@
+# AGENTS.md — working in a Pylon project
+
+Operating rules for a coding agent in this Pylon app. Pylon is a Rails-like framework for realtime apps: you declare entities, policies, and server functions in TypeScript, and a single Rust binary (`pylon`) serves the API, auth, sync, WebSocket, SSE, and native React 19 SSR — one process, one port. The full API reference is at **/llms-full.txt** (served at `/llms-full.txt`; in the repo at `apps/web/public/llms-full.txt`). Read it before guessing an API name.
+
+## Directory conventions
+
+**Unified SSR app:**
+- `app.ts` — data model + manifest (`entity()` + `field.*`, queries/actions/policies, `routes: await discoverAppRoutes()`). Ends with `console.log(JSON.stringify(manifest))`.
+- `app/` — file-based SSR routes. `app/page.tsx` → `/`, `app/about/page.tsx` → `/about`, `app/blog/[slug]/page.tsx` → `/blog/:slug`. `app/layout.tsx` is the shell; `app/error.tsx` / `app/not-found.tsx` are boundaries.
+- `app/globals.css` — Tailwind v4 entrypoint (auto-compiled and injected).
+- `functions/` — server functions, one per file, `default`-exported.
+- `.pylon/` — local dev state (sqlite, jobs, sessions, uploads). Created by `pylon dev`. Do not commit.
+
+**Monorepo app:** backend is `apps/api/` (entry `apps/api/schema.ts`, handlers in `apps/api/functions/`); frontend in `apps/web/`. `pylon.manifest.json` / `pylon.client.ts` are generated — do not hand-edit.
+
+## The core authoring loop
+
+1. **Define an entity** — `entity("Thing", { name: field.string(), done: field.boolean().default(false) })`. Modifiers: `.optional()`, `.unique()`, `.readonly()` (settable on insert, rejected on client update — use for `authorId`/`orgId`), `.serverOnly()` (never in HTTP responses), `.encrypted()` (AEAD at rest, needs `PYLON_ENCRYPTION_KEY`), `.crdt("text")` (collaborative).
+2. **Write a policy** — `policy({ entity: "Thing", allowRead, allowInsert, allowUpdate, allowDelete })` with CEL-like expressions over `auth.*` / `data.*` (e.g. `"auth.userId == data.authorId"`). **Omitted actions DENY by default.** Wide-open dev policies (`allow*: "true"`) are flagged by `pylon lint` — tighten before shipping.
+3. **Author a function** in `functions/<name>.ts` — `query` (read-only), `mutation` (transactional read+write), or `action` (external I/O, no direct `ctx.db`). Import `{ query, mutation, action, v }` from `@pylonsync/functions`. `auth` defaults to `"user"` (secure-by-default); set `"public"` explicitly for unauthenticated access. Use `ctx.db.*`, `ctx.auth.userId`, `ctx.error(code, msg)`.
+4. **Read it on the client** — `db.useQuery("Thing")` (live, re-renders on any write) or `db.useQueryOne("Thing", id)`. Call functions with `db.fn(name, args)` / `callFn`. On SSR pages, read via `use(serverData.list("Thing"))` inside `<Suspense>`.
+
+## Key gotchas
+
+- **Policies deny by default; server functions BYPASS them.** Direct client CRUD (`/api/entities/*`) and sync are policy-checked. Functions run with full DB access — enforce trust with `ctx.auth` checks inside the handler, not policies.
+- **Type page props from the SDK, don't hand-roll them.** `import type { PageProps, Metadata } from "@pylonsync/react"`. Every page/layout gets `{ url, params, searchParams, auth, response, serverData }`; `PageProps<{ slug: string }>` types a `[slug]` route's params. Request headers/cookies are intentionally NOT on `PageProps` — they're server-only and stripped from hydration, so reading them in the render would mismatch.
+- **Anonymous output caching is opt-in + earned.** `export const revalidate = 60` (seconds) on a page makes it CDN-cacheable (`public, s-maxage=60`) — but ONLY if the render is auth-INDEPENDENT: it must NOT read `props.auth` (reading it at all opts out, even for anonymous), set no cookie, and the app must not run strict per-caller policies (`PYLON_STRICT_FN_POLICIES`). `export const dynamic = "force-static"` caches until the next deploy; `"force-dynamic"` never caches. Fail-closed: without the opt-in (or if any condition fails) the page is `no-cache`. A page that reads `auth` or sets a cookie is never shared. The SAME earned render is also kept in an **origin disk cache** (`.pylon/.cache/ssr`): a cookie-less GET with no query string is served straight off disk for the TTL — skipping the render entirely — then re-rendered live when stale. The disk cache is namespaced per deploy (wiped on each new build) and OFF in `pylon dev` (so an edit is never masked by a stale entry); invalidation is by the `revalidate` TTL or the next deploy.
+- **No-JS forms use `route.ts` + `<Form>`.** Drop `app/.../route.ts` exporting `export const POST: RouteHandler = async ({ form, db, response, auth }) => { await db.insert("X", {...}); response.redirect("/x?ok=1"); }` (303 POST-redirect-GET by default). Render `<Form action="/x">` (from @pylonsync/react) with plain `<input name=...>` — works with JS off (native POST→handler→redirect) and is enhanced to no-reload when JS is on. The handler's `db` is read+write (mutation trust model — gate on `auth`); CSRF is automatic (Origin gate + SameSite=Lax). Multipart/file uploads aren't supported yet — use urlencoded forms + `/api/files`.
+- **`loading.tsx` streams a skeleton while the page's data resolves.** Drop `app/.../loading.tsx` (default export, page props) and the nearest one becomes a route-level Suspense fallback: Pylon flushes the shell + skeleton immediately, then reveals the real page when its top-level `use(serverData…)` resolves (no blank page). It only shows when the PAGE suspends — a page that wraps its own `<Suspense>` around a child (like `/dashboard` in this template) handles that itself. The skeleton is SERVER-ONLY: don't read `serverData` in it. A page with no `loading.tsx` is buffered (unchanged).
+- **`export const streaming = true` streams a page's OWN inner `<Suspense>` boundaries.** Without it (and without a `loading.tsx`), a page is BUFFERED — the whole document, including suspended children, resolves before the first byte. Opt in and the shell + each inner `<Suspense>` fallback flush immediately, then each boundary's real content streams in as its data resolves (multi-boundary progressive streaming). It's opt-in because it changes the response timing contract: a streaming render commits its HTTP head BEFORE suspended subtrees finish, so (a) it's never CDN/disk cacheable — don't combine with `export const revalidate`; (b) `response.setStatus/setCookie/redirect/notFound` only take effect from the SYNCHRONOUS shell render — a call from inside a suspended subtree is dropped (the runtime logs a loud warning naming what was lost); (c) a `throw` from a deep `<Suspense>` child resolves via its nearest `error.tsx` at HTTP 200, not a 5xx. Hydration is clean for any number of boundaries (the data blob ships before hydration runs). Type the config with `import type { RouteSegmentConfig } from "@pylonsync/react"`.
+- **`error.tsx` / `not-found.tsx` boundaries are HYDRATED (interactive).** `app/.../error.tsx` catches a throw below it (HTTP 500) and receives `{ error: { message, digest }, reset }` (`import type { ErrorBoundaryProps }`) — `reset()` re-attempts the route; the stack NEVER reaches the client (dev overlay + logs only). `app/.../not-found.tsx` renders at 404 (also for `response.notFound()`) and gets the page props (`NotFoundProps`), no `reset`. Both run useState/onClick/hooks.
+- **Client navigation hooks live in @pylonsync/react.** `useRouter()` → `{ push, replace, back, forward, refresh, prefetch }`; `useSearchParams()` → reactive `URLSearchParams`; `usePathname()` → reactive pathname. The hooks are CLIENT-reactive — during SSR they return defaults (empty params / "/"); for server-side URL values read the `url` / `searchParams` page props.
+- **Dynamic + catch-all routes follow Next conventions.** `app/blog/[slug]/page.tsx` → `params.slug`. `app/docs/[...path]/page.tsx` is a catch-all (matches `/docs/a/b/c`; `params.path === "a/b/c"` — `.split("/")` for segments). `app/shop/[[...filters]]/page.tsx` is an optional catch-all (also matches the bare `/shop`, with `params.filters === ""`). A catch-all must be the last segment; static beats dynamic beats catch-all on overlap.
+- **`serverData` (SSR) is READ-ONLY.** No write methods; the runtime rejects write frames (`SSR_WRITE_FORBIDDEN`). Mutations belong in actions/functions, never in a page render.
+- **`response.*` / `response.redirect()` / `response.notFound()` must fire in the synchronous shell render**, before any `await` / `<Suspense>`. The HTTP head commits when the shell is ready — status/headers/cookies set from a suspended subtree are lost, and `redirect`/`notFound` thrown below a Suspense boundary are swallowed.
+- **`ctx.llm` and `ctx.connections` are on mutation + action only, NOT query** (reactive purity). `action` has no direct `ctx.db` — use `ctx.runQuery` / `ctx.runMutation`.
+- **It's `db.useQueryOne`, not `useOne`.** Validators and field types have aliases: `v.bool`/`v.boolean`, `v.float`/`v.number`.
+- **There is no `ctx.files` or `defineWorkflow`/`defineJob`.** Files go through `<FileUpload>` + `/api/files/*`; deferred execution is `ctx.scheduler.runAfter/runAt/cancel`.
+
+## Use the CLI — don't guess
+
+| Need | Command |
+|---|---|
+| Run the app (SSR + API, hot reload, one port `:4321`) | `pylon dev` (or `npm run dev`) |
+| Regenerate manifest + typed client | `pylon codegen` (Swift client: `pylon codegen client --target swift`) |
+| Validate / diff / push schema | `pylon schema check` \| `diff` \| `push` |
+| Migrations | `pylon migrate create <name>` \| `plan` \| `apply` |
+| Lint policies (PYL001–PYL004) | `pylon lint --strict` |
+| Tests | `pylon test` |
+| Adversarial security probe | `pylon test:security` |
+| Inspect cloud request logs (agent-safe) | `pylon logs --json --limit 50` |
+| Inspect data / entities | `pylon data entities` \| `pylon data list <Entity>` |
+| Call a function | `pylon fn <name> key=value` |
+| Health snapshot | `pylon status` |
+| Build for prod | `pylon build` |
+| Deploy (Pylon Cloud by default) | `pylon deploy` |
+| Look up an error code | `pylon explain <CODE>` |
+
+`--json` works on every command for machine-readable output. Prefer one-shot/agent-safe flags (`pylon logs --limit N`, not a blocking `--follow`).
+
+For full signatures, env vars, the complete CLI, and SSR/client/server-primitive details: **/llms-full.txt**.

package/templates/directory/README.md

@@ -0,0 +1,80 @@
+# __APP_NAME__
+
+A curated, searchable **directory** built with [Pylon](https://pylonsync.com) —
+live full-text search + facets, community upvotes, and a moderated submit flow,
+all from one binary on one port. No Next.js, no search service.
+
+It's the template that shows off Pylon's **full-text search**: the browse page
+is a live `db.useSearch` over the listing table — type in the box and results +
+facet counts update instantly, and vote counts tick up across every open tab.
+
+## Develop
+
+```bash
+__RUN_DEV__
+```
+
+Open http://localhost:4321 — the directory seeds itself on first load. Search,
+filter by category, and upvote. Then **open a second tab** and upvote something —
+watch the count rise in both.
+
+## How it works
+
+- **Live faceted search.** `app/directory-browse.tsx` calls
+  `db.useSearch("Listing", { query, filters, facets, sort })`, declared by the
+  `search: { text, facets, sortable }` block on the `Listing` entity in `app.ts`
+  (Pylon builds FTS5 + facet shadow tables). It re-runs on every keystroke AND
+  whenever the table is written — so it doubles as the realtime layer.
+- **Live upvotes.** The public `upvote` mutation bumps `Listing.votes` under a
+  per-listing advisory lock; because `useSearch` is live, the new count appears
+  in every open tab instantly.
+- **Moderated submissions.** `submitListing` (public) writes a pending
+  `Submission`; the curator approves it from `/dashboard`, which copies the
+  public fields into a new `Listing` (`approveSubmission`).
+
+## Privacy — read this
+
+The `Submission` entity holds the submitter's name + email (PII), so its policy
+in `app.ts` **denies every client read and write**. The public directory only
+reads `Listing` (no PII). Submissions come back only through the owner-gated
+`submissionsForOwner`, and `approveSubmission` copies *only* the PII-free fields
+into the public `Listing` — the submitter's contact details never become public.
+
+## The curator dashboard
+
+`/dashboard` is the moderation queue: pending submissions (with submitter
+details), Approve / Reject, and a live count of published listings.
+
+Set `PYLON_OWNER_EMAIL` in `.env` (see `.env.example`) to the email you'll sign
+in with, then create that account at `/login`.
+
+## Rebrand it
+
+Everything lives in **`lib/site.config.ts`** — brand, colors, hero copy, the
+category list, the starter listings (which seed the directory), and the submit
+copy. Edit that one file and the whole directory re-themes; it re-seeds on a
+fresh database.
+
+## Layout
+
+```
+app.ts                          Listing (public, FTS) + Submission (PII) + User
+lib/site.config.ts              ALL copy + brand + categories + seed listings
+functions/seedListings.ts       idempotent seed from config
+functions/submitListing.ts      public mutation: write a pending Submission (PII)
+functions/upvote.ts             public mutation: bump Listing.votes (live)
+functions/submissionsForOwner.ts  owner-only query: queue + submitter PII
+functions/{approve,reject}Submission.ts  owner-only moderation
+app/page.tsx                    hero + browse island
+app/directory-browse.tsx        client island: live db.useSearch + facets + votes
+app/submit/page.tsx, submit-form.tsx  the submit flow
+app/dashboard/                  curator moderation queue (auth-gated, live)
+```
+
+## Deploy
+
+```bash
+pylon deploy
+```
+
+Docs: https://docs.pylonsync.com

package/templates/directory/app/auth-form.tsx

@@ -0,0 +1,129 @@
+"use client";
+
+import React, { useState } from "react";
+import {
+  passwordLogin,
+  passwordRegister,
+  persistSession,
+  ApiError,
+} from "@pylonsync/client";
+
+// The owner's email/password form — one form, two modes. It calls the built-in
+// auth API directly (`passwordLogin` / `passwordRegister` POST to
+// `/api/auth/password/*`), then `persistSession` writes the freshly-minted
+// token to local storage so the sync engine + `callFn` authenticate AS THE
+// OWNER on the next load. This step matters here specifically: the landing page
+// mints an anonymous guest session (for the live slot counter), and without
+// persisting the real session that stale guest token would shadow the owner's
+// — so the owner-only `inquiriesForOwner` call would come back as a guest and
+// get rejected. We then do a full navigation to /dashboard so the SSR runtime
+// re-resolves auth from the HttpOnly cookie and renders server-side.
+//
+// A studio is single-tenant: there's no public sign-up, just the owner creating
+// their one account. Whoever signs in only sees data if their email matches
+// PYLON_OWNER_EMAIL — enforced by the inquiriesForOwner function.
+export function AuthForm() {
+  const [mode, setMode] = useState<"login" | "register">("login");
+  const [email, setEmail] = useState("");
+  const [password, setPassword] = useState("");
+  const [error, setError] = useState<string | null>(null);
+  const [pending, setPending] = useState(false);
+
+  async function onSubmit(e: React.FormEvent) {
+    e.preventDefault();
+    setError(null);
+    setPending(true);
+    try {
+      const session =
+        mode === "login"
+          ? await passwordLogin({ email, password })
+          : await passwordRegister({ email, password });
+      // Make this session authoritative, replacing any anonymous guest token.
+      persistSession(session);
+      window.location.assign("/dashboard");
+    } catch (err) {
+      setError(messageFor(err));
+      setPending(false);
+    }
+  }
+
+  return (
+    <div className="space-y-5">
+      <form onSubmit={onSubmit} className="space-y-4">
+        <label className="block">
+          <span className="mb-1.5 block text-[13px] font-medium text-zinc-700">Email</span>
+          <input
+            type="email"
+            value={email}
+            onChange={(e) => setEmail(e.target.value)}
+            required
+            autoComplete="email"
+            placeholder="you@yourbusiness.com"
+            className="h-10 w-full rounded-lg border border-zinc-300 bg-white px-3 text-sm text-zinc-900 outline-none transition placeholder:text-zinc-400 focus:border-brand focus:ring-2 focus:ring-brand/20"
+          />
+        </label>
+        <label className="block">
+          <span className="mb-1.5 block text-[13px] font-medium text-zinc-700">Password</span>
+          <input
+            type="password"
+            value={password}
+            onChange={(e) => setPassword(e.target.value)}
+            required
+            autoComplete={mode === "login" ? "current-password" : "new-password"}
+            placeholder={mode === "login" ? "Your password" : "At least 10 characters"}
+            className="h-10 w-full rounded-lg border border-zinc-300 bg-white px-3 text-sm text-zinc-900 outline-none transition placeholder:text-zinc-400 focus:border-brand focus:ring-2 focus:ring-brand/20"
+          />
+        </label>
+        {error ? (
+          <p className="rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-[13px] leading-snug text-red-700">
+            {error}
+          </p>
+        ) : null}
+        <button
+          type="submit"
+          disabled={pending}
+          className="inline-flex h-10 w-full items-center justify-center rounded-lg bg-zinc-900 text-sm font-medium text-white transition-colors hover:bg-zinc-700 disabled:opacity-60"
+        >
+          {pending ? "…" : mode === "login" ? "Sign in" : "Create account"}
+        </button>
+      </form>
+
+      <p className="text-center text-[13px] text-zinc-500">
+        {mode === "login" ? "First time here?" : "Already have an account?"}{" "}
+        <button
+          type="button"
+          onClick={() => {
+            setMode(mode === "login" ? "register" : "login");
+            setError(null);
+          }}
+          className="font-medium text-zinc-900 underline underline-offset-2"
+        >
+          {mode === "login" ? "Create the owner account" : "Sign in"}
+        </button>
+      </p>
+    </div>
+  );
+}
+
+// Map the framework's auth error codes to friendly copy. `ApiError` carries a
+// stable `.code` so you branch on the code, not the message.
+function messageFor(err: unknown): string {
+  if (err instanceof ApiError) {
+    switch (err.code) {
+      case "INVALID_CREDENTIALS":
+        return "Wrong email or password.";
+      case "USER_EXISTS":
+        return "That email is already registered — sign in instead.";
+      case "WEAK_PASSWORD":
+        return "Pick a longer password — at least 10 characters.";
+      case "PWNED_PASSWORD":
+        return "That password has appeared in a known data breach. Choose a different one.";
+      case "RATE_LIMITED":
+        return "Too many attempts — try again in a minute.";
+      default:
+        return err.message;
+    }
+  }
+  if (err instanceof Error) return err.message;
+  return "Something went wrong. Try again.";
+}