@aglyn/plugins-commerce 1.0.0-beta.143

package/src/lib/components/console/host-orders-card.component.js

@@ -0,0 +1,861 @@
+/**
+ * @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 CommerceModel from "../../model/index.js";
+import { CardDisplay } from "@aglyn/shared-ui-jsx";
+import { ScrollTable } from "@aglyn/shared-ui-jsx/components/scroll-table.component";
+import { useSnackbar } from "@aglyn/shared-ui-snackstack";
+import { checkEntitlement, ORDERS_CUSTOMER_PARAM, ORDERS_ORDER_PARAM, pluginDocsHelp } from "@aglyn/aglyn";
+import { Alert, AlertTitle, Button, Chip, Dialog, DialogActions, DialogContent, DialogTitle, MenuItem, Stack, TableBody, TableCell, TableHead, TableRow, TextField, Tooltip, Typography } from "@mui/material";
+import { collection, doc, getDoc, limit, orderBy, query } from "firebase/firestore";
+import { useSearchParams } from "next/navigation";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { ceilingedWindow, collectionCeiling, useFirestore, useOrgPlan, useUser } from "@aglyn/tenant-feature-instance";
+import { useFirestoreCollection } from "@aglyn/tenant-feature-instance";
+import { authorizedFetch } from "@aglyn/shared-util-http/authorized-token";
+import CommerceStatTile from "./commerce-stat-tile.component.js";
+import OrderDetailDialog, { DISPUTE_COLOR } from "./order-detail-dialog.component.js";
+/**
+ * How far back the table, its filters and its export reach.
+ *
+ * This window cannot be paged the way a plain list can. Five filters and the
+ * CSV export all run over what was read, so a page of ten would quietly narrow
+ * every one of them — a status filter would search a tenth of the orders and
+ * report confidently on what it found. Bounding the read and saying where the
+ * bound falls keeps the filters honest about their own scope.
+ */ const ORDERS_WINDOW = 200;
+/** A name map for the filter menu; it renders no product rows of its own. */ const PRODUCT_NAME_WINDOW = 100;
+/**
+ * Orders console (AGL-287): filterable list over webhook-written order
+ * docs with a detail dialog (timeline, fulfill, refund, cancel, notes,
+ * packing slip) and draft orders that send the buyer a payment link.
+ */ export function HostOrdersCard(props) {
+    var _ref, _find, _ref1, _ref2, _ref3, _ref4;
+    var _draft_shipCountries, _draft_shipCountries1;
+    const { hostId } = props;
+    const firestore = useFirestore();
+    /**
+   * The most recent orders, in the order the table shows them.
+   *
+   * `createdAtMs` is the field every order writer in the plugin stamps and the
+   * one `reconcile-stock` already walks the collection by. Ordering on it is
+   * what makes this window the RECENT orders: an unordered cap is answered in
+   * document-id order, and orders are keyed by generated ids, so it returns a
+   * pseudo-random sample that a client sort then dresses as newest-first.
+   */ const { data: orderDocs } = useFirestoreCollection(()=>query(collection(firestore, 'hosts', hostId, 'orders'), orderBy('createdAtMs', 'desc'), limit(ORDERS_WINDOW + 1)), [
+        firestore,
+        hostId
+    ], {
+        idField: '$id'
+    });
+    const { data: productDocs } = useFirestoreCollection(()=>collectionCeiling(collection(firestore, 'hosts', hostId, 'products'), PRODUCT_NAME_WINDOW), [
+        firestore,
+        hostId
+    ], {
+        idField: '$id'
+    });
+    const orderWindow = useMemo(()=>ceilingedWindow(orderDocs != null ? orderDocs : undefined, ORDERS_WINDOW), [
+        orderDocs
+    ]);
+    const productWindow = useMemo(()=>ceilingedWindow(productDocs != null ? productDocs : undefined, PRODUCT_NAME_WINDOW), [
+        productDocs
+    ]);
+    const productNames = useMemo(()=>{
+        const map = {};
+        for (const product of productWindow.rows){
+            var _product_name;
+            map[product.$id] = (_product_name = product.name) != null ? _product_name : product.$id;
+        }
+        return map;
+    }, [
+        productWindow
+    ]);
+    /**
+   * The money tiles are the `commerceAnalytics` surface (AGL-1938,
+   * AGL-2056), and this is the third place they appear. Rendering them
+   * ungated here would undo both of those passes and hand a Starter org
+   * the Pro figures one tab away from the upgrade prompt that refuses
+   * them. The TABLE below is not gated — a list of your own orders is not
+   * a paid feature.
+   */ const { org, ready: orgReady } = useOrgPlan(hostId);
+    const showStats = orgReady && checkEntitlement(org, 'commerceAnalytics');
+    // The query returns the window already newest-first; re-sorting it here
+    // would only restate the order it arrived in.
+    const orders = orderWindow.rows;
+    // Filters + CSV export (AGL-96) over the loaded window.
+    const [productFilter, setProductFilter] = useState('');
+    const [dateFilter, setDateFilter] = useState('');
+    const [statusFilter, setStatusFilter] = useState('');
+    const [channelFilter, setChannelFilter] = useState('');
+    /**
+   * Disputes filter (AGL-1796), separate from Status on purpose: the two are
+   * orthogonal. An OPEN dispute sits on an order that is still `paid`, and a
+   * lost one sits on `refunded` beside every ordinary refund — so folding
+   * either into the Status select would make that control lie about what it
+   * selects.
+   */ const [disputeFilter, setDisputeFilter] = useState('');
+    /*
+   * Customer filter (AGL-2622): the buyer's address, matched as a substring
+   * of `customerEmail` so a domain finds every buyer at a company. Seeded
+   * from the URL, because the CRM's contact page links here with the
+   * person's address to answer "what has this customer ordered" — the
+   * orders count on the record is the number, and this list is the rows.
+   */ const searchParams = useSearchParams();
+    const [customerFilter, setCustomerFilter] = useState(()=>{
+        var _ref;
+        return (_ref = searchParams == null ? void 0 : searchParams.get(ORDERS_CUSTOMER_PARAM)) != null ? _ref : '';
+    });
+    const [selectedId, setSelectedId] = useState(null);
+    /*
+   * An order named in the URL opens in its dialog on arrival (AGL-2622). A
+   * contact's timeline names the order that made the person a customer,
+   * and the address it links to is this list with `?order={id}`. The
+   * window is the newest two hundred, and an order from last year is not
+   * in it, so the document is read once by id and held beside the window
+   * for the dialog; an order that IS in the window is found there first
+   * and the read is skipped. Once per id — the ref keeps a re-render from
+   * reopening a dialog the merchant has since closed — and the landing read
+   * is judged against the ref rather than an effect cleanup, because the
+   * `setSelectedId` above re-renders before the read lands and a cleanup
+   * keyed on any dep would cancel the answer to the question just asked.
+   */ const seededOrderId = (_ref = searchParams == null ? void 0 : searchParams.get(ORDERS_ORDER_PARAM)) != null ? _ref : null;
+    const [seededOrder, setSeededOrder] = useState(null);
+    const seededOpened = useRef(null);
+    useEffect(()=>{
+        if (!seededOrderId || seededOpened.current === seededOrderId) return;
+        if (orderDocs === undefined) return;
+        seededOpened.current = seededOrderId;
+        setSelectedId(seededOrderId);
+        if (orderDocs.some((order)=>order.$id === seededOrderId)) return;
+        void getDoc(doc(firestore, 'hosts', hostId, 'orders', seededOrderId)).then((snapshot)=>{
+            if (seededOpened.current !== snapshot.id || !snapshot.exists()) return;
+            setSeededOrder(_extends({}, snapshot.data(), {
+                $id: snapshot.id
+            }));
+        }).catch(()=>undefined);
+    }, [
+        seededOrderId,
+        orderDocs,
+        firestore,
+        hostId
+    ]);
+    const [draft, setDraft] = useState(null);
+    const { data: user } = useUser();
+    const { enqueueSnackbar } = useSnackbar();
+    const visibleOrders = useMemo(()=>{
+        const now = Date.now() / 1000;
+        return orders.filter((order)=>{
+            var _order_customerEmail, _lifted_channel, _order_createdAtMs;
+            var _CommerceModel_describeOrderDispute;
+            const lifted = CommerceModel.liftLegacyOrder(order);
+            // Line items first (AGL-1747): the flat `productId` is written only by
+            // the two buy-now Stripe paths, so matching on it alone hid every cart,
+            // POS and draft order behind the product filter.
+            if (productFilter && !CommerceModel.orderContainsProduct(lifted, productFilter)) {
+                return false;
+            }
+            if (statusFilter && lifted.status !== statusFilter) return false;
+            if (customerFilter && !String((_order_customerEmail = order.customerEmail) != null ? _order_customerEmail : '').toLowerCase().includes(customerFilter.trim().toLowerCase())) {
+                return false;
+            }
+            if (channelFilter && ((_lifted_channel = lifted.channel) != null ? _lifted_channel : 'online') !== channelFilter) {
+                return false;
+            }
+            if (disputeFilter === 'open' && !CommerceModel.orderHasOpenDispute(lifted)) {
+                return false;
+            }
+            // `lost` is the tone, not the raw status: a dispute that was WON also
+            // closes with money untouched, and listing it under "charged back"
+            // would tell a merchant they lost a case they won.
+            if (disputeFilter === 'lost' && ((_CommerceModel_describeOrderDispute = CommerceModel.describeOrderDispute(lifted)) == null ? void 0 : _CommerceModel_describeOrderDispute.tone) !== 'lost') {
+                return false;
+            }
+            // The same field the query orders by. `createdAt` is not universal
+            // across order writers, and a row missing it read as epoch zero — which
+            // both date filters excluded outright.
+            const created = ((_order_createdAtMs = order.createdAtMs) != null ? _order_createdAtMs : 0) / 1000;
+            if (dateFilter === '7d' && now - created > 7 * 86400) return false;
+            if (dateFilter === '30d' && now - created > 30 * 86400) return false;
+            return true;
+        });
+    }, [
+        orders,
+        productFilter,
+        dateFilter,
+        statusFilter,
+        channelFilter,
+        disputeFilter,
+        customerFilter
+    ]);
+    /**
+   * Raised over EVERY loaded order, not the visible ones (AGL-1796). A
+   * merchant filtered to "delivered" still has a deadline running on a `paid`
+   * order, and the evidence window is days long.
+   */ const openDisputes = useMemo(()=>CommerceModel.summariseOpenDisputes(orders.map((order)=>CommerceModel.liftLegacyOrder(order))), [
+        orders
+    ]);
+    /**
+   * 30-day money summary with the prior 30 days behind it (AGL-2136). Over
+   * the LOADED window, like every other figure on this card — the query is
+   * `limit(200)`, so a store past 200 orders in 60 days is summarising a
+   * slice. That is the same bound the analytics card has always had, and
+   * making this one silently different would be worse than sharing it.
+   */ const summary = useMemo(()=>CommerceModel.summarizeOrderWindow(orders, {
+            nowMs: Date.now()
+        }), [
+        orders
+    ]);
+    const handleExportCsv = useCallback(()=>{
+        // The rows themselves are built by the pure model helper (AGL-1747) so the
+        // column-by-column arithmetic is unit-testable without a Firestore mock.
+        const csv = CommerceModel.buildOrdersCsv(visibleOrders, productNames);
+        const url = URL.createObjectURL(new Blob([
+            csv
+        ], {
+            type: 'text/csv'
+        }));
+        const anchor = document.createElement('a');
+        anchor.href = url;
+        anchor.download = 'orders.csv';
+        anchor.click();
+        URL.revokeObjectURL(url);
+    }, [
+        visibleOrders,
+        productNames
+    ]);
+    /**
+   * Idempotency key for ONE draft attempt (AGL-1697).
+   *
+   * Minted lazily on the first create click, NOT per call — two clicks (or a
+   * click retried after a lost response) must present ONE key so the server
+   * replays the original payment link instead of minting a second order.
+   * Retired whenever a content field changes: an edited draft is a different
+   * order, and replaying the old one against it would hand the merchant a
+   * link priced for fields they no longer see. Answering the shipping-country
+   * ask also retires it, which is safe — that refusal is served before the
+   * server takes the claim, so the first key was never spent.
+   */ const draftAttemptKey = useRef('');
+    useEffect(()=>{
+        draftAttemptKey.current = '';
+    }, [
+        draft == null ? void 0 : draft.productId,
+        draft == null ? void 0 : draft.variantId,
+        draft == null ? void 0 : draft.quantity,
+        draft == null ? void 0 : draft.email,
+        draft == null ? void 0 : draft.shipTo
+    ]);
+    const handleDraftCreate = useCallback(async ()=>{
+        if (!(draft == null ? void 0 : draft.productId)) return;
+        setDraft((prev)=>prev ? _extends({}, prev, {
+                busy: true
+            }) : prev);
+        try {
+            if (!draftAttemptKey.current) {
+                var _ref;
+                var _globalThis_crypto_randomUUID, _globalThis_crypto;
+                draftAttemptKey.current = (_ref = (_globalThis_crypto = globalThis.crypto) == null ? void 0 : (_globalThis_crypto_randomUUID = _globalThis_crypto.randomUUID) == null ? void 0 : _globalThis_crypto_randomUUID.call(_globalThis_crypto)) != null ? _ref : `${Date.now()}-${Math.random().toString(36).slice(2)}`;
+            }
+            const response = await authorizedFetch(user, '/api/commerce/draft-order', {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json',
+                    // Stable across a retry of THIS attempt (AGL-1697), so a
+                    // double-click cannot mint two live payment links.
+                    'Idempotency-Key': draftAttemptKey.current
+                },
+                body: JSON.stringify(_extends({
+                    hostId,
+                    productId: draft.productId,
+                    variantId: draft.variantId || undefined,
+                    quantity: Number(draft.quantity) || 1,
+                    email: draft.email || undefined
+                }, draft.shipTo ? {
+                    shippingCountry: draft.shipTo
+                } : {}))
+            });
+            const payload = await response.json();
+            if (!response.ok) {
+                var _ref1;
+                // The merchant's rates differ by destination, so the server will not
+                // price this order until it knows one (AGL-1792). Reveal the field and
+                // let them answer; a store whose rates are the same everywhere, or
+                // which configured none, never sends this and never shows it.
+                if (payload == null ? void 0 : payload.needsShippingCountry) {
+                    setDraft((prev)=>{
+                        var _payload_shippingCountries;
+                        return prev ? _extends({}, prev, {
+                            shipCountries: ((_payload_shippingCountries = payload.shippingCountries) == null ? void 0 : _payload_shippingCountries.length) ? payload.shippingCountries : [
+                                ...CommerceModel.CHECKOUT_SHIPPING_COUNTRIES
+                            ]
+                        }) : prev;
+                    });
+                }
+                return void enqueueSnackbar((_ref1 = payload == null ? void 0 : payload.error) != null ? _ref1 : 'Draft order failed', {
+                    variant: 'error',
+                    allowDuplicate: true
+                });
+            }
+            await navigator.clipboard.writeText(payload.url).catch(()=>undefined);
+            enqueueSnackbar('Draft created — payment link copied', {
+                variant: 'success',
+                persist: false
+            });
+            setDraft(null);
+        } finally{
+            setDraft((prev)=>prev ? _extends({}, prev, {
+                    busy: false
+                }) : prev);
+        }
+    }, [
+        draft,
+        user,
+        hostId,
+        enqueueSnackbar
+    ]);
+    const selectedOrder = (_find = (orderDocs != null ? orderDocs : []).find((order)=>order.$id === selectedId)) != null ? _find : seededOrder && seededOrder.$id === selectedId ? seededOrder : null;
+    /**
+   * Shared by the two triggers (AGL-1805) so the empty state and the toolbar
+   * cannot drift into opening the dialog with different starting fields.
+   */ const openDraft = useCallback(()=>setDraft({
+            productId: '',
+            variantId: '',
+            quantity: '1',
+            email: ''
+        }), []);
+    /** What the draft dialog can actually offer. */ const selectableProducts = useMemo(()=>productWindow.rows.filter((product)=>!product.deletedAt), [
+        productWindow
+    ]);
+    return /*#__PURE__*/ _jsxs(CardDisplay, {
+        header: 'Orders',
+        help: pluginDocsHelp('commerce', {
+            anchor: '#orders',
+            excerpt: 'Every order with its channel, status and net total. A refunded ' + 'order shows what is left, with the gross beneath it.'
+        }),
+        contentGutterX: true,
+        contentGutterY: true,
+        children: [
+            orders.length === 0 ? /*
+         * An invitation, not a report (AGL-1805). The "Draft order" button
+         * used to live in the other arm of this ternary, so the one state a
+         * draft order exists for — no sales yet, invoice the customer you
+         * already have — was the only state that could not reach it, and
+         * every other route into the dialog needs an order to exist first.
+         *
+         * The filters stay behind deliberately: they belong to a list with
+         * rows in it. Export CSV likewise — a header-only file is not
+         * something a merchant on day one is looking for.
+         */ /*#__PURE__*/ _jsxs(Stack, {
+                spacing: 1,
+                sx: {
+                    alignItems: 'flex-start'
+                },
+                children: [
+                    /*#__PURE__*/ _jsx(Typography, {
+                        variant: "body2",
+                        color: "text.secondary",
+                        children: 'No orders yet. Storefront sales, POS sales and draft orders ' + 'all appear here as they come in.'
+                    }),
+                    /*#__PURE__*/ _jsx(Typography, {
+                        variant: "body2",
+                        color: "text.secondary",
+                        children: 'Selling to someone directly? Draft their order and send them ' + 'a payment link.'
+                    }),
+                    /*#__PURE__*/ _jsx(Button, {
+                        size: "small",
+                        variant: "contained",
+                        color: "primary",
+                        onClick: openDraft,
+                        children: 'Draft order'
+                    })
+                ]
+            }) : /*#__PURE__*/ _jsxs(Stack, {
+                spacing: 1,
+                children: [
+                    showStats ? /*#__PURE__*/ _jsxs(Stack, {
+                        direction: "row",
+                        spacing: 3,
+                        sx: {
+                            flexWrap: 'wrap',
+                            rowGap: 1
+                        },
+                        children: [
+                            /*#__PURE__*/ _jsx(CommerceStatTile, {
+                                label: "Revenue · 30d",
+                                value: `$${(summary.revenueCents / 100).toFixed(2)}`,
+                                deltaPct: summary.revenueDeltaPct,
+                                deltaCaption: "vs the previous 30 days"
+                            }),
+                            /*#__PURE__*/ _jsx(CommerceStatTile, {
+                                label: "Orders · 30d",
+                                value: String(summary.orders),
+                                deltaPct: summary.ordersDeltaPct,
+                                deltaCaption: "vs the previous 30 days"
+                            }),
+                            /*#__PURE__*/ _jsx(CommerceStatTile, {
+                                label: "Avg order value",
+                                value: `$${(summary.aovCents / 100).toFixed(2)}`,
+                                deltaPct: summary.aovDeltaPct,
+                                deltaCaption: "vs the previous 30 days"
+                            })
+                        ]
+                    }) : null,
+                    openDisputes.count > 0 ? /*#__PURE__*/ _jsxs(Alert, {
+                        severity: openDisputes.overdue ? 'error' : 'warning',
+                        action: disputeFilter === 'open' ? undefined : /*#__PURE__*/ _jsx(Button, {
+                            size: "small",
+                            color: "inherit",
+                            onClick: ()=>setDisputeFilter('open'),
+                            children: 'Show them'
+                        }),
+                        children: [
+                            /*#__PURE__*/ _jsx(AlertTitle, {
+                                children: openDisputes.count === 1 ? 'A shopper has disputed a charge with their bank' : `${openDisputes.count} charges are disputed with the shopper’s bank`
+                            }),
+                            openDisputes.soonestDaysLeft === undefined ? 'Answer in the Stripe dashboard while the case is open — an unanswered dispute is decided for the shopper.' : openDisputes.soonestDaysLeft < 0 ? 'The evidence deadline has passed on at least one of these. Stripe decides an unanswered dispute for the shopper.' : `Evidence is due to Stripe in ${openDisputes.soonestDaysLeft} day${openDisputes.soonestDaysLeft === 1 ? '' : 's'} on the tightest of these. An unanswered dispute is decided for the shopper.`
+                        ]
+                    }) : null,
+                    /*#__PURE__*/ _jsxs(Stack, {
+                        direction: "row",
+                        spacing: 1,
+                        sx: {
+                            alignItems: 'center'
+                        },
+                        children: [
+                            /*#__PURE__*/ _jsxs(TextField, {
+                                select: true,
+                                size: "small",
+                                label: "Product",
+                                value: productFilter,
+                                onChange: (event)=>setProductFilter(event.target.value),
+                                sx: {
+                                    minWidth: 160
+                                },
+                                children: [
+                                    /*#__PURE__*/ _jsx(MenuItem, {
+                                        value: "",
+                                        children: 'All products'
+                                    }),
+                                    productWindow.rows.map((product)=>{
+                                        var _product_name;
+                                        return /*#__PURE__*/ _jsx(MenuItem, {
+                                            value: product.$id,
+                                            children: (_product_name = product.name) != null ? _product_name : product.$id
+                                        }, product.$id);
+                                    })
+                                ]
+                            }),
+                            /*#__PURE__*/ _jsxs(TextField, {
+                                select: true,
+                                size: "small",
+                                label: "Period",
+                                value: dateFilter,
+                                onChange: (event)=>setDateFilter(event.target.value),
+                                sx: {
+                                    minWidth: 130
+                                },
+                                children: [
+                                    /*#__PURE__*/ _jsx(MenuItem, {
+                                        value: "",
+                                        children: 'All time'
+                                    }),
+                                    /*#__PURE__*/ _jsx(MenuItem, {
+                                        value: "7d",
+                                        children: 'Last 7 days'
+                                    }),
+                                    /*#__PURE__*/ _jsx(MenuItem, {
+                                        value: "30d",
+                                        children: 'Last 30 days'
+                                    })
+                                ]
+                            }),
+                            /*#__PURE__*/ _jsxs(TextField, {
+                                select: true,
+                                size: "small",
+                                label: "Status",
+                                value: statusFilter,
+                                onChange: (event)=>setStatusFilter(event.target.value),
+                                sx: {
+                                    minWidth: 130
+                                },
+                                children: [
+                                    /*#__PURE__*/ _jsx(MenuItem, {
+                                        value: "",
+                                        children: 'All statuses'
+                                    }),
+                                    Object.keys(CommerceModel.ORDER_STATUS_LABELS).map((status)=>/*#__PURE__*/ _jsx(MenuItem, {
+                                            value: status,
+                                            children: CommerceModel.ORDER_STATUS_LABELS[status]
+                                        }, status))
+                                ]
+                            }),
+                            /*#__PURE__*/ _jsxs(TextField, {
+                                select: true,
+                                size: "small",
+                                label: "Channel",
+                                value: channelFilter,
+                                onChange: (event)=>setChannelFilter(event.target.value),
+                                sx: {
+                                    minWidth: 120
+                                },
+                                children: [
+                                    /*#__PURE__*/ _jsx(MenuItem, {
+                                        value: "",
+                                        children: 'All channels'
+                                    }),
+                                    Object.keys(CommerceModel.ORDER_CHANNEL_LABELS).map((channel)=>/*#__PURE__*/ _jsx(MenuItem, {
+                                            value: channel,
+                                            children: CommerceModel.ORDER_CHANNEL_LABELS[channel]
+                                        }, channel))
+                                ]
+                            }),
+                            /*#__PURE__*/ _jsx(TextField, {
+                                size: "small",
+                                label: "Customer",
+                                placeholder: "Email",
+                                value: customerFilter,
+                                onChange: (event)=>setCustomerFilter(event.target.value),
+                                sx: {
+                                    minWidth: 180
+                                }
+                            }),
+                            /*#__PURE__*/ _jsxs(TextField, {
+                                select: true,
+                                size: "small",
+                                label: "Disputes",
+                                value: disputeFilter,
+                                onChange: (event)=>setDisputeFilter(event.target.value),
+                                sx: {
+                                    minWidth: 140
+                                },
+                                children: [
+                                    /*#__PURE__*/ _jsx(MenuItem, {
+                                        value: "",
+                                        children: 'All orders'
+                                    }),
+                                    /*#__PURE__*/ _jsx(MenuItem, {
+                                        value: "open",
+                                        children: 'Open dispute'
+                                    }),
+                                    /*#__PURE__*/ _jsx(MenuItem, {
+                                        value: "lost",
+                                        children: 'Charged back'
+                                    })
+                                ]
+                            }),
+                            /*#__PURE__*/ _jsx(Button, {
+                                size: "small",
+                                onClick: handleExportCsv,
+                                children: 'Export CSV'
+                            }),
+                            /*#__PURE__*/ _jsx(Button, {
+                                size: "small",
+                                variant: "contained",
+                                color: "primary",
+                                onClick: openDraft,
+                                children: 'Draft order'
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsxs(ScrollTable, {
+                        size: "small",
+                        "aria-label": "Orders",
+                        children: [
+                            /*#__PURE__*/ _jsx(TableHead, {
+                                children: /*#__PURE__*/ _jsxs(TableRow, {
+                                    children: [
+                                        /*#__PURE__*/ _jsx(TableCell, {
+                                            children: 'Order'
+                                        }),
+                                        /*#__PURE__*/ _jsx(TableCell, {
+                                            children: 'Customer'
+                                        }),
+                                        /*#__PURE__*/ _jsx(TableCell, {
+                                            children: 'Channel'
+                                        }),
+                                        /*#__PURE__*/ _jsx(TableCell, {
+                                            align: "right",
+                                            children: 'Total'
+                                        }),
+                                        /*#__PURE__*/ _jsx(TableCell, {
+                                            children: 'Status'
+                                        }),
+                                        /*#__PURE__*/ _jsx(TableCell, {
+                                            children: 'Date'
+                                        })
+                                    ]
+                                })
+                            }),
+                            /*#__PURE__*/ _jsx(TableBody, {
+                                children: visibleOrders.map((order)=>{
+                                    var _ref, _ref1, _ref2, _ref3, _ref4, _ref5, _CommerceModel_ORDER_STATUS_LABELS_lifted_status, _CommerceModel_ORDER_STATUS_COLOR_lifted_status;
+                                    var _order_createdAt_toDate, _order_createdAt, _lifted_lineItems_, _lifted_lineItems, _lifted_lineItems1, _lifted_totals;
+                                    const lifted = CommerceModel.liftLegacyOrder(order);
+                                    // A lost chargeback leaves `status: 'refunded'` (AGL-1787),
+                                    // so the status pill on this row cannot tell the two apart
+                                    // either — which is why the dispute chip sits beside it
+                                    // rather than being folded into the status.
+                                    const dispute = CommerceModel.describeOrderDispute(lifted);
+                                    const createdAt = (_order_createdAt = order.createdAt) == null ? void 0 : (_order_createdAt_toDate = _order_createdAt.toDate) == null ? void 0 : _order_createdAt_toDate.call(_order_createdAt);
+                                    const itemName = (_ref = (_ref1 = (_ref2 = (_lifted_lineItems = lifted.lineItems) == null ? void 0 : (_lifted_lineItems_ = _lifted_lineItems[0]) == null ? void 0 : _lifted_lineItems_.name) != null ? _ref2 : productNames[order.productId]) != null ? _ref1 : order.productId) != null ? _ref : '';
+                                    const extraItems = Math.max(0, ((_ref3 = (_lifted_lineItems1 = lifted.lineItems) == null ? void 0 : _lifted_lineItems1.length) != null ? _ref3 : 0) - 1);
+                                    return /*#__PURE__*/ _jsxs(TableRow, {
+                                        hover: true,
+                                        onClick: ()=>setSelectedId(order.$id),
+                                        sx: {
+                                            cursor: 'pointer'
+                                        },
+                                        children: [
+                                            /*#__PURE__*/ _jsxs(TableCell, {
+                                                children: [
+                                                    /*#__PURE__*/ _jsx(Typography, {
+                                                        variant: "body2",
+                                                        children: CommerceModel.formatOrderNumber(lifted, order.$id)
+                                                    }),
+                                                    /*#__PURE__*/ _jsx(Typography, {
+                                                        variant: "caption",
+                                                        color: "text.secondary",
+                                                        children: extraItems ? `${itemName} +${extraItems} more` : itemName
+                                                    })
+                                                ]
+                                            }),
+                                            /*#__PURE__*/ _jsx(TableCell, {
+                                                children: /*#__PURE__*/ _jsx(Typography, {
+                                                    variant: "body2",
+                                                    noWrap: true,
+                                                    children: order.customerEmail || '—'
+                                                })
+                                            }),
+                                            /*#__PURE__*/ _jsx(TableCell, {
+                                                children: /*#__PURE__*/ _jsx(Typography, {
+                                                    variant: "body2",
+                                                    children: CommerceModel.orderChannelLabel(lifted.channel)
+                                                })
+                                            }),
+                                            /*#__PURE__*/ _jsxs(TableCell, {
+                                                align: "right",
+                                                children: [
+                                                    /*#__PURE__*/ _jsx(Typography, {
+                                                        variant: "body2",
+                                                        children: `$${(CommerceModel.orderNetCents(lifted) / 100).toFixed(2)}`
+                                                    }),
+                                                    order.refundedCents ? /*#__PURE__*/ _jsx(Typography, {
+                                                        variant: "caption",
+                                                        color: "text.secondary",
+                                                        children: `$${(((_ref4 = (_ref5 = (_lifted_totals = lifted.totals) == null ? void 0 : _lifted_totals.totalCents) != null ? _ref5 : order.amountCents) != null ? _ref4 : 0) / 100).toFixed(2)} less refunds`
+                                                    }) : null
+                                                ]
+                                            }),
+                                            /*#__PURE__*/ _jsxs(TableCell, {
+                                                children: [
+                                                    /*#__PURE__*/ _jsxs(Stack, {
+                                                        direction: "row",
+                                                        spacing: 0.5,
+                                                        sx: {
+                                                            alignItems: 'center'
+                                                        },
+                                                        children: [
+                                                            /*#__PURE__*/ _jsx(Chip, {
+                                                                label: (_CommerceModel_ORDER_STATUS_LABELS_lifted_status = CommerceModel.ORDER_STATUS_LABELS[lifted.status]) != null ? _CommerceModel_ORDER_STATUS_LABELS_lifted_status : lifted.status,
+                                                                size: "small",
+                                                                color: (_CommerceModel_ORDER_STATUS_COLOR_lifted_status = CommerceModel.ORDER_STATUS_COLOR[lifted.status]) != null ? _CommerceModel_ORDER_STATUS_COLOR_lifted_status : 'default',
+                                                                variant: "outlined"
+                                                            }),
+                                                            dispute ? /*#__PURE__*/ _jsx(Tooltip, {
+                                                                title: dispute.detail,
+                                                                children: /*#__PURE__*/ _jsx(Chip, {
+                                                                    label: dispute.label,
+                                                                    size: "small",
+                                                                    color: DISPUTE_COLOR[dispute.tone],
+                                                                    variant: "filled"
+                                                                })
+                                                            }) : null
+                                                        ]
+                                                    }),
+                                                    (dispute == null ? void 0 : dispute.evidenceDaysLeft) !== undefined ? /*#__PURE__*/ _jsx(Typography, {
+                                                        variant: "caption",
+                                                        component: "div",
+                                                        color: dispute.evidenceDaysLeft < 0 ? 'error' : 'warning.main',
+                                                        children: dispute.evidenceDaysLeft < 0 ? 'Evidence deadline passed' : `Evidence due in ${dispute.evidenceDaysLeft} day${dispute.evidenceDaysLeft === 1 ? '' : 's'}`
+                                                    }) : null
+                                                ]
+                                            }),
+                                            /*#__PURE__*/ _jsxs(TableCell, {
+                                                children: [
+                                                    /*#__PURE__*/ _jsx(Typography, {
+                                                        variant: "body2",
+                                                        noWrap: true,
+                                                        children: createdAt ? createdAt.toLocaleDateString() : '—'
+                                                    }),
+                                                    /*#__PURE__*/ _jsx(Typography, {
+                                                        variant: "caption",
+                                                        color: "text.secondary",
+                                                        children: createdAt ? createdAt.toLocaleTimeString() : ''
+                                                    })
+                                                ]
+                                            })
+                                        ]
+                                    }, order.$id);
+                                })
+                            })
+                        ]
+                    }),
+                    orderWindow.truncated ? /*
+             * Where the filters and the export stop. Both run over what was
+             * read, so a store past this window would otherwise see a status
+             * filter return nothing and read it as having no such orders.
+             */ /*#__PURE__*/ _jsx(Typography, {
+                        variant: "caption",
+                        color: "text.secondary",
+                        children: `Showing the ${ORDERS_WINDOW} most recent orders. Filters and Export CSV cover these.`
+                    }) : null
+                ]
+            }),
+            selectedOrder ? /*#__PURE__*/ _jsx(OrderDetailDialog, {
+                hostId: hostId,
+                order: selectedOrder,
+                onClose: ()=>setSelectedId(null)
+            }) : null,
+            /*#__PURE__*/ _jsxs(Dialog, {
+                open: Boolean(draft),
+                onClose: ()=>setDraft(null),
+                maxWidth: "xs",
+                fullWidth: true,
+                children: [
+                    /*#__PURE__*/ _jsx(DialogTitle, {
+                        children: 'Draft order'
+                    }),
+                    /*#__PURE__*/ _jsxs(DialogContent, {
+                        sx: {
+                            display: 'flex',
+                            flexDirection: 'column',
+                            gap: 2
+                        },
+                        children: [
+                            /*#__PURE__*/ _jsx(TextField, {
+                                label: "Product",
+                                value: (_ref1 = draft == null ? void 0 : draft.productId) != null ? _ref1 : '',
+                                onChange: (event)=>setDraft((prev)=>prev ? _extends({}, prev, {
+                                            productId: event.target.value,
+                                            variantId: ''
+                                        }) : prev),
+                                size: "small",
+                                select: true,
+                                sx: {
+                                    mt: 1
+                                },
+                                /*
+             * The second dead end behind the first (AGL-1805): a store with
+             * no orders may have no products either, and a draft order is
+             * composed from one — so "Create & copy link" stays disabled. Say
+             * why, rather than opening an empty menu onto nothing.
+             */ helperText: selectableProducts.length === 0 ? 'Add a product to this store first — a draft order is built from one.' : undefined,
+                                children: selectableProducts.map((product)=>{
+                                    var _product_name;
+                                    return /*#__PURE__*/ _jsx(MenuItem, {
+                                        value: product.$id,
+                                        children: (_product_name = product.name) != null ? _product_name : product.$id
+                                    }, product.$id);
+                                })
+                            }),
+                            (()=>{
+                                var _ref;
+                                const product = productWindow.rows.find((item)=>item.$id === (draft == null ? void 0 : draft.productId));
+                                const variants = product ? CommerceModel.liftLegacyProduct(product).variants : [];
+                                return variants.length > 1 ? /*#__PURE__*/ _jsx(TextField, {
+                                    label: "Variant",
+                                    value: (_ref = draft == null ? void 0 : draft.variantId) != null ? _ref : '',
+                                    onChange: (event)=>setDraft((prev)=>prev ? _extends({}, prev, {
+                                                variantId: event.target.value
+                                            }) : prev),
+                                    size: "small",
+                                    select: true,
+                                    children: variants.map((variant)=>{
+                                        var _variant_options;
+                                        return /*#__PURE__*/ _jsx(MenuItem, {
+                                            value: variant.id,
+                                            children: `${Object.values((_variant_options = variant.options) != null ? _variant_options : {}).join(' / ') || 'Default'} — $${variant.priceUsd}`
+                                        }, variant.id);
+                                    })
+                                }) : null;
+                            })(),
+                            /*#__PURE__*/ _jsx(TextField, {
+                                label: "Quantity",
+                                value: (_ref2 = draft == null ? void 0 : draft.quantity) != null ? _ref2 : '1',
+                                onChange: (event)=>setDraft((prev)=>prev ? _extends({}, prev, {
+                                            quantity: event.target.value.replace(/[^0-9]/g, '')
+                                        }) : prev),
+                                size: "small",
+                                slotProps: {
+                                    htmlInput: {
+                                        inputMode: 'numeric'
+                                    }
+                                }
+                            }),
+                            /*#__PURE__*/ _jsx(TextField, {
+                                label: "Buyer email (optional)",
+                                value: (_ref3 = draft == null ? void 0 : draft.email) != null ? _ref3 : '',
+                                onChange: (event)=>setDraft((prev)=>prev ? _extends({}, prev, {
+                                            email: event.target.value
+                                        }) : prev),
+                                size: "small"
+                            }),
+                            (draft == null ? void 0 : (_draft_shipCountries = draft.shipCountries) == null ? void 0 : _draft_shipCountries.length) ? /*#__PURE__*/ _jsx(TextField, {
+                                label: "Ships to",
+                                value: (_ref4 = draft == null ? void 0 : draft.shipTo) != null ? _ref4 : '',
+                                onChange: (event)=>setDraft((prev)=>prev ? _extends({}, prev, {
+                                            shipTo: event.target.value
+                                        }) : prev),
+                                size: "small",
+                                select: true,
+                                helperText: 'This store’s shipping rates differ by destination, so the ' + 'payment link has to be priced for one.',
+                                children: draft.shipCountries.map((code)=>{
+                                    var _CommerceModel_CHECKOUT_SHIPPING_COUNTRY_NAMES_code;
+                                    return /*#__PURE__*/ _jsx(MenuItem, {
+                                        value: code,
+                                        children: (_CommerceModel_CHECKOUT_SHIPPING_COUNTRY_NAMES_code = CommerceModel.CHECKOUT_SHIPPING_COUNTRY_NAMES[code]) != null ? _CommerceModel_CHECKOUT_SHIPPING_COUNTRY_NAMES_code : code
+                                    }, code);
+                                })
+                            }) : null
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsxs(DialogActions, {
+                        children: [
+                            /*#__PURE__*/ _jsx(Button, {
+                                onClick: ()=>setDraft(null),
+                                children: 'Cancel'
+                            }),
+                            /*#__PURE__*/ _jsx(Button, {
+                                variant: "contained",
+                                color: "primary",
+                                disabled: !(draft == null ? void 0 : draft.productId) || (draft == null ? void 0 : draft.busy) || // Once asked, the answer is required: retrying without one is
+                                // refused again, so the button would only look broken.
+                                Boolean((draft == null ? void 0 : (_draft_shipCountries1 = draft.shipCountries) == null ? void 0 : _draft_shipCountries1.length) && !(draft == null ? void 0 : draft.shipTo)),
+                                onClick: handleDraftCreate,
+                                children: 'Create & copy link'
+                            })
+                        ]
+                    })
+                ]
+            })
+        ]
+    });
+}
+HostOrdersCard.displayName = 'HostOrdersCard';
+export default HostOrdersCard;
+
+//# sourceMappingURL=host-orders-card.component.js.map