@aglyn/plugins-commerce 1.0.0-beta.285 → 1.0.0-beta.287

package/src/lib/components/console/pos/pos-hardware-sale-terms.component.js

@@ -0,0 +1,251 @@
+/**
+ * @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 { customerDisplayHost, subscribeCustomerDisplayHost } from "@aglyn/aglyn/plugin-manager/plugin-customer-display";
+import { Alert, Box, Button, Checkbox, Dialog, DialogActions, DialogContent, DialogTitle, FormControlLabel, Link, Stack, Typography } from "@mui/material";
+import { useCallback, useEffect, useState, useSyncExternalStore } from "react";
+import { BUNDLE_ID } from "../../../constants/bundle-common.js";
+import { PosHardwareRequestError } from "./pos-hardware-api.js";
+import { posHardwareAcceptTerms, posHardwareTerms, posHardwareTermsOnDisplay, posHardwareTermsStatus } from "./pos-hardware-sale-api.js";
+/** The display page the terms open at, beneath `/kiosk/commerce` (`server/pos-display.ts`). */ export const POS_HARDWARE_TERMS_SCREEN_PATH = '/hardware-terms';
+/** The printable booth sign, a public page of this plugin. */ export const POS_HARDWARE_TERMS_SIGN_HREF = `/kiosk/${BUNDLE_ID}/hardware-terms-sign`;
+/** How often the register asks whether the buyer accepted on the display. */ export const POS_HARDWARE_TERMS_POLL_MS = 2500;
+const METHOD_LABEL = {
+    tablet: 'on this tablet',
+    display: 'on the customer display',
+    notice: 'by the receipt and booth sign'
+};
+function useDisplayHost() {
+    return useSyncExternalStore(subscribeCustomerDisplayHost, customerDisplayHost, ()=>null);
+}
+/**
+ * The buyer accepts the terms of sale before paying (AGL-4038, Terms 4.28):
+ * on the customer display, which the register shows them on through core's
+ * display seam, or on this tablet, handed to them. Where neither can be
+ * used, every receipt of the sale and the booth sign state the terms, and
+ * paying is agreeing; the sign prints from here.
+ */ export function PosHardwareSaleTerms(props) {
+    var _ref, _ref1, _ref2;
+    const { user, hostId, saleOrderId, notify } = props;
+    const host = useDisplayHost();
+    const [acceptance, setAcceptance] = useState(null);
+    const [waiting, setWaiting] = useState(false);
+    const [tablet, setTablet] = useState(null);
+    const [agreed, setAgreed] = useState(false);
+    const [busy, setBusy] = useState(false);
+    const refresh = useCallback(async ()=>{
+        var _ref;
+        const answer = await posHardwareTermsStatus(user, hostId, saleOrderId).catch(()=>null);
+        if (answer) setAcceptance(answer.acceptance);
+        return (_ref = answer == null ? void 0 : answer.acceptance) != null ? _ref : null;
+    }, [
+        user,
+        hostId,
+        saleOrderId
+    ]);
+    useEffect(()=>{
+        setAcceptance(null);
+        setWaiting(false);
+        void refresh();
+    }, [
+        refresh
+    ]);
+    // Waiting on the display: asked until the buyer accepts there.
+    useEffect(()=>{
+        if (!waiting) return undefined;
+        const timer = window.setInterval(()=>{
+            void refresh().then((held)=>{
+                if (held && held.method !== 'notice') {
+                    setWaiting(false);
+                    notify('The buyer accepted the terms of sale on the display.', 'success');
+                }
+            });
+        }, POS_HARDWARE_TERMS_POLL_MS);
+        return ()=>window.clearInterval(timer);
+    }, [
+        waiting,
+        refresh,
+        notify
+    ]);
+    const fail = (caught, fallback)=>notify(caught instanceof PosHardwareRequestError ? caught.message : fallback, 'warning');
+    const showOnDisplay = async ()=>{
+        if (!host) return;
+        setBusy(true);
+        try {
+            await posHardwareTermsOnDisplay(user, hostId, saleOrderId);
+            const shown = await host.show({
+                pluginId: BUNDLE_ID,
+                path: POS_HARDWARE_TERMS_SCREEN_PATH,
+                params: {
+                    order: saleOrderId
+                }
+            });
+            if (!shown) throw new Error('not shown');
+            setWaiting(true);
+        } catch (caught) {
+            fail(caught, 'The terms could not be shown on the display. Hand them this tablet instead.');
+        } finally{
+            setBusy(false);
+        }
+    };
+    const takeOff = async ()=>{
+        var _host_close;
+        setWaiting(false);
+        await (host == null ? void 0 : (_host_close = host.close) == null ? void 0 : _host_close.call(host, BUNDLE_ID));
+    };
+    const openTablet = async ()=>{
+        setBusy(true);
+        try {
+            setAgreed(false);
+            setTablet(await posHardwareTerms(user, hostId));
+        } catch (caught) {
+            fail(caught, 'The terms could not be shown.');
+        } finally{
+            setBusy(false);
+        }
+    };
+    const acceptOnTablet = async ()=>{
+        setBusy(true);
+        try {
+            const answer = await posHardwareAcceptTerms(user, hostId, saleOrderId);
+            setAcceptance(answer.acceptance);
+            setTablet(null);
+            notify('The buyer accepted the terms of sale.', 'success');
+        } catch (caught) {
+            fail(caught, 'The acceptance did not go through. Try again.');
+        } finally{
+            setBusy(false);
+        }
+    };
+    const accepted = acceptance && acceptance.method !== 'notice' ? acceptance : null;
+    return /*#__PURE__*/ _jsxs(_Fragment, {
+        children: [
+            /*#__PURE__*/ _jsx(Alert, {
+                severity: accepted ? 'success' : 'info',
+                action: accepted ? undefined : /*#__PURE__*/ _jsxs(Stack, {
+                    direction: "row",
+                    spacing: 1,
+                    children: [
+                        host ? waiting ? /*#__PURE__*/ _jsx(Button, {
+                            size: "small",
+                            onClick: ()=>void takeOff(),
+                            children: 'Take off display'
+                        }) : /*#__PURE__*/ _jsx(Button, {
+                            size: "small",
+                            disabled: busy,
+                            onClick: ()=>void showOnDisplay(),
+                            children: 'Show on display'
+                        }) : null,
+                        /*#__PURE__*/ _jsx(Button, {
+                            size: "small",
+                            disabled: busy,
+                            onClick: ()=>void openTablet(),
+                            children: 'Accept on this tablet'
+                        })
+                    ]
+                }),
+                children: accepted ? `Terms of sale accepted ${METHOD_LABEL[accepted.method]} at ${new Date(accepted.atMs).toLocaleTimeString()}.` : waiting ? 'Waiting for the buyer to accept the terms of sale on the display…' : 'Before the buyer pays, have them accept the terms of sale. If no screen can be used, the receipt and the booth sign state the terms, and paying is agreeing.'
+            }),
+            /*#__PURE__*/ _jsx(Typography, {
+                variant: "caption",
+                color: "text.secondary",
+                children: /*#__PURE__*/ _jsx(Link, {
+                    href: POS_HARDWARE_TERMS_SIGN_HREF,
+                    target: "_blank",
+                    rel: "noopener",
+                    children: 'Print the booth sign'
+                })
+            }),
+            /*#__PURE__*/ _jsxs(Dialog, {
+                open: Boolean(tablet),
+                onClose: ()=>setTablet(null),
+                maxWidth: "sm",
+                fullWidth: true,
+                children: [
+                    /*#__PURE__*/ _jsx(DialogTitle, {
+                        children: 'Terms of sale for your card reader hardware'
+                    }),
+                    /*#__PURE__*/ _jsxs(DialogContent, {
+                        sx: {
+                            display: 'flex',
+                            flexDirection: 'column',
+                            gap: 1.5
+                        },
+                        children: [
+                            /*#__PURE__*/ _jsx(Typography, {
+                                variant: "body2",
+                                children: `Hand this tablet to the buyer. This purchase is made under our Terms, Sections ${(_ref = tablet == null ? void 0 : tablet.sections) != null ? _ref : ''}. In short:`
+                            }),
+                            /*#__PURE__*/ _jsx(Box, {
+                                component: "ul",
+                                sx: {
+                                    m: 0,
+                                    pl: 3,
+                                    display: 'flex',
+                                    flexDirection: 'column',
+                                    gap: 1
+                                },
+                                children: ((_ref1 = tablet == null ? void 0 : tablet.summary) != null ? _ref1 : []).map((line)=>/*#__PURE__*/ _jsx(Typography, {
+                                        component: "li",
+                                        variant: "body2",
+                                        children: line
+                                    }, line))
+                            }),
+                            /*#__PURE__*/ _jsxs(Typography, {
+                                variant: "body2",
+                                color: "text.secondary",
+                                children: [
+                                    'The full Terms: ',
+                                    /*#__PURE__*/ _jsx(Link, {
+                                        href: tablet == null ? void 0 : tablet.url,
+                                        target: "_blank",
+                                        rel: "noopener",
+                                        children: tablet == null ? void 0 : tablet.url.replace(/^https?:\/\//, '')
+                                    })
+                                ]
+                            }),
+                            /*#__PURE__*/ _jsx(FormControlLabel, {
+                                control: /*#__PURE__*/ _jsx(Checkbox, {
+                                    checked: agreed,
+                                    onChange: (event)=>setAgreed(event.target.checked)
+                                }),
+                                label: `I have read the terms of sale (Sections ${(_ref2 = tablet == null ? void 0 : tablet.sections) != null ? _ref2 : ''}) and accept them for this purchase.`
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsxs(DialogActions, {
+                        children: [
+                            /*#__PURE__*/ _jsx(Button, {
+                                onClick: ()=>setTablet(null),
+                                children: 'Not now'
+                            }),
+                            /*#__PURE__*/ _jsx(Button, {
+                                variant: "contained",
+                                disabled: !agreed || busy,
+                                onClick: ()=>void acceptOnTablet(),
+                                children: 'Accept'
+                            })
+                        ]
+                    })
+                ]
+            })
+        ]
+    });
+}
+export default PosHardwareSaleTerms;
+
+//# sourceMappingURL=pos-hardware-sale-terms.component.js.map

package/src/lib/components/console/pos/pos-hardware-sale-terms.component.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../../../libs/plugins/commerce/src/lib/components/console/pos/pos-hardware-sale-terms.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\n'use client'\n\nimport {\n  customerDisplayHost,\n  subscribeCustomerDisplayHost,\n} from '@aglyn/aglyn/plugin-manager/plugin-customer-display'\nimport {\n  Alert,\n  Box,\n  Button,\n  Checkbox,\n  Dialog,\n  DialogActions,\n  DialogContent,\n  DialogTitle,\n  FormControlLabel,\n  Link,\n  Stack,\n  Typography,\n} from '@mui/material'\nimport { useCallback, useEffect, useState, useSyncExternalStore } from 'react'\nimport { BUNDLE_ID } from '../../../constants/bundle-common'\nimport { PosHardwareRequestError } from './pos-hardware-api'\nimport {\n  posHardwareAcceptTerms,\n  posHardwareTerms,\n  posHardwareTermsOnDisplay,\n  posHardwareTermsStatus,\n  type PosHardwareTermsAcceptanceView,\n  type PosHardwareTermsView,\n} from './pos-hardware-sale-api'\n\ntype User = Parameters<typeof posHardwareTerms>[0]\ntype Notify = (message: string, variant: 'success' | 'info' | 'warning' | 'error') => void\n\n/** The display page the terms open at, beneath `/kiosk/commerce` (`server/pos-display.ts`). */\nexport const POS_HARDWARE_TERMS_SCREEN_PATH = '/hardware-terms'\n\n/** The printable booth sign, a public page of this plugin. */\nexport const POS_HARDWARE_TERMS_SIGN_HREF = `/kiosk/${BUNDLE_ID}/hardware-terms-sign`\n\n/** How often the register asks whether the buyer accepted on the display. */\nexport const POS_HARDWARE_TERMS_POLL_MS = 2_500\n\nconst METHOD_LABEL: Record<PosHardwareTermsAcceptanceView['method'], string> = {\n  tablet: 'on this tablet',\n  display: 'on the customer display',\n  notice: 'by the receipt and booth sign',\n}\n\nfunction useDisplayHost() {\n  return useSyncExternalStore(subscribeCustomerDisplayHost, customerDisplayHost, () => null)\n}\n\n/**\n * The buyer accepts the terms of sale before paying (AGL-4038, Terms 4.28):\n * on the customer display, which the register shows them on through core's\n * display seam, or on this tablet, handed to them. Where neither can be\n * used, every receipt of the sale and the booth sign state the terms, and\n * paying is agreeing; the sign prints from here.\n */\nexport function PosHardwareSaleTerms(props: { user: User; hostId: string; saleOrderId: string; notify: Notify }) {\n  const { user, hostId, saleOrderId, notify } = props\n  const host = useDisplayHost()\n  const [acceptance, setAcceptance] = useState<PosHardwareTermsAcceptanceView | null>(null)\n  const [waiting, setWaiting] = useState(false)\n  const [tablet, setTablet] = useState<PosHardwareTermsView | null>(null)\n  const [agreed, setAgreed] = useState(false)\n  const [busy, setBusy] = useState(false)\n\n  const refresh = useCallback(async () => {\n    const answer = await posHardwareTermsStatus(user, hostId, saleOrderId).catch(() => null)\n    if (answer) setAcceptance(answer.acceptance)\n    return answer?.acceptance ?? null\n  }, [user, hostId, saleOrderId])\n\n  useEffect(() => {\n    setAcceptance(null)\n    setWaiting(false)\n    void refresh()\n  }, [refresh])\n\n  // Waiting on the display: asked until the buyer accepts there.\n  useEffect(() => {\n    if (!waiting) return undefined\n    const timer = window.setInterval(() => {\n      void refresh().then((held) => {\n        if (held && held.method !== 'notice') {\n          setWaiting(false)\n          notify('The buyer accepted the terms of sale on the display.', 'success')\n        }\n      })\n    }, POS_HARDWARE_TERMS_POLL_MS)\n    return () => window.clearInterval(timer)\n  }, [waiting, refresh, notify])\n\n  const fail = (caught: unknown, fallback: string) =>\n    notify(caught instanceof PosHardwareRequestError ? caught.message : fallback, 'warning')\n\n  const showOnDisplay = async () => {\n    if (!host) return\n    setBusy(true)\n    try {\n      await posHardwareTermsOnDisplay(user, hostId, saleOrderId)\n      const shown = await host.show({ pluginId: BUNDLE_ID, path: POS_HARDWARE_TERMS_SCREEN_PATH, params: { order: saleOrderId } })\n      if (!shown) throw new Error('not shown')\n      setWaiting(true)\n    } catch (caught) {\n      fail(caught, 'The terms could not be shown on the display. Hand them this tablet instead.')\n    } finally {\n      setBusy(false)\n    }\n  }\n\n  const takeOff = async () => {\n    setWaiting(false)\n    await host?.close?.(BUNDLE_ID)\n  }\n\n  const openTablet = async () => {\n    setBusy(true)\n    try {\n      setAgreed(false)\n      setTablet(await posHardwareTerms(user, hostId))\n    } catch (caught) {\n      fail(caught, 'The terms could not be shown.')\n    } finally {\n      setBusy(false)\n    }\n  }\n\n  const acceptOnTablet = async () => {\n    setBusy(true)\n    try {\n      const answer = await posHardwareAcceptTerms(user, hostId, saleOrderId)\n      setAcceptance(answer.acceptance)\n      setTablet(null)\n      notify('The buyer accepted the terms of sale.', 'success')\n    } catch (caught) {\n      fail(caught, 'The acceptance did not go through. Try again.')\n    } finally {\n      setBusy(false)\n    }\n  }\n\n  const accepted = acceptance && acceptance.method !== 'notice' ? acceptance : null\n  return (\n    <>\n      <Alert\n        severity={accepted ? 'success' : 'info'}\n        action={\n          accepted ? undefined : (\n            <Stack direction=\"row\" spacing={1}>\n              {host ? (\n                waiting ? (\n                  <Button size=\"small\" onClick={() => void takeOff()}>\n                    {'Take off display'}\n                  </Button>\n                ) : (\n                  <Button size=\"small\" disabled={busy} onClick={() => void showOnDisplay()}>\n                    {'Show on display'}\n                  </Button>\n                )\n              ) : null}\n              <Button size=\"small\" disabled={busy} onClick={() => void openTablet()}>\n                {'Accept on this tablet'}\n              </Button>\n            </Stack>\n          )\n        }\n      >\n        {accepted\n          ? `Terms of sale accepted ${METHOD_LABEL[accepted.method]} at ${new Date(accepted.atMs).toLocaleTimeString()}.`\n          : waiting\n            ? 'Waiting for the buyer to accept the terms of sale on the display…'\n            : 'Before the buyer pays, have them accept the terms of sale. If no screen can be used, the receipt and the booth sign state the terms, and paying is agreeing.'}\n      </Alert>\n      <Typography variant=\"caption\" color=\"text.secondary\">\n        <Link href={POS_HARDWARE_TERMS_SIGN_HREF} target=\"_blank\" rel=\"noopener\">\n          {'Print the booth sign'}\n        </Link>\n      </Typography>\n      <Dialog open={Boolean(tablet)} onClose={() => setTablet(null)} maxWidth=\"sm\" fullWidth>\n        <DialogTitle>{'Terms of sale for your card reader hardware'}</DialogTitle>\n        <DialogContent sx={{ display: 'flex', flexDirection: 'column', gap: 1.5 }}>\n          <Typography variant=\"body2\">\n            {`Hand this tablet to the buyer. This purchase is made under our Terms, Sections ${tablet?.sections ?? ''}. In short:`}\n          </Typography>\n          <Box component=\"ul\" sx={{ m: 0, pl: 3, display: 'flex', flexDirection: 'column', gap: 1 }}>\n            {(tablet?.summary ?? []).map((line) => (\n              <Typography key={line} component=\"li\" variant=\"body2\">\n                {line}\n              </Typography>\n            ))}\n          </Box>\n          <Typography variant=\"body2\" color=\"text.secondary\">\n            {'The full Terms: '}\n            <Link href={tablet?.url} target=\"_blank\" rel=\"noopener\">\n              {tablet?.url.replace(/^https?:\\/\\//, '')}\n            </Link>\n          </Typography>\n          <FormControlLabel\n            control={<Checkbox checked={agreed} onChange={(event) => setAgreed(event.target.checked)} />}\n            label={`I have read the terms of sale (Sections ${tablet?.sections ?? ''}) and accept them for this purchase.`}\n          />\n        </DialogContent>\n        <DialogActions>\n          <Button onClick={() => setTablet(null)}>{'Not now'}</Button>\n          <Button variant=\"contained\" disabled={!agreed || busy} onClick={() => void acceptOnTablet()}>\n            {'Accept'}\n          </Button>\n        </DialogActions>\n      </Dialog>\n    </>\n  )\n}\n\nexport default PosHardwareSaleTerms\n"],"names":["customerDisplayHost","subscribeCustomerDisplayHost","Alert","Box","Button","Checkbox","Dialog","DialogActions","DialogContent","DialogTitle","FormControlLabel","Link","Stack","Typography","useCallback","useEffect","useState","useSyncExternalStore","BUNDLE_ID","PosHardwareRequestError","posHardwareAcceptTerms","posHardwareTerms","posHardwareTermsOnDisplay","posHardwareTermsStatus","POS_HARDWARE_TERMS_SCREEN_PATH","POS_HARDWARE_TERMS_SIGN_HREF","POS_HARDWARE_TERMS_POLL_MS","METHOD_LABEL","tablet","display","notice","useDisplayHost","PosHardwareSaleTerms","props","user","hostId","saleOrderId","notify","host","acceptance","setAcceptance","waiting","setWaiting","setTablet","agreed","setAgreed","busy","setBusy","refresh","answer","catch","undefined","timer","window","setInterval","then","held","method","clearInterval","fail","caught","fallback","message","showOnDisplay","shown","show","pluginId","path","params","order","Error","takeOff","close","openTablet","acceptOnTablet","accepted","severity","action","direction","spacing","size","onClick","disabled","Date","atMs","toLocaleTimeString","variant","color","href","target","rel","open","Boolean","onClose","maxWidth","fullWidth","sx","flexDirection","gap","sections","component","m","pl","summary","map","line","url","replace","control","checked","onChange","event","label"],"mappings":"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"}

package/src/lib/components/console/pos/use-pos-display.js

@@ -15,6 +15,7 @@
  * limitations under the License.
  */ 'use client';
 import { _ as _extends } from "@swc/helpers/_/_extends";
+import { registerCustomerDisplayHost } from "@aglyn/aglyn/plugin-manager/plugin-customer-display";
 import { useCallback, useEffect, useRef, useState } from "react";
 import { newAttemptKey, posDisplayCall } from "./pos-api.js";
 /**
@@ -72,6 +73,55 @@ import { newAttemptKey, posDisplayCall } from "./pos-api.js";
         hostId,
         registerId
     ]);
+    // While this register has a display, any plugin's widget on the page may
+    // put one of its own public pages on it (AGL-4042), through core's seam,
+    // which names no plugin here and no register there.
+    useEffect(()=>{
+        if (!connected || !uid || !registerId) return undefined;
+        return registerCustomerDisplayHost({
+            show: async (screen)=>{
+                const signedIn = userRef.current;
+                if (!signedIn) return false;
+                try {
+                    await posDisplayCall(signedIn, {
+                        action: 'push',
+                        hostId,
+                        registerId,
+                        state: {
+                            mode: 'screen',
+                            screen,
+                            promptId: newAttemptKey().slice(0, 32)
+                        }
+                    });
+                    return true;
+                } catch (unused) {
+                    return false;
+                }
+            },
+            // Staff closed the plugin's screen (AGL-4042): the display shows the
+            // register's own screen again, unless the register already moved on.
+            close: async (pluginId)=>{
+                const signedIn = userRef.current;
+                if (!signedIn) return false;
+                try {
+                    await posDisplayCall(signedIn, {
+                        action: 'close-screen',
+                        hostId,
+                        registerId,
+                        pluginId
+                    });
+                    return true;
+                } catch (unused) {
+                    return false;
+                }
+            }
+        });
+    }, [
+        connected,
+        uid,
+        hostId,
+        registerId
+    ]);
     const show = useCallback(async (state)=>{
         if (!user || !registerId || !connected) return;
         await posDisplayCall(user, {

package/src/lib/components/console/pos/use-pos-display.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../../../../libs/plugins/commerce/src/lib/components/console/pos/use-pos-display.ts"],"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 { useCallback, useEffect, useRef, useState } from 'react'\nimport type * as CommerceModel from '../../../model'\nimport { newAttemptKey, posDisplayCall } from './pos-api'\n\ntype User = Parameters<typeof posDisplayCall>[0]\n\n/**\n * The tip the customer screen shows beside the sale (AGL-3608): the tips\n * already on its payments, plus one chosen for the payment about to be taken\n * (on the display or by the cashier), which the ledger does not hold until\n * that payment is recorded. Without the second part the screen read the\n * sale's total right after the customer added a tip, short by that tip.\n */\nexport function posDisplayTipCents(\n  sale: { status: string; tipCents: number } | null | undefined,\n  pendingTipCents: number,\n): number {\n  if (!sale) return 0\n  const pending = sale.status === 'paid' ? 0 : Math.max(0, Math.round(pendingTipCents) || 0)\n  return Math.max(0, sale.tipCents) + pending\n}\n\n/** How long the register waits for the customer to answer a prompt. */\nexport const POS_DISPLAY_ANSWER_TIMEOUT_MS = 3 * 60 * 1000\n\nexport interface PosDisplayControl {\n  /** A display for this register polled within the last two minutes. */\n  connected: boolean\n  /** The prompt the register is waiting on, if any. */\n  asking: CommerceModel.PosDisplayMode | null\n  /** Shows something on the display with no answer expected. */\n  show: (state: Omit<CommerceModel.PosDisplayState, 'updatedAtMs' | 'promptId'>) => Promise<void>\n  /**\n   * Asks the customer (a tip or a receipt) and resolves with their answer,\n   * or null when the cashier cancels or the customer does not answer.\n   */\n  ask: (\n    state: Omit<CommerceModel.PosDisplayState, 'updatedAtMs' | 'promptId'>,\n  ) => Promise<CommerceModel.PosDisplayResponse | null>\n  cancelAsk: () => void\n}\n\n/**\n * The register's half of the customer display (AGL-3608). It writes the\n * display's state through `commerce/pos-display` and reads answers back the\n * same way; nothing here talks to Firestore, because the display state is\n * server-only (it can hold a customer's typed email address).\n */\nexport function usePosDisplay(\n  user: User | null | undefined,\n  hostId: string,\n  registerId: string,\n): PosDisplayControl {\n  const [connected, setConnected] = useState(false)\n  const [asking, setAsking] = useState<CommerceModel.PosDisplayMode | null>(null)\n  const cancelRef = useRef<(() => void) | null>(null)\n  // The poll reads the latest session through a ref and is keyed on the uid,\n  // so a refreshed user object does not restart it.\n  const userRef = useRef(user)\n  userRef.current = user\n  const uid = (user as { uid?: string } | null | undefined)?.uid ?? ''\n\n  useEffect(() => {\n    if (!uid || !registerId) return undefined\n    let active = true\n    const check = async () => {\n      const signedIn = userRef.current\n      if (!signedIn) return\n      try {\n        const result = await posDisplayCall<{ connected: boolean }>(\n          signedIn,\n          { action: 'state', hostId, registerId },\n          'GET',\n        )\n        if (active) setConnected(Boolean(result.connected))\n      } catch {\n        if (active) setConnected(false)\n      }\n    }\n    void check()\n    const timer = setInterval(check, 15_000)\n    return () => {\n      active = false\n      clearInterval(timer)\n    }\n  }, [uid, hostId, registerId])\n\n  const show = useCallback<PosDisplayControl['show']>(\n    async (state) => {\n      if (!user || !registerId || !connected) return\n      await posDisplayCall(user, { action: 'push', hostId, registerId, state }).catch(() => undefined)\n    },\n    [user, hostId, registerId, connected],\n  )\n\n  const cancelAsk = useCallback(() => {\n    cancelRef.current?.()\n  }, [])\n\n  const ask = useCallback<PosDisplayControl['ask']>(\n    async (state) => {\n      if (!user || !registerId) return null\n      cancelRef.current?.()\n      const promptId = newAttemptKey().slice(0, 32)\n      await posDisplayCall(user, {\n        action: 'push',\n        hostId,\n        registerId,\n        state: { ...state, promptId },\n      })\n      setAsking(state.mode)\n      return await new Promise<CommerceModel.PosDisplayResponse | null>((resolve) => {\n        let done = false\n        const finish = (answer: CommerceModel.PosDisplayResponse | null) => {\n          if (done) return\n          done = true\n          clearInterval(timer)\n          clearTimeout(timeout)\n          cancelRef.current = null\n          setAsking(null)\n          resolve(answer)\n        }\n        const timer = setInterval(async () => {\n          try {\n            const result = await posDisplayCall<{\n              state: CommerceModel.PosDisplayState | null\n            }>(user, { action: 'state', hostId, registerId }, 'GET')\n            const response = result.state?.response\n            if (response && response.promptId === promptId) finish(response)\n          } catch {\n            // A missed poll is retried on the next tick.\n          }\n        }, 1000)\n        const timeout = setTimeout(() => finish(null), POS_DISPLAY_ANSWER_TIMEOUT_MS)\n        cancelRef.current = () => finish(null)\n      })\n    },\n    [user, hostId, registerId],\n  )\n\n  // Pairing a new display is `usePosPairing` (AGL-3712), shared with the devices card.\n  return { connected, asking, show, ask, cancelAsk }\n}\n"],"names":["useCallback","useEffect","useRef","useState","newAttemptKey","posDisplayCall","posDisplayTipCents","sale","pendingTipCents","pending","status","Math","max","round","tipCents","POS_DISPLAY_ANSWER_TIMEOUT_MS","usePosDisplay","user","hostId","registerId","connected","setConnected","asking","setAsking","cancelRef","userRef","current","uid","undefined","active","check","signedIn","result","action","Boolean","timer","setInterval","clearInterval","show","state","catch","cancelAsk","ask","promptId","slice","mode","Promise","resolve","done","finish","answer","clearTimeout","timeout","response","setTimeout"],"mappings":"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"}
+{"version":3,"sources":["../../../../../../../../../libs/plugins/commerce/src/lib/components/console/pos/use-pos-display.ts"],"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 { registerCustomerDisplayHost } from '@aglyn/aglyn/plugin-manager/plugin-customer-display'\nimport { useCallback, useEffect, useRef, useState } from 'react'\nimport type * as CommerceModel from '../../../model'\nimport { newAttemptKey, posDisplayCall } from './pos-api'\n\ntype User = Parameters<typeof posDisplayCall>[0]\n\n/**\n * The tip the customer screen shows beside the sale (AGL-3608): the tips\n * already on its payments, plus one chosen for the payment about to be taken\n * (on the display or by the cashier), which the ledger does not hold until\n * that payment is recorded. Without the second part the screen read the\n * sale's total right after the customer added a tip, short by that tip.\n */\nexport function posDisplayTipCents(\n  sale: { status: string; tipCents: number } | null | undefined,\n  pendingTipCents: number,\n): number {\n  if (!sale) return 0\n  const pending = sale.status === 'paid' ? 0 : Math.max(0, Math.round(pendingTipCents) || 0)\n  return Math.max(0, sale.tipCents) + pending\n}\n\n/** How long the register waits for the customer to answer a prompt. */\nexport const POS_DISPLAY_ANSWER_TIMEOUT_MS = 3 * 60 * 1000\n\nexport interface PosDisplayControl {\n  /** A display for this register polled within the last two minutes. */\n  connected: boolean\n  /** The prompt the register is waiting on, if any. */\n  asking: CommerceModel.PosDisplayMode | null\n  /** Shows something on the display with no answer expected. */\n  show: (state: Omit<CommerceModel.PosDisplayState, 'updatedAtMs' | 'promptId'>) => Promise<void>\n  /**\n   * Asks the customer (a tip or a receipt) and resolves with their answer,\n   * or null when the cashier cancels or the customer does not answer.\n   */\n  ask: (\n    state: Omit<CommerceModel.PosDisplayState, 'updatedAtMs' | 'promptId'>,\n  ) => Promise<CommerceModel.PosDisplayResponse | null>\n  cancelAsk: () => void\n}\n\n/**\n * The register's half of the customer display (AGL-3608). It writes the\n * display's state through `commerce/pos-display` and reads answers back the\n * same way; nothing here talks to Firestore, because the display state is\n * server-only (it can hold a customer's typed email address).\n */\nexport function usePosDisplay(\n  user: User | null | undefined,\n  hostId: string,\n  registerId: string,\n): PosDisplayControl {\n  const [connected, setConnected] = useState(false)\n  const [asking, setAsking] = useState<CommerceModel.PosDisplayMode | null>(null)\n  const cancelRef = useRef<(() => void) | null>(null)\n  // The poll reads the latest session through a ref and is keyed on the uid,\n  // so a refreshed user object does not restart it.\n  const userRef = useRef(user)\n  userRef.current = user\n  const uid = (user as { uid?: string } | null | undefined)?.uid ?? ''\n\n  useEffect(() => {\n    if (!uid || !registerId) return undefined\n    let active = true\n    const check = async () => {\n      const signedIn = userRef.current\n      if (!signedIn) return\n      try {\n        const result = await posDisplayCall<{ connected: boolean }>(\n          signedIn,\n          { action: 'state', hostId, registerId },\n          'GET',\n        )\n        if (active) setConnected(Boolean(result.connected))\n      } catch {\n        if (active) setConnected(false)\n      }\n    }\n    void check()\n    const timer = setInterval(check, 15_000)\n    return () => {\n      active = false\n      clearInterval(timer)\n    }\n  }, [uid, hostId, registerId])\n\n  // While this register has a display, any plugin's widget on the page may\n  // put one of its own public pages on it (AGL-4042), through core's seam,\n  // which names no plugin here and no register there.\n  useEffect(() => {\n    if (!connected || !uid || !registerId) return undefined\n    return registerCustomerDisplayHost({\n      show: async (screen) => {\n        const signedIn = userRef.current\n        if (!signedIn) return false\n        try {\n          await posDisplayCall(signedIn, {\n            action: 'push',\n            hostId,\n            registerId,\n            state: { mode: 'screen', screen, promptId: newAttemptKey().slice(0, 32) },\n          })\n          return true\n        } catch {\n          return false\n        }\n      },\n      // Staff closed the plugin's screen (AGL-4042): the display shows the\n      // register's own screen again, unless the register already moved on.\n      close: async (pluginId) => {\n        const signedIn = userRef.current\n        if (!signedIn) return false\n        try {\n          await posDisplayCall(signedIn, { action: 'close-screen', hostId, registerId, pluginId })\n          return true\n        } catch {\n          return false\n        }\n      },\n    })\n  }, [connected, uid, hostId, registerId])\n\n  const show = useCallback<PosDisplayControl['show']>(\n    async (state) => {\n      if (!user || !registerId || !connected) return\n      await posDisplayCall(user, { action: 'push', hostId, registerId, state }).catch(() => undefined)\n    },\n    [user, hostId, registerId, connected],\n  )\n\n  const cancelAsk = useCallback(() => {\n    cancelRef.current?.()\n  }, [])\n\n  const ask = useCallback<PosDisplayControl['ask']>(\n    async (state) => {\n      if (!user || !registerId) return null\n      cancelRef.current?.()\n      const promptId = newAttemptKey().slice(0, 32)\n      await posDisplayCall(user, {\n        action: 'push',\n        hostId,\n        registerId,\n        state: { ...state, promptId },\n      })\n      setAsking(state.mode)\n      return await new Promise<CommerceModel.PosDisplayResponse | null>((resolve) => {\n        let done = false\n        const finish = (answer: CommerceModel.PosDisplayResponse | null) => {\n          if (done) return\n          done = true\n          clearInterval(timer)\n          clearTimeout(timeout)\n          cancelRef.current = null\n          setAsking(null)\n          resolve(answer)\n        }\n        const timer = setInterval(async () => {\n          try {\n            const result = await posDisplayCall<{\n              state: CommerceModel.PosDisplayState | null\n            }>(user, { action: 'state', hostId, registerId }, 'GET')\n            const response = result.state?.response\n            if (response && response.promptId === promptId) finish(response)\n          } catch {\n            // A missed poll is retried on the next tick.\n          }\n        }, 1000)\n        const timeout = setTimeout(() => finish(null), POS_DISPLAY_ANSWER_TIMEOUT_MS)\n        cancelRef.current = () => finish(null)\n      })\n    },\n    [user, hostId, registerId],\n  )\n\n  // Pairing a new display is `usePosPairing` (AGL-3712), shared with the devices card.\n  return { connected, asking, show, ask, cancelAsk }\n}\n"],"names":["registerCustomerDisplayHost","useCallback","useEffect","useRef","useState","newAttemptKey","posDisplayCall","posDisplayTipCents","sale","pendingTipCents","pending","status","Math","max","round","tipCents","POS_DISPLAY_ANSWER_TIMEOUT_MS","usePosDisplay","user","hostId","registerId","connected","setConnected","asking","setAsking","cancelRef","userRef","current","uid","undefined","active","check","signedIn","result","action","Boolean","timer","setInterval","clearInterval","show","screen","state","mode","promptId","slice","close","pluginId","catch","cancelAsk","ask","Promise","resolve","done","finish","answer","clearTimeout","timeout","response","setTimeout"],"mappings":"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"}

package/src/lib/components/console/pos-cellular-control.component.d.ts

@@ -0,0 +1,41 @@
+/**
+ * @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.
+ */
+import type { PosCellularView } from '../../model/pos-cellular';
+export interface PosCellularControlProps {
+    hostId: string;
+    cellular: PosCellularView;
+    /** Why the viewer may not change it ("Registers and devices"), or null. */
+    blocked: string | null;
+    /** Reload the card once it changed. */
+    onChanged: () => void | Promise<void>;
+}
+/**
+ * 4G for a store's Stripe Reader S710s (AGL-4038), on the POS devices card.
+ * Stripe turns cellular service on for a store's reader Location, so this is
+ * one switch for the store: it says plainly that every S710 at the store
+ * gets 4G and that each one is charged, and turning it on takes an explicit
+ * agreement to the monthly price. Turning it ON is charged to the workspace,
+ * so it also takes "Manage billing": without it the control says so rather
+ * than hiding. A store whose 4G was turned off for an unpaid month says
+ * which, and how to turn it back on. Loaded only where 4G is offered and the
+ * store has an S710.
+ */
+export declare function PosCellularControl({ hostId, cellular, blocked, onChanged }: PosCellularControlProps): import("react").JSX.Element;
+export declare namespace PosCellularControl {
+    var displayName: string;
+}
+export default PosCellularControl;

package/src/lib/components/console/pos-cellular-control.component.js

@@ -0,0 +1,211 @@
+import { _ as _extends } from "@swc/helpers/_/_extends";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * @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.
+ */ import { BlockedControl } from "@aglyn/shared-ui-jsx/components/blocked-control.component";
+import { useSnackbar } from "@aglyn/shared-ui-snackstack";
+import { useUser } from "@aglyn/tenant-feature-instance";
+import { Alert, Box, Button, Checkbox, Chip, Dialog, DialogActions, DialogContent, DialogTitle, FormControlLabel, Stack, Typography } from "@mui/material";
+import { useState } from "react";
+import { posReadersCall, PosRequestError, usd } from "./pos/pos-api.js";
+const readersText = (count)=>`${count} Stripe Reader S710${count === 1 ? '' : 's'}`;
+/**
+ * 4G for a store's Stripe Reader S710s (AGL-4038), on the POS devices card.
+ * Stripe turns cellular service on for a store's reader Location, so this is
+ * one switch for the store: it says plainly that every S710 at the store
+ * gets 4G and that each one is charged, and turning it on takes an explicit
+ * agreement to the monthly price. Turning it ON is charged to the workspace,
+ * so it also takes "Manage billing": without it the control says so rather
+ * than hiding. A store whose 4G was turned off for an unpaid month says
+ * which, and how to turn it back on. Loaded only where 4G is offered and the
+ * store has an S710.
+ */ export function PosCellularControl({ hostId, cellular, blocked, onChanged }) {
+    var _cellular_turnOnBlocked;
+    const { data: user } = useUser();
+    const { enqueueSnackbar } = useSnackbar();
+    const [dialog, setDialog] = useState(null);
+    const [agreed, setAgreed] = useState(false);
+    const [busy, setBusy] = useState(false);
+    const price = usd(cellular.readerMonthlyCents);
+    // Off needs only the card's key; on is charged to the workspace, so billing too.
+    const reason = blocked != null ? blocked : cellular.enabled ? null : (_cellular_turnOnBlocked = cellular.turnOnBlocked) != null ? _cellular_turnOnBlocked : null;
+    const change = async (enabled)=>{
+        if (!user) return;
+        setBusy(true);
+        try {
+            await posReadersCall(user, _extends({
+                action: 'cellular',
+                hostId,
+                enabled
+            }, enabled ? {
+                consent: agreed
+            } : {}));
+            setDialog(null);
+            setAgreed(false);
+            enqueueSnackbar(enabled ? '4G is on for this store’s S710 readers' : '4G is off for this store', {
+                variant: 'success',
+                persist: false
+            });
+            await onChanged();
+        } catch (error) {
+            enqueueSnackbar(error instanceof PosRequestError ? error.message : '4G could not be changed. Try again.', {
+                variant: 'warning',
+                persist: false
+            });
+        } finally{
+            setBusy(false);
+        }
+    };
+    return /*#__PURE__*/ _jsxs(Stack, {
+        direction: "row",
+        spacing: 1,
+        sx: {
+            alignItems: 'center',
+            flexWrap: 'wrap',
+            rowGap: 1
+        },
+        children: [
+            /*#__PURE__*/ _jsxs(Box, {
+                sx: {
+                    flex: 1,
+                    minWidth: 220
+                },
+                children: [
+                    /*#__PURE__*/ _jsx(Typography, {
+                        variant: "body2",
+                        sx: {
+                            fontWeight: 'fontWeightMedium'
+                        },
+                        children: '4G (cellular)'
+                    }),
+                    /*#__PURE__*/ _jsx(Typography, {
+                        variant: "caption",
+                        color: "text.secondary",
+                        component: "p",
+                        children: cellular.enabled ? `On for every Stripe Reader S710 at this store (${readersText(cellular.readers)} now). Each is charged ${price} a month.` : `A Stripe Reader S710 can use Stripe's 4G service when Wi-Fi drops. It turns on for every S710 at this store, at ${price} a month each.`
+                    })
+                ]
+            }),
+            /*#__PURE__*/ _jsx(Chip, {
+                size: "small",
+                label: cellular.enabled ? 'On' : 'Off',
+                color: cellular.enabled ? 'success' : 'default'
+            }),
+            /*#__PURE__*/ _jsx(BlockedControl, {
+                blocked: Boolean(reason),
+                reason: reason != null ? reason : '',
+                children: /*#__PURE__*/ _jsx(Button, {
+                    size: "small",
+                    onClick: ()=>setDialog(cellular.enabled ? 'off' : 'on'),
+                    children: cellular.enabled ? 'Turn off 4G' : 'Turn on 4G'
+                })
+            }),
+            cellular.suspended ? /*#__PURE__*/ _jsx(Alert, {
+                severity: "warning",
+                sx: {
+                    flexBasis: '100%'
+                },
+                children: `4G was turned off because the 4G charge for ${cellular.suspended.month} wasn't paid. Pay it on the Billing page, then turn 4G on again here.`
+            }) : null,
+            /*#__PURE__*/ _jsxs(Dialog, {
+                open: dialog === 'on',
+                onClose: ()=>busy ? undefined : setDialog(null),
+                maxWidth: "sm",
+                fullWidth: true,
+                children: [
+                    /*#__PURE__*/ _jsx(DialogTitle, {
+                        children: 'Turn on 4G for this store?'
+                    }),
+                    /*#__PURE__*/ _jsxs(DialogContent, {
+                        sx: {
+                            display: 'flex',
+                            flexDirection: 'column',
+                            gap: 1.5
+                        },
+                        children: [
+                            /*#__PURE__*/ _jsx(Typography, {
+                                variant: "body2",
+                                children: `Every Stripe Reader S710 at this store gets Stripe's 4G service and uses it whenever Wi-Fi and Ethernet are not available. That is ${readersText(cellular.readers)} now, and any S710 you add here later.`
+                            }),
+                            /*#__PURE__*/ _jsx(Typography, {
+                                variant: "body2",
+                                children: `Each S710 is charged ${price} a month, plus any sales tax, for every calendar month it has 4G. The charge goes to this workspace's card at the start of the next month. Turning 4G off stops the charge from the next month. If a month's charge isn't paid, 4G is turned off after a grace period, until it's paid and turned on again.`
+                            }),
+                            /*#__PURE__*/ _jsx(FormControlLabel, {
+                                control: /*#__PURE__*/ _jsx(Checkbox, {
+                                    checked: agreed,
+                                    onChange: (event)=>setAgreed(event.target.checked)
+                                }),
+                                label: `I agree to ${price} a month for each Stripe Reader S710 at this store while 4G is on.`
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsxs(DialogActions, {
+                        children: [
+                            /*#__PURE__*/ _jsx(Button, {
+                                onClick: ()=>setDialog(null),
+                                disabled: busy,
+                                children: 'Cancel'
+                            }),
+                            /*#__PURE__*/ _jsx(Button, {
+                                variant: "contained",
+                                disabled: busy || !agreed,
+                                onClick: ()=>void change(true),
+                                children: 'Turn on 4G'
+                            })
+                        ]
+                    })
+                ]
+            }),
+            /*#__PURE__*/ _jsxs(Dialog, {
+                open: dialog === 'off',
+                onClose: ()=>busy ? undefined : setDialog(null),
+                maxWidth: "xs",
+                fullWidth: true,
+                children: [
+                    /*#__PURE__*/ _jsx(DialogTitle, {
+                        children: 'Turn off 4G?'
+                    }),
+                    /*#__PURE__*/ _jsx(DialogContent, {
+                        children: /*#__PURE__*/ _jsx(Typography, {
+                            variant: "body2",
+                            children: 'The S710 readers at this store stop using 4G the next time they connect, and use Wi-Fi or Ethernet only. This month is still charged for each reader that had 4G in it.'
+                        })
+                    }),
+                    /*#__PURE__*/ _jsxs(DialogActions, {
+                        children: [
+                            /*#__PURE__*/ _jsx(Button, {
+                                onClick: ()=>setDialog(null),
+                                disabled: busy,
+                                children: 'Cancel'
+                            }),
+                            /*#__PURE__*/ _jsx(Button, {
+                                variant: "contained",
+                                disabled: busy,
+                                onClick: ()=>void change(false),
+                                children: 'Turn off 4G'
+                            })
+                        ]
+                    })
+                ]
+            })
+        ]
+    });
+}
+PosCellularControl.displayName = 'PosCellularControl';
+export default PosCellularControl;
+
+//# sourceMappingURL=pos-cellular-control.component.js.map