@flowselections/floriday-voorraad 1.0.27 → 1.0.29

package/dist-lib/components/voorraad/ArtikelWizard.js

@@ -12,16 +12,23 @@ import { buildAddTradeItemPayload, buildUpdateTradeItemPayload, buildPrimaryPack
 import { AdditionalPackagingDialog } from "./AdditionalPackagingDialog";
 import { publishCustomerOfferFn } from "../../lib/floriday-customer-offer.functions";
 import { upsertSupplyLineForTradeItem } from "../../lib/floriday-supply-line";
-import { deleteLocalTradeItem, getLocalTradeItem, upsertLocalTradeItem, } from "../../hooks/useLocalTradeItems";
+import { deleteLocalTradeItem, getLocalTradeItem, markLocalSyncStatus, readLocalSyncStatus, upsertLocalTradeItem, } from "../../hooks/useLocalTradeItems";
 import { useTradeItemSpec } from "../../hooks/useTradeItemSpec";
-import { isMissingCharacteristicsError } from "../../lib/floriday-writes.functions";
 import { useVbnRegulatoryFeatures } from "../../hooks/useVbnRegulatoryFeatures";
 import { useFloridayVbnRequired } from "../../hooks/useFloridayVbnRequired";
 import { saveFloridayVbnRequired } from "../../lib/floriday-vbn-required.functions";
-import { useQueryClient } from "@tanstack/react-query";
+import { useQuery, useQueryClient } from "@tanstack/react-query";
 import { useCodeList, useTradeItemFormSchema } from "../../hooks/useFloriday";
 import { useFloridayPriceGroups } from "../../hooks/useFloridayPriceGroups";
 import { readTradeItemPrices, syncTradeItemPrices } from "../../lib/trade-item-prices";
+import { createPublishJob, finishPublishJob, markStepSkipped, rememberPublishRejection, runPublishStep, } from "../../lib/publish-pipeline";
+import { translatePublishError, } from "../../lib/publish-errors";
+import { buildReadinessReport } from "../../lib/publish-readiness";
+import { usePublishJob } from "../../hooks/usePublishJob";
+import { PublishReadinessCard } from "./PublishReadinessCard";
+import { PublishProgressCard } from "./PublishProgressCard";
+import { gatewayReadFn } from "../../lib/floriday-gateway.functions";
+import { getFloridayReadinessFn } from "../../lib/floriday-env.functions";
 const floridayLogo = "/flowselections-assets/Voorraad/floriday-logo.png";
 import { VoorraadStockCard } from "../../components/voorraad/VoorraadStockCard";
 import { ProductLinkCard } from "../../components/voorraad/ProductLinkCard";
@@ -78,6 +85,11 @@ function warehouseSubLabel(raw) {
     const city = addr.city ?? "";
     return [line, city].filter(Boolean).join(", ") || undefined;
 }
+function asPlainRecord(value) {
+    return value && typeof value === "object" && !Array.isArray(value)
+        ? value
+        : {};
+}
 async function lookupProductGroupForVbn(vbnCode) {
     const code = String(vbnCode ?? "").trim();
     if (!code)
@@ -90,14 +102,23 @@ async function lookupProductGroupForVbn(vbnCode) {
         .maybeSingle();
     return data ? groupOfRecord(data) : null;
 }
-export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId, } = {}) {
+export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId, resumeJobId, } = {}) {
     const navigate = useNavigate();
     const { activeId, activeConnection, loading: connLoading } = useFloridayConnection();
+    const connectionReadiness = useQuery({
+        queryKey: ["floriday-readiness", activeId, activeConnection?.active_environment],
+        queryFn: () => getFloridayReadinessFn(),
+        enabled: Boolean(activeId),
+        staleTime: 30000,
+        retry: false,
+    });
     const { customers: floridayCustomers } = useFlorydayCustomers(activeId);
     const { priceGroups } = useFloridayPriceGroups(activeId);
     const [step, setStep] = useState(0);
     const [data, setData] = useState(empty);
     const [submitting, setSubmitting] = useState(false);
+    const [publishJobId, setPublishJobId] = useState(resumeJobId ?? null);
+    const { job: publishJob, steps: publishSteps } = usePublishJob(publishJobId);
     const [publishToFloriday, setPublishToFloriday] = useState(true);
     const [draftId, setDraftId] = useState(initialDraftId);
     const [draftFloridayId, setDraftFloridayId] = useState(null);
@@ -106,6 +127,9 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
     const [productLoading, setProductLoading] = useState(Boolean(productId));
     const [syncState, setSyncState] = useState("idle");
     const [syncError, setSyncError] = useState(null);
+    // Lokaal opgeslagen, maar (nog) niet bevestigd door Floriday.
+    const [pendingSync, setPendingSync] = useState(null);
+    const [retryingSync, setRetryingSync] = useState(false);
     const [productMeta, setProductMeta] = useState({ floridayActive: false, floridayTradeItemId: null, physicalStock: 0 });
     const [deleteAck, setDeleteAck] = useState(false);
     const [deleteOpen, setDeleteOpen] = useState(false);
@@ -257,7 +281,7 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
             try {
                 const { data: product, error } = await supabase
                     .from("products")
-                    .select("id,product,barcode,article_number,quantity,sale_price,vat_rate,vat_code,image_url,plants_per_crate,crates_per_layer,layers_per_cart,floriday_active,floriday_trade_item_id,floriday_payload")
+                    .select("id,product,barcode,article_number,quantity,image_url,plants_per_crate,crates_per_layer,layers_per_cart,trade_item_key,floriday_trade_item_id,custom_fields")
                     .eq("id", productId)
                     .maybeSingle();
                 if (cancelled)
@@ -274,9 +298,15 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
                 const ppc = Number(product.plants_per_crate) || 0;
                 const cpl = Number(product.crates_per_layer) || 0;
                 const lpc = Number(product.layers_per_cart) || 0;
-                const payload = (product.floriday_payload ?? {});
-                const fid = (product.floriday_trade_item_id ?? null);
-                const fActive = Boolean(product.floriday_active);
+                const customFields = asPlainRecord(product.custom_fields);
+                const payload = asPlainRecord(customFields.floriday_payload);
+                const productTradeItemKey = String(product.trade_item_key ?? "");
+                const fid = ((product.floriday_trade_item_id ??
+                    customFields.floriday_id ??
+                    (productTradeItemKey && !productTradeItemKey.startsWith("product:")
+                        ? productTradeItemKey
+                        : null)) || null);
+                const fActive = Boolean(fid);
                 // Floriday-cache + warehouse-voorkeur parallel ophalen wanneer we een
                 // gekoppeld trade-item hebben. Missing cache blokkeert de wizard niet;
                 // dan valt hij terug op wat er lokaal is opgeslagen.
@@ -313,6 +343,20 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
                         console.warn("Floriday-cache laden mislukt", e);
                     }
                 }
+                // Lokale wijzigingen die nog niet door Floriday zijn bevestigd zijn
+                // leidend: anders zou de (verouderde) Floriday-kopie de invoer van de
+                // gebruiker overschrijven en lijken beladingen/foto's "verwijderd".
+                const localSync = readLocalSyncStatus(customFields);
+                if (localSync?.dirty) {
+                    cacheData = null;
+                    setPendingSync({
+                        error: localSync.last_error ?? null,
+                        at: localSync.last_attempt_at ?? null,
+                    });
+                }
+                else {
+                    setPendingSync(null);
+                }
                 const cachePackings = cacheData?.packingConfigurations ?? [];
                 const payloadHasPacking = Array.isArray(payload.packingConfigurations) && payload.packingConfigurations.length > 0;
                 const seededPacking = cachePackings.length > 0
@@ -402,17 +446,19 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
                         : validGtin
                             ? barcode
                             : (payload.gtin ?? ""),
-                    salePricePerPiece: Number(product.sale_price ?? payload.salePricePerPiece) || 0,
+                    salePricePerPiece: Number(customFields.sale_price ?? customFields.salePrice ?? payload.salePricePerPiece) || 0,
                     // Voorkeur: werkelijke voorraad uit trade_item_stock.
                     // Fallback: opgeslagen payload-waarde. `products.quantity` wordt
                     // bewust NIET meer gelezen — die staat structureel op 0.
                     saleStockPieces: physical > 0
                         ? physical
                         : Number(payload.saleStockPieces ?? 0) || 0,
