create-qpq-app 0.1.16 → 0.1.18

package/README.md

@@ -1,6 +1,6 @@
 # create-qpq-app
 
-Scaffold a new [quidproquo](https://github.com/joe-coady/quidproquo) app:
+Scaffold a new [quidproquo](https://github.com/qpqjs/quidproquo) app:
 
 ```bash
 npx create-qpq-app my-app
@@ -8,9 +8,16 @@ cd my-app
 npm run dev
 ```
 
-You get a full QPQ workspace with five services (`admin`, `auth`, `design`,
-`shell` and `todo`) that builds, runs locally on the QPQ dev server, and
-deploys as a single docker image with `npm run deploy`.
+You get a full workspace with five services (`admin`, `auth`, `design`, `shell` and `todo`) that builds, runs locally on the qpq dev server, and deploys as a single docker image with `npm run deploy`.
+
+The api comes up on `http://localhost:8080` and the web on `http://localhost:3080`:
+
+```bash
+curl http://localhost:8080/api/shell/v1/health
+# {"status":"healthy","service":"shell","checkedAt":"..."}
+```
+
+Node.js 24 or newer is required. Docker is only needed to deploy.
 
 ## Options
 
@@ -23,11 +30,22 @@ npx create-qpq-app <app-name> [options]
 --no-install                         skip npm install
 ```
 
+Pass `--language javascript` and you get the same app with type annotations stripped and JSX preserved, running on the same toolchain.
+
 ## How it works
 
-The template is a snapshot of quidproquojs.com — a real, continuously-built
-QPQ workspace — captured into this package at publish time. Scaffolding runs
-a pipeline of self-contained steps (prune the docs site, prune the website
-app, apply your app's identity/domain, pin quidproquo versions, git init,
-install). The generated app pins the `quidproquo-*` versions this package was
-published with; the whole family releases in lockstep.
+The template is a snapshot of quidproquojs.com, a real and continuously built qpq workspace, captured into this package at publish time. Scaffolding runs a pipeline of self-contained steps: prune the docs site, prune the website app, apply your app's identity and domain, pin the quidproquo versions, git init, install.
+
+The generated app pins the `quidproquo-*` versions this package was published with. The whole family releases in lockstep, so those versions are always a set that was built and tested together.
+
+## Status
+
+Pre-1.0 and under active development. The generated app changes shape between releases.
+
+## Documentation
+
+[docs.quidproquojs.com](https://docs.quidproquojs.com)
+
+## License
+
+MIT. See [LICENSE](https://github.com/qpqjs/quidproquo/blob/main/LICENSE).

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-qpq-app",
-  "version": "0.1.16",
+  "version": "0.1.18",
   "description": "Scaffold a new quidproquo app: npx create-qpq-app my-app",
   "main": "./lib/commonjs/index.js",
   "module": "./lib/esm/index.js",
@@ -13,6 +13,9 @@
     "lib/**/*",
     "template"
   ],
+  "publishConfig": {
+    "access": "public"
+  },
   "scripts": {
     "test": "vitest run",
     "test:watch": "vitest",
@@ -23,7 +26,7 @@
     "build:esm": "tsc -p tsconfig.esm.json",
     "build:bin-perms": "node -e \"require('fs').chmodSync('lib/commonjs/bin/createQpqApp.js', 0o755)\"",
     "snapshot-template": "node ./scripts/snapshotTemplate.mjs",
-    "smoke-test": "node ./scripts/smokeTest.mjs",
+    "scaffold-test": "node ./scripts/scaffoldTest.mjs",
     "prepack": "npm run snapshot-template",
     "lint": "npx eslint .",
     "lint:fix": "npx eslint . --fix",
@@ -31,7 +34,7 @@
   },
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/joe-coady/quidproquo.git"
+    "url": "git+https://github.com/qpqjs/quidproquo.git"
   },
   "keywords": [
     "quidproquo",
@@ -42,9 +45,9 @@
   "author": "",
   "license": "MIT",
   "bugs": {
-    "url": "https://github.com/joe-coady/quidproquo/issues"
+    "url": "https://github.com/qpqjs/quidproquo/issues"
   },
-  "homepage": "https://github.com/joe-coady/quidproquo#readme",
+  "homepage": "https://github.com/qpqjs/quidproquo#readme",
   "dependencies": {
     "@inquirer/prompts": "^8.5.2",
     "prettier": "^3.2.5",
@@ -52,7 +55,7 @@
   },
   "devDependencies": {
     "@types/node": "^22.13.13",
-    "quidproquo-tsconfig": "0.1.16"
+    "quidproquo-tsconfig": "0.1.18"
   },
   "bin": {
     "create-qpq-app": "./lib/commonjs/bin/createQpqApp.js"

package/template/README.md

@@ -1,150 +1,102 @@
 # quidproquojs.com
 
-The QPQ framework's own website (app **qpqjs**), built with QPQ itself:
-TypeScript npm workspaces, AWS Lambda service backends bundled with Rspack,
-React microfrontend views built with Rspack + Module Federation, deployed with
-AWS CDK.
+The quidproquo framework's own website (app **qpqjs**), built with quidproquo itself: TypeScript npm workspaces, AWS Lambda service backends bundled with Rspack, React microfrontend views built with Rspack and Module Federation, deployed with AWS CDK.
 
-This folder lives inside the quidproquo monorepo but is **not** one of its
-workspaces — it is a self-contained consumer app. All `quidproquo-*`
-dependencies are `file:../<pkg>` refs to the sibling packages, so the site
-always runs against the in-repo HEAD. Build the framework first
-(`npm install && npm run build` at the repo root) before installing here.
+This folder lives inside the quidproquo monorepo but is **not** one of its workspaces. It is a self-contained consumer app. All `quidproquo-*` dependencies are `file:../<pkg>` refs to the sibling packages, so the site always runs against the in-repo HEAD. Build the framework first (`npm install && npm run build` at the repo root) before installing here.
+
+It doubles as the `create-qpq-app` template: the scaffolder snapshots this workspace at publish time, so anything broken here is broken in every new app.
 
 ## Getting started
 
-> **Requires the repo's pinned Node version (see `.nvmrc` — currently 24.x).**
-> Run `nvm use` **before** `npm install` — on an older Node, `npm install`
-> refuses to run (`engines` + `engine-strict`).
+> Requires the repo's pinned Node version (see `.nvmrc`, currently 24.x). Run `nvm use` **before** `npm install`. On an older Node, `npm install` refuses to run (`engines` plus `engine-strict`).
 
 ```bash
-nvm use              # ALWAYS FIRST — switches to the Node version in .nvmrc
-npm install          # installs deps + symlinks the sibling quidproquo-* packages (file: refs)
-npm run build        # build every workspace (libs -> tsc -b to dist; services -> type-check)
-npm run go:dev       # full local dev stack: api dev server (:8080) + all views dev servers
+nvm use              # always first: switches to the Node version in .nvmrc
+npm install          # deps, plus symlinks to the sibling quidproquo-* packages (file: refs)
+npm run build        # build every workspace (libs: tsc -b to dist; services: type-check)
+npm run dev          # full local dev stack: api dev server (:8080) and all views dev servers
 ```
 
-Smoke test once `go:dev` is up:
+Smoke test once the dev server is up:
 
 ```bash
 curl -H "Host: qpqjs.development.localhost" http://localhost:8080/api/shell/v1/health
-# -> healthy response from the shell service
+# healthy response from the shell service
 ```
 
 ## Layout
 
 ```
 apps/<app>/                       # qpqjs
-  deploy.config.json              # { "prefix", "domain" } — DNS config for deploy
-  tsconfig.federated.json         # GENERATED by `npm run prep` — cross-view type aliases
+  deploy.config.json              # { "prefix", "domain" }: dns config for deploy
+  tsconfig.federated.json         # generated by `npm run prep`: cross-view type aliases
   packages/                       # app-wide libs (config, constants, service-utils)
   services/<svc>/
-    config, models, x-models,     # per-service libs — each builds to its own dist/
+    config, models, x-models,     # per-service libs, each builds to its own dist/
     shared-logic, x-logic,
     service-utils
-    service/                      # Lambda backend (rspack bundle, built at deploy time)
-    views/                        # React microfrontend (Rspack + Module Federation)
-docusaurus/                       # docs site (docs.quidproquojs.com) — built first
+    service/                      # lambda backend (rspack bundle, built at deploy time)
+    views/                        # react microfrontend (rspack + module federation)
+docusaurus/                       # docs site (docs.quidproquojs.com), built first
                                   # (listed first in workspaces); the shell's 'docs'
                                   # web entry auto-uploads docusaurus/build at deploy
 ```
 
-There is no tools/ directory: all build/dev/deploy orchestration ships in the
-`quidproquo-cli` package (the `qpq` bin — the root npm scripts are thin
-aliases), with the rspack config builders in `quidproquo-deploy-rspack` and the
-generic CDK app in `quidproquo-deploy-awscdk`.
+There is no tools/ directory. All build, dev, and deploy orchestration ships in the `quidproquo-cli` package (the `qpq` bin, which the root npm scripts alias), with the rspack config builders in `quidproquo-deploy-rspack` and the generic CDK app in `quidproquo-deploy-awscdk`.
 
 ## How it fits together
 
-- **Libraries** build to their own `dist/` with `tsc -b` (TypeScript project
-  references, so only what changed rebuilds). Each lib's `package.json`
-  `main`/`types`/`exports` point at `dist/src`, and npm workspaces symlink it
-  into `node_modules/@qpqjs/*`, so imports
-  resolve like any npm package. Libs build before services because the root
-  `workspaces` array lists all lib globs ahead of `apps/*/services/*/service`.
-- **Service backends** are bundled to AWS Lambda by Rspack, programmatically
-  at deploy time (`qpq go` calls `getServiceRspackConfig` from
-  `quidproquo-deploy-rspack`) — there are no per-service `rspack.config.ts`
-  files or `bundle` scripts. A service's `build` script only type-checks.
-- **Views** are microfrontends built by Rspack + `@module-federation/enhanced`.
-  There are no per-view federation config files: exposes are computed at build
-  time from `// federated.export` markers, and remotes are discovered from
-  sibling views packages (dev port from each service's
-  `defineDevServerOptions({ port })` in its `infrastructure.ts`). The
-  only generated artifact is `apps/<app>/tsconfig.federated.json` — regenerate
-  with `npm run prep` after adding or removing a marker.
-- **The dev server** (`qpq go:dev:api`, powered by `quidproquo-dev-server`) loads each service's
-  `infrastructure.ts` directly — no synth needed, just built libs. Its bundle
-  externalizes `node_modules` (an externals function in its rspack config) so native modules like
-  `sqlite3` load at runtime from their install location.
-- **The `admin` service** owns the QPQ log/admin backbone: every service's
-  config references `defineAdminSettings(Admin, …)` + `logServiceName: Admin`,
-  so the dev server resolves log globals from the `admin` module. Running a
-  single service without `admin` spams `Global config qpq-log-retention-days
-  not found`.
+- **Libraries** build to their own `dist/` with `tsc -b` (TypeScript project references, so only what changed rebuilds). Each lib's `package.json` `main`, `types`, and `exports` point at `dist/src`, and npm workspaces symlink it into `node_modules/@qpqjs/*`, so imports resolve like any npm package. Libs build before services because the root `workspaces` array lists all lib globs ahead of `apps/*/services/*/service`.
+- **Service backends** are bundled to AWS Lambda by Rspack, programmatically at deploy time (`qpq go` calls `getServiceRspackConfig` from `quidproquo-deploy-rspack`). There are no per-service `rspack.config.ts` files or `bundle` scripts, and a service's `build` script only type-checks.
+- **Views** are microfrontends built by Rspack and `@module-federation/enhanced`. There are no per-view federation config files: exposes are computed at build time from `// federated.export` markers, and remotes are discovered from sibling views packages (dev port from each service's `defineDevServerOptions({ port })` in its `infrastructure.ts`). The only generated artifact is `apps/<app>/tsconfig.federated.json`, regenerated with `npm run prep` after adding or removing a marker.
+- **The dev server** (`npx qpq go:dev:api`, powered by `quidproquo-dev-server`) loads each service's `infrastructure.ts` directly, so no synth is needed, just built libs. Its bundle externalizes `node_modules` (an externals function in its rspack config) so native modules like `sqlite3` load at runtime from their install location.
+- **The `admin` service** owns the log and admin backbone. Every service's config references `defineAdminSettings(Admin, …)` and `logServiceName: Admin`, so the dev server resolves log globals from the `admin` module. Running a single service without `admin` spams `Global config qpq-log-retention-days not found`.
 
 ## Commands
 
+The root scripts are `build`, `validate-ts`, `lint`, `lint:fix`, `dev`, `deploy`, and `prep`. Anything else is a direct `npx qpq` call.
+
 ```bash
-npm run build        # build only the libs (services/views are bundled, not built); scope with --workspace=@qpqjs/constants
-npm run validate-ts  # TS check: build libs, then tsc-typecheck every service + views
-npm run prep         # regenerate tsconfig.federated.json from // federated.export markers
-npm run go:dev       # api + web dev servers in one process (one ctrl+c stops the lot)
-npm run go:dev:api   # backend dev server only, on :8080, every service at /api/<svc>
-npm run go:dev:web   # boot ALL views Rspack dev servers (host shell :3080 + remotes on their
-                     # ports); remotes resolve dynamically at runtime via mf-manifest.json.
-                     # Subset: npm run go:dev:web -- --only host,shell,design
+npm run build          # build only the libs (services and views are bundled, not built)
+                       # scope with --workspace=@qpqjs/constants
+npm run validate-ts    # ts check: build libs, then typecheck every service and views
+npm run prep           # regenerate tsconfig.federated.json from // federated.export markers
+npm run dev            # api and web dev servers in one process (one ctrl+c stops the lot)
+
+npx qpq go:dev:api     # backend dev server only, on :8080, every service at /api/<svc>
+npx qpq go:dev:web     # all views rspack dev servers (host shell :3080, remotes on their
+                       # ports); remotes resolve at runtime via mf-manifest.json
+                       # subset: npx qpq go:dev:web --only host,shell,design
 ```
 
 ### App selection (multi-app)
 
-Every app-facing script (`prep`, `synth`, `go`, `go:docker`, `go:dev`,
-`go:dev:api`, `go:dev:web`) resolves its target app the same way:
+Every app-facing command (`prep`, `synth`, `go`, `go:docker`, `go:dev`, `go:dev:api`, `go:dev:web`) resolves its target app the same way:
 
-1. `--app <name>` — **must come after `--`**: `npm run go:dev -- --app qpqjs`
-   (this npm silently swallows flags before `--`)
-2. the script's env var (`QPQ_DEV_APP` for dev, `DEPLOY_APP_NAME` for synth/deploy)
-3. exactly one app under `apps/` → auto-selected
-4. interactive prompt (TTY)
+1. `--app <name>`. Through an npm script it **must come after `--`**: `npm run dev -- --app qpqjs`, because npm silently swallows flags before `--`
+2. the command's env var (`QPQ_DEV_APP` for dev, `DEPLOY_APP_NAME` for synth and deploy)
+3. exactly one app under `apps/`, which is then auto-selected
+4. interactive prompt, when attached to a TTY
 5. otherwise it prints the valid app list and exits 1
 
-`prep` and `synth` also accept `--app all`. `synth <service>` (bare positional)
-still infers the owning app. Unknown names print the valid list and exit 1.
+`prep` and `synth` also accept `--app all`. A bare `qpq synth <service>` still infers the owning app. Unknown names print the valid list and exit 1.
 
 ## Deployment
 
 ```bash
-npm run synth        # writes dist/apps/<app>/infrastructure/<svc>-config.json (for CDK deploy)
-npm run go           # interactive AWS deploy: pick app -> services -> stacks (inf/api/web/views).
-                     # Bundles (rspack production) + cdk deploy + s3 sync per phase.
+npm run deploy         # docker deploy (qpq go:docker)
+npx qpq synth          # writes dist/apps/<app>/infrastructure/<svc>-config.json for cdk
+npx qpq go             # interactive aws deploy: pick app, services, stacks (inf/api/web/views)
+                       # bundles (rspack production), cdk deploy, and s3 sync per phase
 ```
 
-`go` needs AWS credentials plus a deploy identity: either an
-`"environments"` map in `apps/<app>/deploy.config.json`
-(`{ "prefix", "domain", "environments": { "<env>": { "accountId", "region" } } }`,
-selected with `--env <name>`) or the legacy `ENVIRONMENT`/`AWS_DEFAULT_*` env
-vars. App-specific bootstrap/account extras live in `apps/<app>/bootstrap.qpq.ts`
-and `apps/<app>/account.qpq.ts` (config fragments; the identity plumbing is
-provided by the generic CDK app in `quidproquo-deploy-awscdk`).
-
-- Production views bundles get prod remote URLs
-  (`https://views.<feature>.<env>.<domain>/<svc>`) derived from
-  `deploy.config.json` + the service's QPQ config; dev bundles use localhost
-  ports.
-- `cdk.context.json` at the repo root is CDK's regenerable Route53 lookup
-  cache (written on first deploy; check it in so later synths need no live
-  AWS lookups).
-
-## Adding a service (pattern from `mini`)
-
-1. Create its `config/models/x-models/shared-logic/x-logic/service-utils` + `service`.
-2. Each lib: `package.json` with `"build": "tsc -b"` (+ the dist-pointing
-   `main`/`types`/`exports`); `tsconfig.json` (extends root base, **no paths**,
-   references `./tsconfig.lib.json`) + `tsconfig.lib.json` (`composite`,
-   `outDir ./dist`, `rootDir .`, `references` to its workspace deps'
-   `tsconfig.lib.json`). No root-level list to touch — `npm run build --workspaces`
-   discovers the new lib automatically.
-3. `service/`: add a `package.json` (`@qpqjs/<svc>-service`, `private`,
-   `"build": "tsc -p tsconfig.app.json"`) and a `tsconfig.app.json`.
-   No rspack.config.ts, no bundle script — `qpq go` bundles it by convention.
-   `npm run build` then picks it up automatically.
+`qpq go` needs AWS credentials plus a deploy identity: either an `"environments"` map in `apps/<app>/deploy.config.json` (`{ "prefix", "domain", "environments": { "<env>": { "accountId", "region" } } }`, selected with `--env <name>`) or the legacy `ENVIRONMENT` and `AWS_DEFAULT_*` env vars. App-specific bootstrap and account extras live in `apps/<app>/bootstrap.qpq.ts` and `apps/<app>/account.qpq.ts` as config fragments; the identity plumbing is provided by the generic CDK app in `quidproquo-deploy-awscdk`.
+
+- Production views bundles get prod remote URLs (`https://views.<feature>.<env>.<domain>/<svc>`) derived from `deploy.config.json` plus the service's qpq config. Dev bundles use localhost ports.
+- `cdk.context.json` at the repo root is CDK's regenerable Route53 lookup cache. It is written on the first deploy, and checking it in means later synths need no live AWS lookups.
+
+## Adding a service
+
+1. Create its `config`, `models`, `x-models`, `shared-logic`, `x-logic`, `service-utils`, and `service` packages.
+2. Each lib gets a `package.json` with `"build": "tsc -b"` and the dist-pointing `main`, `types`, and `exports`; a `tsconfig.json` (extends the root base, **no paths**, references `./tsconfig.lib.json`); and a `tsconfig.lib.json` (`composite`, `outDir ./dist`, `rootDir .`, with `references` to its workspace deps' `tsconfig.lib.json`). There is no root-level list to touch, since `npm run build --workspaces` discovers the new lib automatically.
+3. `service/` gets a `package.json` (`@qpqjs/<svc>-service`, `private`, `"build": "tsc -p tsconfig.app.json"`) and a `tsconfig.app.json`. No rspack.config.ts and no bundle script, because `qpq go` bundles it by convention. `npm run build` then picks it up automatically.

package/template/apps/qpqjs/packages/constants/src/QpqjsServiceEnum.ts

@@ -3,6 +3,8 @@ export enum QpqjsServiceEnum {
   Auth = 'auth',
   Design = 'design',
   Shell = 'shell',
+  Test = 'test',
+  TestA = 'testa',
 }
 
 export type QpqjsServiceEnumValues = `${QpqjsServiceEnum}`;

package/template/apps/qpqjs/packages/constants/src/index.ts

@@ -1,3 +1,4 @@
 export * from './domain';
 export * from './QpqjsServiceEnum';
+export * from './smokeProbe';
 export * from './userDirectory';

package/template/apps/qpqjs/packages/constants/src/smokeProbe.ts

@@ -0,0 +1,13 @@
+// Smoke probe resources owned by the test service and reached cross-service
+// by testa (which declares them with owner: { module: test }). App-level
+// because both services must agree on the names.
+export const SMOKE_PROBE_STORE = 'smokeProbe';
+// Lowercase with a hyphen: this becomes an S3 bucket name, which must be lowercase.
+export const SMOKE_PROBE_DRIVE = 'smoke-probe';
+
+// The testa service functions the cross-service smoke tests invoke, one per
+// foreign grant (the store and the drive are separate IAM statements).
+export const SMOKE_CROSS_SERVICE_KEY_VALUE_STORE_PROBE_FUNCTION_NAME =
+  'crossKvsProbe';
+export const SMOKE_CROSS_SERVICE_STORAGE_DRIVE_PROBE_FUNCTION_NAME =
+  'crossDriveProbe';

package/template/apps/qpqjs/services/design/views/src/components/LandingPage/LandingPage.tsx

@@ -1,20 +1,22 @@
 // federated.export: This file will be exported using module federation
 
-import { Features } from './components/Features';
+import { Actions } from './components/Actions';
 import { Footer } from './components/Footer';
 import { Hero } from './components/Hero';
-import { Packages } from './components/Packages';
-import { Pipeline } from './components/Pipeline';
+import { Infrastructure } from './components/Infrastructure';
+import { Replay } from './components/Replay';
+import { Testing } from './components/Testing';
 import { YieldLoop } from './components/YieldLoop';
 import './landing.css';
 
 export const LandingPage = () => (
   <main>
     <Hero />
-    <Features />
     <YieldLoop />
-    <Pipeline />
-    <Packages />
+    <Replay />
+    <Testing />
+    <Infrastructure />
+    <Actions />
     <Footer />
   </main>
 );

package/template/apps/qpqjs/services/design/views/src/components/LandingPage/components/Actions.tsx

@@ -0,0 +1,53 @@
+type ActionDomain = {
+  domain: string;
+  requester: string;
+};
+
+// A sample, not the catalogue: enough to show the shape and the reach without
+// turning the section into a reference page.
+const DOMAINS: ActionDomain[] = [
+  { domain: 'key value store', requester: 'askKeyValueStoreGet' },
+  { domain: 'file', requester: 'askFileWriteTextContents' },
+  { domain: 'queue', requester: 'askQueueSendMessages' },
+  { domain: 'event bus', requester: 'askEventBusSendMessages' },
+  { domain: 'user directory', requester: 'askUserDirectoryCreateUser' },
+  { domain: 'websocket', requester: 'askWebsocketSendMessage' },
+  { domain: 'network', requester: 'askNetworkRequest' },
+  { domain: 'ai', requester: 'askAiPrompt' },
+  {
+    domain: 'graph database',
+    requester: 'askGraphDatabaseExecuteOpenCypherQuery',
+  },
+  { domain: 'crypto', requester: 'askCryptoEncrypt' },
+  { domain: 'metric', requester: 'askMetricPut' },
+  { domain: 'config', requester: 'askConfigGetSecret' },
+];
+
+export function Actions() {
+  return (
+    <section className="section" id="actions">
+      <div className="section__head">
+        <p className="section__kicker">the surface</p>
+        <h2 className="section__title">What a story can ask for</h2>
+        <p className="section__sub">
+          Every capability is an action with a typed payload and a typed result.
+          Each platform supplies its own processor, so the story stays the same
+          wherever it runs.
+        </p>
+      </div>
+
+      <div className="action-grid">
+        {DOMAINS.map((entry) => (
+          <div key={entry.domain} className="action-cell">
+            <span className="action-cell__domain">{entry.domain}</span>
+            <code className="action-cell__requester">{entry.requester}</code>
+          </div>
+        ))}
+      </div>
+
+      <p className="action-note">
+        25 domains · 91 action types · and your own, when you need one
+      </p>
+    </section>
+  );
+}

package/template/apps/qpqjs/services/design/views/src/components/LandingPage/components/CodeWindow.tsx

@@ -8,7 +8,7 @@ const cm = (text: string) => <span className="tok-cm">{text}</span>;
 const pr = (text: string) => <span className="tok-pr">{text}</span>;
 
 const LINES: ReactNode[] = [
-  <>{cm('// pure business logic — no infrastructure')}</>,
+  <>{cm('// no SDK imports, no platform APIs')}</>,
   <>
     {kw('export function')}* {fn('askSendWelcomeEmail')}(
   </>,
@@ -23,7 +23,7 @@ const LINES: ReactNode[] = [
   <>&nbsp;</>,
   <>
     {'  '}
-    {kw('yield')}* {fn('askQueueSendMessage')}({str("'email'")}, {'{'}
+    {kw('yield')}* {fn('askQueueSendMessages')}({str("'email'")}, {'{'}
   </>,
   <>
     {'    '}
@@ -37,7 +37,7 @@ const LINES: ReactNode[] = [
   <>&nbsp;</>,
   <>
     {'  '}
-    {kw('yield')}* {fn('askEventBusPublish')}({str("'welcomed'")}, {'{'} userId {'}'});
+    {kw('yield')}* {fn('askEventBusSendMessages')}({'{'} userId {'}'});
   </>,
   <>&nbsp;</>,
   <>
@@ -59,7 +59,7 @@ export function CodeWindow() {
       <pre className="code-window__body">
         <code>
           {LINES.map((line, index) => (
-            <span className="code-line" key={index}>
+            <span key={index} className="code-line">
               <span className="code-line__num">{index + 1}</span>
               <span className="code-line__text">{line}</span>
             </span>

package/template/apps/qpqjs/services/design/views/src/components/LandingPage/components/Footer.tsx

@@ -1,40 +1,29 @@
-import { useRef } from 'react';
-
 import { InstallChip } from './InstallChip';
-import { TronGrid } from './TronGrid';
 
 export function Footer() {
-  const panelRef = useRef<HTMLDivElement>(null);
-
   return (
     <footer className="footer">
       <div className="footer__cta">
-        <TronGrid avoidRefs={[panelRef]} />
-        <div ref={panelRef} className="footer__cta-content">
-          <p className="section__kicker">get started</p>
-          <h2 className="footer__cta-title">
-            Ready to write
-            <br />
-            <span className="hero__title-glow">your first story?</span>
-          </h2>
-          <p className="footer__cta-sub">
-            One command scaffolds a full app — five services, a local dev
-            server, a one-image docker deploy. Yield an action; the runtime
-            handles the rest.
-          </p>
-          <div className="footer__cta-actions">
-            <InstallChip />
-            <a
-              className="btn btn--ghost"
-              href="https://github.com/joe-coady/quidproquo"
-              rel="noreferrer"
-              target="_blank"
-            >
-              Star on GitHub
-            </a>
-          </div>
+        <p className="section__kicker">get started</p>
+        <h2 className="footer__cta-title">Write your first story</h2>
+        <p className="footer__cta-sub">
+          One command scaffolds a full app: five services, a local dev server
+          and a one-image docker deploy. Yield an action, and the runtime takes
+          it from there.
+        </p>
+        <div className="footer__cta-actions">
+          <InstallChip />
+          <a
+            className="btn btn--ghost"
+            href="https://github.com/qpqjs/quidproquo"
+            rel="noreferrer"
+            target="_blank"
+          >
+            Star on GitHub
+          </a>
         </div>
       </div>
+
       <div className="footer__base">
         <div className="footer__base-inner">
           <span>quidproquo · MIT license</span>

package/template/apps/qpqjs/services/design/views/src/components/LandingPage/components/Hero.tsx

@@ -1,60 +1,51 @@
-import { useRef } from 'react';
-
 import { CodeWindow } from './CodeWindow';
 import { InstallChip } from './InstallChip';
 import { NavBar } from './NavBar';
-import { TronGrid } from './TronGrid';
 
 export function Hero() {
-  const copyRef = useRef<HTMLDivElement>(null);
-  const panelRef = useRef<HTMLDivElement>(null);
-
   return (
-    <section className="hero" id="top">
-      <TronGrid avoidRefs={[copyRef, panelRef]} />
+    <>
       <NavBar />
 
-      <div className="hero__inner">
-        <div ref={copyRef} className="hero__copy">
-          <span className="hero__badge">
-            <span className="hero__badge-pulse" />
-            functional · action-based · typescript
-          </span>
+      <section className="hero" id="top">
+        <div aria-hidden="true" className="hero__grid" />
+        <div aria-hidden="true" className="hero__glow" />
+
+        <div className="hero__inner">
+          <p className="hero__kicker">functional · action-based · typescript</p>
 
           <h1 className="hero__title">
-            Write pure stories.
+            Pure business logic.
             <br />
-            <span className="hero__title-glow">Run them anywhere.</span>
+            <span className="hero__title-dim">Platform agnostic.</span>
           </h1>
 
           <p className="hero__sub">
-            quidproquo is an action-based framework where business logic is a
-            generator function — a <em>story</em> that yields typed actions. The
-            runtime decides how each action executes: AWS Lambda in production,
-            Node on your machine, the browser in your app.
+            Your logic is a generator function (a <em>story</em>) that yields
+            typed actions, never a platform API. A processor per platform
+            decides how each action actually runs: Lambda, a container, the
+            browser.
           </p>
 
           <div className="hero__cta">
-            <a className="btn btn--primary" href="#stories">
-              Get started
+            <InstallChip />
+            <a className="btn btn--ghost" href="#loop">
+              See how it works
               <span className="btn__arrow">→</span>
             </a>
-            <InstallChip />
           </div>
 
-          <div className="hero__meta">
+          <p className="hero__meta">
             <span>MIT licensed</span>
-            <span>zero side effects</span>
-            <span>deploys itself with CDK</span>
-          </div>
+            <span>zero side effects in your logic</span>
+            <span>infrastructure from config</span>
+          </p>
         </div>
 
-        <div ref={panelRef} className="hero__panel">
+        <div className="hero__panel">
           <CodeWindow />
         </div>
-      </div>
-
-      <div aria-hidden="true" className="hero__fade" />
-    </section>
+      </section>
+    </>
   );
 }