@blamejs/blamejs-shop 0.3.20 → 0.3.22

package/CHANGELOG.md

@@ -8,6 +8,10 @@ upgrading across more than a few patches at a time.
 
 ## v0.3.x
 
+- v0.3.22 (2026-05-30) — **Create and publish content pages (About, Shipping, Returns, and the like) from the admin console.** The shop now has editable content pages. An admin Pages screen lets an operator create a page with a slug, title, Markdown body, layout, and meta fields, then publish, unpublish, archive, or restore it — and the storefront serves each published page at /pages/<slug>. Previously the content-page backend existed but had no admin screen and the storefront did not serve it, so it could not be used; a page is created as a draft and is not visible on the storefront until it is published. **Added:** *Content pages: author in the console, serve on the storefront* — A new Pages admin screen manages content pages through their full lifecycle (draft, published, archived, with restore). Published pages are served at /pages/<slug> with the page's chosen layout; a draft or archived slug returns not-found. The Markdown body is rendered with the same escaping and safe-link handling as the rest of the storefront. This makes a standard set of pages — about, shipping, returns, and similar — editable instead of requiring a code change.
+
+- v0.3.21 (2026-05-30) — **Customers can cancel an order from their account before it ships.** A signed-in customer can now cancel one of their own orders from the order page, as long as it has not started fulfillment. The Cancel control appears only while the order is still cancellable — a paid or pending order — and is absent once the order is fulfilling, shipped, delivered, already cancelled, or refunded. The action is tied to the signed-in customer, so a customer can only cancel their own order. Note: cancelling a paid order changes its status to cancelled but does not by itself refund the charge — issue the refund from the admin console as usual; a customer-initiated cancellation of a paid order is your signal to do so. **Added:** *Cancel an unfulfilled order from the account* — The order page now shows a Cancel button while an order is still in a pre-fulfillment state (paid or pending). Cancelling moves the order to cancelled and shows a confirmation; the control does not appear once an order is fulfilling, shipped, delivered, cancelled, or refunded, and a customer can only cancel their own order. A paid-order cancellation updates the status but does not automatically refund the captured payment — refund it from the console; treat a customer cancellation of a paid order as the prompt to do so.
+
 - v0.3.20 (2026-05-30) — **Served media carries hardened headers, primary-image changes are product-scoped, and image-by-URL imports are size-capped.** Three defense-in-depth fixes on product media. Media assets served from storage now carry X-Content-Type-Options: nosniff and Cross-Origin-Resource-Policy: same-origin, and SVG files additionally carry a content policy that prevents script from running when the file is opened directly while still rendering normally inside a product image. Setting a product's primary image now verifies the image actually belongs to the product named in the request rather than acting on the image alone. And importing a product image by URL now refuses a response larger than the same 10 MiB limit the file-upload path enforces, instead of buffering an unbounded download. **Changed:** *Setting the primary image is product-scoped* — The endpoint that makes an image a product's primary (hero) now verifies the image belongs to the product in the request path and returns not-found otherwise, instead of acting on the image regardless of the product named. A request whose product and image don't match is now rejected. · *Vendored runtime updated to v0.14.9* — The vendored blamejs runtime is updated to v0.14.9, a documentation-path and source-comment fix with no API, wire-format, or behavior changes. No operator action is required. **Security:** *Hardened response headers on served media* — Media served from storage now sets X-Content-Type-Options: nosniff and Cross-Origin-Resource-Policy: same-origin, so a mistyped or hostile upload can't be content-sniffed into something executable or embedded cross-origin. An SVG additionally carries a default-src 'none' sandbox content-security policy, so opening an SVG URL directly cannot run script (it still renders inside an img tag). This sits behind the existing SVG-upload sanitizer as a second layer. · *Importing an image by URL is size-capped* — Importing a product image from a URL now refuses a response larger than 10 MiB — the same limit a direct file upload uses — returning a clear error instead of buffering an unbounded download.
 
 - v0.3.19 (2026-05-30) — **Edit announcement bars, automatic-discount terms, and subscription plans from the console.** Three admin entities could be created but only partly edited from the console — the rest of their fields were reachable only through the API, so changing them meant archive-and-recreate or a manual API call. Each now has a detail screen with the full edit form. An announcement bar can have its message, links, schedule, audience, and dismissibility changed in place. An automatic discount can have its actual terms changed — the amount, percentage, threshold, or buy-x-get-y values — not just its title, priority, and on/off state. A subscription plan can have its price, billing interval, trial length, active state, and variant edited. Create and archive behavior is unchanged. **Fixed:** *Announcement bars are editable in place* — A detail screen now lets you change an announcement's message, link, theme, audience, start/end schedule, and whether it can be dismissed — instead of archiving it and creating a new one (which lost the slug and any recorded dismissal state). · *Automatic-discount terms are editable from the console* — The discount detail screen now edits the rule's trigger and value — the amount off, percent off, cart threshold, or buy-x-get-y terms — which previously could only be changed through the API. The inline priority and on/off controls are unchanged. · *Subscription plans have an edit screen* — A subscription plan's price, billing interval count, trial length, active state, and variant can now be edited from a detail screen. The Stripe-bound fields (the price id, interval unit, and currency) remain read-only, as they were always immutable.