-                    vatRate: product.vat_rate !== null && product.vat_rate !== undefined
-                        ? Number(product.vat_rate)
+                    vatRate: customFields.vat_rate !== null && customFields.vat_rate !== undefined
+                        ? Number(customFields.vat_rate)
                         : (payload.vatRate ?? null),
-                    vatCode: product.vat_code ?? payload.vatCode ?? null,
+                    vatCode: (customFields.vat_code ?? customFields.vatCode) ??
+                        payload.vatCode ??
+                        null,
                     warehouseId: warehousePref ||
                         cacheWarehouseId ||
                         payloadWarehouseId ||
@@ -473,14 +519,45 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
                     toast.error("Artikel niet gevonden in de cache");
                     return;
                 }
+                // Lokale rij met nog niet doorgegeven wijzigingen? Die is leidend.
+                let localRow = null;
+                try {
+                    const { data: prod } = await supabase
+                        .from("products")
+                        .select("id,custom_fields")
+                        .eq("floriday_trade_item_id", tradeItemId)
+                        .maybeSingle();
+                    localRow = prod ?? null;
+                }
+                catch {
+                    /* geen lokale rij; cache is dan leidend */
+                }
+                if (cancelled)
+                    return;
+                const localSync = readLocalSyncStatus(localRow?.custom_fields);
+                const localPayload = localRow?.custom_fields?.floriday_payload;
+                if (localRow?.id)
+                    setDraftId(localRow.id);
+                if (localSync?.dirty) {
+                    setPendingSync({
+                        error: localSync.last_error ?? null,
+                        at: localSync.last_attempt_at ?? null,
+                    });
+                }
+                else {
+                    setPendingSync(null);
+                }
                 const wizardData = floridayCacheToWizardData(row.data);
-                const productGroup = wizardData.productGroup ??
-                    (await lookupProductGroupForVbn(wizardData.vbnCode));
+                const baseData = localSync?.dirty && localPayload
+                    ? { ...wizardData, ...localPayload }
+                    : wizardData;
+                const productGroup = baseData.productGroup ??
+                    (await lookupProductGroupForVbn(baseData.vbnCode));
                 const prefWarehouseId = pref?.warehouse_id ?? "";
-                const cachedWarehouseId = wizardData.warehouseId ?? "";
+                const cachedWarehouseId = baseData.warehouseId ?? "";
                 const preferredWarehouseFallback = prefWarehouseId || cachedWarehouseId ? null : await resolvePreferredWarehouseId();
                 setData({
-                    ...wizardData,
+                    ...baseData,
                     productGroup,
                     warehouseId: prefWarehouseId || cachedWarehouseId || preferredWarehouseFallback || "",
                 });
@@ -795,20 +872,94 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
         }, 50);
         return () => window.clearTimeout(id);
     }, [step]);
