@aglyn/plugins-commerce 1.0.0-beta.220 → 1.0.0-beta.222

package/src/lib/components/console/products-hub-card.component.js

@@ -17,6 +17,7 @@
 import { _ as _extends } from "@swc/helpers/_/_extends";
 import { _ as _object_without_properties_loose } from "@swc/helpers/_/_object_without_properties_loose";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { TransferResumeImport } from "@aglyn/aglyn/app-utils/transfer-resume-import";
 import * as Aglyn from "@aglyn/aglyn";
 import * as CommerceModel from "../../model/index.js";
 import { PRODUCT_LIST_BASE, PRODUCT_LIST_FIELDS, PRODUCT_LIST_HEADERS, PRODUCT_LIST_OPTIONS, PRODUCT_LIST_QUERY, PRODUCT_LIST_SELECT_FIELDS, productListRequestClauses } from "../../constants/product-list-query.js";
@@ -32,30 +33,21 @@ import { useListGridFilter } from "@aglyn/shared-ui-jsx/hooks/use-list-grid-filt
 import { useSnackbar } from "@aglyn/shared-ui-snackstack";
 import { Timestamp } from "@aglyn/shared-util-timestamp";
 import { Box, Button, Chip, Dialog, DialogActions, DialogContent, DialogTitle, MenuItem, Stack, TextField, Typography } from "@mui/material";
-import { addDoc, collection, doc, documentId, getCountFromServer, getDocs, limit, orderBy, query, startAfter, updateDoc, where } from "firebase/firestore";
+import { addDoc, collection, doc, documentId, getCountFromServer, limit, orderBy, query, updateDoc, where } from "firebase/firestore";
 import { useCallback, useEffect, useMemo, useState } from "react";
 import { useFirestore, useUser } from "@aglyn/tenant-feature-instance";
 import { writeSiteWideChange } from "@aglyn/tenant-feature-instance/hooks/helpers/site-wide-change";
 import { useFirestoreCollection, writeGuardedBySeed } from "@aglyn/tenant-feature-instance";
-import { listQueryConstraints, useListQuery } from "@aglyn/tenant-feature-instance/hooks/use-list-query";
+import { useListQuery } from "@aglyn/tenant-feature-instance/hooks/use-list-query";
 import { useHostResourceApi } from "@aglyn/tenant-feature-instance";
 import { useOrgPlan } from "@aglyn/tenant-feature-instance";
 import ProductEditorDialog from "./product-editor-dialog.component.js";
 import { productSlugLedger } from "./product-slugs.js";
-import { productCollectionFields, readSmartCollections } from "./smart-collections.js";
+import { productCollectionFields } from "./smart-collections.js";
 import ProductsHubZone from "./products-hub-zone.component.js";
 import { pluginDocsHelp } from "@aglyn/aglyn";