package/lib/admin.js

@@ -510,7 +510,7 @@ function mount(router, deps) {
   // `reports` is always present in the nav (read-only sales summary needs no
   // extra dep); its route mounts unconditionally and renders an unconfigured
   // notice when the salesReports primitive isn't wired.
-  var navAvailable = { returns: !!returns, reviews: !!reviews, productQa: !!productQa, subscriptions: !!deps.subscriptions, webhooks: !!deps.webhooks, collections: !!deps.collections, customers: !!deps.customers, giftcards: !!deps.giftcards, announcementBar: !!deps.announcementBar, blog: !!deps.blog, customerSurveys: !!deps.customerSurveys, businessHours: !!deps.businessHours, taxRates: !!deps.taxRates, shippingZones: !!deps.shippingZones, autoDiscount: !!deps.autoDiscount, discountAllocation: !!deps.discountAllocation, quantityDiscounts: !!deps.quantityDiscounts, pickLists: !!pickLists, salesTaxFilings: !!salesTaxFilings, shippingLabels: !!shippingLabels };
+  var navAvailable = { returns: !!returns, reviews: !!reviews, productQa: !!productQa, subscriptions: !!deps.subscriptions, webhooks: !!deps.webhooks, collections: !!deps.collections, customers: !!deps.customers, giftcards: !!deps.giftcards, announcementBar: !!deps.announcementBar, blog: !!deps.blog, customerSurveys: !!deps.customerSurveys, storefrontPages: !!deps.storefrontPages, businessHours: !!deps.businessHours, taxRates: !!deps.taxRates, shippingZones: !!deps.shippingZones, autoDiscount: !!deps.autoDiscount, discountAllocation: !!deps.discountAllocation, quantityDiscounts: !!deps.quantityDiscounts, pickLists: !!pickLists, salesTaxFilings: !!salesTaxFilings, shippingLabels: !!shippingLabels };
 
   try { b.audit.registerNamespace(AUDIT_NAMESPACE); } catch (_e) { /* idempotent */ }
 
@@ -4356,6 +4356,238 @@ function mount(router, deps) {
     _blogTransition("archive", function (s) { return blog.archive(s); });
   }
 
+  // ---- storefront pages -----------------------------------------------
+  // Author the operator's CMS content pages (About, Shipping, Returns,
+  // Privacy, Terms, and the long tail every shop needs). The edge Worker
+  // serves the customer-facing page at /pages/:slug, reading ONLY
+  // published rows; this console writes them. A page is created as a draft
+  // and stays invisible to the storefront until it's published — publish /
+  // unpublish / archive / restore move it through the lifecycle (draft →
+  // published → archived, with restore back to draft). Content-negotiated
+  // like the other screens: bearer → the JSON contract; signed-in browser
+  // → the HTML list + author forms.
+  if (deps.storefrontPages) {
+    var pages = deps.storefrontPages;
+
+    // The list pulls each lifecycle state separately (the primitive has
+    // listDrafts / listArchived + listPublished, each returning an array)
+    // and merges them for the console table. The console doesn't page the
+    // page corpus — operators have a handful of content pages.
+    async function _pageRows(filter) {
+      var drafts    = await pages.listDrafts();
+      var archived  = await pages.listArchived();
+      var published = await pages.listPublished();
+      if (filter === "draft")     return drafts;
+      if (filter === "published") return published;
+      if (filter === "archived")  return archived;
+      // All: published first (newest-live), then drafts, then archived.
+      return published.concat(drafts).concat(archived);
+    }
+
+    router.get("/admin/pages", _pageOrApi(true,
+      R(async function (req, res) {
+        var url = req.url ? new URL(req.url, "http://localhost") : null;
+        var status = (url && url.searchParams.get("status")) || null;
+        _json(res, 200, { rows: await _pageRows(status) });
+      }),
+      async function (req, res) {
+        var url = req.url ? new URL(req.url, "http://localhost") : null;
+        var status = (url && url.searchParams.get("status")) || null;
+        var rows = await _pageRows(status);
+        _sendHtml(res, 200, renderAdminPages({
+          shop_name: deps.shop_name, nav_available: navAvailable, pages: rows,
+          status_filter: status,
+          created:   url && url.searchParams.get("created"),
+          updated:   url && url.searchParams.get("updated"),
+          published: url && url.searchParams.get("published"),
+          archived:  url && url.searchParams.get("archived"),
+          notice:    (url && url.searchParams.get("err")) ? "That action couldn't be completed for the page." : null,
+        }));
+      },
+    ));
+
+    // The new-page form. A standalone GET so the "New page" button on the
+    // list has a target; the create POST lives at /admin/pages.
+    router.get("/admin/pages/new", _pageOrApi(true,
+      R(async function (_req, res) {
+        return _problem(res, 405, "use-canonical-endpoint", "POST /admin/pages with a JSON body to create a page");
+      }),
+      async function (_req, res) {
+        _sendHtml(res, 200, renderAdminPageDetail({
+          shop_name: deps.shop_name, nav_available: navAvailable, page: null,
+        }));
+      },
+    ));
+
+    // Create content-negotiates: bearer → JSON 201 (a draft row); browser
+    // form → defineDraft, then PRG to the page's detail screen to keep
+    // authoring. Every page is born a DRAFT — never published on create —
+    // so it can't reach the storefront before the operator publishes it.
+    router.post("/admin/pages", _pageOrApi(false,
+      W("page.create", async function (req, res) {
+        var row = await pages.defineDraft(req.body || {});
+        _json(res, 201, row);
+        return { id: row.slug };
+      }),
+      async function (req, res) {
+        var made;
+        try {
+          made = await pages.defineDraft(_pageFromForm(req.body || {}));
+        } catch (e) {
+          var n = _safeNotice(e, "page.create");
+          return _sendHtml(res, n.status, renderAdminPageDetail({
+            shop_name: deps.shop_name, nav_available: navAvailable, page: null,
+            form_values: req.body || {},
+            notice: n.message.replace(/^storefrontPages[.:]\s*/, ""),
+          }));
+        }
+        b.audit.safeEmit({ action: AUDIT_NAMESPACE + ".page.create", outcome: "success", metadata: { slug: made.slug } });
+        _redirect(res, "/admin/pages/" + encodeURIComponent(made.slug) + "?created=1");
+      },
+    ));
+
+    // Detail content-negotiates: bearer → JSON (the row, any status);
+    // browser → the edit form + the lifecycle action buttons. A bad /
+    // unknown slug is a 404 page, never a 500.
+    router.get("/admin/pages/:slug", _pageOrApi(true,
+      R(async function (req, res) {
+        var row;
+        try { row = await pages.get(req.params.slug); }
+        catch (e) { if (e instanceof TypeError) return _problem(res, 404, "page-not-found", e.message); throw e; }
+        if (!row) return _problem(res, 404, "page-not-found");
+        _json(res, 200, row);
+      }),
+      async function (req, res) {
+        var url = req.url ? new URL(req.url, "http://localhost") : null;
+        var row;
+        try { row = await pages.get(req.params.slug); }
+        catch (e) { if (!(e instanceof TypeError)) throw e; row = null; }
+        if (!row) return _sendHtml(res, 404, renderAdminPages({
+          shop_name: deps.shop_name, nav_available: navAvailable, pages: [], notice: "Page not found.",
+        }));
+        _sendHtml(res, 200, renderAdminPageDetail({
+          shop_name: deps.shop_name, nav_available: navAvailable, page: row,
+          updated:   url && url.searchParams.get("updated"),
+          published: url && url.searchParams.get("published"),
+          notice:    (url && url.searchParams.get("err")) ? "That action couldn't be completed for the page." : null,
+        }));
+      },
+    ));
+
+    // Edit content-negotiates: bearer PATCH (the JSON contract) + browser
+    // POST /edit (HTML forms can't PATCH). Both patch the editable columns
+    // (title / body / meta / layout). Status is NOT editable here — it
+    // moves via the lifecycle routes below.
+    router.patch("/admin/pages/:slug", W("page.update", async function (req, res) {
+      var row;
+      try { row = await pages.update(req.params.slug, req.body || {}); }
+      catch (e) {
+        if (e instanceof TypeError) return _problem(res, 400, "bad-request", e.message);
+        throw e;
+      }
+      _json(res, 200, row);
+      return { id: row.slug };
+    }));
+
+    router.post("/admin/pages/:slug/edit", _pageOrApi(false,
+      W("page.update", async function (req, res) {
+        var row;
+        try { row = await pages.update(req.params.slug, req.body || {}); }
+        catch (e) {
+          if (e instanceof TypeError) return _problem(res, 400, "bad-request", e.message);
+          throw e;
+        }
+        _json(res, 200, row);
+        return { id: row.slug };
+      }),
+      async function (req, res) {
+        var slug = req.params.slug;
+        var enc  = encodeURIComponent(slug);
+        try {
+          await pages.update(slug, _pagePatchFromForm(req.body || {}));
+        } catch (e) {
+          var n = _safeNotice(e, "page.update");
+          var current = null;
+          try { current = await pages.get(slug); } catch (_e) { current = null; }
+          if (!current) return _redirect(res, "/admin/pages?err=1");
+          return _sendHtml(res, n.status, renderAdminPageDetail({
+            shop_name: deps.shop_name, nav_available: navAvailable, page: current,
+            notice: n.message.replace(/^storefrontPages[.:]\s*/, ""),
+          }));
+        }
+        b.audit.safeEmit({ action: AUDIT_NAMESPACE + ".page.update", outcome: "success", metadata: { slug: slug } });
+        _redirect(res, "/admin/pages/" + enc + "?updated=1");
+      },
+    ));
+
+    // Lifecycle transitions — each PRGs back to the detail. publish takes
+    // a draft live (now visible on the storefront); unpublish pulls it
+    // back to draft (gone from the storefront); restore returns an
+    // archived page to draft. An illegal transition (wrong from-state) or
+    // a missing slug throws a TypeError from the primitive — a ?err=1
+    // notice, never a 500.
+    function _pageTransition(action, fn) {
+      router.post("/admin/pages/:slug/" + action, _pageOrApi(false,
+        W("page." + action, async function (req, res) {
+          var row;
+          try { row = await fn(req.params.slug); }
+          catch (e) {
+            if (e instanceof TypeError) return _problem(res, 400, "bad-request", e.message);
+            throw e;
+          }
+          _json(res, 200, row);
+          return { id: row.slug };
+        }),
+        async function (req, res) {
+          var slug = req.params.slug;
+          var enc  = encodeURIComponent(slug);
+          try {
+            await fn(slug);
+          } catch (e) {
+            if (e instanceof TypeError) return _redirect(res, "/admin/pages/" + enc + "?err=1");
+            throw e;
+          }
+          b.audit.safeEmit({ action: AUDIT_NAMESPACE + ".page." + action, outcome: "success", metadata: { slug: slug } });
+          // archive lands back on the list (the page left the editable
+          // set); the others stay on the detail with a status banner.
+          if (action === "archive") return _redirect(res, "/admin/pages?archived=1");
+          _redirect(res, "/admin/pages/" + enc + (action === "publish" ? "?published=1" : "?updated=1"));
+        },
+      ));
+    }
+    _pageTransition("publish",   function (s) { return pages.publish(s); });
+    _pageTransition("unpublish", function (s) { return pages.unpublish(s); });
+    _pageTransition("restore",   function (s) { return pages.restore(s); });
+
+    // Archive removes the page from the live storefront and the editable
+    // set, so the browser path confirms first — the CSP forbids a client
+    // confirm() dialog. Reached by a GET link from the detail screen;
+    // bearer clients POST /archive directly.
+    router.get("/admin/pages/:slug/archive/confirm-page", _pageOrApi(true,
+      R(async function (_req, res) {
+        return _problem(res, 405, "use-canonical-endpoint", "POST /admin/pages/:slug/archive directly for the JSON API");
+      }),
+      async function (req, res) {
+        var slug = req.params.slug;
+        var enc  = encodeURIComponent(slug);
+        var row = null;
+        try { row = await pages.get(slug); }
+        catch (e) { if (!(e instanceof TypeError)) throw e; }
+        if (!row) return _redirect(res, "/admin/pages?err=1");
+        _sendHtml(res, 200, renderAdminConfirm({
+          shop_name: deps.shop_name, nav_available: navAvailable, active: "pages",
+          heading: "Archive this page?",
+          consequence: "Archiving removes the page from the live storefront. You can restore it to a draft later.",
+          detail: "Page: " + (row.title || slug) + ".",
+          action: "/admin/pages/" + _htmlEscape(enc) + "/archive",
+          confirm_label: "Archive page",
+          cancel_href: "/admin/pages/" + enc,
+        }));
+      },
+    ));
+    _pageTransition("archive", function (s) { return pages.archive(s); });
+  }
+
   // ---- customer surveys -----------------------------------------------
   // Define NPS/CSAT/CES/custom surveys, issue token invitations (the
   // plaintext link is shown once on issue), and read the rollup. The
@@ -6844,6 +7076,7 @@ var ADMIN_NAV_ITEMS = [
   { key: "pick-lists",   href: "/admin/pick-lists",   label: "Pick lists",   requires: "pickLists" },
   { key: "announcements", href: "/admin/announcements", label: "Announcements", requires: "announcementBar" },
   { key: "blog",         href: "/admin/blog",         label: "Blog",         requires: "blog" },
+  { key: "pages",        href: "/admin/pages",        label: "Pages",        requires: "storefrontPages" },
   { key: "surveys",      href: "/admin/surveys",      label: "Surveys",      requires: "customerSurveys" },
   { key: "hours",        href: "/admin/hours",        label: "Hours",        requires: "businessHours" },
   { key: "giftcards",    href: "/admin/gift-cards",    label: "Gift cards",   requires: "giftcards" },
@@ -9961,6 +10194,203 @@ function renderAdminBlogDetail(opts) {
   return _renderAdminShell(opts.shop_name, isNew ? "New post" : "Post " + a.slug, body, "blog", opts.nav_available);
 }
 
+// Coerce the create form into storefrontPages.defineDraft's shape: trimmed
+// slug, the required title/body, and the optional meta + layout fields (a
+// blank optional field is omitted so the primitive's default applies). The
+// primitive validates every field — this only shapes the form strings.
+function _pageFromForm(body) {
+  body = body || {};
+  var out = {
+    slug:  typeof body.slug === "string" ? body.slug.trim() : body.slug,
+    title: body.title,
+    body:  body.body,
+  };
+  var md = typeof body.meta_description === "string" ? body.meta_description.trim() : "";
+  if (md) out.meta_description = md;
+  var mk = typeof body.meta_keywords === "string" ? body.meta_keywords.trim() : "";
+  if (mk) out.meta_keywords = mk;
+  var layout = typeof body.layout === "string" ? body.layout.trim() : "";
+  if (layout) out.layout = layout;
+  return out;
+}
+
+// Coerce the edit form into a storefrontPages.update patch. Only the
+// columns the form carries are included; an empty optional meta field is
+// sent as "" so the operator can clear a previously-set meta line (the
+// primitive accepts an empty string for the nullable meta columns). Status
+// / slug are NOT here — status moves via the lifecycle routes; the slug is
+// the PK and immutable after create.
+function _pagePatchFromForm(body) {
+  body = body || {};
+  var patch = {};
+  if (typeof body.title === "string")            patch.title = body.title;
+  if (typeof body.body === "string")             patch.body = body.body;
+  if (typeof body.meta_description === "string") patch.meta_description = body.meta_description.trim();
+  if (typeof body.meta_keywords === "string")    patch.meta_keywords = body.meta_keywords.trim();
+  if (typeof body.layout === "string" && body.layout.trim()) patch.layout = body.layout.trim();
+  return patch;
+}
+
+// One status pill class per lifecycle state, reusing the order-status pill
+// palette: published = paid (green), draft = pending (amber), archived =
+// cancelled (grey). Mirrors the blog pill so the two content surfaces read
+// the same.
+function _pageStatusPill(status) {
+  var cls = status === "published" ? "paid" : status === "archived" ? "cancelled" : "pending";
+  return "<span class=\"status-pill " + cls + "\">" + _htmlEscape(status) + "</span>";
+}
+
+// Layout <select> — the closed enum the migration + primitive enforce.
+// `current` pre-selects the page's layout (default when absent).
+var _PAGE_LAYOUTS = ["default", "wide", "landing", "legal"];
+function _pageLayoutSelect(current) {
+  var sel = (typeof current === "string" && _PAGE_LAYOUTS.indexOf(current) !== -1) ? current : "default";
+  var opts = _PAGE_LAYOUTS.map(function (l) {
+    return "<option value=\"" + l + "\"" + (l === sel ? " selected" : "") + ">" + l + "</option>";
+  }).join("");
+  return "<label class=\"form-field\"><span>Layout</span>" +
+    "<select name=\"layout\">" + opts + "</select>" +
+    "<small>Picks the storefront wrapper: default, wide, landing, or legal.</small></label>";
+}
+
+function renderAdminPages(opts) {
+  opts = opts || {};
+  var rows = opts.pages || [];
+  var created   = opts.created   ? "<div class=\"banner banner--ok\">Page created as a draft.</div>" : "";
+  var updated   = opts.updated   ? "<div class=\"banner banner--ok\">Page saved.</div>" : "";
+  var published = opts.published ? "<div class=\"banner banner--ok\">Page published — it's live on the storefront.</div>" : "";
+  var archived  = opts.archived  ? "<div class=\"banner banner--ok\">Page archived.</div>" : "";
+  var notice    = opts.notice    ? "<div class=\"banner banner--err\">" + _htmlEscape(opts.notice) + "</div>" : "";
+
+  var sf = opts.status_filter;
+  var chips = "<div class=\"order-filters\">" +
+    "<a class=\"chip" + (sf == null ? " chip--on" : "") + "\" href=\"/admin/pages\">All</a>" +
+    "<a class=\"chip" + (sf === "published" ? " chip--on" : "") + "\" href=\"/admin/pages?status=published\">Published</a>" +
+    "<a class=\"chip" + (sf === "draft" ? " chip--on" : "") + "\" href=\"/admin/pages?status=draft\">Drafts</a>" +
+    "<a class=\"chip" + (sf === "archived" ? " chip--on" : "") + "\" href=\"/admin/pages?status=archived\">Archived</a>" +
+    "</div>";
+
+  var bodyRows = rows.map(function (p) {
+    var enc = encodeURIComponent(p.slug);
+    var date = p.published_at != null ? _fmtDate(p.published_at) : "—";
+    // Per-row lifecycle actions match the page's current state: a draft
+    // can publish; a published page can unpublish or archive; an archived
+    // page can restore. Edit is always offered.
+    var actions = "<a class=\"btn btn--ghost\" href=\"/admin/pages/" + _htmlEscape(enc) + "\">Edit</a>";
+    if (p.status === "draft") {
+      actions += "<form method=\"post\" action=\"/admin/pages/" + _htmlEscape(enc) + "/publish\" class=\"form-inline\">" +
+        "<button class=\"btn\" type=\"submit\">Publish</button></form>";
+    } else if (p.status === "published") {
+      actions += "<form method=\"post\" action=\"/admin/pages/" + _htmlEscape(enc) + "/unpublish\" class=\"form-inline\">" +
+        "<button class=\"btn btn--ghost\" type=\"submit\">Unpublish</button></form>" +
+        "<a class=\"btn btn--danger\" href=\"/admin/pages/" + _htmlEscape(enc) + "/archive/confirm-page\">Archive</a>";
+    } else if (p.status === "archived") {
+      actions += "<form method=\"post\" action=\"/admin/pages/" + _htmlEscape(enc) + "/restore\" class=\"form-inline\">" +
+        "<button class=\"btn btn--ghost\" type=\"submit\">Restore</button></form>";
+    }
+    return "<tr>" +
+      "<td><a href=\"/admin/pages/" + _htmlEscape(enc) + "\"><strong>" + _htmlEscape(p.title) + "</strong></a></td>" +
+      "<td><code class=\"order-id\">" + _htmlEscape(p.slug) + "</code></td>" +
+      "<td>" + _pageStatusPill(p.status) + "</td>" +
+      "<td>" + _htmlEscape(date) + "</td>" +
+      "<td><div class=\"actions-row\">" + actions + "</div></td>" +
+    "</tr>";
+  }).join("");
+
+  var table = rows.length
+    ? "<div class=\"panel\"><table><thead><tr><th scope=\"col\">Title</th><th scope=\"col\">Slug</th><th scope=\"col\">Status</th><th scope=\"col\">Published</th><th scope=\"col\">Actions</th></tr></thead><tbody>" + bodyRows + "</tbody></table></div>"
+    : "<p class=\"empty\">No pages" + (sf ? " " + _htmlEscape(sf) : " yet") + ". Write your first one.</p>";
+
+  var newBtn = "<div class=\"actions-row\"><a class=\"btn\" href=\"/admin/pages/new\">New page</a></div>";
+
+  var bodyHtml = "<section><h2>Pages</h2>" +
+    created + updated + published + archived + notice +
+    "<p class=\"meta\">Content pages shown on the storefront at /pages/&lt;slug&gt; (About, Shipping, Returns, and the like). A page is created as a draft and stays hidden until you publish it.</p>" +
+    newBtn + chips + table + "</section>";
+  return _renderAdminShell(opts.shop_name, "Pages", bodyHtml, "pages", opts.nav_available);
+}
+
+// New-page form (page: null) or edit form (page set) for a single content
+// page, plus the lifecycle action row when editing an existing page.
+// `form_values` re-fills a failed create so the operator doesn't retype.
+function renderAdminPageDetail(opts) {
+  opts = opts || {};
+  var p = opts.page || null;
+  var isNew = !p;
+  var fv = opts.form_values || {};
+  var updated   = opts.updated   ? "<div class=\"banner banner--ok\">Page saved.</div>" : "";
+  var published = opts.published ? "<div class=\"banner banner--ok\">Page published — it's live on the storefront.</div>" : "";
+  var notice    = opts.notice    ? "<div class=\"banner banner--err\">" + _htmlEscape(opts.notice) + "</div>" : "";
+
+  // Field values: the existing row when editing, else the failed-create
+  // form values, else blank.
+  function _val(col) {
+    if (p && p[col] != null) return p[col];
+    if (fv[col] != null) return fv[col];
+    return "";
+  }
+
+  var action = isNew ? "/admin/pages" : "/admin/pages/" + encodeURIComponent(p.slug) + "/edit";
+  // Slug is the PK — editable only on create (the primitive keys update on
+  // it). On edit it shows read-only so the operator sees the storefront URL.
+  var slugField = isNew
+    ? _setupField("Slug", "slug", _val("slug"), "text", "Letters, digits, dots, hyphens, underscores — appears in /pages/<slug>.", " maxlength=\"80\" required")
+    : "<label class=\"form-field\"><span>Slug</span><input type=\"text\" value=\"" + _htmlEscape(p.slug) + "\" readonly>" +
+        "<small>The storefront URL: <code>/pages/" + _htmlEscape(p.slug) + "</code></small></label>";
+
+  var form =
+    "<div class=\"panel mw-40\">" +
+      "<h3 class=\"subhead\">" + (isNew ? "New page" : "Page details") + "</h3>" +
+      "<form method=\"post\" action=\"" + _htmlEscape(action) + "\">" +
+        slugField +
+        _setupField("Title", "title", _val("title"), "text", "Shown as the page heading and the <title> tag.", " maxlength=\"200\" required") +
+        "<label class=\"form-field\"><span>Body (Markdown)</span>" +
+          "<textarea name=\"body\" rows=\"18\" maxlength=\"200000\" required>" + _htmlEscape(_val("body")) + "</textarea>" +
+          "<small>Headings, lists, links, bold/italic. Raw HTML is escaped — links are https-only or /-rooted.</small></label>" +
+        _pageLayoutSelect(p ? p.layout : (typeof fv.layout === "string" ? fv.layout : "default")) +
+        _setupField("Meta description (optional)", "meta_description", _val("meta_description"), "text", "Shown in search results + the page's <head>.", " maxlength=\"320\"") +
+        _setupField("Meta keywords (optional)", "meta_keywords", _val("meta_keywords"), "text", "", " maxlength=\"320\"") +
+        "<div class=\"actions-row\"><button class=\"btn\" type=\"submit\">" + (isNew ? "Create draft" : "Save") + "</button>" +
+          "<a class=\"btn btn--ghost\" href=\"/admin/pages\">Back</a></div>" +
+      "</form>" +
+    "</div>";
+
+  var lifecycle = "";
+  if (!isNew) {
+    var enc = encodeURIComponent(p.slug);
+    var btns = "";
+    if (p.status === "draft") {
+      btns = "<form method=\"post\" action=\"/admin/pages/" + _htmlEscape(enc) + "/publish\" class=\"form-inline\">" +
+        "<button class=\"btn\" type=\"submit\">Publish</button></form>" +
+        "<span class=\"meta\">Publishing makes the page live on the storefront.</span>";
+    } else if (p.status === "published") {
+      btns = "<form method=\"post\" action=\"/admin/pages/" + _htmlEscape(enc) + "/unpublish\" class=\"form-inline\">" +
+        "<button class=\"btn btn--ghost\" type=\"submit\">Unpublish</button></form>" +
+        "<a class=\"btn btn--danger\" href=\"/admin/pages/" + _htmlEscape(enc) + "/archive/confirm-page\">Archive</a>" +
+        "<span class=\"meta\">Unpublish pulls it back to a draft; archive removes it from the storefront.</span>";
+    } else if (p.status === "archived") {
+      btns = "<form method=\"post\" action=\"/admin/pages/" + _htmlEscape(enc) + "/restore\" class=\"form-inline\">" +
+        "<button class=\"btn btn--ghost\" type=\"submit\">Restore to draft</button></form>";
+    }
+    lifecycle = "<div class=\"panel mt-1 mw-40\"><h3 class=\"subhead\">Status</h3>" +
+      "<p class=\"meta\">Current state: " + _pageStatusPill(p.status) + "</p>" +
+      "<div class=\"actions-row\">" + btns + "</div></div>";
+  }
+
+  var head = isNew
+    ? "<p class=\"meta\"><a href=\"/admin/pages\">&larr; Pages</a></p>"
+    : "<p class=\"meta\"><a href=\"/admin/pages\">&larr; Pages</a> · " +
+        _pageStatusPill(p.status) +
+        (p.status === "published"
+          ? " · <a href=\"/pages/" + _htmlEscape(encodeURIComponent(p.slug)) + "\" target=\"_blank\" rel=\"noreferrer\">View on storefront &rarr;</a>"
+          : "") +
+      "</p>";
+
+  var title = isNew ? "New page" : (p.title || p.slug);
+  var body = "<section><h2>" + _htmlEscape(title) + "</h2>" + updated + published + notice + head + form + "</section>" + lifecycle;
+  return _renderAdminShell(opts.shop_name, isNew ? "New page" : "Page " + p.slug, body, "pages", opts.nav_available);
+}
+
 // Standard question set per survey kind, so the console can create the
 // common surveys without a dynamic question builder (fully custom question
 // lists go through the JSON defineSurvey API). Each question carries a
@@ -10781,6 +11211,8 @@ module.exports = {
   renderAdminCollection:   renderAdminCollection,
   renderAdminBlog:         renderAdminBlog,
   renderAdminBlogDetail:   renderAdminBlogDetail,
+  renderAdminPages:        renderAdminPages,
+  renderAdminPageDetail:   renderAdminPageDetail,
   renderAdminGiftCards:    renderAdminGiftCards,
   renderAdminGiftCard:     renderAdminGiftCard,
   renderAdminTaxRates:     renderAdminTaxRates,

package/lib/asset-manifest.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.3.20",
+  "version": "0.3.22",
   "assets": {
     "css/admin.css": {
       "integrity": "sha384-1SIn6oAf1DjECbRfKENZasdKHJiywGdXR58wn0hsFGcdVHzUmvfgMkEz5ANIAZJ3",

package/lib/storefront.js

@@ -4569,6 +4569,20 @@ function _orderEligibleForReorder(status) {
   return status !== "pending";
 }
 
+// Cancel is offered only while the order is still pre-fulfillment: the
+// order FSM (lib/order.js) accepts the `cancel` event from `pending`
+// (awaiting capture) and `paid` (captured, not yet picked) only. Once
+// the warehouse starts fulfilling — and through shipped / delivered —
+// the order is no longer the customer's to cancel; the terminal off-ramps
+// (cancelled / refunded) have no cancel edge either. Keeping this in lock-
+// step with the FSM's cancel edges means the button never offers a
+// transition the primitive would refuse. A cancel on a `paid` order does
+// NOT void the captured charge — the FSM only moves the status — so a paid
+// cancel leaves the operator to issue the refund from the console.
+function _orderEligibleForCancel(status) {
+  return status === "pending" || status === "paid";
+}
+
 // Render the lifecycle timeline. Every step up to and including the
 // current status is marked done; the current step is also marked
 // current. A terminal off-ramp (refunded / cancelled) collapses the rail
@@ -4669,6 +4683,12 @@ function _orderActionsBlock(o) {
     btns.push(
       "<a class=\"btn-secondary order-action\" href=\"/account/orders/" + esc(String(o.id)) + "/return\">Request a return</a>");
   }
+  if (_orderEligibleForCancel(o.status)) {
+    btns.push(
+      "<form class=\"order-action\" method=\"post\" action=\"/orders/" + esc(String(o.id)) + "/cancel\">" +
+        "<button type=\"submit\" class=\"btn-ghost\">Cancel order</button>" +
+      "</form>");
+  }
   if (!btns.length) return "";
   return "<div class=\"order-page__actions\">" + btns.join("") + "</div>";
 }
@@ -4733,6 +4753,7 @@ function renderOrder(opts) {
       actions_html:        actionsHtml,
       can_return:          _orderEligibleForReturn(o.status),
       can_reorder:         _orderEligibleForReorder(o.status),
+      can_cancel:          _orderEligibleForCancel(o.status),
       recommendations:     recs,
       has_recommendations: recs.length > 0,
       asset_css_main:      opts.theme.assetUrl("css/main.css"),
@@ -4759,6 +4780,14 @@ function renderOrder(opts) {
   var reorderNotice = opts.reordered
     ? "<p class=\"form-notice form-notice--ok\" role=\"status\">Items from this order were added to your cart. <a href=\"/cart\">View cart →</a></p>"
     : "";
+  // Confirmation banner after a successful cancel (the POST redirects to
+  // ?cancelled=1). A paid order's captured charge is not auto-voided by the
+  // cancel — the refund is the operator's call from the console — so the
+  // copy stays neutral ("cancelled") rather than promising a refund the
+  // status transition didn't perform.
+  var cancelNotice = opts.cancelled
+    ? "<p class=\"form-notice form-notice--ok\" role=\"status\">This order has been cancelled.</p>"
+    : "";
   var body = _render(ORDER_PAGE, {
     order_id:  o.id,
     status:    o.status,
@@ -4768,7 +4797,7 @@ function renderOrder(opts) {
     shipping:  shipping,
     total:     total,
   }).replace("RAW_LINES", rows)
-    .replace("RAW_REORDER_NOTICE", reorderNotice)
+    .replace("RAW_REORDER_NOTICE", reorderNotice + cancelNotice)
     .replace("RAW_ORDER_TIMELINE", timelineHtml)
     .replace("RAW_ORDER_TRACKING", trackingHtml)
     .replace("RAW_ORDER_ACTIONS", actionsHtml)
@@ -8557,6 +8586,7 @@ function mount(router, deps) {
         recommendations: recommendations,
         shipments:       shipments,
         reordered:       ordUrl ? ordUrl.searchParams.get("reordered") === "1" : false,
+        cancelled:       ordUrl ? ordUrl.searchParams.get("cancelled") === "1" : false,
         shop_name:       shopName,
         theme:           theme,
       }));
@@ -10895,6 +10925,68 @@ function mount(router, deps) {
       res.setHeader && res.setHeader("location", "/orders/" + encodeURIComponent(o.id) + "?reordered=1");
       return res.end ? res.end() : res.send("");
     });
+
+    // POST /orders/:id/cancel — customer-initiated cancellation of an
+    // order that hasn't been fulfilled yet. The order FSM (lib/order.js)
+    // accepts the `cancel` event from `pending` and `paid` only; this
+    // route gates on the same eligibility (_orderEligibleForCancel) so a
+    // shipped / delivered / already-cancelled / refunded order can't be
+    // cancelled here. Two refusals guard against IDOR: the order must
+    // belong to the signed-in customer (a foreign or guest-owned order is
+    // a clean 404, never acted on and never leaked), and only then is the
+    // transition attempted. A cancel the FSM still refuses (a status that
+    // raced past `paid` between the page render and the POST) maps to a
+    // clean redirect back to the order rather than a 500. Cancelling a
+    // `paid` order moves the status only — the captured charge is NOT
+    // auto-voided by the transition, so the refund remains the operator's
+    // action from the console.
+    router.post("/orders/:order_id/cancel", async function (req, res) {
+      var orderId = req.params && req.params.order_id;
+      // Cancel is a logged-in-customer action — resolve the session first
+      // so an unauthenticated POST goes to login, never near the order.
+      var cancelAuth = _currentCustomerEnv(req);
+      if (!cancelAuth) {
+        res.status(303); res.setHeader && res.setHeader("location", "/account/login");
+        return res.end ? res.end() : res.send("");
+      }
+      var o;
+      try { o = orderId ? await deps.order.get(orderId) : null; }
+      catch (e) { if (e instanceof TypeError) { o = null; } else throw e; }
+      // Ownership gate against IDOR: a missing order, a malformed id, an
+      // order owned by another customer, OR a guest order with no owner
+      // all 404 — the cancel never touches an order the caller doesn't own.
+      if (!o || !o.customer_id || o.customer_id !== cancelAuth.customer_id) {
+        return _send(res, 404, renderNotFound({ shop_name: shopName, theme: theme }));
+      }
+      // Eligibility gate mirrors the FSM's cancel edges (pending | paid).
+      // A non-cancellable status (fulfilling / shipped / delivered /
+      // cancelled / refunded) bounces back to the order page unchanged —
+      // a clean 303, no transition attempted, no 500.
+      if (!_orderEligibleForCancel(o.status)) {
+        res.status(303);
+        res.setHeader && res.setHeader("location", "/orders/" + encodeURIComponent(o.id));
+        return res.end ? res.end() : res.send("");
+      }
+      try {
+        await deps.order.transition(o.id, "cancel", { reason: "customer-requested" });
+      } catch (e) {
+        // The FSM refuses the event (a status that advanced out of the
+        // cancellable window between render and POST). order.transition
+        // tags the refusal with .code = ORDER_TRANSITION_REFUSED; surface
+        // it as a clean redirect to the order page rather than a 500.
+        if (e && e.code === "ORDER_TRANSITION_REFUSED") {
+          res.status(303);
+          res.setHeader && res.setHeader("location", "/orders/" + encodeURIComponent(o.id));
+          return res.end ? res.end() : res.send("");
+        }
+        throw e;
+      }
+      // PRG back to the order page with a confirmation banner (a refresh
+      // doesn't re-fire the cancel).
+      res.status(303);
+      res.setHeader && res.setHeader("location", "/orders/" + encodeURIComponent(o.id) + "?cancelled=1");
+      return res.end ? res.end() : res.send("");
+    });
   }
 
   // POST /cart/lines — add a line. Reads variant_id + qty from the

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@blamejs/blamejs-shop",
-  "version": "0.3.20",
+  "version": "0.3.22",
   "description": "Open-source framework built on blamejs. Vendored stack, zero npm runtime deps, PQC-first crypto, security-on by default.",
   "main": "lib/index.js",
   "scripts": {