Two AT Proto client demos that share one login workflow and both talk to the loggedin.fyi Cloudflare Worker.
They must be two origins. Logging into Lightbox heartbeats a DID; Cratewalk can then offer that account as a normal OAuth hint.
Rendering mermaid diagram...
| Demo | HTTP file | Planned subdomain | After login |
|---|---|---|---|
| A · Lightbox | lightbox.ts | lightbox-loggedin.val.run | Images from the current feed, plus a feed picker |
| B · Cratewalk | cratewalk.ts | cratewalk-loggedin.val.run | Posts arrive in Habbo-style boxes on a half-width conveyor |
Copy this folder into two Val Town vals (or remix twice). Mark lightbox.ts as the HTTP trigger in one and cratewalk.ts in the other.
Claim kebab-case subdomains:
lightbox-loggedincratewalk-loggedin
If a name is taken, add a random 1–100 suffix and update allowlist.json.
Each val needs a cookie secret of at least 32 characters:
👉 Add COOKIE_SECRET here: https://www.val.town/x/HANDLE/VAL_NAME/environment-variables?key=COOKIE_SECRET
Optional:
👉 Add PUBLIC_BASE_URL here: https://www.val.town/x/HANDLE/VAL_NAME/environment-variables?key=PUBLIC_BASE_URL
👉 Add LOGGEDIN_ORIGIN here: https://www.val.town/x/HANDLE/VAL_NAME/environment-variables?key=LOGGEDIN_ORIGIN
👉 Add SISTER_APP_URL here: https://www.val.town/x/HANDLE/VAL_NAME/environment-variables?key=SISTER_APP_URL
| Key | Default | Notes |
|---|---|---|
COOKIE_SECRET | — | Required. 32+ random characters. |
PUBLIC_BASE_URL | request origin | Set to https://lightbox-loggedin.val.run (or Cratewalk) after the subdomain is claimed. This is the OAuth client_id origin. |
LOGGEDIN_ORIGIN | https://loggedin.fyi | Use http://localhost:8787 against a local Worker. |
SISTER_APP_URL | unset | The other demo’s URL, for the header link. |
Replace HANDLE/VAL_NAME with each val after it exists.
Add both production origins to the Worker allowlist before the embed can heartbeat or list accounts. The repo already has:
https://lightbox-loggedin.val.runhttps://cratewalk-loggedin.val.run
If you use generated *.web.val.run URLs, put those origins in allowlist.json and redeploy the Worker.
node val-town/preview/serve.mjs
Then open http://localhost:4173/?authed=1 (Lightbox) and http://localhost:4174/?authed=0 (Cratewalk login). Preview talks to https://loggedin-fyi.polished-bird-a3ae.workers.dev unless LOGGEDIN_ORIGIN is set.
Both apps:
- Show a handle field and Sign in with Bluesky (
GET /login?handle=…→ PDS OAuth). - Embed
LOGGEDIN_ORIGIN/embedand render hinted DIDs from the Worker. - Heartbeat the signed-in DID (Chrome silent path). On Safari / iOS,
heartbeat()opens a first-party/savewindow;/enrollremains as a fallback. - Fetch the home timeline or a picked generator through the user’s PDS (
atproto-proxyto the Bluesky AppView).