@aglyn/plugins-commerce 1.0.0-beta.143

package/src/lib/components/console/recovery-queue-card.component.js

@@ -0,0 +1,262 @@
+/**
+ * @license
+ * Copyright 2026 Aglyn LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */ 'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { CardDisplay } from "@aglyn/shared-ui-jsx";
+import { Chip, Divider, Stack, Typography } from "@mui/material";
+import { collection } from "firebase/firestore";
+import { useMemo } from "react";
+import { ceilingedWindow, collectionCeiling, useFirestore, useFirestoreCollection } from "@aglyn/tenant-feature-instance";
+import { pluginDocsHelp } from "@aglyn/aglyn";
+import { EntitlementUpsell, useCommerceEntitlement } from "./entitlement-gate.component.js";
+/** `process-abandoned.ts` waits this long before it will remind a checkout. */ const REMIND_AFTER_MS = 60 * 60 * 1000;
+/** …and gives up after this, marking the checkout `expired`. */ const GIVE_UP_AFTER_MS = 7 * 24 * 60 * 60 * 1000;
+const recoveryHelp = pluginDocsHelp('commerce', {
+    anchor: '#recovery-and-alerts',
+    title: 'Recovery & alerts',
+    excerpt: 'Shoppers who left a checkout unfinished, and shoppers waiting to be ' + 'told a sold-out product is back. Both are emailed automatically.'
+});
+const relative = (atMs)=>{
+    if (!atMs) return '—';
+    const minutes = Math.max(0, Math.round((Date.now() - atMs) / 60000));
+    if (minutes < 60) return `${minutes}m ago`;
+    const hours = Math.round(minutes / 60);
+    if (hours < 48) return `${hours}h ago`;
+    return `${Math.round(hours / 24)}d ago`;
+};
+/**
+ * How many documents each set of counters may be computed from.
+ *
+ * Every figure this card renders is a COUNT, so neither read can be paged — a
+ * tally over page one is not a tally. What makes a count trustworthy instead
+ * is that the walk reaching it is total, which is why both ask through
+ * `collectionCeiling` and order on the document name: an unordered cap returns
+ * a pseudo-random slice, and a count over a random slice is an undercount with
+ * nothing on screen to suggest it.
+ *
+ * These chips claim to mirror what `scanAbandonedCheckouts` will act on, so a
+ * ceiling that bites has to say so rather than quietly report a smaller queue
+ * than the job will find.
+ */ const CHECKOUT_CEILING = 200;
+const ALERT_CEILING = 200;
+/**
+ * Recovery & alerts (AGL-2227).
+ *
+ * Two queues the storefront fills and a background job drains, neither of
+ * which the console showed at all:
+ *
+ * - **Abandoned checkouts** — `hosts/{hostId}/checkouts` with `status: 'open'`.
+ *   `scanAbandonedCheckouts` emails one reminder per checkout that carries an
+ *   email and has been sitting for an hour, then stamps `remindedAtMs`.
+ * - **Back-in-stock alerts** — `hosts/{hostId}/restockAlerts` with a null
+ *   `notifiedAtMs`. `scanRestockAlerts` mails them once the product has stock.
+ *
+ * Both scans were dark until AGL-2227 put them on the platform job beat. That
+ * is the reason this card exists rather than only the wiring: a background job
+ * is the one surface with no user to notice it has stopped, so the merchant
+ * needs somewhere the queue depth is visible. A queue that is always empty and
+ * a queue that is never drained look identical from outside.
+ *
+ * Read-only, and deliberately so. The counts come from the same documents the
+ * scans read; nothing here writes, so this card cannot disagree with the job
+ * about what is owed. Sending is the job's to do — a "send now" button would
+ * be a second sender racing a beat that runs every 15 minutes, for a reminder
+ * the merchant cannot un-send.
+ *
+ * The abandoned half is entitlement-gated in place rather than gating the
+ * whole card: `abandonedCart` is Pro, back-in-stock alerts are on every plan
+ * that has commerce, and `EntitlementGatedCard` would have hidden the free
+ * half behind the paid one. `ready` is load-bearing for the same reason it is
+ * everywhere else — `checkEntitlement(undefined)` resolves the FREE tier, so
+ * refusing before the org doc lands accuses a paying customer.
+ */ export function RecoveryQueueCard(props) {
+    const { hostId } = props;
+    const firestore = useFirestore();
+    const { ready, entitled, upgradeHref, planLabel } = useCommerceEntitlement(hostId, 'abandonedCart');
+    const { data: checkoutDocs } = useFirestoreCollection(()=>collectionCeiling(collection(firestore, 'hosts', hostId, 'checkouts'), CHECKOUT_CEILING), [
+        firestore,
+        hostId
+    ], {
+        idField: '$id'
+    });
+    const { data: alertDocs } = useFirestoreCollection(()=>collectionCeiling(collection(firestore, 'hosts', hostId, 'restockAlerts'), ALERT_CEILING), [
+        firestore,
+        hostId
+    ], {
+        idField: '$id'
+    });
+    const checkoutWindow = useMemo(()=>ceilingedWindow(checkoutDocs != null ? checkoutDocs : undefined, CHECKOUT_CEILING), [
+        checkoutDocs
+    ]);
+    const alertWindow = useMemo(()=>ceilingedWindow(alertDocs != null ? alertDocs : undefined, ALERT_CEILING), [
+        alertDocs
+    ]);
+    const checkouts = useMemo(()=>{
+        const now = Date.now();
+        // The same three tests `scanAbandonedCheckouts` applies, in the same
+        // order, so the number here is the number the job will act on rather
+        // than a looser "open checkouts" count that would always read higher.
+        const open = checkoutWindow.rows.filter((row)=>row.status === 'open' && row.email);
+        return {
+            reminded: open.filter((row)=>row.remindedAtMs).length,
+            due: open.filter((row)=>{
+                var _row_createdAtMs, _row_createdAtMs1;
+                return !row.remindedAtMs && now - Number((_row_createdAtMs = row.createdAtMs) != null ? _row_createdAtMs : 0) >= REMIND_AFTER_MS && now - Number((_row_createdAtMs1 = row.createdAtMs) != null ? _row_createdAtMs1 : 0) <= GIVE_UP_AFTER_MS;
+            }).length,
+            waiting: open.filter((row)=>{
+                var _row_createdAtMs;
+                return !row.remindedAtMs && now - Number((_row_createdAtMs = row.createdAtMs) != null ? _row_createdAtMs : 0) < REMIND_AFTER_MS;
+            }).length,
+            recent: [
+                ...open
+            ].sort((a, b)=>{
+                var _b_createdAtMs, _a_createdAtMs;
+                return ((_b_createdAtMs = b.createdAtMs) != null ? _b_createdAtMs : 0) - ((_a_createdAtMs = a.createdAtMs) != null ? _a_createdAtMs : 0);
+            }).slice(0, 5)
+        };
+    }, [
+        checkoutWindow
+    ]);
+    const alerts = useMemo(()=>{
+        const rows = alertWindow.rows;
+        return {
+            pending: rows.filter((row)=>row.notifiedAtMs == null).length,
+            notified: rows.filter((row)=>row.notifiedAtMs != null && !row.skipped).length
+        };
+    }, [
+        alertWindow
+    ]);
+    return /*#__PURE__*/ _jsx(CardDisplay, {
+        header: 'Recovery & alerts',
+        help: recoveryHelp,
+        contentGutterX: true,
+        contentGutterY: true,
+        children: /*#__PURE__*/ _jsxs(Stack, {
+            spacing: 2,
+            children: [
+                /*#__PURE__*/ _jsxs(Stack, {
+                    spacing: 1,
+                    children: [
+                        /*#__PURE__*/ _jsx(Typography, {
+                            variant: "subtitle2",
+                            children: 'Abandoned checkouts'
+                        }),
+                        !ready ? /*#__PURE__*/ _jsx(Typography, {
+                            variant: "body2",
+                            color: "text.secondary",
+                            children: 'Checking your plan…'
+                        }) : entitled ? /*#__PURE__*/ _jsxs(_Fragment, {
+                            children: [
+                                /*#__PURE__*/ _jsxs(Stack, {
+                                    direction: "row",
+                                    spacing: 1,
+                                    useFlexGap: true,
+                                    sx: {
+                                        flexWrap: 'wrap'
+                                    },
+                                    children: [
+                                        /*#__PURE__*/ _jsx(Chip, {
+                                            size: "small",
+                                            color: checkouts.due ? 'warning' : 'default',
+                                            label: `${checkouts.due} due a reminder`
+                                        }),
+                                        /*#__PURE__*/ _jsx(Chip, {
+                                            size: "small",
+                                            label: `${checkouts.waiting} still within the first hour`
+                                        }),
+                                        /*#__PURE__*/ _jsx(Chip, {
+                                            size: "small",
+                                            color: checkouts.reminded ? 'success' : 'default',
+                                            label: `${checkouts.reminded} reminded`
+                                        })
+                                    ]
+                                }),
+                                checkoutWindow.truncated ? /*#__PURE__*/ _jsx(Typography, {
+                                    variant: "caption",
+                                    color: "text.secondary",
+                                    children: `Counted across ${CHECKOUT_CEILING} checkouts. The reminder job reads the rest; these figures do not.`
+                                }) : null,
+                                /*#__PURE__*/ _jsx(Typography, {
+                                    variant: "caption",
+                                    color: "text.secondary",
+                                    children: 'Reminders send automatically about 15 minutes after a ' + 'checkout has been idle for an hour. A checkout that is ' + 'completed stops reminding itself.'
+                                }),
+                                checkouts.recent.length ? /*#__PURE__*/ _jsx(Stack, {
+                                    spacing: 0.5,
+                                    children: checkouts.recent.map((row)=>/*#__PURE__*/ _jsx(Typography, {
+                                            variant: "body2",
+                                            children: `${row.email} · started ${relative(row.createdAtMs)}${row.remindedAtMs ? ` · reminded ${relative(row.remindedAtMs)}` : ''}`
+                                        }, row.$id))
+                                }) : /*#__PURE__*/ _jsx(Typography, {
+                                    variant: "body2",
+                                    color: "text.secondary",
+                                    children: 'No open checkouts with an email address.'
+                                })
+                            ]
+                        }) : /*#__PURE__*/ _jsx(EntitlementUpsell, {
+                            planLabel: planLabel,
+                            upgradeHref: upgradeHref,
+                            children: 'Abandoned checkout recovery emails a shopper who reached ' + 'checkout, entered their email and left, with a link straight ' + 'back to the cart they built.'
+                        })
+                    ]
+                }),
+                /*#__PURE__*/ _jsx(Divider, {}),
+                /*#__PURE__*/ _jsxs(Stack, {
+                    spacing: 1,
+                    children: [
+                        /*#__PURE__*/ _jsx(Typography, {
+                            variant: "subtitle2",
+                            children: 'Back-in-stock alerts'
+                        }),
+                        /*#__PURE__*/ _jsxs(Stack, {
+                            direction: "row",
+                            spacing: 1,
+                            useFlexGap: true,
+                            sx: {
+                                flexWrap: 'wrap'
+                            },
+                            children: [
+                                /*#__PURE__*/ _jsx(Chip, {
+                                    size: "small",
+                                    color: alerts.pending ? 'info' : 'default',
+                                    label: `${alerts.pending} shoppers waiting`
+                                }),
+                                /*#__PURE__*/ _jsx(Chip, {
+                                    size: "small",
+                                    label: `${alerts.notified} notified`
+                                })
+                            ]
+                        }),
+                        alertWindow.truncated ? /*#__PURE__*/ _jsx(Typography, {
+                            variant: "caption",
+                            color: "text.secondary",
+                            children: `Counted across ${ALERT_CEILING} alerts. The notify job reads the rest; these figures do not.`
+                        }) : null,
+                        /*#__PURE__*/ _jsx(Typography, {
+                            variant: "caption",
+                            color: "text.secondary",
+                            children: 'Anyone who used “Notify me when it’s back” on a sold-out ' + 'product is emailed once its stock goes above zero. Waiting ' + 'shoppers are a demand signal worth restocking against.'
+                        })
+                    ]
+                })
+            ]
+        })
+    });
+}
+RecoveryQueueCard.displayName = 'RecoveryQueueCard';
+export default RecoveryQueueCard;
+
+//# sourceMappingURL=recovery-queue-card.component.js.map

