@withpotter/components 0.13.0-next.101

package/dist/product-editor/product-editor-page.js

@@ -0,0 +1,374 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState, useEffect, useMemo, useCallback } from "react";
+import { useRouter, useParams } from "next/navigation";
+import { useAuth } from "@withpotter/lib/auth-context";
+import { useCurrentTemplate } from "@withpotter/lib/template-context";
+import { useProductFormState } from "@withpotter/hooks/use-product-form-state";
+import { useProductDraft } from "@withpotter/hooks/use-product-draft";
+import { useProductEditDraft } from "@withpotter/hooks/use-product-edit-draft";
+import { useApiDispatch } from "@withpotter/hooks/use-api-dispatch";
+import { useEditorDirtyTracking } from "@withpotter/components/editor-shared";
+import { contentApi } from "@withpotter/lib/api/content";
+import { digitalFilesApi } from "@withpotter/lib/api/digital-files";
+import { inventoryApi } from "@withpotter/lib/api/inventory";
+import { DetailPageSkeleton } from "@withpotter/ui-kit/page-skeletons";
+import { AlertTriangle, ArrowLeft } from "lucide-react";
+import { useIndustryConfig } from "@withpotter/hooks/use-industry-config";
+import { resolveItemLabel } from "@withpotter/lib/industry-configs";
+import { useEntityLabel } from "@withpotter/lib/intents/use-entity-label";
+import { useItemLinks } from "@withpotter/lib/use-item-links";
+import { useDestinationLabel } from "@withpotter/lib/intents/use-destination-label";
+import { useToast } from "@withpotter/ui-kit/use-toast";
+import { ProductEditor } from "./product-editor";
+import { useConfirm } from "@withpotter/ui-kit/confirm-dialog";
+import {
+  errorMessage,
+  errorStatus,
+  toCardSummary
+} from "./product-editor-page-utils";
+import { useProductEditorCategories } from "./use-product-editor-categories";
+function ProductEditorPage({ mode }) {
+  const confirm = useConfirm();
+  const router = useRouter();
+  const links = useItemLinks();
+  const params = useParams();
+  const { tenant, refreshTenant } = useAuth();
+  const { template } = useCurrentTemplate();
+  const { toast } = useToast();
+  const [created, setCreated] = useState(false);
+  const tenantSlug = tenant?.slug;
+  const productId = mode === "edit" ? params?.productId : void 0;
+  const [product, setProduct] = useState(null);
+  const [loadingProduct, setLoadingProduct] = useState(mode === "edit");
+  const [loadError, setLoadError] = useState(null);
+  useEffect(() => {
+    if (mode !== "edit" || !tenantSlug || !productId) return;
+    let cancelled = false;
+    const fetch = async () => {
+      setLoadingProduct(true);
+      setLoadError(null);
+      try {
+        const data = await inventoryApi.getById(tenantSlug, productId);
+        if (!cancelled) setProduct(data);
+      } catch (e) {
+        if (!cancelled)
+          setLoadError(errorMessage(e) || "Failed to load product");
+      } finally {
+        if (!cancelled) setLoadingProduct(false);
+      }
+    };
+    fetch();
+    return () => {
+      cancelled = true;
+    };
+  }, [mode, tenantSlug, productId]);
+  const state = useProductFormState({
+    contentType: null,
+    product: mode === "edit" ? product : null
+  });
+  const [formValues, setFormValues] = useState({});
+  useEffect(() => {
+    if (product?.data) {
+      setFormValues(product.data);
+    }
+  }, [product?.data]);
+  const setFormValuesAndSync = useCallback((v) => {
+    setFormValues(v);
+  }, []);
+  const discardDraft = useProductDraft({
+    enabled: mode === "create",
+    tenantSlug,
+    state,
+    formValues,
+    setFormValues: setFormValuesAndSync
+  });
+  const discardEditDraft = useProductEditDraft({
+    enabled: mode === "edit",
+    tenantSlug,
+    productId,
+    productTitle: product?.title,
+    loaded: !loadingProduct && !!product,
+    state,
+    formValues,
+    setFormValues: setFormValuesAndSync
+  });
+  const { save: apiDispatchSave } = useApiDispatch();
+  const { tenantCategories, handleCreateCategory, handleDeleteCategory } = useProductEditorCategories({
+    tenantSlug,
+    tenantSettings: tenant?.settings,
+    categoryKey: state.categoryKey,
+    selectedCategories: state.categories,
+    setSelectedCategories: state.setCategories,
+    refreshTenant
+  });
+  const contentTypeSchemas = useMemo(
+    () => Object.fromEntries(
+      Object.entries(template?.contentTypes || {}).map(([key, ct]) => [
+        key,
+        ct.fields
+      ])
+    ),
+    [template?.contentTypes]
+  );
+  const templateFieldGroups = useMemo(
+    () => (template?.contentTypes?.products?.fieldGroups ?? []).map((group) => ({
+      name: group.name,
+      label: group.label,
+      description: group.description,
+      fields: group.fields
+    })),
+    [template?.contentTypes]
+  );
+  const industryConfig = useIndustryConfig();
+  const tenantSettings = tenant?.settings;
+  const editorBehaviors = Array.isArray(tenantSettings?.enabledBehaviors) ? tenantSettings.enabledBehaviors : ["sellable"];
+  const intentItemLabel = useEntityLabel("item");
+  const legacyItemLabel = resolveItemLabel(industryConfig, editorBehaviors);
+  const itemLabel = intentItemLabel?.singular ? intentItemLabel : legacyItemLabel;
+  const listLabel = useDestinationLabel("catalog") ?? itemLabel.plural;
+  const [savedCustomFieldDefinitions, setSavedCustomFieldDefinitions] = useState([]);
+  const onSaveCustomFieldDefinition = useCallback(
+    (def) => {
+      setSavedCustomFieldDefinitions((prev) => {
+        const exists = prev.findIndex((d) => d.key === def.key);
+        if (exists >= 0) {
+          const updated = [...prev];
+          updated[exists] = def;
+          return updated;
+        }
+        return [...prev, def];
+      });
+    },
+    []
+  );
+  const onRemoveCustomFieldDefinition = useCallback((key) => {
+    setSavedCustomFieldDefinitions((prev) => prev.filter((d) => d.key !== key));
+  }, []);
+  const { setIsDirty } = useEditorDirtyTracking([
+    state.title,
+    state.slug,
+    state.description,
+    state.price,
+    state.compareAtPrice,
+    state.costPrice,
+    state.trackInventory,
+    state.quantity,
+    state.lowStockThreshold,
+    state.featured,
+    state.isActive,
+    state.heroImage,
+    state.galleryItems,
+    state.categories,
+    state.behaviorConfigs,
+    state.gatedBy,
+    state.gatedByPlanIds,
+    state.selectedCollectionIds,
+    state.assigneeIds,
+    formValues
+  ]);
+  const [deleting, setDeleting] = useState(false);
+  const handleDelete = useCallback(async () => {
+    if (!tenantSlug || !productId) return;
+    const ok = await confirm({
+      title: `Delete this ${itemLabel.singular.toLowerCase()}?`,
+      description: "Orders that already include it keep their record. This cannot be undone.",
+      tone: "danger",
+      confirmLabel: "Delete"
+    });
+    if (!ok) return;
+    setDeleting(true);
+    try {
+      await inventoryApi.delete(tenantSlug, productId);
+      router.replace(links.list);
+    } catch (e) {
+      state.setError(errorMessage(e) || "Failed to delete");
+      setDeleting(false);
+    }
+  }, [
+    tenantSlug,
+    productId,
+    confirm,
+    itemLabel.singular,
+    router,
+    state,
+    links
+  ]);
+  const handleSave = useCallback(async () => {
+    if (!tenantSlug) return;
+    const title = formValues.title || state.title;
+    if (!title?.trim()) {
+      state.setError("Title is required");
+      return;
+    }
+    state.setSaving(true);
+    state.setError(null);
+    try {
+      const apiContentType = "products";
+      const description = formValues.description || state.description || "";
+      const result = await apiDispatchSave(
+        {
+          title: title.trim(),
+          slug: formValues.slug || state.slug || "",
+          description: description || void 0,
+          category: state.categories.length > 0 ? state.categories.join(",") : void 0,
+          featured: state.featured,
+          isActive: state.isActive,
+          // The editor works one list; storage keeps cover and gallery apart.
+          heroImage: state.heroImage,
+          galleryItems: state.galleryItemsWithoutCover,
+          price: state.price,
+          compareAtPrice: state.compareAtPrice,
+          costPrice: state.costPrice,
+          currency: state.tenantCurrency,
+          trackInventory: state.trackInventory,
+          quantity: typeof state.quantity === "number" ? state.quantity : 0,
+          lowStockThreshold: typeof state.lowStockThreshold === "number" ? state.lowStockThreshold : 5,
+          productType: state.productType,
+          behaviorConfigs: state.behaviorConfigs,
+          gatedBy: state.gatedBy,
+          gatedByPlanIds: state.gatedByPlanIds,
+          hasVariants: state.hasVariants,
+          variants: state.variants,
+          templateValues: {
+            ...formValues,
+            // Derived, never typed — see toCardSummary. Always recomputed, so
+            // an item edited after this change stops carrying a stale summary
+            // the merchant no longer has any field to correct.
+            shortDescription: toCardSummary(description),
+            category: state.categories.length > 0 ? state.categories.join(",") : void 0
+          },
+          allCollections: state.allCollections,
+          selectedCollectionIds: state.selectedCollectionIds,
+          resourceRequirements: state.resourceRequirements,
+          intent: state.intentKey,
+          assigneeIds: state.assigneeIds
+        },
+        apiContentType,
+        productId
+      );
+      setIsDirty(false);
+      if (mode === "create") {
+        if (state.pendingFiles.length > 0) {
+          for (const file of state.pendingFiles) {
+            try {
+              await digitalFilesApi.upload(tenantSlug, result.id, file);
+            } catch (err) {
+              console.error("Failed to upload pending file:", file.name, err);
+            }
+          }
+          state.setPendingFiles([]);
+        }
+        toast({
+          title: `${itemLabel.singular} created`,
+          description: "It has been saved."
+        });
+        const next = links.detail(result.id);
+        discardDraft();
+        router.prefetch(next);
+        setCreated(true);
+        await new Promise((resolve) => setTimeout(resolve, 750));
+        router.replace(next);
+      } else {
+        toast({
+          title: `${itemLabel.singular} saved`,
+          description: "Your changes have been saved."
+        });
+        discardEditDraft();
+        router.replace(links.list);
+      }
+    } catch (err) {
+      console.error("Failed to save:", err);
+      state.setError(err instanceof Error ? err.message : "Failed to save");
+    } finally {
+      state.setSaving(false);
+    }
+  }, [
+    tenantSlug,
+    formValues,
+    state,
+    apiDispatchSave,
+    productId,
+    mode,
+    router,
+    setIsDirty,
+    toast,
+    links,
+    itemLabel.singular,
+    discardDraft,
+    discardEditDraft
+  ]);
+  const backUrl = mode === "edit" && productId ? links.detail(productId) : links.list;
+  const isSeriesChild = Boolean(product?.seriesId);
+  const handleCreateSeries = useCallback(
+    async (recurrence) => {
+      if (!tenantSlug || !productId) return;
+      try {
+        await contentApi.createSeries(
+          tenantSlug,
+          "products",
+          productId,
+          recurrence
+        );
+      } catch (e) {
+        const is404 = errorStatus(e) === 404 || errorMessage(e)?.includes("Not Found");
+        state.setError(
+          is404 ? "Event series is not available yet. Please save and try again later." : errorMessage(e) || "Failed to create series"
+        );
+        throw e;
+      }
+    },
+    [tenantSlug, productId, state]
+  );
+  if (mode === "edit" && loadingProduct) {
+    return /* @__PURE__ */ jsx(DetailPageSkeleton, { maxWidth: "max-w-6xl" });
+  }
+  if (mode === "edit" && (loadError || !product)) {
+    return /* @__PURE__ */ jsxs("div", { className: "max-w-4xl mx-auto px-6 py-8", children: [
+      /* @__PURE__ */ jsxs(
+        "button",
+        {
+          type: "button",
+          onClick: () => router.push(links.list),
+          className: "flex items-center gap-2 text-sm text-[var(--text-secondary)] hover:text-[var(--text-primary)] mb-6 transition-colors",
+          children: [
+            /* @__PURE__ */ jsx(ArrowLeft, { className: "size-4" }),
+            `Back to ${listLabel}`
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsxs("div", { className: "bg-[var(--error-bg)] border border-[var(--error)]/20 rounded-md p-6 text-center", children: [
+        /* @__PURE__ */ jsx(AlertTriangle, { className: "size-8 text-[var(--error)] mx-auto mb-2" }),
+        /* @__PURE__ */ jsx("p", { className: "text-[var(--error)] font-medium", children: loadError || `${itemLabel.singular} not found` })
+      ] })
+    ] });
+  }
+  return /* @__PURE__ */ jsx(
+    ProductEditor,
+    {
+      state,
+      formValues,
+      setFormValues: setFormValuesAndSync,
+      tenantCategories,
+      tenantSlug,
+      contentTypeSchemas,
+      templateFieldGroups,
+      created,
+      onSave: handleSave,
+      onBack: () => router.push(backUrl),
+      onDelete: mode === "edit" ? handleDelete : void 0,
+      deleting,
+      savedCustomFieldDefinitions,
+      onSaveCustomFieldDefinition,
+      onRemoveCustomFieldDefinition,
+      onCreateCategory: handleCreateCategory,
+      onDeleteCategory: handleDeleteCategory,
+      onCreateSeries: mode === "edit" ? handleCreateSeries : void 0,
+      isSeriesChild
+    }
+  );
+}
+export {
+  ProductEditorPage
+};
+//# sourceMappingURL=product-editor-page.js.map

package/dist/product-editor/product-editor-page.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/product-editor/product-editor-page.tsx"],"sourcesContent":["'use client';\n\nimport { useState, useEffect, useMemo, useCallback } from 'react';\nimport { useRouter, useParams } from 'next/navigation';\nimport { useAuth } from '@withpotter/lib/auth-context';\nimport { useCurrentTemplate } from '@withpotter/lib/template-context';\nimport { useProductFormState } from '@withpotter/hooks/use-product-form-state';\nimport { useProductDraft } from '@withpotter/hooks/use-product-draft';\nimport { useProductEditDraft } from '@withpotter/hooks/use-product-edit-draft';\nimport { useApiDispatch } from '@withpotter/hooks/use-api-dispatch';\nimport { useEditorDirtyTracking } from '@withpotter/components/editor-shared';\nimport { contentApi } from '@withpotter/lib/api/content';\nimport { digitalFilesApi } from '@withpotter/lib/api/digital-files';\nimport { inventoryApi } from '@withpotter/lib/api/inventory';\nimport type { Product, EventRecurrenceRule } from '@withpotter/lib/product-types';\nimport type { CustomFieldDefinition } from '@withpotter/components/custom-fields-step';\nimport { DetailPageSkeleton } from '@withpotter/ui-kit/page-skeletons';\nimport { AlertTriangle, ArrowLeft } from 'lucide-react';\nimport { useIndustryConfig } from '@withpotter/hooks/use-industry-config';\nimport { resolveItemLabel } from '@withpotter/lib/industry-configs';\nimport { useEntityLabel } from '@withpotter/lib/intents/use-entity-label';\nimport { useItemLinks } from '@withpotter/lib/use-item-links';\nimport { useDestinationLabel } from '@withpotter/lib/intents/use-destination-label';\nimport { useToast } from '@withpotter/ui-kit/use-toast';\n\nimport { ProductEditor } from './product-editor';\nimport { useConfirm } from '@withpotter/ui-kit/confirm-dialog';\nimport {\n  errorMessage,\n  errorStatus,\n  toCardSummary,\n} from './product-editor-page-utils';\nimport { useProductEditorCategories } from './use-product-editor-categories';\n\n// ============================================================================\n// TYPES\n// ============================================================================\n\ninterface ProductEditorPageProps {\n  mode: 'create' | 'edit';\n}\n\n// ============================================================================\n// COMPONENT\n// ============================================================================\n\nexport function ProductEditorPage({ mode }: ProductEditorPageProps) {\n  const confirm = useConfirm();\n  const router = useRouter();\n  const links = useItemLinks();\n  const params = useParams();\n  const { tenant, refreshTenant } = useAuth();\n  const { template } = useCurrentTemplate();\n  const { toast } = useToast();\n  const [created, setCreated] = useState(false);\n  const tenantSlug = tenant?.slug;\n\n  const productId = mode === 'edit' ? (params?.productId as string) : undefined;\n\n  // -- Product data loading (edit mode) --\n  const [product, setProduct] = useState<Product | null>(null);\n  const [loadingProduct, setLoadingProduct] = useState(mode === 'edit');\n  const [loadError, setLoadError] = useState<string | null>(null);\n\n  useEffect(() => {\n    if (mode !== 'edit' || !tenantSlug || !productId) return;\n    let cancelled = false;\n\n    const fetch = async () => {\n      setLoadingProduct(true);\n      setLoadError(null);\n      try {\n        const data = await inventoryApi.getById(tenantSlug, productId);\n        if (!cancelled) setProduct(data as unknown as Product);\n      } catch (e) {\n        if (!cancelled)\n          setLoadError(errorMessage(e) || 'Failed to load product');\n      } finally {\n        if (!cancelled) setLoadingProduct(false);\n      }\n    };\n    fetch();\n    return () => {\n      cancelled = true;\n    };\n  }, [mode, tenantSlug, productId]);\n\n  // -- Form state --\n  const state = useProductFormState({\n    contentType: null,\n    product: mode === 'edit' ? product : null,\n  });\n\n  // -- Template field values --\n  const [formValues, setFormValues] = useState<Record<string, unknown>>({});\n\n  // Product data arrives asynchronously and hydrates the template fields.\n  useEffect(() => {\n    if (product?.data) {\n      // eslint-disable-next-line react-hooks/set-state-in-effect\n      setFormValues(product.data as Record<string, unknown>);\n    }\n  }, [product?.data]);\n\n  // Sync basic fields from state into formValues (for DynamicForm compatibility)\n  const setFormValuesAndSync = useCallback((v: Record<string, unknown>) => {\n    setFormValues(v);\n  }, []);\n\n  // A new product survives an interruption (a call, switching apps).\n  const discardDraft = useProductDraft({\n    enabled: mode === 'create',\n    tenantSlug,\n    state,\n    formValues,\n    setFormValues: setFormValuesAndSync,\n  });\n\n  // Edits to an existing product survive it too, but only against the same\n  // version of the product (see the hook).\n  const discardEditDraft = useProductEditDraft({\n    enabled: mode === 'edit',\n    tenantSlug,\n    productId,\n    productTitle: product?.title,\n    loaded: !loadingProduct && !!product,\n    state,\n    formValues,\n    setFormValues: setFormValuesAndSync,\n  });\n\n  // -- API dispatch --\n  const { save: apiDispatchSave } = useApiDispatch();\n\n  const { tenantCategories, handleCreateCategory, handleDeleteCategory } =\n    useProductEditorCategories({\n      tenantSlug,\n      tenantSettings: tenant?.settings as Record<string, unknown> | undefined,\n      categoryKey: state.categoryKey,\n      selectedCategories: state.categories,\n      setSelectedCategories: state.setCategories,\n      refreshTenant,\n    });\n\n  const contentTypeSchemas = useMemo(\n    () =>\n      Object.fromEntries(\n        Object.entries(template?.contentTypes || {}).map(([key, ct]) => [\n          key,\n          ct.fields,\n        ]),\n      ),\n    [template?.contentTypes],\n  );\n\n  // The template's own grouping of its extra fields, so the editor can draw\n  // them under the headings the template author wrote.\n  const templateFieldGroups = useMemo(\n    () =>\n      (template?.contentTypes?.products?.fieldGroups ?? []).map((group) => ({\n        name: group.name,\n        label: group.label,\n        description: group.description,\n        fields: group.fields,\n      })),\n    [template?.contentTypes],\n  );\n\n  const industryConfig = useIndustryConfig();\n  const tenantSettings = tenant?.settings as\n    Record<string, unknown> | undefined;\n  const editorBehaviors = (\n    Array.isArray(tenantSettings?.enabledBehaviors)\n      ? tenantSettings!.enabledBehaviors\n      : ['sellable']\n  ) as string[];\n  /**\n   * What this business calls the thing being created.\n   *\n   * The archetype's word wins. `resolveItemLabel` reads the legacy\n   * industry-config system, which predates business models and does not know\n   * `rent-property` exists — so a landlord whose sidebar said Properties, whose\n   * list said Properties and whose empty state said Properties would open the\n   * editor and be told they were making a Product. The intent registry is what\n   * every other surface reads; this one was the holdout.\n   *\n   * The old resolver stays as the fallback for tenants that have not picked a\n   * business model, which is the only case it was ever right about.\n   */\n  const intentItemLabel = useEntityLabel('item');\n  const legacyItemLabel = resolveItemLabel(industryConfig, editorBehaviors);\n  const itemLabel = intentItemLabel?.singular\n    ? intentItemLabel\n    : legacyItemLabel;\n\n  // The place, not the thing — see the breadcrumb note in product-editor.tsx.\n  const listLabel = useDestinationLabel('catalog') ?? itemLabel.plural;\n\n  // -- Custom field definitions (workspace-level) --\n  const [savedCustomFieldDefinitions, setSavedCustomFieldDefinitions] =\n    useState<CustomFieldDefinition[]>([]);\n\n  const onSaveCustomFieldDefinition = useCallback(\n    (def: CustomFieldDefinition) => {\n      setSavedCustomFieldDefinitions((prev) => {\n        const exists = prev.findIndex((d) => d.key === def.key);\n        if (exists >= 0) {\n          const updated = [...prev];\n          updated[exists] = def;\n          return updated;\n        }\n        return [...prev, def];\n      });\n    },\n    [],\n  );\n\n  const onRemoveCustomFieldDefinition = useCallback((key: string) => {\n    setSavedCustomFieldDefinitions((prev) => prev.filter((d) => d.key !== key));\n  }, []);\n\n  // -- Dirty tracking --\n  const { setIsDirty } = useEditorDirtyTracking([\n    state.title,\n    state.slug,\n    state.description,\n    state.price,\n    state.compareAtPrice,\n    state.costPrice,\n    state.trackInventory,\n    state.quantity,\n    state.lowStockThreshold,\n    state.featured,\n    state.isActive,\n    state.heroImage,\n    state.galleryItems,\n    state.categories,\n    state.behaviorConfigs,\n    state.gatedBy,\n    state.gatedByPlanIds,\n    state.selectedCollectionIds,\n    state.assigneeIds,\n    formValues,\n  ]);\n\n  // -- Delete handler (edit mode) --\n  const [deleting, setDeleting] = useState(false);\n  const handleDelete = useCallback(async () => {\n    if (!tenantSlug || !productId) return;\n    const ok = await confirm({\n      title: `Delete this ${itemLabel.singular.toLowerCase()}?`,\n      description:\n        'Orders that already include it keep their record. This cannot be undone.',\n      tone: 'danger',\n      confirmLabel: 'Delete',\n    });\n    if (!ok) return;\n    setDeleting(true);\n    try {\n      await inventoryApi.delete(tenantSlug, productId);\n      router.replace(links.list);\n    } catch (e) {\n      state.setError(errorMessage(e) || 'Failed to delete');\n      setDeleting(false);\n    }\n  }, [\n    tenantSlug,\n    productId,\n    confirm,\n    itemLabel.singular,\n    router,\n    state,\n    links,\n  ]);\n\n  // -- Save handler --\n  const handleSave = useCallback(async () => {\n    if (!tenantSlug) return;\n\n    const title = (formValues.title as string) || state.title;\n    if (!title?.trim()) {\n      state.setError('Title is required');\n      return;\n    }\n\n    state.setSaving(true);\n    state.setError(null);\n\n    try {\n      const apiContentType = 'products';\n\n      const description =\n        (formValues.description as string) || state.description || '';\n\n      const result = await apiDispatchSave(\n        {\n          title: title.trim(),\n          slug: (formValues.slug as string) || state.slug || '',\n          description: description || undefined,\n          category:\n            state.categories.length > 0\n              ? state.categories.join(',')\n              : undefined,\n          featured: state.featured,\n          isActive: state.isActive,\n          // The editor works one list; storage keeps cover and gallery apart.\n          heroImage: state.heroImage,\n          galleryItems: state.galleryItemsWithoutCover,\n          price: state.price,\n          compareAtPrice: state.compareAtPrice,\n          costPrice: state.costPrice,\n          currency: state.tenantCurrency,\n          trackInventory: state.trackInventory,\n          quantity: typeof state.quantity === 'number' ? state.quantity : 0,\n          lowStockThreshold:\n            typeof state.lowStockThreshold === 'number'\n              ? state.lowStockThreshold\n              : 5,\n          productType: state.productType,\n          behaviorConfigs: state.behaviorConfigs,\n          gatedBy: state.gatedBy,\n          gatedByPlanIds: state.gatedByPlanIds,\n          hasVariants: state.hasVariants,\n          variants: state.variants,\n          templateValues: {\n            ...formValues,\n            // Derived, never typed — see toCardSummary. Always recomputed, so\n            // an item edited after this change stops carrying a stale summary\n            // the merchant no longer has any field to correct.\n            shortDescription: toCardSummary(description),\n            category:\n              state.categories.length > 0\n                ? state.categories.join(',')\n                : undefined,\n          },\n          allCollections: state.allCollections,\n          selectedCollectionIds: state.selectedCollectionIds,\n          resourceRequirements: state.resourceRequirements,\n          intent: state.intentKey,\n          assigneeIds: state.assigneeIds,\n        },\n        apiContentType,\n        productId,\n      );\n\n      setIsDirty(false);\n\n      if (mode === 'create') {\n        // Upload any pending digital files\n        if (state.pendingFiles.length > 0) {\n          for (const file of state.pendingFiles) {\n            try {\n              await digitalFilesApi.upload(tenantSlug, result.id, file);\n            } catch (err) {\n              console.error('Failed to upload pending file:', file.name, err);\n            }\n          }\n          state.setPendingFiles([]);\n        }\n\n        toast({\n          title: `${itemLabel.singular} created`,\n          description: 'It has been saved.',\n        });\n        // Let the button finish its story — green, a check — before the page\n        // moves on. The detail route is warmed first so the wait is the only\n        // cost, and it is kept short: this is a flourish, not a delay.\n        const next = links.detail(result.id);\n        discardDraft();\n        router.prefetch(next);\n        setCreated(true);\n        await new Promise((resolve) => setTimeout(resolve, 750));\n        router.replace(next);\n      } else {\n        toast({\n          title: `${itemLabel.singular} saved`,\n          description: 'Your changes have been saved.',\n        });\n        discardEditDraft();\n        router.replace(links.list);\n      }\n    } catch (err) {\n      console.error('Failed to save:', err);\n      state.setError(err instanceof Error ? err.message : 'Failed to save');\n    } finally {\n      state.setSaving(false);\n    }\n  }, [\n    tenantSlug,\n    formValues,\n    state,\n    apiDispatchSave,\n    productId,\n    mode,\n    router,\n    setIsDirty,\n    toast,\n    links,\n    itemLabel.singular,\n    discardDraft,\n    discardEditDraft,\n  ]);\n\n  const backUrl =\n    mode === 'edit' && productId ? links.detail(productId) : links.list;\n\n  // -- Event series --\n  const isSeriesChild = Boolean(product?.seriesId);\n\n  const handleCreateSeries = useCallback(\n    async (recurrence: EventRecurrenceRule) => {\n      if (!tenantSlug || !productId) return;\n      try {\n        await contentApi.createSeries(\n          tenantSlug,\n          'products',\n          productId,\n          recurrence,\n        );\n      } catch (e) {\n        const is404 =\n          errorStatus(e) === 404 || errorMessage(e)?.includes('Not Found');\n        state.setError(\n          is404\n            ? 'Event series is not available yet. Please save and try again later.'\n            : errorMessage(e) || 'Failed to create series',\n        );\n        throw e;\n      }\n    },\n    [tenantSlug, productId, state],\n  );\n\n  // -- Loading states --\n  if (mode === 'edit' && loadingProduct) {\n    return <DetailPageSkeleton maxWidth=\"max-w-6xl\" />;\n  }\n\n  if (mode === 'edit' && (loadError || !product)) {\n    return (\n      <div className=\"max-w-4xl mx-auto px-6 py-8\">\n        <button\n          type=\"button\"\n          onClick={() => router.push(links.list)}\n          className=\"flex items-center gap-2 text-sm text-[var(--text-secondary)] hover:text-[var(--text-primary)] mb-6 transition-colors\"\n        >\n          <ArrowLeft className=\"size-4\" />\n          {`Back to ${listLabel}`}\n        </button>\n        <div className=\"bg-[var(--error-bg)] border border-[var(--error)]/20 rounded-md p-6 text-center\">\n          <AlertTriangle className=\"size-8 text-[var(--error)] mx-auto mb-2\" />\n          <p className=\"text-[var(--error)] font-medium\">\n            {loadError || `${itemLabel.singular} not found`}\n          </p>\n        </div>\n      </div>\n    );\n  }\n\n  return (\n    <ProductEditor\n      state={state}\n      formValues={formValues}\n      setFormValues={setFormValuesAndSync}\n      tenantCategories={tenantCategories}\n      tenantSlug={tenantSlug}\n      contentTypeSchemas={contentTypeSchemas}\n      templateFieldGroups={templateFieldGroups}\n      created={created}\n      onSave={handleSave}\n      onBack={() => router.push(backUrl)}\n      onDelete={mode === 'edit' ? handleDelete : undefined}\n      deleting={deleting}\n      savedCustomFieldDefinitions={savedCustomFieldDefinitions}\n      onSaveCustomFieldDefinition={onSaveCustomFieldDefinition}\n      onRemoveCustomFieldDefinition={onRemoveCustomFieldDefinition}\n      onCreateCategory={handleCreateCategory}\n      onDeleteCategory={handleDeleteCategory}\n      onCreateSeries={mode === 'edit' ? handleCreateSeries : undefined}\n      isSeriesChild={isSeriesChild}\n    />\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/product-editor/product-editor.d.ts

@@ -0,0 +1,33 @@
+import type { ContentFieldConfig } from '@withpotter/lib/template-types';
+import type { EventRecurrenceRule } from '@withpotter/lib/product-types';
+import type { ProductFormState } from '@withpotter/hooks/use-product-form-state';
+import type { CustomFieldDefinition } from '@withpotter/components/custom-fields-step';
+import type { TemplateFieldGroup } from './sections/template-fields-section';
+interface ProductEditorProps {
+    state: ProductFormState;
+    formValues: Record<string, unknown>;
+    setFormValues: (v: Record<string, unknown>) => void;
+    tenantCategories: Record<string, {
+        value: string;
+        label: string;
+        sortOrder?: number;
+    }[]>;
+    tenantSlug?: string;
+    contentTypeSchemas: Record<string, ContentFieldConfig[]>;
+    templateFieldGroups?: TemplateFieldGroup[];
+    onSave: () => void;
+    /** The record was just created: the save button celebrates, then the page moves on. */
+    created?: boolean;
+    onBack: () => void;
+    onDelete?: () => void;
+    deleting?: boolean;
+    savedCustomFieldDefinitions: CustomFieldDefinition[];
+    onSaveCustomFieldDefinition: (def: CustomFieldDefinition) => void;
+    onRemoveCustomFieldDefinition: (key: string) => void;
+    onCreateCategory?: (label: string) => void;
+    onDeleteCategory?: (value: string) => void;
+    onCreateSeries?: (recurrence: EventRecurrenceRule) => Promise<void>;
+    isSeriesChild?: boolean;
+}
+export declare function ProductEditor({ state, formValues, setFormValues, tenantCategories, tenantSlug, contentTypeSchemas, templateFieldGroups, onSave, created, onBack, onDelete, deleting, savedCustomFieldDefinitions, onSaveCustomFieldDefinition, onRemoveCustomFieldDefinition, onCreateCategory, onDeleteCategory, onCreateSeries, isSeriesChild, }: ProductEditorProps): import("react").JSX.Element;
+export {};

package/dist/product-editor/product-editor.js

@@ -0,0 +1,160 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Save, Shapes, Trash2 } from "lucide-react";
+import { useEffect, useMemo, useRef } from "react";
+import { useEntityLabel } from "@withpotter/lib/intents/use-entity-label";
+import { useItemLinks } from "@withpotter/lib/use-item-links";
+import { useDestinationLabel } from "@withpotter/lib/intents/use-destination-label";
+import { Button } from "@withpotter/ui-kit/button";
+import { DetailPage } from "@withpotter/ui-kit/detail-page";
+import { useErrorToast } from "@withpotter/ui-kit";
+import { useMoneyVisibility } from "@withpotter/lib/use-money-visibility";
+import { useDetailHeader } from "@withpotter/hooks/use-detail-header";
+import { ProductEditorContent } from "./product-editor-content";
+import { SaveButton } from "./save-button";
+import { TOOLBAR_H } from "@withpotter/ui-kit/toolbar-parts";
+function ProductEditor({
+  state,
+  formValues,
+  setFormValues,
+  tenantCategories,
+  tenantSlug,
+  contentTypeSchemas,
+  templateFieldGroups,
+  onSave,
+  created = false,
+  onBack,
+  onDelete,
+  deleting,
+  savedCustomFieldDefinitions,
+  onSaveCustomFieldDefinition,
+  onRemoveCustomFieldDefinition,
+  onCreateCategory,
+  onDeleteCategory,
+  onCreateSeries,
+  isSeriesChild
+}) {
+  const { canSeeEarnings } = useMoneyVisibility();
+  useErrorToast(state.error, () => state.setError(null));
+  const item = useEntityLabel("item");
+  const links = useItemLinks();
+  const listLabel = useDestinationLabel("catalog") ?? item.plural;
+  const actions = useMemo(
+    () => /* @__PURE__ */ jsxs(Fragment, { children: [
+      state.isEditing && onDelete && /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "secondary",
+          onClick: onDelete,
+          loading: deleting,
+          icon: /* @__PURE__ */ jsx(Trash2, {}),
+          className: `${TOOLBAR_H} text-[var(--error)] hover:text-[var(--error)]`,
+          children: "Delete"
+        }
+      ),
+      /* @__PURE__ */ jsx(Button, { variant: "secondary", className: TOOLBAR_H, onClick: onBack, children: "Discard" }),
+      /* @__PURE__ */ jsx(
+        SaveButton,
+        {
+          className: TOOLBAR_H,
+          saving: state.saving,
+          done: created,
+          onClick: onSave,
+          idleLabel: state.isEditing ? "Save changes" : `Create ${item.singular.toLowerCase()}`,
+          savingLabel: state.isEditing ? "Saving\u2026" : "Creating\u2026",
+          doneLabel: "Created"
+        }
+      )
+    ] }),
+    [
+      created,
+      deleting,
+      item.singular,
+      onBack,
+      onDelete,
+      onSave,
+      state.isEditing,
+      state.saving
+    ]
+  );
+  const latest = useRef({
+    onSave,
+    onBack,
+    onDelete,
+    saving: state.saving
+  });
+  useEffect(() => {
+    latest.current = { onSave, onBack, onDelete, saving: state.saving };
+  });
+  const hasDelete = state.isEditing && Boolean(onDelete);
+  const mobileActions = useMemo(
+    () => /* @__PURE__ */ jsxs(Fragment, { children: [
+      hasDelete && /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "secondary",
+          onClick: () => latest.current.onDelete?.(),
+          icon: /* @__PURE__ */ jsx(Trash2, {}),
+          className: "text-[var(--error)] hover:text-[var(--error)]",
+          children: "Delete"
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "primary",
+          onClick: () => {
+            if (!latest.current.saving) latest.current.onSave();
+          },
+          icon: /* @__PURE__ */ jsx(Save, {}),
+          children: state.isEditing ? "Save changes" : `Create ${item.singular.toLowerCase()}`
+        }
+      )
+    ] }),
+    [hasDelete, item.singular, state.isEditing]
+  );
+  useDetailHeader({
+    title: `${state.isEditing ? "Edit" : "New"} ${item.singular}`,
+    onBack: () => latest.current.onBack(),
+    actions: mobileActions
+  });
+  return /* @__PURE__ */ jsx(
+    DetailPage,
+    {
+      breadcrumbs: [
+        { label: listLabel, href: links.list, icon: /* @__PURE__ */ jsx(Shapes, {}) },
+        {
+          label: state.isEditing ? state.title || item.singular : `New ${item.singular.toLowerCase()}`
+        }
+      ],
+      breadcrumbSize: "md",
+      className: "lg:pt-2",
+      actions,
+      maxWidth: "max-w-6xl",
+      children: /* @__PURE__ */ jsx(
+        ProductEditorContent,
+        {
+          state,
+          formValues,
+          setFormValues,
+          tenantCategories,
+          tenantSlug,
+          contentTypeSchemas,
+          templateFieldGroups,
+          savedCustomFieldDefinitions,
+          onSaveCustomFieldDefinition,
+          onRemoveCustomFieldDefinition,
+          onCreateCategory,
+          onDeleteCategory,
+          onCreateSeries,
+          isSeriesChild,
+          canSeeProfitability: canSeeEarnings
+        }
+      )
+    }
+  );
+}
+export {
+  ProductEditor
+};
+//# sourceMappingURL=product-editor.js.map

