@tokenoftrust/storefront-runner 1.3.2 → 1.3.4-rc.2

package/apps/storefront/src/middleware/index.ts

@@ -29,7 +29,7 @@ import {
   resolveCustomizationEnv,
   buildCsp,
   STOREFRONT_CSP_ALLOWLIST,
-  foxyCspAdditions,
+  checkoutCspAdditions,
   CSP_REPORT_GROUP,
   CSP_REPORT_PATH,
   readPublishedArtifact,
@@ -39,7 +39,7 @@ import {
   capabilitiesArtifactPath,
 } from "@tot/public-runtime";
 import type { CapabilityConfig } from "@tot/public-runtime";
-import { resolveTenantCommerce } from "@/lib/foxyCommerce";
+import { resolveTenantCommerce } from "@/lib/checkoutCommerce";
 import { evaluateDemoGate, hostInGateList } from "@/lib/demoGate";
 import {
   evaluateLoginGate,
@@ -51,6 +51,7 @@ import {
 import { gatedHoldingResponse } from "@/lib/auth/gatePage";
 import { readSession, KvSessionStore, SESSION_COOKIE } from "@/lib/auth/session";
 import { isMaintenanceOn, maintenanceResponse } from "@/lib/maintenance";
+import { HEALTH_PATH, healthResponse } from "@/lib/health";
 import { membershipFor } from "@/lib/dashboard/tenantSelection";
 import type { DeepPartial, ThemeTokens } from "@tot/public-runtime";
 
@@ -60,6 +61,14 @@ export const onRequest = defineMiddleware(async (context, next) => {
   const host =
     request.headers.get("host") ?? url.host ?? "localhost";
 
+  // ---- /health — liveness + deploy-identity probe ---------------------------
+  // Answered FIRST: before tenant resolution, the access gate, the maintenance
+  // kill-switch, and the edge cache — so it reports the running build's commit SHA
+  // regardless of Host, an unresolved tenant, or a closed site. See lib/health.
+  if (url.pathname === HEALTH_PATH) {
+    return healthResponse();
+  }
+
   // ---- Site maintenance kill-switch (fail-safe full close) ------------------
   // MAINTENANCE_MODE=1 takes the ENTIRE site offline (every host + path) with a
   // static "Coming Soon" holding page, BEFORE tenant resolution, the access
@@ -324,7 +333,7 @@ export const onRequest = defineMiddleware(async (context, next) => {
   // read these instead of hard-coding tenant identity checks.
   locals.features = resolveTenantFeatures(tenant);
   locals.capabilities = capabilities;
-  // FoxyCart cart/checkout facts (Track A) — only when the tenant has a catalog
+  // Cart/checkout facts (Track A) — only when the tenant has a catalog
   // AND the cartCheckout capability is enabled for THIS environment. Drives the
   // loader + signed add-to-cart, and the CSP additions below.
   const commerce =
@@ -356,6 +365,14 @@ export const onRequest = defineMiddleware(async (context, next) => {
   // the tenant prefix on the client.
   locals.basePath = basePath;
 
+  // /dev was renamed to /cockpit (2026-07-20). 302-redirect any old /dev link —
+  // host-routed (/dev) or path-routed (/<vendor>/dev) — to the new path, preserving
+  // the tenant prefix + query. Temporary (302) while the cockpit UX is still evolving.
+  if (renderPath === "/dev" || renderPath.startsWith("/dev/")) {
+    const rest = renderPath.slice("/dev".length); // "" or "/sub…"
+    return Response.redirect(`${url.origin}${basePath}/cockpit${rest}${url.search}`, 302);
+  }
+
   // When a /<domain>/ prefix selected the tenant, rewrite to the stripped route
   // so the existing file-based routes match. next(path) rewrites WITHOUT
   // re-running middleware, so the locals set above are preserved.
@@ -406,10 +423,10 @@ export const onRequest = defineMiddleware(async (context, next) => {
     "Reporting-Endpoints",
     `${CSP_REPORT_GROUP}="${CSP_REPORT_PATH}"`,
   );
-  // FoxyCart origins (loader CDN + the store's cart/checkout host) added to the
+  // Checkout origins (loader CDN + the store's cart/checkout host) added to the
   // strict policy only when this tenant has a store — so add-to-cart, the
   // sidecart iframe/XHR, and the cross-origin form POST all pass.
-  const foxyCsp = commerce ? foxyCspAdditions(commerce.origin) : null;
+  const checkoutCsp = commerce ? checkoutCspAdditions(commerce.origin) : null;
   response.headers.set(
     cspHeader,
     buildCsp({
@@ -420,21 +437,21 @@ export const onRequest = defineMiddleware(async (context, next) => {
       scriptSrc: [
         ...STOREFRONT_CSP_ALLOWLIST.scriptSrc,
         ...STATIC_SCRIPT_HASHES,
-        ...(foxyCsp?.scriptSrc ?? []),
+        ...(checkoutCsp?.scriptSrc ?? []),
       ],
       styleSrc: [
         ...STOREFRONT_CSP_ALLOWLIST.styleSrc,
         ...STATIC_STYLE_HASHES,
-        ...(foxyCsp?.styleSrc ?? []),
+        ...(checkoutCsp?.styleSrc ?? []),
       ],
-      fontSrc: [...STOREFRONT_CSP_ALLOWLIST.fontSrc, ...(foxyCsp?.fontSrc ?? [])],
+      fontSrc: [...STOREFRONT_CSP_ALLOWLIST.fontSrc, ...(checkoutCsp?.fontSrc ?? [])],
       connectSrc: [
         ...STOREFRONT_CSP_ALLOWLIST.connectSrc,
-        ...(foxyCsp?.connectSrc ?? []),
+        ...(checkoutCsp?.connectSrc ?? []),
       ],
-      imgSrc: [...STOREFRONT_CSP_ALLOWLIST.imgSrc, ...(foxyCsp?.imgSrc ?? [])],
-      frameSrc: foxyCsp?.frameSrc ?? [],
-      formAction: foxyCsp?.formAction ?? [],
+      imgSrc: [...STOREFRONT_CSP_ALLOWLIST.imgSrc, ...(checkoutCsp?.imgSrc ?? [])],
+      frameSrc: checkoutCsp?.frameSrc ?? [],
+      formAction: checkoutCsp?.formAction ?? [],
       reportGroup: CSP_REPORT_GROUP,
       reportUri: CSP_REPORT_PATH,
     }),

package/apps/storefront/src/pages/[...slug].astro

@@ -9,7 +9,7 @@ import Layout from "@/layouts/Layout.astro";
 import Breadcrumbs from "@/components/Breadcrumbs.astro";
 import { breadcrumbLd } from "@/lib/jsonld";
 import { truncate } from "@/lib/format";
-import { rawHtmlResponse } from "@/lib/rawMarketingHtml";
+import { rawHtmlPolicy, rawHtmlResponse } from "@/lib/rawMarketingHtml";
 
 const { tenant, canonicalBase, content, basePath } = Astro.locals;
 const slug = (Astro.params.slug ?? "").replace(/^\/+|\/+$/g, "");
@@ -34,12 +34,11 @@ if (slug === "_style-guide" || slug.startsWith("_style-guide/")) {
 }
 
 // Raw tenant-authored marketing subpage (vendor-injected HTML) — serve the
-// self-contained document VERBATIM, bypassing the block Layout, with the request
-// CSP nonce stamped onto its first-party inline <style>/<script>. Same path as the
-// raw home in index.astro. Middleware still applies canonical host, security
-// headers, CSP, and (prod) the edge cache.
+// self-contained document VERBATIM only when rawHtmlPolicy says this tenant may
+// bypass Layout. Regulated commerce tenants fall through to platform-composed
+// pages so compliance UI cannot be removed by raw HTML.
 const rawHtml = await content.getPageHtml(slug);
-if (rawHtml) {
+if (rawHtml && rawHtmlPolicy(tenant).allowed) {
   // Shared chrome: a body-only fragment gets wrapped in the tenant's chrome.html;
   // a full document serves verbatim (backward-compatible). See rawMarketingHtml.ts.
   const chromeWrapper = await content.getChromeHtml();

package/apps/storefront/src/pages/admin.astro

@@ -12,7 +12,7 @@
  *
  * SHELL CONTRACT — every AdminXTab.astro component mounted below must preserve:
  *   - A `<section id="{tab}" data-admin-panel data-agent-scope="{tab}">` root,
- *     where {tab} is one of: orders, products, customers, fulfillment,
+ *     where {tab} is one of: orders, products, subscriptions, customers, fulfillment,
  *     reporting, ai-workflows, settings. The shell's hash router shows/hides
  *     panels by matching `html[data-admin-tab]` to this id, and the AI Ask
  *     envelope reads `data-agent-scope` to label its active context.
@@ -35,6 +35,7 @@ import AdminFulfillmentTab from "../components/admin/AdminFulfillmentTab.astro";
 import AdminAIWorkflowsTab from "../components/admin/AdminAIWorkflowsTab.astro";
 import OrdersWorkspace from "../components/admin/orders/OrdersWorkspace.astro";
 import AdminProductsTab from "../components/admin/AdminProductsTab.astro";
+import AdminSubscriptionsTab from "../components/admin/AdminSubscriptionsTab.astro";
 import AdminReportingTab from "../components/admin/AdminReportingTab.astro";
 import AdminSettingsTab from "../components/admin/AdminSettingsTab.astro";
 import { readViewerSession } from "@/lib/auth/route";
@@ -79,7 +80,7 @@ const { envelope: tenantEnvelope, isStaff, pickerTenants, deniedTarget } = admin
     <title>{tenantLabel} Admin</title>
     <script is:inline nonce={cspNonce}>
       (() => {
-        const adminTabs = ["orders", "products", "customers", "fulfillment", "reporting", "ai-workflows", "settings"];
+        const adminTabs = ["orders", "products", "subscriptions", "customers", "fulfillment", "reporting", "ai-workflows", "settings"];
         const canViewInternalGuide = document.documentElement.dataset.internalAdminGuide === "true";
         const defaultTab = canViewInternalGuide ? "orders" : "settings";
         const hash = window.location.hash.slice(1);
@@ -502,6 +503,7 @@ const { envelope: tenantEnvelope, isStaff, pickerTenants, deniedTarget } = admin
 
       html.admin-tabs-ready[data-admin-mode="work-area"][data-admin-tab="orders"] #orders,
       html.admin-tabs-ready[data-admin-mode="work-area"][data-admin-tab="products"] #products,
+      html.admin-tabs-ready[data-admin-mode="work-area"][data-admin-tab="subscriptions"] #subscriptions,
       html.admin-tabs-ready[data-admin-mode="work-area"][data-admin-tab="customers"] #customers,
       html.admin-tabs-ready[data-admin-mode="work-area"][data-admin-tab="fulfillment"] #fulfillment,
       html.admin-tabs-ready[data-admin-mode="work-area"][data-admin-tab="reporting"] #reporting,
@@ -1126,6 +1128,7 @@ const { envelope: tenantEnvelope, isStaff, pickerTenants, deniedTarget } = admin
         <nav class="nav">
           <a href="#orders" data-admin-tab-link><svg><use href="#i-file"></use></svg><span>Orders</span></a>
           <a href="#products" data-admin-tab-link><svg><use href="#i-box"></use></svg><span>Products</span></a>
+          <a href="#subscriptions" data-admin-tab-link><svg><use href="#i-refresh"></use></svg><span>Subscriptions</span></a>
           <a href="#customers" data-admin-tab-link><svg><use href="#i-users"></use></svg><span>Customers</span></a>
           <a href="#fulfillment" data-admin-tab-link><svg><use href="#i-truck"></use></svg><span>Fulfillment</span></a>
           <a href="#reporting" data-admin-tab-link><svg><use href="#i-chart"></use></svg><span>Reporting</span></a>
@@ -1151,6 +1154,7 @@ const { envelope: tenantEnvelope, isStaff, pickerTenants, deniedTarget } = admin
         <div class="tabs mobile-tabbar" role="tablist" aria-label="Admin work areas">
           <a class="tab" href="#orders" role="tab" aria-controls="orders" aria-selected="false" data-admin-tab-link>Orders</a>
           <a class="tab" href="#products" role="tab" aria-controls="products" aria-selected="false" data-admin-tab-link>Products</a>
+          <a class="tab" href="#subscriptions" role="tab" aria-controls="subscriptions" aria-selected="false" data-admin-tab-link>Subscriptions</a>
           <a class="tab" href="#customers" role="tab" aria-controls="customers" aria-selected="false" data-admin-tab-link>Customers</a>
           <a class="tab" href="#fulfillment" role="tab" aria-controls="fulfillment" aria-selected="false" data-admin-tab-link>Fulfillment</a>
           <a class="tab" href="#reporting" role="tab" aria-controls="reporting" aria-selected="false" data-admin-tab-link>Reporting</a>
@@ -1197,6 +1201,7 @@ const { envelope: tenantEnvelope, isStaff, pickerTenants, deniedTarget } = admin
                 <div class="tabs admin-tabs" role="tablist" aria-label="Admin work areas">
                   <a id="admin-tab-orders" class="tab active" href="#orders" role="tab" aria-controls="orders" aria-selected="true" data-admin-tab-link>Orders</a>
                   <a id="admin-tab-products" class="tab" href="#products" role="tab" aria-controls="products" aria-selected="false" data-admin-tab-link>Products</a>
+                  <a id="admin-tab-subscriptions" class="tab" href="#subscriptions" role="tab" aria-controls="subscriptions" aria-selected="false" data-admin-tab-link>Subscriptions</a>
                   <a id="admin-tab-customers" class="tab" href="#customers" role="tab" aria-controls="customers" aria-selected="false" data-admin-tab-link>Customers</a>
                   <a id="admin-tab-fulfillment" class="tab" href="#fulfillment" role="tab" aria-controls="fulfillment" aria-selected="false" data-admin-tab-link>Fulfillment</a>
                   <a id="admin-tab-reporting" class="tab" href="#reporting" role="tab" aria-controls="reporting" aria-selected="false" data-admin-tab-link>Reporting</a>
@@ -1321,6 +1326,7 @@ const { envelope: tenantEnvelope, isStaff, pickerTenants, deniedTarget } = admin
 
           <OrdersWorkspace envelope={tenantEnvelope} />
           <AdminProductsTab envelope={tenantEnvelope} />
+          <AdminSubscriptionsTab envelope={tenantEnvelope} />
           <AdminCustomersTab envelope={tenantEnvelope} />
           <AdminFulfillmentTab envelope={tenantEnvelope} />
           <AdminReportingTab envelope={tenantEnvelope} />
@@ -1441,7 +1447,7 @@ const { envelope: tenantEnvelope, isStaff, pickerTenants, deniedTarget } = admin
 
     <script is:inline nonce={cspNonce}>
       (() => {
-        const tabIds = ["orders", "products", "customers", "fulfillment", "reporting", "ai-workflows", "settings"];
+        const tabIds = ["orders", "products", "subscriptions", "customers", "fulfillment", "reporting", "ai-workflows", "settings"];
         const tabSet = new Set(tabIds);
         const tabHashPattern = new RegExp(`^#(${tabIds.join("|")})$`);
         const canViewInternalGuide = document.documentElement.dataset.internalAdminGuide === "true";
@@ -1449,6 +1455,7 @@ const { envelope: tenantEnvelope, isStaff, pickerTenants, deniedTarget } = admin
         const askContexts = {
           orders: "Orders",
           products: "Products",
+          subscriptions: "Subscriptions",
           customers: "Customers",
           fulfillment: "Fulfillment",
           reporting: "Reporting",

package/apps/storefront/src/pages/api/admin/orders/[id].ts

@@ -1,15 +1,15 @@
 /**
  * `GET /api/admin/orders/:id` — one order's full detail for the Orders tab (U2).
  *
- * Server-side proxy to tot-foxycart `GET /commerce/orders/:orderId` for the
- * resolved tenant + env. Bearer stays server-side; response is the FoxyOrderDetail
+ * Server-side proxy to checkout `GET /commerce/orders/:orderId` for the
+ * resolved tenant + env. Bearer stays server-side; response is the CheckoutOrderDetail
  * DTO. `verificationDetail` is empty until U4 fills it — consumers tolerate that.
  * Read-only (scope-locks).
  */
 import type { APIContext } from "astro";
 import { readEnv } from "@/lib/env";
 import {
-  createFoxyOrderClient,
+  createCheckoutOrderClient,
   orderApiBaseUrl,
   OrderApiError,
 } from "@/lib/admin/orderClient";
@@ -37,7 +37,7 @@ export async function GET(context: APIContext): Promise<Response> {
   const bearer = await readEnv("FOXY_ORDER_API_KEY");
   if (!bearer) return jsonError("not_provisioned", 503);
 
-  const client = createFoxyOrderClient({
+  const client = createCheckoutOrderClient({
     baseUrl: orderApiBaseUrl(customizationEnv),
     appDomain: tenant.appDomain,
     bearer,

package/apps/storefront/src/pages/api/admin/orders.ts

@@ -1,7 +1,7 @@
 /**
  * `GET /api/admin/orders` — internal admin route backing the Orders tab (U2).
  *
- * Server-side proxy to tot-foxycart's order READ API for the resolved tenant +
+ * Server-side proxy to the checkout order READ API for the resolved tenant +
  * environment. The per-tenant bearer key stays on the Worker (never in the
  * response); the browser only ever sees order DTO JSON. Read-only (scope-locks).
  * U3 consumes this and maps the DTO → OrdersViewModel.
@@ -10,10 +10,10 @@
  * host/approver layer) — same posture as `api/evidence.json.ts`; no new gate here.
  */
 import type { APIContext } from "astro";
-import type { FoxyOrderListFilters } from "@tot/public-runtime";
+import type { CheckoutOrderListFilters } from "@tot/public-runtime";
 import { readEnv } from "@/lib/env";
 import {
-  createFoxyOrderClient,
+  createCheckoutOrderClient,
   orderApiBaseUrl,
   OrderApiError,
 } from "@/lib/admin/orderClient";
@@ -46,7 +46,7 @@ export async function GET(context: APIContext): Promise<Response> {
   const url = new URL(context.request.url);
   const q = url.searchParams;
   const limitRaw = q.get("limit");
-  const filters: FoxyOrderListFilters = {
+  const filters: CheckoutOrderListFilters = {
     queue: q.get("queue") ?? undefined,
     status: q.get("status") ?? undefined,
     from: q.get("from") ?? undefined,
@@ -55,7 +55,7 @@ export async function GET(context: APIContext): Promise<Response> {
     cursor: q.get("cursor") ?? undefined,
   };
 
-  const client = createFoxyOrderClient({
+  const client = createCheckoutOrderClient({
     baseUrl: orderApiBaseUrl(customizationEnv),
     appDomain: tenant.appDomain,
     bearer,

package/apps/storefront/src/pages/api/auth/magic-exchange.ts

@@ -24,16 +24,19 @@ import {
   sessionFromFederatedClaims,
 } from "@/lib/auth/identityToken";
 import { createSession, DEFAULT_SESSION_TTL_SECONDS } from "@/lib/auth/session";
+import { normalizeEmailHint } from "@/lib/privacy/emailHint";
 
 export const prerender = false;
 
 /** Back to the landing page carrying an error (no token in the URL on failure). */
 function magicRedirect(
   context: APIContext,
-  params: { error?: string; next?: string },
+  params: { error?: string; next?: string; tenant?: string; emailHint?: string },
 ): Response {
   const q = new URLSearchParams();
   if (params.error) q.set("error", params.error);
+  if (params.tenant) q.set("tenant", params.tenant);
+  if (params.emailHint) q.set("email_hint", params.emailHint);
   if (params.next && params.next !== "/dashboard") q.set("next", params.next);
   const qs = q.toString();
   return context.redirect(`/auth/magic${qs ? `?${qs}` : ""}`, 303);
@@ -42,19 +45,23 @@ function magicRedirect(
 export async function POST(context: APIContext): Promise<Response> {
   let token = "";
   let next = "/dashboard";
+  let tenant = "";
+  let emailHint = "";
   try {
     const form = await context.request.formData();
     token = String(form.get("token") ?? "").trim();
+    tenant = String(form.get("tenant") ?? "").trim().toLowerCase();
+    emailHint = normalizeEmailHint(String(form.get("email_hint") ?? "")) ?? "";
     next = safeNext(String(form.get("next") ?? "/dashboard"));
   } catch {
     return magicRedirect(context, { error: "invalid", next });
   }
-  if (!token) return magicRedirect(context, { error: "missing", next });
+  if (!token) return magicRedirect(context, { error: "missing", tenant, emailHint, next });
 
   const client = await getAccessClient();
   const store = await getSessionStore();
   if (!client || !store) {
-    return magicRedirect(context, { error: "unconfigured", next });
+    return magicRedirect(context, { error: "unconfigured", tenant, emailHint, next });
   }
 
   // Consume the token (single-use; burned server-side by tot20).
@@ -62,19 +69,19 @@ export async function POST(context: APIContext): Promise<Response> {
   if (!result.ok) {
     // reason ∈ invalid|expired|error (tot20's "used" normalizes to invalid).
     const error = result.reason === "expired" ? "expired" : "invalid";
-    return magicRedirect(context, { error, next });
+    return magicRedirect(context, { error, tenant, emailHint, next });
   }
 
   // Prove authorization offline — fail closed with no flat-JSON fallback.
   const idToken = result.id_token;
   if (!idToken) {
     console.error("auth/magic-exchange: no id_token on exchange; failing closed");
-    return magicRedirect(context, { error: "verify_failed", next });
+    return magicRedirect(context, { error: "verify_failed", tenant, emailHint, next });
   }
   const verifier = await getFederatedVerifier();
   if (!verifier) {
     console.error("auth/magic-exchange: federated verifier unconfigured");
-    return magicRedirect(context, { error: "unconfigured", next });
+    return magicRedirect(context, { error: "unconfigured", tenant, emailHint, next });
   }
 
   let derived;
@@ -85,7 +92,7 @@ export async function POST(context: APIContext): Promise<Response> {
     console.error("auth/magic-exchange: id_token verification failed; failing closed", {
       error: err instanceof Error ? err.message : String(err),
     });
-    return magicRedirect(context, { error: "verify_failed", next });
+    return magicRedirect(context, { error: "verify_failed", tenant, emailHint, next });
   }
 
   const nowSeconds = Math.floor(Date.now() / 1000);

package/apps/storefront/src/pages/api/checkout-style.css.ts

@@ -1,17 +1,17 @@
 /**
  * `GET /api/checkout-style.css` — the stable, per-tenant storefront URL that hosts
  * the published checkout styling as `text/css`. This URL is what U11's publisher
- * points FoxyCart's checkout-template `content_url` at (PUT /theme/foxy) and what
- * Foxy fetches server-side when it (re)caches the checkout template.
+ * points hosted checkout's `content_url` at and what checkout fetches server-side
+ * when it (re)caches the checkout template.
  *
- * The tenant + environment are self-identifying from the request Host (Foxy's
+ * The tenant + environment are self-identifying from the request Host (checkout's
  * fetch carries no session): the middleware resolves `locals.tenant` +
  * `locals.customizationEnv`, and we serve exactly that tenant's published style
  * for that env (live on prod hosts, test behind a preview token). Falls back to
  * the neutral DEFAULT_CHECKOUT_STYLE tokens when nothing is published, so the URL
  * is always a valid, non-empty stylesheet.
  *
- * ASCII-safety (Foxy cache is not Unicode-safe) is enforced inside
+ * ASCII-safety (checkout cache is not Unicode-safe) is enforced inside
  * buildCheckoutStyleCss. No secrets, no cross-service call — read-only from KV.
  */
 import type { APIContext } from "astro";
@@ -34,7 +34,7 @@ export async function GET(context: APIContext): Promise<Response> {
   return new Response(css, {
     headers: {
       "content-type": "text/css; charset=utf-8",
-      // Foxy caches on its side via /theme/foxy/refresh; keep the origin fresh so
+      // Checkout caches on its side via the theme refresh; keep the origin fresh so
       // a re-cache always pulls the latest published styling.
       "cache-control": "no-store",
       "x-robots-tag": "noindex, nofollow",

package/apps/storefront/src/pages/auth/login.astro

@@ -10,12 +10,15 @@
  * (tot20 sends/verifies the code, the storefront mints the session). No secrets
  * reach the browser. Inline style carries the per-request CSP nonce.
  */
+import { normalizeEmailHint } from "@/lib/privacy/emailHint";
+
 export const prerender = false;
 
 const cspNonce = Astro.locals.cspNonce;
 const url = new URL(Astro.request.url);
 const sent = url.searchParams.get("sent") === "1";
 const email = (url.searchParams.get("email") ?? "").trim();
+const emailHint = normalizeEmailHint(url.searchParams.get("email_hint")) ?? "";
 const errorCode = url.searchParams.get("error");
 const next = (() => {
   const n = url.searchParams.get("next") ?? "/";
@@ -132,7 +135,7 @@ if (devMode) {
       ) : (
         <>
           <h1>Sign in</h1>
-          <p class="sub"><span class="who">Token of Trust© Regulated Storefront</span> is in early access. Enter your email — if you have access, we'll send a one-time code.</p>
+          <p class="sub"><span class="who">Token of Trust© Regulated Storefront</span> is in early access. Enter your email — if you have access, we'll send a one-time code.{emailHint ? <> Use the invite email hinted as <span class="who">{emailHint}</span>.</> : null}</p>
           <form method="post" action="/api/auth/send">
             <input type="hidden" name="next" value={next} />
             <label for="email">Work email</label>