-import { useConsoleWidgetSlot } from "@aglyn/aglyn/app-utils/console-widget-slot-context";
-import { PRODUCT_IMPORT_ZONE } from "./product-zones.js";
-/** Products read per request of the CSV export's walk. */ const EXPORT_PAGE = 500;
-/**
- * The most products one CSV export writes (AGL-3321).
- *
- * The export walks the table's own query page by page, so it writes what the
- * filters and search match across the whole catalog rather than the rows on
- * screen. It stops here because the file is built in the browser, and says
- * so when it does.
- */ const EXPORT_CEILING = 10000;
+import { commerceListFilter } from "../../transfer/list-filter.js";
+import { COMMERCE_PRODUCTS_TRANSFER } from "../../transfer/transfer-keys.js";
 /**
  * How many of ONE product's license keys the dialog reads.
  *
@@ -83,8 +75,7 @@ const STATUS_COLOR = {
  * gated here on create/duplicate/import (AGL-471); server-side
  * enforcement of the client-write path rides AGL-473.
  */ export function ProductsHubCard(props) {
-    var _ref, _ref1, _ref2, _ref3, _ref4, _ref5, _ref6, _ref7, _ref8, _ref9, _ref10, _ref11, _ref12;
-    var _importing_parsed, _importing_parsed1, _importing_parsed2;
+    var _ref, _ref1, _ref2, _ref3, _ref4, _ref5, _ref6, _ref7, _ref8, _ref9, _ref10, _ref11;
     const { hostId } = props;
     const firestore = useFirestore();
     const { data: user } = useUser();
@@ -105,16 +96,14 @@ const STATUS_COLOR = {
     const [editing, setEditing] = useState(null);
     const [creating, setCreating] = useState(false);
     const [adjusting, setAdjusting] = useState(null);
-    const [importing, setImporting] = useState(null);
     const [keysFor, setKeysFor] = useState(null);
     const [keysText, setKeysText] = useState('');
     /**
-   * What the import zone set for the import in the dialog, and what the last
-   * import created with those options (AGL-2916), which the hub's zone hands
-   * to its widgets.
-   */ const [importOptions, setImportOptions] = useState({});
-    const [lastImport, setLastImport] = useState(null);
-    const WidgetSlot = useConsoleWidgetSlot();
+   * What the last import created, with the options its After import step
+   * set (AGL-2916, AGL-3531), which the hub's zone hands to its widgets.
+   */ const [lastImport, setLastImport] = useState(null);
+    // The console's import wizard and export dialog; none outside the console.
+    const transfer = Aglyn.useTransferLauncher();
     const { rows: productDocs, data: productWindow, hasMore, page, setPage, pageSize, setPageSize, plan, status: productsStatus, /**
      * The product rows the stock dialog is seeded from are unconfirmed by
      * the server (AGL-1358). A stock adjustment does not write the delta —
@@ -416,148 +405,55 @@ const STATUS_COLOR = {
         enqueueSnackbar
     ]);
     /*
-   * CSV import/export (AGL-282): Shopify-dialect columns, dry-run first.
+   * Import and export (AGL-3531) run on the console's transfer wizard and
+   * dialog, on the `commerce.products` resource: a product matched by
+   * handle, SKU or ID is updated, every step is a choice, and the export
+   * writes what the table's query matches — its filters and search — on the
+   * server, a row per variant, with a Shopify preset.
    *
-   * The export writes what the table's filters and search MATCH, across the
-   * whole catalog (AGL-3321): it walks the table's own query — the same plan,
-   * so the same scope, predicates and order — a page of `EXPORT_PAGE` at a
-   * time from a cursor, rather than writing the rows on screen. A walk that
-   * reaches `EXPORT_CEILING` stops, asks once whether anything is left, and
-   * says so when something is.
-   */ const [exporting, setExporting] = useState(false);
-    const handleExport = useCallback(async ()=>{
-        setExporting(true);
-        try {
-            const productsRef = collection(firestore, 'hosts', hostId, 'products');
-            const constraints = listQueryConstraints(plan);
-            const exported = [];
-            let cursor = null;
-            let more = false;
-            for(;;){
-                const room = EXPORT_CEILING - exported.length;
-                const snapshot = await getDocs(query(productsRef, ...constraints, ...cursor ? [
-                    startAfter(cursor)
-                ] : [], limit(room > 0 ? Math.min(EXPORT_PAGE, room) : 1)));
-                if (room <= 0) {
-                    more = !snapshot.empty;
-                    break;
-                }
-                for (const product of snapshot.docs){
-                    exported.push(_extends({}, CommerceModel.liftLegacyProduct(product.data()), {
-                        $id: product.id
-                    }));
-                }
-                if (snapshot.docs.length < Math.min(EXPORT_PAGE, room)) break;
-                cursor = snapshot.docs[snapshot.docs.length - 1];
-            }
-            const csv = CommerceModel.productsToCsv(exported);
-            const blob = new Blob([
-                csv
-            ], {
-                type: 'text/csv'
-            });
-            const anchor = document.createElement('a');
-            anchor.href = URL.createObjectURL(blob);
-            anchor.download = `products-${hostId}.csv`;
-            anchor.click();
-            URL.revokeObjectURL(anchor.href);
-            if (more) {
-                enqueueSnackbar(`Exported the first ${EXPORT_CEILING.toLocaleString()} matching ` + 'products — the most one file holds. Filter the list to export the rest.', {
-                    variant: 'info',
-                    persist: false
-                });
+   * When the wizard closes on its results, the products the import created
+   * reach the hub's zone with the options its After import step set.
+   */ const openImport = useCallback(()=>{
+        transfer == null ? void 0 : transfer.openImport({
+            resource: COMMERCE_PRODUCTS_TRANSFER,
+            scope: 'host',
+            hostId,
+            onFinished: ()=>{
+                setProductCountEpoch((epoch)=>epoch + 1);
+                void (async ()=>{
+                    const { takeProductImport, createdProductIds } = await import("../../transfer/product-import-results.js");
+                    const finished = takeProductImport(hostId);
+                    if (!finished) return;
+                    const productIds = await createdProductIds(user, finished);
+                    setLastImport({
+                        key: `${finished.jobId}-${productIds.length}`,
+                        productIds,
+                        options: finished.options
+                    });
+                })();
             }
-        } catch (error) {
-            var _ref;
-            enqueueSnackbar((_ref = error == null ? void 0 : error.message) != null ? _ref : 'Could not export the products', {
-                variant: 'warning',
-                persist: false
-            });
-        } finally{
-            setExporting(false);
-        }
+        });
     }, [
-        firestore,
+        transfer,
         hostId,
-        plan,
-        enqueueSnackbar
+        user
     ]);
-    const handleImportApply = useCallback(async ()=>{
-        const parsed = importing == null ? void 0 : importing.parsed;
-        if (!parsed || parsed.products.length === 0) return;
-        // Batch-aware cap (AGL-471): the whole import must fit the plan.
-        // Not startable until the plan is known (AGL-1064) — the old `org ?`
-        // guard let an import begin against an unknown cap and leaned on the
-        // API rejecting it partway through, leaving a half-imported catalog.
-        if (!planReady) return;
-        const batchQuota = Aglyn.checkQuota(org, 'productsPerHost', productCount + parsed.products.length - 1);
-        if (!batchQuota.allowed) {
-            return void enqueueSnackbar(`This import needs ${parsed.products.length} product slots — your ` + `plan allows ${batchQuota.limit}. See Billing to upgrade.`, {
-                variant: 'info',
-                persist: false
-            });
-        }
-        /*
-     * The duplicate-slug check asks the STORE (AGL-3321): every slug the file
-     * names, by `slug in […]`, and any suffixed one only when it is needed.
-     * It asked the table's rows, which held five hundred products and now
-     * hold one page, so a slug past them was handed out a second time.
-     */ const slugs = productSlugLedger(firestore, hostId);
-        const created = [];
-        try {
-            await slugs.ask(parsed.products.map((product)=>product.slug));
-            // One read of the host's smart collections for the whole file.
-            const smartCollections = await readSmartCollections(firestore, hostId);
-            // Each create rides the quota-enforcing API (AGL-473); the batch cap
-            // above short-circuits before we start, so this loop stays bounded.
-            for (const product of parsed.products){
-                var _ref, _ref1;
-                var _product_variants_, _product_mediaUrls;
-                const slug = await slugs.claim(product.slug);
-                const { id } = await createHostResource({
-                    hostId,
-                    resource: 'product',
-                    data: _extends({}, product, CommerceModel.productSearchFields(product), CommerceModel.productStockFields(product), {
-                        // Its smart collections (AGL-3321).
-                        collectionIds: CommerceModel.productCollectionIds(product, smartCollections),
-                        slug,
-                        priceUsd: (_ref = (_product_variants_ = product.variants[0]) == null ? void 0 : _product_variants_.priceUsd) != null ? _ref : 0,
-                        imageUrl: (_ref1 = (_product_mediaUrls = product.mediaUrls) == null ? void 0 : _product_mediaUrls[0]) != null ? _ref1 : null,
-                        createdAtMs: Date.now(),
-                        updatedAtMs: Date.now()
-                    })
-                });
-                created.push(id);
+    const openExport = useCallback(()=>{
+        transfer == null ? void 0 : transfer.openExport(_extends({
+            resource: COMMERCE_PRODUCTS_TRANSFER,
+            scope: 'host',
+            hostId
+        }, filtering ? {
+            filter: {
+                label: 'the products the list’s filters and search find',
+                value: commerceListFilter(plan)
             }
-        } catch (error) {
-            var _ref2;
-            return void enqueueSnackbar((_ref2 = error == null ? void 0 : error.message) != null ? _ref2 : 'Import failed', {
-                variant: 'warning',
-                persist: false
-            });
-        }
-        setLastImport({
-            key: `${Date.now().toString(36)}-${created.length}`,
-            productIds: created,
-            options: importOptions
-        });
-        setImportOptions({});
-        setImporting(null);
-        setProductCountEpoch((epoch)=>epoch + 1);
-        enqueueSnackbar(`Imported ${parsed.products.length} products`, {
-            variant: 'success',
-            persist: false
-        });
+        } : {}));
     }, [
-        importing,
-        firestore,
+        transfer,
         hostId,
-        createHostResource,
-        enqueueSnackbar,
-        org,
-        planReady,
-        productCount,
-        importOptions
+        filtering,
+        plan
     ]);
     const handleAdjustSave = useCallback(async ()=>{
         if (!adjusting) return;
@@ -630,9 +526,6 @@ const STATUS_COLOR = {
         productCount
     ]);
     const onCatalogCreated = useCallback(()=>setProductCountEpoch((epoch)=>epoch + 1), []);
-    const setImportOption = useCallback((key, on)=>setImportOptions((current)=>_extends({}, current, {
-                [key]: on
-            })), []);
     const formatPrice = (product)=>{
         const [min, max] = CommerceModel.productPriceRange(product);
         return min === max ? `$${min}` : `$${min}–$${max}`;
@@ -844,25 +737,35 @@ const STATUS_COLOR = {
                                 },
                                 children: 'Add product'
                             }),
-                            /*#__PURE__*/ _jsx(Button, {
+                            /*#__PURE__*/ _jsx(TransferResumeImport, {
+                                target: {
+                                    resource: COMMERCE_PRODUCTS_TRANSFER,
+                                    scope: 'host',
+                                    hostId
+                                },
+                                onFinished: ()=>setProductCountEpoch((epoch)=>epoch + 1)
+                            }),
+                            (transfer == null ? void 0 : transfer.can('import', {
+                                resource: COMMERCE_PRODUCTS_TRANSFER,
+                                scope: 'host',
+                                hostId
+                            })) ? /*#__PURE__*/ _jsx(Button, {
                                 size: "small",
                                 disabled: !planReady,
-                                onClick: ()=>{
-                                    setImportOptions({});
-                                    setImporting({
-                                        text: '',
-                                        parsed: null
-                                    });
-                                },
+                                onClick: openImport,
                                 children: 'Import'
-                            }),
-                            /*#__PURE__*/ _jsx(Button, {
+                            }) : null,
+                            (transfer == null ? void 0 : transfer.can('export', {
+                                resource: COMMERCE_PRODUCTS_TRANSFER,
+                                scope: 'host',
+                                hostId
+                            })) ? /*#__PURE__*/ _jsx(Button, {
                                 size: "small",
-                                // Nothing matches: there is nothing for the walk to write.
-                                disabled: exporting || products.length === 0 && page === 0,
-                                onClick: handleExport,
-                                children: exporting ? 'Exporting…' : 'Export'
-                            })
+                                // Nothing matches: there is nothing for the export to write.
+                                disabled: products.length === 0 && page === 0,
+                                onClick: openExport,
+                                children: 'Export'
+                            }) : null
                         ]
                     }),
                     /*#__PURE__*/ _jsx(QuotaReadoutComponent, {
@@ -1037,107 +940,6 @@ const STATUS_COLOR = {
                     })
                 ]
             }),
-            /*#__PURE__*/ _jsxs(Dialog, {
-                open: Boolean(importing),
-                onClose: ()=>setImporting(null),
-                maxWidth: "sm",
-                fullWidth: true,
-                children: [
-                    /*#__PURE__*/ _jsx(DialogTitle, {
-                        children: 'Import products (CSV)'
-                    }),
-                    /*#__PURE__*/ _jsxs(DialogContent, {
-                        sx: {
-                            display: 'flex',
-                            flexDirection: 'column',
-                            gap: 2
-                        },
-                        children: [
-                            /*#__PURE__*/ _jsx(Typography, {
-                                variant: "body2",
-                                color: "text.secondary",
-                                sx: {
-                                    mt: 1
-                                },
-                                children: 'Shopify-compatible columns (Handle, Title, Option/Variant ' + 'columns, Image Src). Paste the file contents or choose a file.'
-                            }),
-                            /*#__PURE__*/ _jsxs(Button, {
-                                component: "label",
-                                size: "small",
-                                sx: {
-                                    alignSelf: 'flex-start'
-                                },
-                                children: [
-                                    'Choose file',
-                                    /*#__PURE__*/ _jsx("input", {
-                                        type: "file",
-                                        accept: ".csv,text/csv",
-                                        hidden: true,
-                                        onChange: async (event)=>{
-                                            var _event_target_files;
-                                            const file = (_event_target_files = event.target.files) == null ? void 0 : _event_target_files[0];
-                                            if (!file) return;
-                                            const text = await file.text();
-                                            setImporting({
-                                                text,
-                                                parsed: CommerceModel.parseProductsCsv(text)
-                                            });
-                                        }
-                                    })
-                                ]
-                            }),
-                            /*#__PURE__*/ _jsx(TextField, {
-                                label: "CSV",
-                                value: (_ref4 = importing == null ? void 0 : importing.text) != null ? _ref4 : '',
-                                onChange: (event)=>setImporting({
-                                        text: event.target.value,
-                                        parsed: event.target.value.trim() ? CommerceModel.parseProductsCsv(event.target.value) : null
-                                    }),
-                                size: "small",
-                                multiline: true,
-                                minRows: 5,
-                                maxRows: 10
-                            }),
-                            (importing == null ? void 0 : importing.parsed) ? /*#__PURE__*/ _jsxs(_Fragment, {
-                                children: [
-                                    /*#__PURE__*/ _jsx(Typography, {
-                                        variant: "body2",
-                                        children: `Ready to import ${importing.parsed.products.length} products` + (importing.parsed.errors.length ? ` — ${importing.parsed.errors.length} rows skipped:` : '')
-                                    }),
-                                    importing.parsed.errors.slice(0, 5).map((error)=>/*#__PURE__*/ _jsx(Typography, {
-                                            variant: "caption",
-                                            color: "warning.main",
-                                            children: error
-                                        }, error))
-                                ]
-                            }) : null,
-                            WidgetSlot && (importing == null ? void 0 : (_importing_parsed = importing.parsed) == null ? void 0 : _importing_parsed.products.length) ? /*#__PURE__*/ _jsx(WidgetSlot, {
-                                slot: PRODUCT_IMPORT_ZONE.id,
-                                hostId: hostId,
-                                orgId: undefined,
-                                count: importing.parsed.products.length,
-                                options: importOptions,
-                                setOption: setImportOption
-                            }) : null
-                        ]
-                    }),
-                    /*#__PURE__*/ _jsxs(DialogActions, {
-                        children: [
-                            /*#__PURE__*/ _jsx(Button, {
-                                onClick: ()=>setImporting(null),
-                                children: 'Cancel'
-                            }),
-                            /*#__PURE__*/ _jsx(Button, {
-                                variant: "contained",
-                                color: "primary",
-                                disabled: !(importing == null ? void 0 : (_importing_parsed1 = importing.parsed) == null ? void 0 : _importing_parsed1.products.length),
-                                onClick: handleImportApply,
-                                children: `Import${(importing == null ? void 0 : (_importing_parsed2 = importing.parsed) == null ? void 0 : _importing_parsed2.products.length) ? ` ${importing.parsed.products.length}` : ''}`
-                            })
-                        ]
-                    })
-                ]
-            }),
             /*#__PURE__*/ _jsxs(Dialog, {
                 open: Boolean(adjusting),
                 onClose: ()=>setAdjusting(null),
@@ -1145,7 +947,7 @@ const STATUS_COLOR = {
                 fullWidth: true,
                 children: [
                     /*#__PURE__*/ _jsx(DialogTitle, {
-                        children: `Adjust stock — ${(_ref5 = adjusting == null ? void 0 : adjusting.product.name) != null ? _ref5 : ''}`
+                        children: `Adjust stock — ${(_ref4 = adjusting == null ? void 0 : adjusting.product.name) != null ? _ref4 : ''}`
                     }),
                     /*#__PURE__*/ _jsxs(DialogContent, {
                         sx: {
@@ -1156,7 +958,7 @@ const STATUS_COLOR = {
                         children: [
                             /*#__PURE__*/ _jsx(TextField, {
                                 label: "Variant",
-                                value: (_ref6 = adjusting == null ? void 0 : adjusting.variantId) != null ? _ref6 : '',
+                                value: (_ref5 = adjusting == null ? void 0 : adjusting.variantId) != null ? _ref5 : '',
                                 onChange: (event)=>setAdjusting((prev)=>prev ? _extends({}, prev, {
                                             variantId: event.target.value
                                         }) : prev),
@@ -1165,7 +967,7 @@ const STATUS_COLOR = {
                                 sx: {
                                     mt: 1
                                 },
-                                children: ((_ref7 = adjusting == null ? void 0 : adjusting.product.variants) != null ? _ref7 : []).filter((variant)=>variant.inventory != null).map((variant)=>{
+                                children: ((_ref6 = adjusting == null ? void 0 : adjusting.product.variants) != null ? _ref6 : []).filter((variant)=>variant.inventory != null).map((variant)=>{
                                     var _variant_options;
                                     return /*#__PURE__*/ _jsx(MenuItem, {
                                         value: variant.id,
@@ -1173,9 +975,9 @@ const STATUS_COLOR = {
                                     }, variant.id);
                                 })
                             }),
-                            ((_ref8 = locationDocs == null ? void 0 : locationDocs.length) != null ? _ref8 : 0) > 1 ? /*#__PURE__*/ _jsx(TextField, {
+                            ((_ref7 = locationDocs == null ? void 0 : locationDocs.length) != null ? _ref7 : 0) > 1 ? /*#__PURE__*/ _jsx(TextField, {
                                 label: "Location",
-                                value: (_ref9 = adjusting == null ? void 0 : adjusting.locationId) != null ? _ref9 : '',
+                                value: (_ref8 = adjusting == null ? void 0 : adjusting.locationId) != null ? _ref8 : '',
                                 onChange: (event)=>setAdjusting((prev)=>prev ? _extends({}, prev, {
                                             locationId: event.target.value
                                         }) : prev),
@@ -1189,7 +991,7 @@ const STATUS_COLOR = {
                             /*#__PURE__*/ _jsx(TextField, {
                                 label: "Change",
                                 placeholder: "+10 or -3",
-                                value: (_ref10 = adjusting == null ? void 0 : adjusting.delta) != null ? _ref10 : '',
+                                value: (_ref9 = adjusting == null ? void 0 : adjusting.delta) != null ? _ref9 : '',
                                 onChange: (event)=>setAdjusting((prev)=>prev ? _extends({}, prev, {
                                             delta: event.target.value.replace(/[^0-9+-]/g, '')
                                         }) : prev),
@@ -1197,7 +999,7 @@ const STATUS_COLOR = {
                             }),
                             /*#__PURE__*/ _jsxs(TextField, {
                                 label: "Reason",
-                                value: (_ref11 = adjusting == null ? void 0 : adjusting.reason) != null ? _ref11 : 'restock',
+                                value: (_ref10 = adjusting == null ? void 0 : adjusting.reason) != null ? _ref10 : 'restock',
                                 onChange: (event)=>setAdjusting((prev)=>prev ? _extends({}, prev, {
                                             reason: event.target.value
                                         }) : prev),
@@ -1258,7 +1060,7 @@ const STATUS_COLOR = {
                     // keeps the cap off the dialog's shoulders (AGL-1716).
                     setProductCountEpoch((epoch)=>epoch + 1);
                 }
-            }, (_ref12 = editing == null ? void 0 : editing.$id) != null ? _ref12 : creating ? 'new' : 'closed')
+            }, (_ref11 = editing == null ? void 0 : editing.$id) != null ? _ref11 : creating ? 'new' : 'closed')
         ]
     });
 }