package/dist/product-editor/product-editor.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/product-editor/product-editor.tsx"],"sourcesContent":["'use client';\n\nimport type { ContentFieldConfig } from '@withpotter/lib/template-types';\nimport type { EventRecurrenceRule } from '@withpotter/lib/product-types';\nimport type { ProductFormState } from '@withpotter/hooks/use-product-form-state';\nimport type { CustomFieldDefinition } from '@withpotter/components/custom-fields-step';\nimport type { TemplateFieldGroup } from './sections/template-fields-section';\nimport { Save, Shapes, Trash2 } from 'lucide-react';\nimport { useEffect, useMemo, useRef } from 'react';\nimport { useEntityLabel } from '@withpotter/lib/intents/use-entity-label';\nimport { useItemLinks } from '@withpotter/lib/use-item-links';\nimport { useDestinationLabel } from '@withpotter/lib/intents/use-destination-label';\nimport { Button } from '@withpotter/ui-kit/button';\nimport { DetailPage } from '@withpotter/ui-kit/detail-page';\nimport { useErrorToast } from '@withpotter/ui-kit';\nimport { useMoneyVisibility } from '@withpotter/lib/use-money-visibility';\nimport { useDetailHeader } from '@withpotter/hooks/use-detail-header';\n\nimport { ProductEditorContent } from './product-editor-content';\nimport { SaveButton } from './save-button';\nimport { TOOLBAR_H } from '@withpotter/ui-kit/toolbar-parts';\n\ninterface ProductEditorProps {\n  state: ProductFormState;\n  formValues: Record<string, unknown>;\n  setFormValues: (v: Record<string, unknown>) => void;\n  tenantCategories: Record<\n    string,\n    { value: string; label: string; sortOrder?: number }[]\n  >;\n  tenantSlug?: string;\n  contentTypeSchemas: Record<string, ContentFieldConfig[]>;\n  templateFieldGroups?: TemplateFieldGroup[];\n  onSave: () => void;\n  /** The record was just created: the save button celebrates, then the page moves on. */\n  created?: boolean;\n  onBack: () => void;\n  onDelete?: () => void;\n  deleting?: boolean;\n  savedCustomFieldDefinitions: CustomFieldDefinition[];\n  onSaveCustomFieldDefinition: (def: CustomFieldDefinition) => void;\n  onRemoveCustomFieldDefinition: (key: string) => void;\n  onCreateCategory?: (label: string) => void;\n  onDeleteCategory?: (value: string) => void;\n  onCreateSeries?: (recurrence: EventRecurrenceRule) => Promise<void>;\n  isSeriesChild?: boolean;\n}\n\nexport function ProductEditor({\n  state,\n  formValues,\n  setFormValues,\n  tenantCategories,\n  tenantSlug,\n  contentTypeSchemas,\n  templateFieldGroups,\n  onSave,\n  created = false,\n  onBack,\n  onDelete,\n  deleting,\n  savedCustomFieldDefinitions,\n  onSaveCustomFieldDefinition,\n  onRemoveCustomFieldDefinition,\n  onCreateCategory,\n  onDeleteCategory,\n  onCreateSeries,\n  isSeriesChild,\n}: ProductEditorProps) {\n  const { canSeeEarnings } = useMoneyVisibility();\n  useErrorToast(state.error, () => state.setError(null));\n\n  /**\n   * The same actions slot CustomerEditor uses. This editor used to own a\n   * bespoke 56px sticky bar that bled edge-to-edge (`-mx-6 px-6`) and set its\n   * title at `text-lg` -- which resolves to 15px here, not 18px -- while the\n   * layout hid the whole sidebar for its route. Three different ways of being\n   * a page, on the one screen you reach by pressing \"Add product\".\n   */\n  /**\n   * The tenant's own noun, not \"Product\". A short-let business presses \"Add\n   * property\" in the sidebar and must not land on a screen headed \"New\n   * product\" -- same engine, different word, and the word is the merchant's.\n   * useEntityLabel is what the catalog list already resolves it with.\n   */\n  const item = useEntityLabel('item');\n  const links = useItemLinks();\n  /**\n   * The crumb naming the list is naming a PLACE, and a place has its own word.\n   *\n   * Two label systems meet on this screen and they answer different questions.\n   * `useEntityLabel` is what the tenant calls the THING — product, property,\n   * dish — and the leaf crumb is right to use it. `useDestinationLabel` is what\n   * the nav calls the PLACE that lists them, and for a shop that is \"Inventory\".\n   *\n   * This crumb used the entity word, so one journey read Inventory in the rail,\n   * Inventory on the list, then Products in the breadcrumb of the screen it\n   * opened — three words for one place in four clicks. The list already\n   * resolves it the right way and this was the holdout, exactly as the title\n   * was before it.\n   */\n  const listLabel = useDestinationLabel('catalog') ?? item.plural;\n\n  const actions = useMemo(\n    () => (\n      <>\n        {state.isEditing && onDelete && (\n          <Button\n            variant=\"secondary\"\n            onClick={onDelete}\n            loading={deleting}\n            icon={<Trash2 />}\n            className={`${TOOLBAR_H} text-[var(--error)] hover:text-[var(--error)]`}\n          >\n            Delete\n          </Button>\n        )}\n        <Button variant=\"secondary\" className={TOOLBAR_H} onClick={onBack}>\n          Discard\n        </Button>\n        <SaveButton\n          className={TOOLBAR_H}\n          saving={state.saving}\n          done={created}\n          onClick={onSave}\n          idleLabel={\n            state.isEditing\n              ? 'Save changes'\n              : `Create ${item.singular.toLowerCase()}`\n          }\n          savingLabel={state.isEditing ? 'Saving…' : 'Creating…'}\n          doneLabel=\"Created\"\n        />\n      </>\n    ),\n    [\n      created,\n      deleting,\n      item.singular,\n      onBack,\n      onDelete,\n      onSave,\n      state.isEditing,\n      state.saving,\n    ],\n  );\n\n  /**\n   * THE PHONE'S SAVE BUTTON LIVES IN THE SHELL HEADER, and the shell keeps the\n   * node it was handed the one time it was published.\n   *\n   * `useDetailHeader` re-publishes on a title change, not on every render. A\n   * Create button built from `onSave` directly would therefore keep the FIRST\n   * render's handler for good — the one that closed over an empty form — and\n   * every tap would answer \"Title is required\" however much was typed. These\n   * buttons call through a ref instead, so a node published once still runs\n   * the latest handler, and the ref is also where a second tap while a save is\n   * in flight gets turned away.\n   *\n   * The page used to publish its own header (title and back, no actions) after\n   * this editor's, and the later publish replaced the earlier whole: the phone\n   * had no Create button at all. The editor now publishes the one header.\n   */\n  const latest = useRef({\n    onSave,\n    onBack,\n    onDelete,\n    saving: state.saving,\n  });\n  useEffect(() => {\n    latest.current = { onSave, onBack, onDelete, saving: state.saving };\n  });\n\n  const hasDelete = state.isEditing && Boolean(onDelete);\n  const mobileActions = useMemo(\n    () => (\n      <>\n        {hasDelete && (\n          <Button\n            variant=\"secondary\"\n            onClick={() => latest.current.onDelete?.()}\n            icon={<Trash2 />}\n            className=\"text-[var(--error)] hover:text-[var(--error)]\"\n          >\n            Delete\n          </Button>\n        )}\n        <Button\n          variant=\"primary\"\n          onClick={() => {\n            if (!latest.current.saving) latest.current.onSave();\n          }}\n          icon={<Save />}\n        >\n          {state.isEditing\n            ? 'Save changes'\n            : `Create ${item.singular.toLowerCase()}`}\n        </Button>\n      </>\n    ),\n    [hasDelete, item.singular, state.isEditing],\n  );\n\n  useDetailHeader({\n    title: `${state.isEditing ? 'Edit' : 'New'} ${item.singular}`,\n    onBack: () => latest.current.onBack(),\n    actions: mobileActions,\n  });\n\n  return (\n    <DetailPage\n      breadcrumbs={[\n        { label: listLabel, href: links.list, icon: <Shapes /> },\n        {\n          label: state.isEditing\n            ? state.title || item.singular\n            : `New ${item.singular.toLowerCase()}`,\n        },\n      ]}\n      breadcrumbSize=\"md\"\n      className=\"lg:pt-2\"\n      actions={actions}\n      maxWidth=\"max-w-6xl\"\n    >\n      <ProductEditorContent\n        state={state}\n        formValues={formValues}\n        setFormValues={setFormValues}\n        tenantCategories={tenantCategories}\n        tenantSlug={tenantSlug}\n        contentTypeSchemas={contentTypeSchemas}\n        templateFieldGroups={templateFieldGroups}\n        savedCustomFieldDefinitions={savedCustomFieldDefinitions}\n        onSaveCustomFieldDefinition={onSaveCustomFieldDefinition}\n        onRemoveCustomFieldDefinition={onRemoveCustomFieldDefinition}\n        onCreateCategory={onCreateCategory}\n        onDeleteCategory={onDeleteCategory}\n        onCreateSeries={onCreateSeries}\n        isSeriesChild={isSeriesChild}\n        canSeeProfitability={canSeeEarnings}\n      />\n    </DetailPage>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/product-editor/public-link-row.d.ts

@@ -0,0 +1,7 @@
+export declare function PublicLinkRow({ slug, slugManuallyEdited, title, tenantSlug, onSlugChange, }: {
+    slug: string;
+    slugManuallyEdited: boolean;
+    title: string;
+    tenantSlug?: string;
+    onSlugChange: (next: string, manual: boolean) => void;
+}): import("react").JSX.Element;