-    const submit = async () => {
+    // ---- Publiceren -----------------------------------------------------
+    // Elke publicatie is één opdracht met vaste deelstappen. Geslaagde stappen
+    // worden bij opnieuw proberen overgeslagen, tijdelijke storingen worden
+    // automatisch herhaald en alles is terug te zien bij "Publicaties".
+    const characteristicLabels = useMemo(() => {
+        const out = {};
+        for (const c of spec.characteristics)
+            out[c.code] = c.label || c.code;
+        return out;
+    }, [spec.characteristics]);
+    const wantsPublish = (isEditingPublished && Boolean(tradeItemId)) ||
+        (!isEditingPublished && publishToFloriday);
+    const readiness = useMemo(() => buildReadinessReport({
+        data,
+        spec,
+        connectionOk: Boolean(activeId) && connectionReadiness.data?.ready === true,
+        connectionLoading: connLoading || connectionReadiness.isLoading,
+        environment: activeConnection?.active_environment ?? null,
+        connectionMessage: connectionReadiness.data?.message ?? null,
+        schemaReady: schemaQuery.isSuccess,
+        learnedCharacteristicCodes: serverRequiredCodes,
+        characteristicLabels,
+        wantsPublish,
+    }), [
+        data,
+        spec,
+        activeId,
+        connLoading,
+        connectionReadiness.data,
+        connectionReadiness.isLoading,
+        activeConnection?.active_environment,
+        schemaQuery.isSuccess,
+        serverRequiredCodes,
+        characteristicLabels,
+        wantsPublish,
+    ]);
+    const goToStepKey = useCallback((key) => {
+        const idx = visibleSteps(data).findIndex((s) => s.key === key);
+        if (idx >= 0)
+            setStep(idx);
+    }, [data]);
+    const handleStepFailure = useCallback(async (friendly) => {
+        if (!friendly)
+            return;
+        if (friendly.code === "MISSING_CHARACTERISTICS" && friendly.missingCodes?.length) {
+            if (data.vbnCode) {
+                try {
+                    const res = await saveFloridayVbnRequired({
+                        data: { vbnCode: data.vbnCode, codes: friendly.missingCodes },
+                    });
+                    queryClient.setQueryData(["floriday-vbn-required", data.vbnCode], {
+                        vbnCode: res.vbnCode,
+                        requiredCodes: res.requiredCodes,
+                    });
+                }
+                catch {
+                    /* leren mag stilletjes falen */
+                }
+                void rememberPublishRejection({
+                    vbnCode: data.vbnCode,
+                    scope: "characteristic",
+                    keys: friendly.missingCodes,
+                    lastError: friendly.detail,
+                });
+            }
+            goToStepKey("eigenschappen");
+        }
+        else if (friendly.action?.stepKey) {
+            goToStepKey(friendly.action.stepKey);
+        }
+        toast.error(friendly.message, {
+            description: friendly.hint,
+        });
+    }, [data.vbnCode, goToStepKey, queryClient]);
+    const submit = async (options) => {
         if (!activeId) {
-            toast.error("Geen actieve Floriday-connectie geselecteerd");
+            toast.error("Geen actieve verbinding met de handelsomgeving", {
+                description: "Stel de verbinding in bij Instellingen.",
+            });
             return;
         }
-        // Publish-gate: blokkeer zolang het trade-item schema niet succesvol
-        // geladen is — anders kunnen verplichte karakteristieken ontbreken.
-        const wantsPublish = (isEditingPublished && Boolean(tradeItemId)) ||
-            (!isEditingPublished && publishToFloriday);
         if (wantsPublish && !schemaQuery.isSuccess) {
-            toast.error("Floriday-schema nog niet geladen — wacht even of probeer opnieuw.");
+            toast.error("De productregels worden nog opgehaald", {
+                description: "Wacht heel even en probeer het opnieuw.",
+            });
             return;
         }
-        // Strict valideer alle stappen voor verzending
+        // Strikte controle van alle stappen voor verzending.
         for (const s of steps) {
             const v = validateStepLocal(s.key, data);
             if (!v.ok) {
@@ -819,68 +970,226 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
                 return;
             }
         }
+        // Lokaal bewaren (niet publiceren) blijft een simpele actie zonder opdracht.
+        if (!wantsPublish) {
+            setSubmitting(true);
+            try {
+                const newId = await upsertLocalTradeItem({
+                    id: draftId,
+                    connectionId: activeId,
+                    data,
+                });
+                setDraftId(newId);
+                toast.success(draftId
+                    ? "Wijzigingen opgeslagen (nog niet gepubliceerd)"
+                    : "Artikel opgeslagen (nog niet gepubliceerd)");
+                navigate({ to: "/voorraad" });
+            }
+            catch (e) {
+                const friendly = translatePublishError(e);
+                toast.error(friendly.message, { description: friendly.hint });
+            }
+            finally {
+                setSubmitting(false);
+            }
+            return;
+        }
+        // Publiceren begint altijd met een lokale opslag, zodat een afgebroken of
+        // mislukte publicatie nooit tot verlies van ingevoerde gegevens leidt.
+        try {
+            const localId = await upsertLocalTradeItem({
+                id: draftId,
+                connectionId: activeId,
+                data,
+                floridayTradeItemId: (isEditingPublished && tradeItemId) ? tradeItemId : (draftFloridayId || null),
+                sync: { dirty: true, last_error: null },
+            });
+            if (localId && localId !== draftId)
+                setDraftId(localId);
+        }
+        catch (e) {
+            toast.error(`Lokaal opslaan mislukt: ${e.message}`);
+            return;
+        }
+        try {
+            const serverConnection = await getFloridayReadinessFn();
+            const browserEnvironment = activeConnection?.active_environment;
+            if (!serverConnection.ready) {
+                toast.error(serverConnection.message, {
+                    description: "Controleer de verbinding bij Instellingen.",
+                });
+                return;
+            }
+            if (serverConnection.connectionId !== activeId ||
+                (browserEnvironment && serverConnection.environment !== browserEnvironment)) {
+                toast.error("De verbinding is gewijzigd", {
+                    description: "Vernieuw de pagina en probeer opnieuw.",
+                });
+                return;
+            }
+        }
+        catch {
+            toast.error("De verbinding kan niet worden gecontroleerd", {
+                description: "Vernieuw de pagina en probeer opnieuw.",
+            });
+            return;
+        }
         setSubmitting(true);
+        const environment = activeConnection?.active_environment;
+        if (environment !== "staging" && environment !== "live") {
+            toast.error("De gekozen omgeving is niet geldig", {
+                description: "Kies de testomgeving of liveomgeving bij Instellingen.",
+            });
+            setSubmitting(false);
+            return;
+        }
+        const intent = isEditingPublished ? "update" : "create";
+        const activeStepKeys = ["trade-item", "verify"];
+        if (data.offerForSale) {
+            activeStepKeys.push("stock", "offer", "supply-line", "prices");
+        }
+        else if (isEditingPublished) {
+            activeStepKeys.push("prices");
+        }
+        let jobId = options?.resumeJobId ?? null;
+        if (!jobId) {
+            const job = await createPublishJob({
+                connectionId: activeId,
+                environment,
+                intent,
+                title: data.name || data.vbnName || "Product",
+                productId: productId ?? null,
+                tradeItemId: tradeItemId ?? null,
+                snapshot: { articleCode: data.articleCode, vbnCode: data.vbnCode },
+                activeSteps: activeStepKeys,
+            });
+            jobId = job?.id ?? null;
+        }
+        setPublishJobId(jobId);
+        const stepOpts = { characteristicLabels };
+        let resolvedTradeItemId = tradeItemId ?? null;
         try {
-            if (isEditingPublished && tradeItemId) {
-                await saveWarehousePreference(tradeItemId, data.warehouseId);
-                // PUT vervangt het bestaande trade item in Floriday
-                // PUT /trade-items/{id} — body volgens TradeItemUpdate (zonder tradeItemId + supplierArticleCode)
-                const payload = buildUpdateTradeItemPayload(data);
-                const res = await floriday.updateTradeItem(activeId, tradeItemId, payload);
-                if (!res?.attemptId) {
-                    throw new Error("Gateway gaf geen attemptId terug — wijziging niet bevestigd");
-                }
-                // Optimistisch: cache-rij meteen bijwerken zodat de tabel niet 5 min wacht
-                try {
-                    const cachePayload = {
-                        ...buildAddTradeItemPayload(data),
-                        tradeItemId,
-                    };
-                    await supabase
-                        .from("floriday_trade_items_cache")
-                        .update({
-                        data: cachePayload,
-                        fetched_at: new Date().toISOString(),
-                    })
-                        .eq("connection_id", activeId)
-                        .eq("floriday_id", tradeItemId);
+            // 1) Productgegevens -------------------------------------------------
+            const core = await runPublishStep(jobId, "trade-item", async () => {
+                if (isEditingPublished && tradeItemId) {
+                    await saveWarehousePreference(tradeItemId, data.warehouseId);
+                    const payload = buildUpdateTradeItemPayload(data);
+                    const res = await floriday.updateTradeItem(activeId, tradeItemId, payload);
+                    if (!res?.attemptId) {
+                        throw new Error("De wijziging is niet bevestigd door de handelsomgeving");
+                    }
+                    return { tradeItemId };
                 }
-                catch {
-                    /* niet kritiek, sync corrigeert binnen 5 min */
+                const payload = buildAddTradeItemPayload(data);
+                const res = await floriday.createTradeItem(activeId, payload);
+                if (!res?.attemptId) {
+                    throw new Error("Het aanmaken is niet bevestigd door de handelsomgeving");
                 }
-                toast.success("Artikel bijgewerkt in Floriday");
-                // Herprijzen: als er een prijs is ingevuld, supply-line (opnieuw) pushen.
-                if (data.offerForSale && data.salePricePerPiece > 0) {
+                const createdId = res.tradeItemId ?? payload.tradeItemId;
+                await saveWarehousePreference(createdId, data.warehouseId);
+                if (draftId) {
                     try {
-                        const primary = data.packingConfigurations.find((p) => p.isPrimary) ??
-                            data.packingConfigurations[0];
-                        if (primary?.id) {
-                            await upsertSupplyLineForTradeItem({
-                                connectionId: activeId,
-                                tradeItemId,
-                                pricePerPiece: data.salePricePerPiece,
-                                packingConfigurationId: primary.id,
-                                availableQuantity: data.saleStockPieces,
-                                customerOrganizationIds: data.customerOrganizationIds,
-                                periodStart: data.offerStartDate
-                                    ? new Date(`${data.offerStartDate}T00:00:00Z`).toISOString()
-                                    : undefined,
-                            });
-                            toast.success("Prijs bijgewerkt in Floriday-catalogus");
-                        }
+                        await deleteLocalTradeItem(draftId);
                     }
-                    catch (e) {
-                        toast.error(`Prijs bijwerken mislukt: ${e.message}`);
+                    catch {
+                        /* niet kritiek */
                     }
                 }
-                // Basisprijs + prijzen per prijsgroep (weekly-base-supply +
-                // weekly-supply-lines) spiegelen naar trade_item_prices en pushen.
-                try {
-                    const primary = data.packingConfigurations.find((p) => p.isPrimary) ??
-                        data.packingConfigurations[0];
+                return { tradeItemId: createdId };
+            }, stepOpts);
+            if (!core.ok) {
+                await handleStepFailure(core.error);
+                if (jobId)
+                    await finishPublishJob(jobId);
+                return;
+            }
+            resolvedTradeItemId =
+                core.value?.tradeItemId ??
+                    resolvedTradeItemId;
+            const primary = data.packingConfigurations.find((p) => p.isPrimary) ??
+                data.packingConfigurations[0];
+            // 2) Voorraad ---------------------------------------------------------
+            if (activeStepKeys.includes("stock") && resolvedTradeItemId) {
+                await runPublishStep(jobId, "stock", async () => {
+                    const key = stockKeyFor({ tradeItemId: resolvedTradeItemId });
+                    if (!key || !(data.saleStockPieces > 0))
+                        return { skipped: true };
+                    const { data: existing } = await supabase
+                        .from("trade_item_stock")
+                        .select("trade_item_key")
+                        .eq("connection_id", activeId)
+                        .eq("trade_item_key", key)
+                        .maybeSingle();
+                    if (existing)
+                        return { kept: true };
+                    const userRes = await supabase.auth.getUser();
+                    const userId = userRes.data.user?.id;
+                    if (!userId)
+                        throw new Error("Unauthorized");
+                    const { error } = await supabase.from("trade_item_stock").insert({
+                        user_id: userId,
+                        connection_id: activeId,
+                        trade_item_key: key,
+                        physical_stock: data.saleStockPieces,
+                        minimum_stock: 0,
+                        reserved_stock: 0,
+                        incoming_stock: 0,
+                    });
+                    if (error)
+                        throw new Error(error.message);
+                    return { created: true };
+                }, stepOpts);
+            }
+            // 3) Aanbod -----------------------------------------------------------
+            if (activeStepKeys.includes("offer") && resolvedTradeItemId && !isEditingPublished) {
+                await runPublishStep(jobId, "offer", async () => {
+                    const packingBase = buildPrimaryPackingBase(data);
+                    await publishCustomerOfferFn({
+                        data: {
+                            customerOfferId: crypto.randomUUID(),
+                            tradeItemId: resolvedTradeItemId,
+                            title: data.name || data.vbnName || "Aanbod",
+                            description: "",
+                            pricePerPiece: data.salePricePerPiece,
+                            currency: "EUR",
+                            despatchWarehouseId: data.warehouseId,
+                            numberOfPieces: data.saleStockPieces,
+                            allowedCustomerOrganizationIds: data.customerOrganizationIds,
+                            packingConfiguration: packingBase,
+                            orderStart: new Date(`${data.offerStartDate}T00:00:00Z`).toISOString(),
+                        },
+                    });
+                    return { published: true };
+                }, stepOpts);
+            }
+            else if (jobId && activeStepKeys.includes("offer")) {
+                await markStepSkipped(jobId, "offer");
+            }
+            // 4) Prijs online ------------------------------------------------------
+            if (activeStepKeys.includes("supply-line") && resolvedTradeItemId) {
+                await runPublishStep(jobId, "supply-line", async () => {
+                    if (!primary?.id || !(data.salePricePerPiece > 0))
+                        return { skipped: true };
+                    const sl = await upsertSupplyLineForTradeItem({
+                        connectionId: activeId,
+                        tradeItemId: resolvedTradeItemId,
+                        pricePerPiece: data.salePricePerPiece,
+                        packingConfigurationId: primary.id,
+                        availableQuantity: data.saleStockPieces,
+                        customerOrganizationIds: data.customerOrganizationIds,
+                        periodStart: data.offerStartDate
+                            ? new Date(`${data.offerStartDate}T00:00:00Z`).toISOString()
+                            : undefined,
+                    });
+                    return { supplyLineId: sl.supplyLineId ?? null };
+                }, stepOpts);
+            }
+            // 5) Prijsafspraken ----------------------------------------------------
+            if (activeStepKeys.includes("prices") && resolvedTradeItemId) {
+                await runPublishStep(jobId, "prices", async () => {
                     const priceSync = await syncTradeItemPrices({
-                        tradeItemId,
-                        tradeItemKey: tradeItemId,
+                        tradeItemId: resolvedTradeItemId,
+                        tradeItemKey: resolvedTradeItemId,
                         availableQuantity: data.saleStockPieces,
                         currency: "EUR",
                         periodStart: data.offerStartDate
@@ -893,199 +1202,82 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
                     });
                     const failed = priceSync.groupResults.filter((r) => !r.ok);
                     if (failed.length) {
-                        toast.error(`Prijsgroep(en) niet gepusht: ${failed.map((r) => r.name).join(", ")}`);
-                    }
-                    else if (priceSync.groupResults.length) {
-                        toast.success(`${priceSync.groupResults.length} prijsgroep-prijs(zen) bijgewerkt`);
+                        throw new Error(`Deze prijsafspraken zijn niet doorgekomen: ${failed
+                            .map((r) => r.name)
+                            .join(", ")}`);
                     }
-                }
-                catch (e) {
-                    toast.error(`Prijzen synchroniseren mislukt: ${e.message}`);
-                }
+                    return { groups: priceSync.groupResults.length };
+                }, stepOpts);
             }
-            else if (publishToFloriday) {
-                const payload = buildAddTradeItemPayload(data);
-                const res = await floriday.createTradeItem(activeId, payload);
-                if (!res?.attemptId) {
-                    throw new Error("Gateway gaf geen attemptId terug — aanmaken niet bevestigd");
-                }
-                const createdTradeItemId = res.tradeItemId ?? payload.tradeItemId;
-                await saveWarehousePreference(createdTradeItemId, data.warehouseId);
-                // Als dit een lokaal artikel was, ruim de draft-rij op
-                if (draftId) {
-                    try {
-                        await deleteLocalTradeItem(draftId);
+            // 6) Controle achteraf --------------------------------------------------
+            if (resolvedTradeItemId) {
+                const verify = await runPublishStep(jobId, "verify", async () => {
+                    const res = (await gatewayReadFn({
+                        data: {
+                            path: `/suppliers-api-2026v1/trade-items/${resolvedTradeItemId}`,
+                        },
+                    }));
+                    const item = res?.data;
+                    if (!item) {
+                        throw new Error("Het product kon niet worden teruggelezen");
                     }
-                    catch {
-                        // Niet kritiek; rij verdwijnt na volgende reload
-                    }
-                }
-                // ---- Direct-sale flow -----------------------------------------
-                // Alleen doorzetten als de gebruiker de "Aanbieden"-stap geactiveerd
-                // heeft. Falen mag de TradeItem-succes NIET terugdraaien — daarom
-                // in een aparte try/catch en apart toast bericht.
-                if (data.offerForSale) {
-                    const tradeItemId = createdTradeItemId;
-                    // 1) Seed lokale voorraad (physical_stock) — de continuous-stock
-                    //    trigger pusht dit naar Floriday zodra de trade item in de
-                    //    cache verschijnt.
-                    //    GUARD: nooit een BESTAANDE voorraad-rij overschrijven. Als
-                    //    er al een rij is (bv. bij herpubliceren of bij een lokaal
-                    //    product met historische voorraad), laten we die met rust
-                    //    om ongewild op 0 zetten te voorkomen. Voorraad wordt
-                    //    beheerd via de Voorraadkaart, niet via de wizard.
-                    try {
-                        const key = stockKeyFor({ tradeItemId });
-                        if (key && data.saleStockPieces > 0) {
-                            const { data: existing } = await supabase
-                                .from("trade_item_stock")
-                                .select("trade_item_key")
-                                .eq("connection_id", activeId)
-                                .eq("trade_item_key", key)
-                                .maybeSingle();
-                            if (!existing) {
-                                const userRes = await supabase.auth.getUser();
-                                const userId = userRes.data.user?.id;
-                                if (userId) {
-                                    await supabase
-                                        .from("trade_item_stock")
-                                        .insert({
-                                        user_id: userId,
-                                        connection_id: activeId,
-                                        trade_item_key: key,
-                                        physical_stock: data.saleStockPieces,
-                                        minimum_stock: 0,
-                                        reserved_stock: 0,
-                                        incoming_stock: 0,
-                                    });
-                                }
-                            }
-                        }
-                    }
-                    catch (e) {
-                        toast.error(`Voorraad opslaan mislukt: ${e.message}`);
-                    }
-                    // 2) CustomerOffer publiceren (POST /customer-offers)
-                    try {
-                        const packingBase = buildPrimaryPackingBase(data);
-                        await publishCustomerOfferFn({
-                            data: {
-                                customerOfferId: crypto.randomUUID(),
-                                tradeItemId,
-                                title: data.name || data.vbnName || "Aanbod",
-                                description: "",
-                                pricePerPiece: data.salePricePerPiece,
-                                currency: "EUR",
-                                despatchWarehouseId: data.warehouseId,
-                                numberOfPieces: data.saleStockPieces,
-                                allowedCustomerOrganizationIds: data.customerOrganizationIds,
-                                packingConfiguration: packingBase,
-                                orderStart: new Date(`${data.offerStartDate}T00:00:00Z`).toISOString(),
-                            },
-                        });
-                        toast.success("Artikel aangemaakt en aangeboden in Floriday");
-                    }
-                    catch (e) {
-                        toast.error(`Aanbod publiceren mislukt: ${e.message}`);
-                    }
-                    // 3) Supply-line pushen naar de Authenticatie-module gateway
-                    //    zodat het product met prijs online komt in de Floriday-catalogus.
-                    //    Idempotent op supplyLineId — herprijzen hergebruikt dezelfde regel.
+                    // Lokale kopie pas bijwerken nadat de handelsomgeving bevestigd heeft.
                     try {
-                        const primary = data.packingConfigurations.find((p) => p.isPrimary) ??
-                            data.packingConfigurations[0];
-                        if (primary?.id && data.salePricePerPiece > 0) {
-                            const sl = await upsertSupplyLineForTradeItem({
-                                connectionId: activeId,
-                                tradeItemId,
-                                pricePerPiece: data.salePricePerPiece,
-                                packingConfigurationId: primary.id,
-                                availableQuantity: data.saleStockPieces,
-                                customerOrganizationIds: data.customerOrganizationIds,
-                                periodStart: data.offerStartDate
-                                    ? new Date(`${data.offerStartDate}T00:00:00Z`).toISOString()
-                                    : undefined,
-                            });
-                            if (sl.supplyLineId) {
-                                toast.success("Prijs online gezet in Floriday-catalogus");
-                            }
-                        }
-                    }
-                    catch (e) {
-                        toast.error(`Prijs online zetten mislukt: ${e.message}`);
+                        await supabase
+                            .from("floriday_trade_items_cache")
+                            .update({
+                            data: item,
+                            fetched_at: new Date().toISOString(),
+                        })
+                            .eq("connection_id", activeId)
+                            .eq("floriday_id", resolvedTradeItemId);
                     }
-                    // Basisprijs + prijzen per prijsgroep spiegelen + pushen.
-                    try {
-                        const primary = data.packingConfigurations.find((p) => p.isPrimary) ??
-                            data.packingConfigurations[0];
-                        const priceSync = await syncTradeItemPrices({
-                            tradeItemId,
-                            tradeItemKey: tradeItemId,
-                            availableQuantity: data.saleStockPieces,
-                            currency: "EUR",
-                            periodStart: data.offerStartDate
-                                ? new Date(`${data.offerStartDate}T00:00:00Z`).toISOString()
-                                : undefined,
-                            basePricePerPiece: data.salePricePerPiece,
-                            pricesByGroupId: data.priceGroupPrices ?? {},
-                            priceGroups,
-                            packingConfigurationId: primary?.id,
-                        });
-                        const failed = priceSync.groupResults.filter((r) => !r.ok);
-                        if (failed.length) {
-                            toast.error(`Prijsgroep(en) niet gepusht: ${failed.map((r) => r.name).join(", ")}`);
-                        }
+                    catch {
+                        /* wordt automatisch bijgewerkt bij de volgende synchronisatie */
                     }
-                    catch (e) {
-                        toast.error(`Prijzen synchroniseren mislukt: ${e.message}`);
+                    const warnings = [];
+                    const remoteName = item?.tradeItemName ?? item?.name;
+                    if (remoteName && data.name && remoteName !== data.name) {
+                        warnings.push("De artikelnaam wijkt af");
                     }
+                    return { warnings };
+                }, stepOpts);
+                if (!verify.ok) {
+                    toast.warning("Het product is opgeslagen, maar nog niet bevestigd", {
+                        description: "Controleer het later bij Publicaties.",
+                    });
                 }
-                else {
-                    toast.success("Artikel aangemaakt in Floriday");
-                }
-            }
-            else {
-                const newId = await upsertLocalTradeItem({
-                    id: draftId,
-                    connectionId: activeId,
-                    data,
-                });
-                setDraftId(newId);
-                toast.success(draftId
-                    ? "Wijzigingen opgeslagen (nog niet gepubliceerd)"
-                    : "Artikel opgeslagen (nog niet gepubliceerd)");
             }
-            navigate({ to: "/voorraad" });
-        }
-        catch (e) {
-            const msg = e.message;
-            const missingCodes = isMissingCharacteristicsError(msg);
-            if (missingCodes.length > 0) {
-                // Floriday's server-side check gaf terug welke karakteristieken nog
-                // ontbreken. Schrijf ze naar de gedeelde Supabase-cache zodat iedere
-                // gebruiker deze eisen vanaf nu vóór de call te zien krijgt, en
-                // navigeer terug naar Eigenschappen zodat ze meteen invulbaar zijn.
-                if (data.vbnCode) {
-                    try {
-                        const res = await saveFloridayVbnRequired({
-                            data: { vbnCode: data.vbnCode, codes: missingCodes },
-                        });
-                        queryClient.setQueryData(["floriday-vbn-required", data.vbnCode], { vbnCode: res.vbnCode, requiredCodes: res.requiredCodes });
-                    }
-                    catch { /* cache-write mag stilletjes falen */ }
+            const status = jobId ? await finishPublishJob(jobId, {
+                tradeItemId: resolvedTradeItemId,
+            }) : "succeeded";
+            if (status === "succeeded") {
+                if (draftId) {
+                    await markLocalSyncStatus(draftId, {
+                        dirty: false,
+                        last_error: null,
+                        last_synced_at: new Date().toISOString(),
+                    }).catch(() => { });
                 }
-                const eigenschappenIdx = visibleSteps(data).findIndex((s) => s.key === "eigenschappen");
-                if (eigenschappenIdx >= 0)
-                    setStep(eigenschappenIdx);
-                toast.error(`Floriday vereist nog: ${missingCodes.join(", ")}. Vul deze eigenschappen in en probeer opnieuw.`);
+                setPendingSync(null);
+                toast.success(isEditingPublished ? "Product bijgewerkt" : "Product gepubliceerd");
+                navigate({ to: "/voorraad" });
             }
-            else if (msg.includes("NO_ACTIVE_FLORIDAY_CONNECTION")) {
-                toast.error("Geen actieve Floriday-connectie. Ga naar Instellingen → Floriday.");
+            else if (status === "succeeded_with_warnings") {
+                toast.warning("Gepubliceerd, met aandachtspunten", {
+                    description: "Bekijk wat er nog moet gebeuren in het overzicht hieronder.",
+                });
             }
             else {
-                toast.error(`Opslaan mislukt: ${msg}`);
+                toast.error("Publiceren is niet gelukt");
             }
         }
+        catch (e) {
+            const friendly = translatePublishError(e, { characteristicLabels });
+            await handleStepFailure(friendly);
+            if (jobId)
+                await finishPublishJob(jobId);
+        }
         finally {
             setSubmitting(false);
         }
@@ -1138,12 +1330,113 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
             setSubmitting(false);
         }
     };
-    // Auto-save: zodra er een bestaand concept OF een gepubliceerd artikel in
-    // bewerking is, persisteren we wijzigingen debounced. Voor concepten gaan de
-    // wijzigingen naar `trade_item_drafts`; voor gepubliceerde artikelen wordt
-    // een PUT /trade-items/{id} naar Floriday gestuurd en de lokale cache
-    // meteen bijgewerkt, zodat aanpassingen (o.a. beladingen) direct overal in
-    // het systeem beschikbaar zijn en niet verloren raken bij navigatie.
+    // Auto-save: wijzigingen worden ALTIJD eerst lokaal vastgelegd en pas daarna
+    // naar Floriday gestuurd. Mislukt die push, dan blijft de invoer bewaard en
+    // wordt het artikel gemarkeerd als "nog niet doorgegeven"; bij het opnieuw
+    // openen is de lokale versie dan leidend.
+    const persistAndPush = useCallback(async (snapshot) => {
+        if (!activeId)
+            return false;
+        const pushTargetId = (isEditingPublished && tradeItemId) ? tradeItemId : (draftFloridayId || null);
+        setSyncState("saving");
+        setSyncError(null);
+        // 1. Lokaal opslaan — nooit overslaan.
+        let localId = draftId;
+        try {
+            localId = await upsertLocalTradeItem({
+                id: draftId,
+                connectionId: activeId,
+                data: snapshot,
+                floridayTradeItemId: pushTargetId,
+                sync: { dirty: Boolean(pushTargetId), last_error: null },
+            });
+            if (localId && localId !== draftId)
+                setDraftId(localId);
+        }
+        catch (e) {
+            const msg = e.message || "Onbekende fout";
+            setSyncError(msg);
+            setSyncState("error");
+            toast.error(`Lokaal opslaan mislukt: ${msg}`);
+            return false;
+        }
+        const finishLocalOnly = () => {
+            setSyncState("local");
+            return true;
+        };
+        if (!pushTargetId) {
+            setPendingSync(null);
+            if (localId) {
+                void markLocalSyncStatus(localId, {
+                    dirty: false,
+                    last_synced_at: null,
+                }).catch(() => { });
+            }
+            return finishLocalOnly();
+        }
+        if (!snapshot.productGroup)
+            return finishLocalOnly();
+        // Geen warehouse gekozen? Alleen lokaal bewaren; zodra de gebruiker een
+        // magazijn kiest gaat de sync verder.
+        const whId = (snapshot.warehouseId ?? "").trim();
+        const isUuid = /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i.test(whId);
+        if (!isUuid)
+            return finishLocalOnly();
+        // 2. Doorgeven aan Floriday.
+        try {
+            await saveWarehousePreference(pushTargetId, snapshot.warehouseId);
+            const payload = buildUpdateTradeItemPayload(snapshot);
+            const res = await floriday.updateTradeItem(activeId, pushTargetId, payload);
+            if (!res?.attemptId) {
+                throw new Error("Gateway gaf geen attemptId terug");
+            }
+            try {
+                const cachePayload = {
+                    ...buildAddTradeItemPayload(snapshot),
+                    tradeItemId: pushTargetId,
+                };
+                await supabase
+                    .from("floriday_trade_items_cache")
+                    .update({
+                    data: cachePayload,
+                    fetched_at: new Date().toISOString(),
+                })
+                    .eq("connection_id", activeId)
+                    .eq("floriday_id", pushTargetId);
+            }
+            catch {
+                /* niet kritiek; sync corrigeert */
+            }
+            if (localId) {
+                await markLocalSyncStatus(localId, {
+                    dirty: false,
+                    last_error: null,
+                    last_synced_at: new Date().toISOString(),
+                }).catch(() => { });
+            }
+            setPendingSync(null);
+            setSyncState("saved");
+            return true;
+        }
+        catch (e) {
+            const msg = e.message || "Onbekende fout";
+            if (localId) {
+                void markLocalSyncStatus(localId, { dirty: true, last_error: msg }).catch(() => { });
+            }
+            setPendingSync({ error: msg, at: new Date().toISOString() });
+            setSyncError(msg);
+            setSyncState("error");
+            return false;
+        }
+    }, [
+        activeId,
+        draftId,
+        draftFloridayId,
+        isEditingPublished,
+        tradeItemId,
+        saveWarehousePreference,
+        floriday,
+    ]);
     useEffect(() => {
         if (!activeId)
             return;
@@ -1162,66 +1455,12 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
         }
         if (lastSavedRef.current === serialized)
             return;
-        const t = window.setTimeout(async () => {
-            setSyncState("saving");
-            setSyncError(null);
-            try {
-                // Altijd lokaal opslaan als we een draft-rij hebben
-                if (draftId) {
-                    await upsertLocalTradeItem({ id: draftId, connectionId: activeId, data });
-                }
-                if (pushTargetId && !data.productGroup) {
-                    setSyncState(draftId ? "local" : "idle");
-                    lastSavedRef.current = serialized;
-                    return;
-                }
-                // Push naar Floriday als er een gekoppeld/gepubliceerd trade-item is
-                if (pushTargetId) {
-                    // Geen warehouse gekozen? Sla stil lokaal op — geen toast, geen rode
-                    // pill. Zodra de gebruiker een warehouse kiest gaat de sync verder.
-                    const whId = (data.warehouseId ?? "").trim();
-                    const isUuid = /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i.test(whId);
-                    if (!isUuid) {
-                        setSyncState(draftId ? "local" : "idle");
-                        lastSavedRef.current = serialized;
-                        return;
-                    }
-                    await saveWarehousePreference(pushTargetId, data.warehouseId);
-                    const payload = buildUpdateTradeItemPayload(data);
-                    const res = await floriday.updateTradeItem(activeId, pushTargetId, payload);
-                    if (!res?.attemptId) {
-                        throw new Error("Gateway gaf geen attemptId terug");
-                    }
-                    try {
-                        const cachePayload = {
-                            ...buildAddTradeItemPayload(data),
-                            tradeItemId: pushTargetId,
-                        };
-                        await supabase
-                            .from("floriday_trade_items_cache")
-                            .update({
-                            data: cachePayload,
-                            fetched_at: new Date().toISOString(),
-                        })
-                            .eq("connection_id", activeId)
-                            .eq("floriday_id", pushTargetId);
-                    }
-                    catch {
-                        /* niet kritiek; sync corrigeert */
-                    }
-                    setSyncState("saved");
-                }
-                else {
-                    setSyncState("local");
-                }
-                lastSavedRef.current = serialized;
-            }
-            catch (e) {
-                const msg = e.message || "Onbekende fout";
-                setSyncError(msg);
-                setSyncState("error");
-                toast.error(`Sync naar Floriday mislukt: ${msg}`);
-            }
+        const snapshot = data;
+        const t = window.setTimeout(() => {
+            // De lokale opslag slaagt (bijna) altijd; de baseline mag dus mee, ook als
+            // de Floriday-push faalt — de invoer staat dan veilig in de eigen database.
+            lastSavedRef.current = serialized;
+            void persistAndPush(snapshot);
         }, 800);
         return () => window.clearTimeout(t);
     }, [
@@ -1233,9 +1472,22 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
         publishedLoading,
         productLoading,
         isEditingPublished,
-        saveWarehousePreference,
         tradeItemId,
+        persistAndPush,
     ]);
+    const retrySync = useCallback(async () => {
+        setRetryingSync(true);
+        try {
+            const ok = await persistAndPush(data);
+            if (ok)
+                toast.success("Wijzigingen doorgegeven aan Floriday");
+            else
+                toast.error("Doorgeven aan Floriday lukt nog niet; je gegevens blijven bewaard");
+        }
+        finally {
+            setRetryingSync(false);
+        }
+    }, [persistAndPush, data]);
     if (connLoading || draftLoading || publishedLoading || productLoading) {
         return (_jsx("main", { className: "p-6", children: _jsxs(Card, { className: "p-6 flex items-center gap-2 text-sm text-muted-foreground", children: [_jsx(Loader2, { className: "h-4 w-4 animate-spin" }), publishedLoading
                         ? "Artikel laden..."
@@ -1252,7 +1504,7 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
                             setDeleteOpen(o);
                             if (!o)
                                 setDeleteAck(false);
-                        }, children: [_jsx(AlertDialogTrigger, { asChild: true, children: _jsxs(Button, { variant: "ghost", size: "sm", className: "text-destructive hover:text-destructive", children: [_jsx(Trash2, { className: "mr-2 h-4 w-4" }), "Verwijderen"] }) }), _jsxs(AlertDialogContent, { children: [_jsxs(AlertDialogHeader, { children: [_jsx(AlertDialogTitle, { children: "Product verwijderen?" }), _jsx(AlertDialogDescription, { asChild: true, children: _jsxs("div", { className: "space-y-3 text-sm", children: [_jsxs("div", { children: ["Je staat op het punt om ", _jsx("strong", { children: data.name || "dit artikel" }), data.articleCode ? _jsxs(_Fragment, { children: [" (artikelnummer ", _jsx("code", { children: data.articleCode }), ")"] }) : null, " ", "lokaal uit de voorraad te verwijderen."] }), _jsxs("div", { className: "rounded-md border p-3 bg-muted/40 space-y-1", children: [_jsxs("div", { children: ["Huidige voorraad: ", _jsx("strong", { children: productMeta.physicalStock }), " stuks"] }), _jsxs("div", { children: ["Floriday-koppeling:", " ", productMeta.floridayActive || productMeta.floridayTradeItemId ? (_jsx("span", { className: "text-emerald-700 font-medium", children: "actief" })) : (_jsx("span", { className: "text-muted-foreground", children: "geen" }))] })] }), (productMeta.floridayActive || productMeta.floridayTradeItemId) && (_jsxs("div", { className: "rounded-md border border-amber-300 bg-amber-50 p-3 text-amber-900", children: [_jsx("strong", { children: "Let op:" }), " dit artikel is gekoppeld met Floriday. Als je alleen de lokale kant verwijdert, blijft het artikel op Floriday bestaan en verschijnt het bij de volgende sync weer terug in de lijst. Trek het artikel daarna zelf in via het Floriday-portaal als je het echt weg wilt."] })), productMeta.physicalStock > 0 && (_jsxs("div", { className: "rounded-md border border-rose-300 bg-rose-50 p-3 text-rose-900", children: ["Er staat nog voorraad (", productMeta.physicalStock, " stuks) op dit product. Deze voorraad wordt \u00F3\u00F3k verwijderd en kan niet automatisch worden hersteld."] })), _jsxs("label", { className: "flex items-start gap-2 pt-1", children: [_jsx(Checkbox, { checked: deleteAck, onCheckedChange: (v) => setDeleteAck(Boolean(v)) }), _jsx("span", { children: "Ik weet zeker dat ik dit product wil verwijderen en begrijp de gevolgen." })] })] }) })] }), _jsxs(AlertDialogFooter, { children: [_jsx(AlertDialogCancel, { children: "Annuleren" }), _jsx(AlertDialogAction, { disabled: !deleteAck, onClick: handleDeleteDraft, className: "bg-destructive text-destructive-foreground hover:bg-destructive/90", children: "Definitief verwijderen" })] })] })] }))] }), isEditing && (data.name || data.vbnName) && (_jsxs("div", { className: "space-y-1", children: [_jsx("div", { className: "text-xs uppercase tracking-wide text-muted-foreground", children: "Artikel" }), _jsxs("div", { className: "flex items-center gap-3 flex-wrap", children: [_jsx("h1", { className: "text-2xl font-semibold leading-tight", children: data.name || data.vbnName }), (isEditingPublished || draftFloridayId) ? (syncState === "saving" ? (_jsxs("span", { className: "inline-flex items-center gap-1 text-xs px-2 py-0.5 rounded-full bg-muted text-muted-foreground", children: [_jsx(Loader2, { className: "h-3 w-3 animate-spin" }), " Synchroniseren\u2026"] })) : syncState === "saved" ? (_jsxs("span", { className: "inline-flex items-center gap-1 text-xs px-2 py-0.5 rounded-full bg-emerald-100 text-emerald-700", children: [_jsx(Check, { className: "h-3 w-3" }), " Gesynchroniseerd"] })) : syncState === "error" ? (_jsx("span", { className: "inline-flex items-center gap-1 text-xs px-2 py-0.5 rounded-full bg-red-100 text-red-700", title: syncError ?? undefined, children: "Sync mislukt \u2014 klik Opslaan om opnieuw te proberen" })) : null) : (_jsx("span", { className: "inline-flex items-center gap-1 text-xs px-2 py-0.5 rounded-full bg-muted text-muted-foreground", children: "Nog niet gepubliceerd naar Floriday" })), _jsx(PriceStatusBadge, { tradeItemId: tradeItemId ?? draftFloridayId ?? null, offerForSale: data.offerForSale })] }), data.name && data.vbnName && data.name !== data.vbnName && (_jsx("div", { className: "text-sm text-muted-foreground", children: data.vbnName }))] })), isEditing && (_jsx(Card, { className: "p-4 bg-muted/30 flex items-center gap-3 text-sm", children: isEditingPublished ? (_jsxs(_Fragment, { children: [_jsx("img", { src: floridayLogo, alt: "Floriday", className: "h-6 w-6 shrink-0" }), _jsxs("div", { className: "flex-1", children: [_jsx("div", { className: "font-medium", children: "Gepubliceerd artikel bewerken" }), _jsx("div", { className: "text-xs text-muted-foreground", children: "Wijzigingen worden direct naar Floriday verstuurd. Je kunt vrij tussen alle secties navigeren." })] }), _jsxs(Button, { onClick: submit, disabled: submitting || invalidStepCount > 0, children: [submitting ? (_jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" })) : (_jsx(Check, { className: "mr-2 h-4 w-4" })), "Wijzigingen opslaan"] })] })) : (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex-1", children: [_jsx("div", { className: "font-medium", children: "Lokaal artikel bewerken" }), _jsx("div", { className: "text-xs text-muted-foreground", children: "Niet gepubliceerd. Je kunt vrij tussen alle secties navigeren." })] }), _jsxs(Button, { onClick: submit, disabled: submitting || invalidStepCount > 0, children: [submitting ? (_jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" })) : (_jsx(Check, { className: "mr-2 h-4 w-4" })), publishToFloriday ? "Publiceren naar Floriday" : "Wijzigingen opslaan"] })] })) })), isEditing && (_jsxs(_Fragment, { children: [_jsx(ArtikelCompositionCard, { productId: linkedProductId, floridayId: tradeItemId ?? draftFloridayId ?? null }), _jsx(FloridayInfoCard, { floridayTradeItemId: tradeItemId ?? draftFloridayId ?? null, local: {
+                        }, children: [_jsx(AlertDialogTrigger, { asChild: true, children: _jsxs(Button, { variant: "ghost", size: "sm", className: "text-destructive hover:text-destructive", children: [_jsx(Trash2, { className: "mr-2 h-4 w-4" }), "Verwijderen"] }) }), _jsxs(AlertDialogContent, { children: [_jsxs(AlertDialogHeader, { children: [_jsx(AlertDialogTitle, { children: "Product verwijderen?" }), _jsx(AlertDialogDescription, { asChild: true, children: _jsxs("div", { className: "space-y-3 text-sm", children: [_jsxs("div", { children: ["Je staat op het punt om ", _jsx("strong", { children: data.name || "dit artikel" }), data.articleCode ? _jsxs(_Fragment, { children: [" (artikelnummer ", _jsx("code", { children: data.articleCode }), ")"] }) : null, " ", "lokaal uit de voorraad te verwijderen."] }), _jsxs("div", { className: "rounded-md border p-3 bg-muted/40 space-y-1", children: [_jsxs("div", { children: ["Huidige voorraad: ", _jsx("strong", { children: productMeta.physicalStock }), " stuks"] }), _jsxs("div", { children: ["Floriday-koppeling:", " ", productMeta.floridayActive || productMeta.floridayTradeItemId ? (_jsx("span", { className: "text-emerald-700 font-medium", children: "actief" })) : (_jsx("span", { className: "text-muted-foreground", children: "geen" }))] })] }), (productMeta.floridayActive || productMeta.floridayTradeItemId) && (_jsxs("div", { className: "rounded-md border border-amber-300 bg-amber-50 p-3 text-amber-900", children: [_jsx("strong", { children: "Let op:" }), " dit artikel is gekoppeld met Floriday. Als je alleen de lokale kant verwijdert, blijft het artikel op Floriday bestaan en verschijnt het bij de volgende sync weer terug in de lijst. Trek het artikel daarna zelf in via het Floriday-portaal als je het echt weg wilt."] })), productMeta.physicalStock > 0 && (_jsxs("div", { className: "rounded-md border border-rose-300 bg-rose-50 p-3 text-rose-900", children: ["Er staat nog voorraad (", productMeta.physicalStock, " stuks) op dit product. Deze voorraad wordt \u00F3\u00F3k verwijderd en kan niet automatisch worden hersteld."] })), _jsxs("label", { className: "flex items-start gap-2 pt-1", children: [_jsx(Checkbox, { checked: deleteAck, onCheckedChange: (v) => setDeleteAck(Boolean(v)) }), _jsx("span", { children: "Ik weet zeker dat ik dit product wil verwijderen en begrijp de gevolgen." })] })] }) })] }), _jsxs(AlertDialogFooter, { children: [_jsx(AlertDialogCancel, { children: "Annuleren" }), _jsx(AlertDialogAction, { disabled: !deleteAck, onClick: handleDeleteDraft, className: "bg-destructive text-destructive-foreground hover:bg-destructive/90", children: "Definitief verwijderen" })] })] })] }))] }), isEditing && (data.name || data.vbnName) && (_jsxs("div", { className: "space-y-1", children: [_jsx("div", { className: "text-xs uppercase tracking-wide text-muted-foreground", children: "Artikel" }), _jsxs("div", { className: "flex items-center gap-3 flex-wrap", children: [_jsx("h1", { className: "text-2xl font-semibold leading-tight", children: data.name || data.vbnName }), (isEditingPublished || draftFloridayId) ? (syncState === "saving" ? (_jsxs("span", { className: "inline-flex items-center gap-1 text-xs px-2 py-0.5 rounded-full bg-muted text-muted-foreground", children: [_jsx(Loader2, { className: "h-3 w-3 animate-spin" }), " Synchroniseren\u2026"] })) : syncState === "saved" ? (_jsxs("span", { className: "inline-flex items-center gap-1 text-xs px-2 py-0.5 rounded-full bg-emerald-100 text-emerald-700", children: [_jsx(Check, { className: "h-3 w-3" }), " Gesynchroniseerd"] })) : syncState === "error" ? (_jsx("span", { className: "inline-flex items-center gap-1 text-xs px-2 py-0.5 rounded-full bg-red-100 text-red-700", title: syncError ?? undefined, children: "Sync mislukt \u2014 klik Opslaan om opnieuw te proberen" })) : null) : (_jsx("span", { className: "inline-flex items-center gap-1 text-xs px-2 py-0.5 rounded-full bg-muted text-muted-foreground", children: "Nog niet gepubliceerd naar Floriday" })), _jsx(PriceStatusBadge, { tradeItemId: tradeItemId ?? draftFloridayId ?? null, offerForSale: data.offerForSale })] }), data.name && data.vbnName && data.name !== data.vbnName && (_jsx("div", { className: "text-sm text-muted-foreground", children: data.vbnName }))] })), pendingSync && (_jsxs(Card, { className: "p-4 border-amber-300 bg-amber-50 text-amber-900 space-y-2", children: [_jsx("div", { className: "font-medium text-sm", children: "Je wijzigingen zijn opgeslagen, maar nog niet doorgegeven aan Floriday" }), _jsxs("div", { className: "text-xs", children: ["Alles wat je hier hebt ingevuld blijft bewaard in dit systeem. Zodra het doorgeven lukt, verdwijnt deze melding vanzelf.", pendingSync.error ? ` Reden: ${pendingSync.error}` : ""] }), _jsx(Button, { type: "button", variant: "outline", size: "sm", disabled: retryingSync, onClick: retrySync, children: retryingSync ? (_jsxs(_Fragment, { children: [_jsx(Loader2, { className: "h-3 w-3 animate-spin mr-1" }), " Bezig\u2026"] })) : ("Opnieuw proberen") })] })), isEditing && (_jsx(Card, { className: "p-4 bg-muted/30 flex items-center gap-3 text-sm", children: isEditingPublished ? (_jsxs(_Fragment, { children: [_jsx("img", { src: floridayLogo, alt: "Floriday", className: "h-6 w-6 shrink-0" }), _jsxs("div", { className: "flex-1", children: [_jsx("div", { className: "font-medium", children: "Gepubliceerd artikel bewerken" }), _jsx("div", { className: "text-xs text-muted-foreground", children: "Wijzigingen worden direct naar Floriday verstuurd. Je kunt vrij tussen alle secties navigeren." })] }), _jsxs(Button, { onClick: () => void submit(), disabled: submitting || invalidStepCount > 0, children: [submitting ? (_jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" })) : (_jsx(Check, { className: "mr-2 h-4 w-4" })), "Wijzigingen opslaan"] })] })) : (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex-1", children: [_jsx("div", { className: "font-medium", children: "Lokaal artikel bewerken" }), _jsx("div", { className: "text-xs text-muted-foreground", children: "Niet gepubliceerd. Je kunt vrij tussen alle secties navigeren." })] }), _jsxs(Button, { onClick: () => void submit(), disabled: submitting || invalidStepCount > 0, children: [submitting ? (_jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" })) : (_jsx(Check, { className: "mr-2 h-4 w-4" })), publishToFloriday ? "Publiceren naar Floriday" : "Wijzigingen opslaan"] })] })) })), isEditing && (_jsxs(_Fragment, { children: [_jsx(ArtikelCompositionCard, { productId: linkedProductId, floridayId: tradeItemId ?? draftFloridayId ?? null }), _jsx(FloridayInfoCard, { floridayTradeItemId: tradeItemId ?? draftFloridayId ?? null, local: {
                             name: data.name || data.vbnName,
                             articleNumber: data.articleCode,
                             gtin: data.gtin,
@@ -1280,7 +1532,7 @@ export function ArtikelWizard({ draftId: initialDraftId, tradeItemId, productId,
                                                         ? "border-destructive bg-destructive text-destructive-foreground"
                                                         : "border-muted-foreground/30 text-muted-foreground"}`, children: status === "valid" ? (_jsx(Check, { className: "h-4 w-4" })) : status === "invalid" ? ("!") : (i + 1) }), _jsx("span", { className: `min-w-0 truncate font-medium ${status === "untouched" ? "text-muted-foreground" : ""}`, children: s.label }), !isOpen && summary && (_jsx("span", { className: `max-w-xs truncate text-xs ${status === "invalid" ? "text-destructive" : "text-muted-foreground"}`, children: status === "invalid" ? `Onvolledig — ${summary}` : summary }))] }), isOpen && (_jsxs(CardContent, { className: "space-y-4 pt-0", children: [_jsx("div", { "data-wizard-form-content": true, className: "w-full min-w-0", children: _jsx(StepBody, { stepKey: s.key, data: data, update: update, vbnProducts: vbnProducts, featureTypes: featureTypes, packagingTypes: packagingTypes, loadCarriers: loadCarriers, floridayCustomers: floridayCustomers, schemaQuery: schemaQuery, regulatoryQuery: regulatoryQuery, spec: spec, collectionsList: collectionsList, setCollectionsList: setCollectionsList, activeId: activeId, acceptedVbnCodes: acceptedVbnCodes, priceGroups: priceGroups, parentProductId: linkedProductId ?? draftId ?? null, parentFloridayId: draftFloridayId ?? tradeItemId ?? null, articleCodeLocked: Boolean(draftFloridayId || tradeItemId) }) }), isLastStep && !isEditingPublished && (_jsxs("div", { className: "rounded-lg border bg-muted/30 p-4 flex items-start gap-3", children: [_jsx("img", { src: floridayLogo, alt: "Floriday", className: "h-7 w-7 shrink-0 mt-0.5" }), _jsxs("div", { className: "flex-1 min-w-0", children: [_jsx(Label, { htmlFor: "publish-to-floriday", className: "font-medium cursor-pointer", children: "Publiceren naar Floriday" }), _jsx("p", { className: "text-xs text-muted-foreground mt-1", children: publishToFloriday
                                                                 ? "Het artikel wordt aangemaakt in Floriday en is binnen enkele minuten zichtbaar voor klanten."
-                                                                : "Het artikel wordt alleen lokaal opgeslagen. Je kunt het later vanuit de voorraadlijst alsnog publiceren naar Floriday." })] }), _jsx(Switch, { id: "publish-to-floriday", checked: publishToFloriday, onCheckedChange: setPublishToFloriday })] })), (isLastStep || isEditing) && invalidStepCount > 0 && (_jsxs("div", { className: "rounded-md border border-destructive/40 bg-destructive/5 px-3 py-2 text-xs text-destructive flex items-center justify-between gap-3", children: [_jsxs("span", { children: ["Nog ", invalidStepCount, " stap", invalidStepCount === 1 ? "" : "pen", " onvolledig"] }), firstInvalidIndex >= 0 && (_jsxs("button", { type: "button", onClick: () => setStep(firstInvalidIndex), className: "underline font-medium", children: ["Ga naar ", steps[firstInvalidIndex].label] }))] })), _jsx("div", { className: "flex justify-end pt-2", children: isLastStep || isEditing ? (_jsxs(Button, { onClick: submit, disabled: submitting || invalidStepCount > 0, children: [submitting ? (_jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" })) : (_jsx(Check, { className: "mr-2 h-4 w-4" })), isEditingPublished
+                                                                : "Het artikel wordt alleen lokaal opgeslagen. Je kunt het later vanuit de voorraadlijst alsnog publiceren naar Floriday." })] }), _jsx(Switch, { id: "publish-to-floriday", checked: publishToFloriday, onCheckedChange: setPublishToFloriday })] })), (isLastStep || isEditing) && (_jsx(PublishReadinessCard, { report: readiness, loading: connLoading || connectionReadiness.isLoading || schemaQuery.isLoading, onGoToStep: goToStepKey })), publishJob && (_jsx(PublishProgressCard, { job: publishJob, steps: publishSteps, retrying: submitting, onRetry: () => void submit({ resumeJobId: publishJob.id }), onFixStep: (key) => goToStepKey(key === "trade-item" ? "eigenschappen" : "aanbod") })), (isLastStep || isEditing) && invalidStepCount > 0 && (_jsxs("div", { className: "rounded-md border border-destructive/40 bg-destructive/5 px-3 py-2 text-xs text-destructive flex items-center justify-between gap-3", children: [_jsxs("span", { children: ["Nog ", invalidStepCount, " stap", invalidStepCount === 1 ? "" : "pen", " onvolledig"] }), firstInvalidIndex >= 0 && (_jsxs("button", { type: "button", onClick: () => setStep(firstInvalidIndex), className: "underline font-medium", children: ["Ga naar ", steps[firstInvalidIndex].label] }))] })), _jsx("div", { className: "flex justify-end pt-2", children: isLastStep || isEditing ? (_jsxs(Button, { onClick: () => void submit(), disabled: submitting || invalidStepCount > 0, children: [submitting ? (_jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" })) : (_jsx(Check, { className: "mr-2 h-4 w-4" })), isEditingPublished
                                                         ? "Wijzigingen opslaan"
                                                         : publishToFloriday
                                                             ? isEditingDraft