package/src/lib/components/console/recovery-queue-card.component.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../../libs/plugins/commerce/src/lib/components/console/recovery-queue-card.component.tsx"],"sourcesContent":["/**\n * @license\n * Copyright 2026 Aglyn LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *   http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n'use client'\n\nimport { CardDisplay } from '@aglyn/shared-ui-jsx'\nimport { Chip, Divider, Stack, Typography } from '@mui/material'\nimport { collection } from 'firebase/firestore'\nimport { useMemo } from 'react'\nimport {\n  ceilingedWindow,\n  collectionCeiling,\n  useFirestore,\n  useFirestoreCollection,\n} from '@aglyn/tenant-feature-instance'\nimport { pluginDocsHelp } from '@aglyn/aglyn'\nimport {\n  EntitlementUpsell,\n  useCommerceEntitlement,\n} from './entitlement-gate.component'\n\nexport interface RecoveryQueueCardProps {\n  hostId: string\n}\n\n/** `process-abandoned.ts` waits this long before it will remind a checkout. */\nconst REMIND_AFTER_MS = 60 * 60 * 1000\n/** …and gives up after this, marking the checkout `expired`. */\nconst GIVE_UP_AFTER_MS = 7 * 24 * 60 * 60 * 1000\n\nconst recoveryHelp = pluginDocsHelp('commerce', {\n  anchor: '#recovery-and-alerts',\n  title: 'Recovery & alerts',\n  excerpt:\n    'Shoppers who left a checkout unfinished, and shoppers waiting to be ' +\n    'told a sold-out product is back. Both are emailed automatically.',\n})\n\nconst relative = (atMs: number | undefined): string => {\n  if (!atMs) return '—'\n  const minutes = Math.max(0, Math.round((Date.now() - atMs) / 60_000))\n  if (minutes < 60) return `${minutes}m ago`\n  const hours = Math.round(minutes / 60)\n  if (hours < 48) return `${hours}h ago`\n  return `${Math.round(hours / 24)}d ago`\n}\n\n/**\n * How many documents each set of counters may be computed from.\n *\n * Every figure this card renders is a COUNT, so neither read can be paged — a\n * tally over page one is not a tally. What makes a count trustworthy instead\n * is that the walk reaching it is total, which is why both ask through\n * `collectionCeiling` and order on the document name: an unordered cap returns\n * a pseudo-random slice, and a count over a random slice is an undercount with\n * nothing on screen to suggest it.\n *\n * These chips claim to mirror what `scanAbandonedCheckouts` will act on, so a\n * ceiling that bites has to say so rather than quietly report a smaller queue\n * than the job will find.\n */\nconst CHECKOUT_CEILING = 200\nconst ALERT_CEILING = 200\n\n/**\n * Recovery & alerts (AGL-2227).\n *\n * Two queues the storefront fills and a background job drains, neither of\n * which the console showed at all:\n *\n * - **Abandoned checkouts** — `hosts/{hostId}/checkouts` with `status: 'open'`.\n *   `scanAbandonedCheckouts` emails one reminder per checkout that carries an\n *   email and has been sitting for an hour, then stamps `remindedAtMs`.\n * - **Back-in-stock alerts** — `hosts/{hostId}/restockAlerts` with a null\n *   `notifiedAtMs`. `scanRestockAlerts` mails them once the product has stock.\n *\n * Both scans were dark until AGL-2227 put them on the platform job beat. That\n * is the reason this card exists rather than only the wiring: a background job\n * is the one surface with no user to notice it has stopped, so the merchant\n * needs somewhere the queue depth is visible. A queue that is always empty and\n * a queue that is never drained look identical from outside.\n *\n * Read-only, and deliberately so. The counts come from the same documents the\n * scans read; nothing here writes, so this card cannot disagree with the job\n * about what is owed. Sending is the job's to do — a \"send now\" button would\n * be a second sender racing a beat that runs every 15 minutes, for a reminder\n * the merchant cannot un-send.\n *\n * The abandoned half is entitlement-gated in place rather than gating the\n * whole card: `abandonedCart` is Pro, back-in-stock alerts are on every plan\n * that has commerce, and `EntitlementGatedCard` would have hidden the free\n * half behind the paid one. `ready` is load-bearing for the same reason it is\n * everywhere else — `checkEntitlement(undefined)` resolves the FREE tier, so\n * refusing before the org doc lands accuses a paying customer.\n */\nexport function RecoveryQueueCard(props: RecoveryQueueCardProps) {\n  const { hostId } = props\n  const firestore = useFirestore()\n  const { ready, entitled, upgradeHref, planLabel } = useCommerceEntitlement(\n    hostId,\n    'abandonedCart',\n  )\n\n  const { data: checkoutDocs } = useFirestoreCollection<any>(\n    () =>\n      collectionCeiling(\n        collection(firestore, 'hosts', hostId, 'checkouts'),\n        CHECKOUT_CEILING,\n      ),\n    [firestore, hostId],\n    { idField: '$id' },\n  )\n  const { data: alertDocs } = useFirestoreCollection<any>(\n    () =>\n      collectionCeiling(\n        collection(firestore, 'hosts', hostId, 'restockAlerts'),\n        ALERT_CEILING,\n      ),\n    [firestore, hostId],\n    { idField: '$id' },\n  )\n  const checkoutWindow = useMemo(\n    () => ceilingedWindow<any>(checkoutDocs ?? undefined, CHECKOUT_CEILING),\n    [checkoutDocs],\n  )\n  const alertWindow = useMemo(\n    () => ceilingedWindow<any>(alertDocs ?? undefined, ALERT_CEILING),\n    [alertDocs],\n  )\n\n  const checkouts = useMemo(() => {\n    const now = Date.now()\n    // The same three tests `scanAbandonedCheckouts` applies, in the same\n    // order, so the number here is the number the job will act on rather\n    // than a looser \"open checkouts\" count that would always read higher.\n    const open = checkoutWindow.rows.filter(\n      (row: any) => row.status === 'open' && row.email,\n    )\n    return {\n      reminded: open.filter((row: any) => row.remindedAtMs).length,\n      due: open.filter(\n        (row: any) =>\n          !row.remindedAtMs &&\n          now - Number(row.createdAtMs ?? 0) >= REMIND_AFTER_MS &&\n          now - Number(row.createdAtMs ?? 0) <= GIVE_UP_AFTER_MS,\n      ).length,\n      waiting: open.filter(\n        (row: any) =>\n          !row.remindedAtMs &&\n          now - Number(row.createdAtMs ?? 0) < REMIND_AFTER_MS,\n      ).length,\n      recent: [...open]\n        .sort((a: any, b: any) => (b.createdAtMs ?? 0) - (a.createdAtMs ?? 0))\n        .slice(0, 5),\n    }\n  }, [checkoutWindow])\n\n  const alerts = useMemo(() => {\n    const rows = alertWindow.rows\n    return {\n      pending: rows.filter((row: any) => row.notifiedAtMs == null).length,\n      notified: rows.filter(\n        (row: any) => row.notifiedAtMs != null && !row.skipped,\n      ).length,\n    }\n  }, [alertWindow])\n\n  return (\n    <CardDisplay\n      header={'Recovery & alerts'}\n      help={recoveryHelp}\n      contentGutterX\n      contentGutterY\n    >\n      <Stack spacing={2}>\n        <Stack spacing={1}>\n          <Typography variant=\"subtitle2\">{'Abandoned checkouts'}</Typography>\n          {!ready ? (\n            <Typography variant=\"body2\" color=\"text.secondary\">\n              {'Checking your plan…'}\n            </Typography>\n          ) : entitled ? (\n            <>\n              <Stack direction=\"row\" spacing={1} useFlexGap sx={{ flexWrap: 'wrap' }}>\n                <Chip\n                  size=\"small\"\n                  color={checkouts.due ? 'warning' : 'default'}\n                  label={`${checkouts.due} due a reminder`}\n                />\n                <Chip\n                  size=\"small\"\n                  label={`${checkouts.waiting} still within the first hour`}\n                />\n                <Chip\n                  size=\"small\"\n                  color={checkouts.reminded ? 'success' : 'default'}\n                  label={`${checkouts.reminded} reminded`}\n                />\n              </Stack>\n              {checkoutWindow.truncated ? (\n                <Typography variant=\"caption\" color=\"text.secondary\">\n                  {`Counted across ${CHECKOUT_CEILING} checkouts. The reminder job reads the rest; these figures do not.`}\n                </Typography>\n              ) : null}\n              <Typography variant=\"caption\" color=\"text.secondary\">\n                {'Reminders send automatically about 15 minutes after a ' +\n                  'checkout has been idle for an hour. A checkout that is ' +\n                  'completed stops reminding itself.'}\n              </Typography>\n              {checkouts.recent.length ? (\n                <Stack spacing={0.5}>\n                  {checkouts.recent.map((row: any) => (\n                    <Typography key={row.$id} variant=\"body2\">\n                      {`${row.email} · started ${relative(row.createdAtMs)}${\n                        row.remindedAtMs\n                          ? ` · reminded ${relative(row.remindedAtMs)}`\n                          : ''\n                      }`}\n                    </Typography>\n                  ))}\n                </Stack>\n              ) : (\n                <Typography variant=\"body2\" color=\"text.secondary\">\n                  {'No open checkouts with an email address.'}\n                </Typography>\n              )}\n            </>\n          ) : (\n            <EntitlementUpsell planLabel={planLabel} upgradeHref={upgradeHref}>\n              {'Abandoned checkout recovery emails a shopper who reached ' +\n                'checkout, entered their email and left, with a link straight ' +\n                'back to the cart they built.'}\n            </EntitlementUpsell>\n          )}\n        </Stack>\n        <Divider />\n        <Stack spacing={1}>\n          <Typography variant=\"subtitle2\">{'Back-in-stock alerts'}</Typography>\n          <Stack direction=\"row\" spacing={1} useFlexGap sx={{ flexWrap: 'wrap' }}>\n            <Chip\n              size=\"small\"\n              color={alerts.pending ? 'info' : 'default'}\n              label={`${alerts.pending} shoppers waiting`}\n            />\n            <Chip size=\"small\" label={`${alerts.notified} notified`} />\n          </Stack>\n          {alertWindow.truncated ? (\n            <Typography variant=\"caption\" color=\"text.secondary\">\n              {`Counted across ${ALERT_CEILING} alerts. The notify job reads the rest; these figures do not.`}\n            </Typography>\n          ) : null}\n          <Typography variant=\"caption\" color=\"text.secondary\">\n            {'Anyone who used “Notify me when it’s back” on a sold-out ' +\n              'product is emailed once its stock goes above zero. Waiting ' +\n              'shoppers are a demand signal worth restocking against.'}\n          </Typography>\n        </Stack>\n      </Stack>\n    </CardDisplay>\n  )\n}\nRecoveryQueueCard.displayName = 'RecoveryQueueCard'\n\nexport default RecoveryQueueCard\n"],"names":["CardDisplay","Chip","Divider","Stack","Typography","collection","useMemo","ceilingedWindow","collectionCeiling","useFirestore","useFirestoreCollection","pluginDocsHelp","EntitlementUpsell","useCommerceEntitlement","REMIND_AFTER_MS","GIVE_UP_AFTER_MS","recoveryHelp","anchor","title","excerpt","relative","atMs","minutes","Math","max","round","Date","now","hours","CHECKOUT_CEILING","ALERT_CEILING","RecoveryQueueCard","props","hostId","firestore","ready","entitled","upgradeHref","planLabel","data","checkoutDocs","idField","alertDocs","checkoutWindow","undefined","alertWindow","checkouts","open","rows","filter","row","status","email","reminded","remindedAtMs","length","due","Number","createdAtMs","waiting","recent","sort","a","b","slice","alerts","pending","notifiedAtMs","notified","skipped","header","help","contentGutterX","contentGutterY","spacing","variant","color","direction","useFlexGap","sx","flexWrap","size","label","truncated","map","$id","displayName"],"mappings":"AAAA;;;;;;;;;;;;;;;CAeC,GACD;;AAEA,SAASA,WAAW,QAAQ,uBAAsB;AAClD,SAASC,IAAI,EAAEC,OAAO,EAAEC,KAAK,EAAEC,UAAU,QAAQ,gBAAe;AAChE,SAASC,UAAU,QAAQ,qBAAoB;AAC/C,SAASC,OAAO,QAAQ,QAAO;AAC/B,SACEC,eAAe,EACfC,iBAAiB,EACjBC,YAAY,EACZC,sBAAsB,QACjB,iCAAgC;AACvC,SAASC,cAAc,QAAQ,eAAc;AAC7C,SACEC,iBAAiB,EACjBC,sBAAsB,QACjB,kCAA8B;AAMrC,6EAA6E,GAC7E,MAAMC,kBAAkB,KAAK,KAAK;AAClC,8DAA8D,GAC9D,MAAMC,mBAAmB,IAAI,KAAK,KAAK,KAAK;AAE5C,MAAMC,eAAeL,eAAe,YAAY;IAC9CM,QAAQ;IACRC,OAAO;IACPC,SACE,yEACA;AACJ;AAEA,MAAMC,WAAW,CAACC;IAChB,IAAI,CAACA,MAAM,OAAO;IAClB,MAAMC,UAAUC,KAAKC,GAAG,CAAC,GAAGD,KAAKE,KAAK,CAAC,AAACC,CAAAA,KAAKC,GAAG,KAAKN,IAAG,IAAK;IAC7D,IAAIC,UAAU,IAAI,OAAO,GAAGA,QAAQ,KAAK,CAAC;IAC1C,MAAMM,QAAQL,KAAKE,KAAK,CAACH,UAAU;IACnC,IAAIM,QAAQ,IAAI,OAAO,GAAGA,MAAM,KAAK,CAAC;IACtC,OAAO,GAAGL,KAAKE,KAAK,CAACG,QAAQ,IAAI,KAAK,CAAC;AACzC;AAEA;;;;;;;;;;;;;CAaC,GACD,MAAMC,mBAAmB;AACzB,MAAMC,gBAAgB;AAEtB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8BC,GACD,OAAO,SAASC,kBAAkBC,KAA6B;IAC7D,MAAM,EAAEC,MAAM,EAAE,GAAGD;IACnB,MAAME,YAAYzB;IAClB,MAAM,EAAE0B,KAAK,EAAEC,QAAQ,EAAEC,WAAW,EAAEC,SAAS,EAAE,GAAGzB,uBAClDoB,QACA;IAGF,MAAM,EAAEM,MAAMC,YAAY,EAAE,GAAG9B,uBAC7B,IACEF,kBACEH,WAAW6B,WAAW,SAASD,QAAQ,cACvCJ,mBAEJ;QAACK;QAAWD;KAAO,EACnB;QAAEQ,SAAS;IAAM;IAEnB,MAAM,EAAEF,MAAMG,SAAS,EAAE,GAAGhC,uBAC1B,IACEF,kBACEH,WAAW6B,WAAW,SAASD,QAAQ,kBACvCH,gBAEJ;QAACI;QAAWD;KAAO,EACnB;QAAEQ,SAAS;IAAM;IAEnB,MAAME,iBAAiBrC,QACrB,IAAMC,gBAAqBiC,uBAAAA,eAAgBI,WAAWf,mBACtD;QAACW;KAAa;IAEhB,MAAMK,cAAcvC,QAClB,IAAMC,gBAAqBmC,oBAAAA,YAAaE,WAAWd,gBACnD;QAACY;KAAU;IAGb,MAAMI,YAAYxC,QAAQ;QACxB,MAAMqB,MAAMD,KAAKC,GAAG;QACpB,qEAAqE;QACrE,qEAAqE;QACrE,sEAAsE;QACtE,MAAMoB,OAAOJ,eAAeK,IAAI,CAACC,MAAM,CACrC,CAACC,MAAaA,IAAIC,MAAM,KAAK,UAAUD,IAAIE,KAAK;QAElD,OAAO;YACLC,UAAUN,KAAKE,MAAM,CAAC,CAACC,MAAaA,IAAII,YAAY,EAAEC,MAAM;YAC5DC,KAAKT,KAAKE,MAAM,CACd,CAACC;oBAEcA,kBACAA;uBAFb,CAACA,IAAII,YAAY,IACjB3B,MAAM8B,QAAOP,mBAAAA,IAAIQ,WAAW,YAAfR,mBAAmB,MAAMpC,mBACtCa,MAAM8B,QAAOP,oBAAAA,IAAIQ,WAAW,YAAfR,oBAAmB,MAAMnC;eACxCwC,MAAM;YACRI,SAASZ,KAAKE,MAAM,CAClB,CAACC;oBAEcA;uBADb,CAACA,IAAII,YAAY,IACjB3B,MAAM8B,QAAOP,mBAAAA,IAAIQ,WAAW,YAAfR,mBAAmB,KAAKpC;eACvCyC,MAAM;YACRK,QAAQ;mBAAIb;aAAK,CACdc,IAAI,CAAC,CAACC,GAAQC;oBAAYA,gBAAuBD;uBAAxB,EAACC,iBAAAA,EAAEL,WAAW,YAAbK,iBAAiB,OAAMD,iBAAAA,EAAEJ,WAAW,YAAbI,iBAAiB;eAClEE,KAAK,CAAC,GAAG;QACd;IACF,GAAG;QAACrB;KAAe;IAEnB,MAAMsB,SAAS3D,QAAQ;QACrB,MAAM0C,OAAOH,YAAYG,IAAI;QAC7B,OAAO;YACLkB,SAASlB,KAAKC,MAAM,CAAC,CAACC,MAAaA,IAAIiB,YAAY,IAAI,MAAMZ,MAAM;YACnEa,UAAUpB,KAAKC,MAAM,CACnB,CAACC,MAAaA,IAAIiB,YAAY,IAAI,QAAQ,CAACjB,IAAImB,OAAO,EACtDd,MAAM;QACV;IACF,GAAG;QAACV;KAAY;IAEhB,qBACE,KAAC7C;QACCsE,QAAQ;QACRC,MAAMvD;QACNwD,cAAc;QACdC,cAAc;kBAEd,cAAA,MAACtE;YAAMuE,SAAS;;8BACd,MAACvE;oBAAMuE,SAAS;;sCACd,KAACtE;4BAAWuE,SAAQ;sCAAa;;wBAChC,CAACxC,sBACA,KAAC/B;4BAAWuE,SAAQ;4BAAQC,OAAM;sCAC/B;6BAEDxC,yBACF;;8CACE,MAACjC;oCAAM0E,WAAU;oCAAMH,SAAS;oCAAGI,UAAU;oCAACC,IAAI;wCAAEC,UAAU;oCAAO;;sDACnE,KAAC/E;4CACCgF,MAAK;4CACLL,OAAO9B,UAAUU,GAAG,GAAG,YAAY;4CACnC0B,OAAO,GAAGpC,UAAUU,GAAG,CAAC,eAAe,CAAC;;sDAE1C,KAACvD;4CACCgF,MAAK;4CACLC,OAAO,GAAGpC,UAAUa,OAAO,CAAC,4BAA4B,CAAC;;sDAE3D,KAAC1D;4CACCgF,MAAK;4CACLL,OAAO9B,UAAUO,QAAQ,GAAG,YAAY;4CACxC6B,OAAO,GAAGpC,UAAUO,QAAQ,CAAC,SAAS,CAAC;;;;gCAG1CV,eAAewC,SAAS,iBACvB,KAAC/E;oCAAWuE,SAAQ;oCAAUC,OAAM;8CACjC,CAAC,eAAe,EAAE/C,iBAAiB,kEAAkE,CAAC;qCAEvG;8CACJ,KAACzB;oCAAWuE,SAAQ;oCAAUC,OAAM;8CACjC,2DACC,4DACA;;gCAEH9B,UAAUc,MAAM,CAACL,MAAM,iBACtB,KAACpD;oCAAMuE,SAAS;8CACb5B,UAAUc,MAAM,CAACwB,GAAG,CAAC,CAAClC,oBACrB,KAAC9C;4CAAyBuE,SAAQ;sDAC/B,GAAGzB,IAAIE,KAAK,CAAC,WAAW,EAAEhC,SAAS8B,IAAIQ,WAAW,IACjDR,IAAII,YAAY,GACZ,CAAC,YAAY,EAAElC,SAAS8B,IAAII,YAAY,GAAG,GAC3C,IACJ;2CALaJ,IAAImC,GAAG;mDAU5B,KAACjF;oCAAWuE,SAAQ;oCAAQC,OAAM;8CAC/B;;;2CAKP,KAAChE;4BAAkB0B,WAAWA;4BAAWD,aAAaA;sCACnD,8DACC,kEACA;;;;8BAIR,KAACnC;8BACD,MAACC;oBAAMuE,SAAS;;sCACd,KAACtE;4BAAWuE,SAAQ;sCAAa;;sCACjC,MAACxE;4BAAM0E,WAAU;4BAAMH,SAAS;4BAAGI,UAAU;4BAACC,IAAI;gCAAEC,UAAU;4BAAO;;8CACnE,KAAC/E;oCACCgF,MAAK;oCACLL,OAAOX,OAAOC,OAAO,GAAG,SAAS;oCACjCgB,OAAO,GAAGjB,OAAOC,OAAO,CAAC,iBAAiB,CAAC;;8CAE7C,KAACjE;oCAAKgF,MAAK;oCAAQC,OAAO,GAAGjB,OAAOG,QAAQ,CAAC,SAAS,CAAC;;;;wBAExDvB,YAAYsC,SAAS,iBACpB,KAAC/E;4BAAWuE,SAAQ;4BAAUC,OAAM;sCACjC,CAAC,eAAe,EAAE9C,cAAc,6DAA6D,CAAC;6BAE/F;sCACJ,KAAC1B;4BAAWuE,SAAQ;4BAAUC,OAAM;sCACjC,8DACC,gEACA;;;;;;;AAMd;AACA7C,kBAAkBuD,WAAW,GAAG;AAEhC,eAAevD,kBAAiB"}

package/src/lib/components/console/registers-card.component.d.ts

@@ -0,0 +1,21 @@
+export interface RegistersCardProps {
+    hostId: string;
+}
+/**
+ * POS registers (AGL-472): named registers under `hosts/{hostId}/registers`,
+ * capped by the plan's `posRegisters` quota (Pro 1, Business 2, Advanced 5)
+ * PLUS the register seats the org has allocated to this site out of the
+ * purchased $89/mo pool (AGL-1775). Creation rides the quota-enforcing
+ * resources API so the cap is authoritative; every POS sale stamps its
+ * register so takings are attributable.
+ *
+ * The add-on used to raise the org-level entitlement, which every site
+ * inherited — one purchase, `hostLimit` registers. It is a pool now, and the
+ * message below tells an owner which of the two things to do about an
+ * exhausted one: assign a seat they already own, or buy another.
+ */
+export declare function RegistersCard(props: RegistersCardProps): import("react").JSX.Element;
+export declare namespace RegistersCard {
+    var displayName: string;
+}
+export default RegistersCard;

package/src/lib/components/console/registers-card.component.js

@@ -0,0 +1,296 @@
+/**
+ * @license
+ * Copyright 2026 Aglyn LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */ 'use client';
+import { _ as _extends } from "@swc/helpers/_/_extends";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as Aglyn from "@aglyn/aglyn";
+import * as CommerceModel from "../../model/index.js";
+import { CardDisplay, useConfirmationContext } from "@aglyn/shared-ui-jsx";
+import { useSnackbar } from "@aglyn/shared-ui-snackstack";
+import { Button, Chip, MenuItem, Stack, TextField, Typography } from "@mui/material";
+import { collection, deleteDoc, doc, getCountFromServer, limit, query } from "firebase/firestore";
+import { useCallback, useEffect, useState } from "react";
+import { useFirestore, useFirestoreCollection, useHostResourceApi, useOrgPlan } from "@aglyn/tenant-feature-instance";
+import { pluginDocsHelp } from "@aglyn/aglyn";
+/**
+ * POS registers (AGL-472): named registers under `hosts/{hostId}/registers`,
+ * capped by the plan's `posRegisters` quota (Pro 1, Business 2, Advanced 5)
+ * PLUS the register seats the org has allocated to this site out of the
+ * purchased $89/mo pool (AGL-1775). Creation rides the quota-enforcing
+ * resources API so the cap is authoritative; every POS sale stamps its
+ * register so takings are attributable.
+ *
+ * The add-on used to raise the org-level entitlement, which every site
+ * inherited — one purchase, `hostLimit` registers. It is a pool now, and the
+ * message below tells an owner which of the two things to do about an
+ * exhausted one: assign a seat they already own, or buy another.
+ */ export function RegistersCard(props) {
+    const { hostId } = props;
+    const firestore = useFirestore();
+    const { enqueueSnackbar } = useSnackbar();
+    const { confirm } = useConfirmationContext();
+    const createHostResource = useHostResourceApi();
+    const { org, ready: planReady } = useOrgPlan(hostId);
+    const { data: registerDocs } = useFirestoreCollection(()=>query(collection(firestore, 'hosts', hostId, 'registers'), limit(25)), [
+        firestore,
+        hostId
+    ], {
+        idField: '$id'
+    });
+    const { data: locationDocs } = useFirestoreCollection(()=>query(collection(firestore, 'hosts', hostId, 'locations'), limit(25)), [
+        firestore,
+        hostId
+    ], {
+        idField: '$id'
+    });
+    const registers = [
+        ...registerDocs != null ? registerDocs : []
+    ].sort((a, b)=>{
+        var _a_name, _b_name;
+        return String((_a_name = a.name) != null ? _a_name : '').localeCompare(String((_b_name = b.name) != null ? _b_name : ''));
+    });
+    const locations = locationDocs != null ? locationDocs : [];
+    /**
+   * The register HEAD-COUNT is a server aggregate, not the length of the
+   * capped listener (AGL-1738, the ninth instance of AGL-1716's AGL-1706
+   * shape — filed as latent, made real when the clamp was declined).
+   *
+   * The listener is `limit(25)` and the stock `posRegisters` bands top out
+   * at agency's 20 — under the window — but the $89/mo register add-on is
+   * sold flat up to `POS_REGISTERS_ADDON_MAX` (50) on any plan carrying
+   * `pos`, so an agency org's effective limit reaches 70. From the 26th
+   * register the listener saturates and the card understated usage in the
+   * flattering direction while `api/hosts/resources`, which counts the
+   * collection, refused the add.
+   *
+   * Re-read after an add AND a delete: registers are hard-deleted here
+   * (like locations, unlike the soft-deleting cards), so a removal really
+   * does free a slot on both sides, and a one-shot that missed it would
+   * keep refusing.
+   */ const [registerCountEpoch, setRegisterCountEpoch] = useState(0);
+    const [serverRegisterCount, setServerRegisterCount] = useState(null);
+    useEffect(()=>{
+        let active = true;
+        void getCountFromServer(collection(firestore, 'hosts', hostId, 'registers')).then((snapshot)=>{
+            if (active) setServerRegisterCount(snapshot.data().count);
+        }).catch(()=>{
+        // Falls back to the loaded rows — a LOWER bound and the prior
+        // behaviour, never 0, which reads as "no registers used" on a site
+        // that is over its cap.
+        });
+        return ()=>{
+            active = false;
+        };
+    }, [
+        firestore,
+        hostId,
+        registerCountEpoch
+    ]);
+    const registerCount = serverRegisterCount != null ? serverRegisterCount : registers.length;
+    // Per SITE (AGL-1775), not the org-level value: the plan's cap plus this
+    // host's allocated seats. The allocation rides the SAME org doc `useOrgPlan`
+    // already returns, so there is no second read to be loading or to fail —
+    // and an unallocated (or not-yet-arrived) org resolves to the plan cap,
+    // never to the pool.
+    const quota = Aglyn.checkHostRegisterQuota(org, hostId, registerCount);
+    const registerPool = Aglyn.resolveRegisterSeatPool(org);
+    // Registers beyond the plan cap (e.g. after a downgrade) can't transact —
+    // pos-order.ts blocks them by creation rank (AGL-482); mirror that here.
+    //
+    // Only once the org doc has arrived (AGL-1064). An absent org resolves to
+    // the free tier's `posRegisters: 0`, which would badge EVERY register
+    // "Over plan limit" for the first render or two of every mount.
+    const withinCap = planReady ? CommerceModel.registersWithinCap(registers, quota.limit) : new Set(registers.map((register)=>register.$id));
+    const [name, setName] = useState('');
+    const [locationId, setLocationId] = useState('');
+    const handleAdd = useCallback(async ()=>{
+        if (!name.trim()) return;
+        // The button is disabled until the plan is known; this guards the case
+        // where a click and the org doc race (AGL-1064).
+        if (!planReady) return;
+        if (!quota.allowed) {
+            // Three different answers, because the fix differs (AGL-1775). An
+            // exhausted POOL is a purchase; an UNASSIGNED seat the org already owns
+            // is a click, and telling that owner to buy another would sell them a
+            // register they are already paying for.
+            return void enqueueSnackbar(quota.limit === 0 ? 'POS registers require the Pro plan or above — see Billing' : registerPool.available > 0 ? `This site can run ${quota.limit} register${quota.limit === 1 ? '' : 's'} — you have ${registerPool.available} unassigned register seat${registerPool.available === 1 ? '' : 's'}; assign one to this site in Billing → Add-ons` : `This site can run ${quota.limit} register${quota.limit === 1 ? '' : 's'} and every purchased seat is assigned — add another from ` + 'Billing → Add-ons ($89/mo each)', {
+                variant: 'info',
+                persist: false
+            });
+        }
+        try {
+            // Creation rides the quota-enforcing resources API (AGL-472/473).
+            await createHostResource({
+                hostId,
+                resource: 'register',
+                data: _extends({
+                    name: name.trim().slice(0, 80)
+                }, locationId ? {
+                    locationId
+                } : {})
+            });
+            setName('');
+            setLocationId('');
+            setRegisterCountEpoch((epoch)=>epoch + 1);
+        } catch (error) {
+            var _ref;
+            enqueueSnackbar((_ref = error == null ? void 0 : error.message) != null ? _ref : 'Could not add register', {
+                variant: 'warning',
+                persist: false
+            });
+        }
+    }, [
+        name,
+        locationId,
+        planReady,
+        quota,
+        hostId,
+        createHostResource,
+        enqueueSnackbar
+    ]);
+    const handleDelete = useCallback((register)=>async ()=>{
+            const confirmed = await confirm({
+                title: 'Remove this register?',
+                description: `"${register.name}" stops being available at checkout. Past ` + 'sales keep their register tag.',
+                confirmationText: 'Remove',
+                confirmationButtonProps: {
+                    color: 'error'
+                }
+            }).then(()=>true).catch(()=>false);
+            if (!confirmed) return;
+            await deleteDoc(doc(firestore, 'hosts', hostId, 'registers', register.$id));
+            // A HARD delete, so the slot really is freed on both sides — the
+            // one-shot aggregate has to be told (AGL-1716/AGL-1738).
+            setRegisterCountEpoch((epoch)=>epoch + 1);
+        }, [
+        confirm,
+        firestore,
+        hostId
+    ]);
+    const locationName = (id)=>{
+        var _locations_find;
+        return (_locations_find = locations.find((location)=>location.$id === id)) == null ? void 0 : _locations_find.name;
+    };
+    return /*#__PURE__*/ _jsx(CardDisplay, {
+        header: 'POS registers',
+        help: pluginDocsHelp('pos', {
+            anchor: '#registers'
+        }),
+        contentGutterX: true,
+        contentGutterY: true,
+        children: /*#__PURE__*/ _jsxs(Stack, {
+            spacing: 1,
+            children: [
+                registers.length === 0 ? /*#__PURE__*/ _jsx(Typography, {
+                    variant: "body2",
+                    color: "text.secondary",
+                    children: 'Name each till or device that takes in-person payments. Every ' + 'POS sale is tagged with its register for end-of-day takings.'
+                }) : registers.map((register)=>{
+                    const overCap = !withinCap.has(register.$id);
+                    return /*#__PURE__*/ _jsxs(Stack, {
+                        direction: "row",
+                        spacing: 1,
+                        sx: {
+                            alignItems: 'center',
+                            opacity: overCap ? 0.6 : 1
+                        },
+                        children: [
+                            /*#__PURE__*/ _jsxs(Typography, {
+                                variant: "body2",
+                                sx: {
+                                    flex: 1
+                                },
+                                noWrap: true,
+                                children: [
+                                    register.name,
+                                    register.locationId && locationName(register.locationId) ? /*#__PURE__*/ _jsx(Typography, {
+                                        component: "span",
+                                        variant: "caption",
+                                        color: "text.secondary",
+                                        children: ` · ${locationName(register.locationId)}`
+                                    }) : null
+                                ]
+                            }),
+                            overCap ? /*#__PURE__*/ _jsx(Chip, {
+                                label: "Over plan limit",
+                                size: "small",
+                                color: "warning",
+                                variant: "outlined"
+                            }) : null,
+                            /*#__PURE__*/ _jsx(Button, {
+                                size: "small",
+                                color: "error",
+                                onClick: handleDelete(register),
+                                children: 'Remove'
+                            })
+                        ]
+                    }, register.$id);
+                }),
+                /*#__PURE__*/ _jsxs(Stack, {
+                    direction: "row",
+                    spacing: 1,
+                    children: [
+                        /*#__PURE__*/ _jsx(TextField, {
+                            label: "New register",
+                            value: name,
+                            onChange: (event)=>setName(event.target.value),
+                            size: "small",
+                            sx: {
+                                flex: 1
+                            },
+                            placeholder: "Front counter"
+                        }),
+                        locations.length > 1 ? /*#__PURE__*/ _jsxs(TextField, {
+                            select: true,
+                            label: "Location",
+                            value: locationId,
+                            onChange: (event)=>setLocationId(event.target.value),
+                            size: "small",
+                            sx: {
+                                minWidth: 140
+                            },
+                            children: [
+                                /*#__PURE__*/ _jsx(MenuItem, {
+                                    value: "",
+                                    children: 'Any'
+                                }),
+                                locations.map((location)=>/*#__PURE__*/ _jsx(MenuItem, {
+                                        value: location.$id,
+                                        children: location.name
+                                    }, location.$id))
+                            ]
+                        }) : null,
+                        /*#__PURE__*/ _jsx(Button, {
+                            size: "small",
+                            disabled: !name.trim() || !planReady,
+                            onClick: handleAdd,
+                            children: 'Add'
+                        })
+                    ]
+                }),
+                /*#__PURE__*/ _jsx(Typography, {
+                    variant: "caption",
+                    color: "text.secondary",
+                    children: planReady ? `${registerCount}/${quota.limit === Aglyn.UNLIMITED ? '∞' : quota.limit} registers on your plan` : `${registerCount} register${registerCount === 1 ? '' : 's'} · checking your plan…`
+                })
+            ]
+        })
+    });
+}
+RegistersCard.displayName = 'RegistersCard';
+export default RegistersCard;
+
+//# sourceMappingURL=registers-card.component.js.map