@open-mercato/core 0.6.8-develop.6998.1.d2bc46c56c → 0.6.8-develop.7001.1.03608ab252

package/dist/modules/warranty_claims/frontend/[orgSlug]/portal/claims/new/page.js

@@ -0,0 +1,1139 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import Link from "next/link";
+import { useRouter } from "next/navigation";
+import { ArrowLeft, ArrowRight, FileText, Plus, Send, Trash2 } from "lucide-react";
+import { useLocale, useT } from "@open-mercato/shared/lib/i18n/context";
+import { Button } from "@open-mercato/ui/primitives/button";
+import { Checkbox } from "@open-mercato/ui/primitives/checkbox";
+import { CheckboxField } from "@open-mercato/ui/primitives/checkbox-field";
+import { IconButton } from "@open-mercato/ui/primitives/icon-button";
+import { Input } from "@open-mercato/ui/primitives/input";
+import { Radio, RadioGroup } from "@open-mercato/ui/primitives/radio";
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue
+} from "@open-mercato/ui/primitives/select";
+import { StatusBadge } from "@open-mercato/ui/primitives/status-badge";
+import { StepIndicator } from "@open-mercato/ui/primitives/step-indicator";
+import { Textarea } from "@open-mercato/ui/primitives/textarea";
+import { FormField } from "@open-mercato/ui/primitives/form-field";
+import { Alert, AlertDescription } from "@open-mercato/ui/primitives/alert";
+import { Spinner } from "@open-mercato/ui/primitives/spinner";
+import { ErrorMessage } from "@open-mercato/ui/backend/detail";
+import { flash } from "@open-mercato/ui/backend/FlashMessages";
+import { useGuardedMutation } from "@open-mercato/ui/backend/injection/useGuardedMutation";
+import { apiCall } from "@open-mercato/ui/backend/utils/apiCall";
+import { usePortalContext } from "@open-mercato/ui/portal/PortalContext";
+import { PortalPageHeader } from "@open-mercato/ui/portal/components/PortalPageHeader";
+import { PortalCard, PortalCardHeader } from "@open-mercato/ui/portal/components/PortalCard";
+import { localizeDictionaryLabel } from "@open-mercato/core/modules/warranty_claims/lib/dictionaryLabels";
+import {
+  ATTACHMENT_ACCEPT_TYPES,
+  validateAttachmentFile
+} from "@open-mercato/core/modules/warranty_claims/lib/portalAttachmentValidation";
+import {
+  TroubleshootingWalker
+} from "../../../../../backend/components/TroubleshootingWalker.js";
+const WIZARD_STEP_IDS = ["order", "items", "details", "review"];
+const EMPTY_SELECT_VALUE = "__empty__";
+let lineId = 0;
+function createLineDraft() {
+  lineId += 1;
+  return {
+    localId: `claim-line-${lineId}`,
+    sku: "",
+    serialNumber: "",
+    faultCode: "",
+    faultDescription: "",
+    qtyClaimed: "1"
+  };
+}
+let stagedAttachmentId = 0;
+function createStagedAttachment(file) {
+  stagedAttachmentId += 1;
+  return { localId: `claim-attachment-${stagedAttachmentId}`, file };
+}
+function optionalText(value) {
+  const trimmed = value.trim();
+  return trimmed.length ? trimmed : void 0;
+}
+function isPositiveQuantity(value) {
+  const qtyClaimed = Number(value);
+  return Number.isFinite(qtyClaimed) && qtyClaimed > 0;
+}
+function parsePositiveNumber(value) {
+  if (typeof value === "number") return Number.isFinite(value) && value > 0 ? value : null;
+  if (typeof value === "string") {
+    const parsed = Number(value);
+    return Number.isFinite(parsed) && parsed > 0 ? parsed : null;
+  }
+  return null;
+}
+function defaultQuantity(value) {
+  return String(parsePositiveNumber(value) ?? 1);
+}
+function formatDate(value, fallback, locale) {
+  if (!value) return fallback;
+  const date = new Date(value);
+  if (Number.isNaN(date.getTime())) return value;
+  return date.toLocaleDateString(locale || void 0, {
+    year: "numeric",
+    month: "short",
+    day: "numeric"
+  });
+}
+function formatQuantity(value, fallback, locale) {
+  const parsed = parsePositiveNumber(value);
+  return parsed === null ? fallback : parsed.toLocaleString(locale || void 0);
+}
+function formatOrderTotal(value, currencyCode, fallback, locale) {
+  const parsed = typeof value === "number" ? value : typeof value === "string" ? Number(value) : Number.NaN;
+  if (!Number.isFinite(parsed)) return fallback;
+  if (currencyCode && /^[A-Z]{3}$/.test(currencyCode)) {
+    return new Intl.NumberFormat(locale || void 0, { style: "currency", currency: currencyCode }).format(parsed);
+  }
+  const formatted = parsed.toLocaleString(locale || void 0);
+  return currencyCode ? `${formatted} ${currencyCode}` : formatted;
+}
+function optionLabel(options, value) {
+  return options.find((option) => option.value === value)?.label ?? value;
+}
+function isBlankLineDraft(line) {
+  return !line.orderLineId && !line.productId && !optionalText(line.productName ?? "") && !optionalText(line.sku) && !optionalText(line.serialNumber) && !optionalText(line.faultCode) && !optionalText(line.faultDescription) && (!optionalText(line.qtyClaimed) || line.qtyClaimed === "1");
+}
+function warrantyStatusVariant(status) {
+  if (status === "in_warranty") return "success";
+  if (status === "out_of_warranty") return "error";
+  return "neutral";
+}
+function warrantyStatusLabelKey(status) {
+  if (status === "in_warranty") return "warranty_claims.portal.entitlement.inWarranty";
+  if (status === "out_of_warranty") return "warranty_claims.portal.entitlement.outOfWarranty";
+  return "warranty_claims.portal.value.notAvailable";
+}
+const CREATE_MUTATION_CONTEXT_ID = "warranty_claims.portal.claim.create";
+function WarrantyClaimPortalNewPage({ params }) {
+  const t = useT();
+  const locale = useLocale();
+  const router = useRouter();
+  const { auth } = usePortalContext();
+  const { user, loading } = auth;
+  const guardedMutation = useGuardedMutation({
+    contextId: CREATE_MUTATION_CONTEXT_ID,
+    blockedMessage: t("warranty_claims.portal.new.blocked")
+  });
+  const [currentStep, setCurrentStep] = React.useState("order");
+  const [noOrder, setNoOrder] = React.useState(false);
+  const [manualOrderEntry, setManualOrderEntry] = React.useState(false);
+  const [orderReference, setOrderReference] = React.useState("");
+  const [orderSearchInput, setOrderSearchInput] = React.useState("");
+  const [debouncedOrderSearch, setDebouncedOrderSearch] = React.useState("");
+  const [orders, setOrders] = React.useState([]);
+  const [ordersLoading, setOrdersLoading] = React.useState(false);
+  const [ordersUnavailable, setOrdersUnavailable] = React.useState(false);
+  const [selectedOrderId, setSelectedOrderId] = React.useState("");
+  const [selectedOrderNumber, setSelectedOrderNumber] = React.useState("");
+  const [selectedOrderPlacedAt, setSelectedOrderPlacedAt] = React.useState(null);
+  const [orderLines, setOrderLines] = React.useState([]);
+  const [orderLinesLoading, setOrderLinesLoading] = React.useState(false);
+  const [orderLinesUnavailable, setOrderLinesUnavailable] = React.useState(false);
+  const [selectedOrderLineIds, setSelectedOrderLineIds] = React.useState(() => /* @__PURE__ */ new Set());
+  const [selectedOrderLineQty, setSelectedOrderLineQty] = React.useState({});
+  const [reasonCode, setReasonCode] = React.useState("");
+  const [notes, setNotes] = React.useState("");
+  const [lines, setLines] = React.useState(() => [createLineDraft()]);
+  const [portalOptions, setPortalOptions] = React.useState({ reasons: [], faultCodes: [] });
+  const [troubleshootingGuide, setTroubleshootingGuide] = React.useState(null);
+  const [error, setError] = React.useState(null);
+  const [submitting, setSubmitting] = React.useState(false);
+  const [stagedFiles, setStagedFiles] = React.useState([]);
+  const [stagedFileInputKey, setStagedFileInputKey] = React.useState(0);
+  const [serialDuplicateWarnings, setSerialDuplicateWarnings] = React.useState({});
+  const serialLookupTimers = React.useRef({});
+  const isMountedRef = React.useRef(true);
+  React.useEffect(() => {
+    if (!loading && !user) {
+      router.replace(`/${params.orgSlug}/portal/login`);
+    }
+  }, [loading, user, router, params.orgSlug]);
+  React.useEffect(() => {
+    isMountedRef.current = true;
+    return () => {
+      isMountedRef.current = false;
+      Object.values(serialLookupTimers.current).forEach((timer) => window.clearTimeout(timer));
+    };
+  }, []);
+  const clearSerialLookupTimer = React.useCallback((localId) => {
+    const timer = serialLookupTimers.current[localId];
+    if (timer) {
+      window.clearTimeout(timer);
+      delete serialLookupTimers.current[localId];
+    }
+  }, []);
+  const clearSerialDuplicateWarning = React.useCallback((localId) => {
+    setSerialDuplicateWarnings((current) => {
+      if (!(localId in current)) return current;
+      const next = { ...current };
+      delete next[localId];
+      return next;
+    });
+  }, []);
+  const checkSerialDuplicate = React.useCallback((localId, serialNumber) => {
+    clearSerialLookupTimer(localId);
+    const trimmed = serialNumber.trim();
+    if (!trimmed) {
+      clearSerialDuplicateWarning(localId);
+      return;
+    }
+    serialLookupTimers.current[localId] = window.setTimeout(() => {
+      void apiCall(
+        `/api/warranty_claims/portal/claims?serialNumber=${encodeURIComponent(trimmed)}&pageSize=5`
+      ).then((result) => {
+        if (!isMountedRef.current || !result.ok || !result.result) return;
+        const claimNumbers = result.result.items.map((item) => item.claimNumber).filter((value) => typeof value === "string" && value.length > 0);
+        setSerialDuplicateWarnings((current) => ({ ...current, [localId]: claimNumbers }));
+      }).catch(() => {
+      });
+    }, 300);
+  }, [clearSerialDuplicateWarning, clearSerialLookupTimer]);
+  React.useEffect(() => {
+    if (!user) return;
+    let cancelled = false;
+    apiCall("/api/warranty_claims/portal/options").then((result) => {
+      if (cancelled) return;
+      const options = result.result?.ok ? result.result.result : null;
+      setPortalOptions({
+        reasons: options?.reasons ?? [],
+        faultCodes: options?.faultCodes ?? []
+      });
+    }).catch(() => {
+      if (!cancelled) setPortalOptions({ reasons: [], faultCodes: [] });
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [user]);
+  React.useEffect(() => {
+    if (!user) {
+      setTroubleshootingGuide(null);
+      return;
+    }
+    let cancelled = false;
+    const timer = window.setTimeout(() => {
+      const params2 = new URLSearchParams({ claimType: "warranty" });
+      const trimmedReason = reasonCode.trim();
+      if (trimmedReason) params2.set("reasonCode", trimmedReason);
+      void apiCall(
+        `/api/warranty_claims/portal/troubleshooting?${params2.toString()}`,
+        void 0,
+        { fallback: { guide: null } }
+      ).then((result) => {
+        if (cancelled) return;
+        setTroubleshootingGuide(result.ok ? result.result?.guide ?? null : null);
+      }).catch(() => {
+        if (!cancelled) setTroubleshootingGuide(null);
+      });
+    }, 300);
+    return () => {
+      cancelled = true;
+      window.clearTimeout(timer);
+    };
+  }, [reasonCode, user]);
+  React.useEffect(() => {
+    if (currentStep !== "order") return;
+    const timer = window.setTimeout(() => {
+      setDebouncedOrderSearch(orderSearchInput.trim());
+    }, 300);
+    return () => window.clearTimeout(timer);
+  }, [currentStep, orderSearchInput]);
+  React.useEffect(() => {
+    if (!user || currentStep !== "order" || ordersUnavailable) return;
+    let cancelled = false;
+    setOrdersLoading(true);
+    const search = encodeURIComponent(debouncedOrderSearch);
+    apiCall(`/api/warranty_claims/portal/orders?search=${search}&page=1`).then((result) => {
+      if (cancelled) return;
+      const payload = result.ok ? result.result : null;
+      if (!payload?.ok) {
+        setOrders([]);
+        setOrdersUnavailable(true);
+        setManualOrderEntry(true);
+        return;
+      }
+      setOrders(payload.items);
+    }).catch(() => {
+      if (!cancelled) {
+        setOrders([]);
+        setOrdersUnavailable(true);
+        setManualOrderEntry(true);
+      }
+    }).finally(() => {
+      if (!cancelled) setOrdersLoading(false);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [currentStep, debouncedOrderSearch, ordersUnavailable, user]);
+  React.useEffect(() => {
+    if (!user || currentStep !== "items" || !selectedOrderId) {
+      if (!selectedOrderId) {
+        setOrderLines([]);
+        setSelectedOrderLineIds(/* @__PURE__ */ new Set());
+        setSelectedOrderLineQty({});
+      }
+      return;
+    }
+    let cancelled = false;
+    setOrderLinesLoading(true);
+    setOrderLinesUnavailable(false);
+    apiCall(
+      `/api/warranty_claims/portal/orders/lines?orderId=${encodeURIComponent(selectedOrderId)}`
+    ).then((result) => {
+      if (cancelled) return;
+      const payload = result.ok ? result.result : null;
+      if (!payload?.ok || payload.items.length === 0) {
+        setOrderLines([]);
+        setSelectedOrderLineIds(/* @__PURE__ */ new Set());
+        setSelectedOrderLineQty({});
+        setOrderLinesUnavailable(true);
+        return;
+      }
+      setOrderLines(payload.items);
+      setSelectedOrderLineIds(/* @__PURE__ */ new Set());
+      setSelectedOrderLineQty(Object.fromEntries(
+        payload.items.map((line) => [line.orderLineId, defaultQuantity(line.quantity)])
+      ));
+    }).catch(() => {
+      if (!cancelled) {
+        setOrderLines([]);
+        setSelectedOrderLineIds(/* @__PURE__ */ new Set());
+        setSelectedOrderLineQty({});
+        setOrderLinesUnavailable(true);
+      }
+    }).finally(() => {
+      if (!cancelled) setOrderLinesLoading(false);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [currentStep, selectedOrderId, user]);
+  const currentStepIndex = WIZARD_STEP_IDS.indexOf(currentStep);
+  const hasValidLines = React.useMemo(() => {
+    return lines.length > 0 && lines.every((line) => line.faultDescription.trim().length > 0 && isPositiveQuantity(line.qtyClaimed));
+  }, [lines]);
+  const hasReason = reasonCode.trim().length > 0;
+  const wizardSteps = React.useMemo(() => {
+    const labels = {
+      order: t("warranty_claims.portal.wizard.order"),
+      items: t("warranty_claims.portal.wizard.items"),
+      details: t("warranty_claims.portal.wizard.details"),
+      review: t("warranty_claims.portal.wizard.reviewSubmit")
+    };
+    return WIZARD_STEP_IDS.map((stepId, index) => ({
+      id: stepId,
+      label: labels[stepId],
+      status: index < currentStepIndex ? "complete" : index === currentStepIndex ? "current" : "pending"
+    }));
+  }, [currentStepIndex, t]);
+  const updateLine = React.useCallback((localId, patch) => {
+    setLines((current) => current.map((line) => line.localId === localId ? { ...line, ...patch } : line));
+  }, []);
+  const addLine = React.useCallback(() => {
+    setLines((current) => [...current, createLineDraft()]);
+  }, []);
+  const removeLine = React.useCallback((localId) => {
+    setLines((current) => current.length > 1 ? current.filter((line) => line.localId !== localId) : current);
+    clearSerialLookupTimer(localId);
+    clearSerialDuplicateWarning(localId);
+  }, [clearSerialDuplicateWarning, clearSerialLookupTimer]);
+  const pruneImportedLineDrafts = React.useCallback(() => {
+    setLines((current) => {
+      const kept = current.filter((line) => !line.orderLineId);
+      return kept.length ? kept : [createLineDraft()];
+    });
+  }, []);
+  const clearSelectedOrder = React.useCallback(() => {
+    setSelectedOrderId("");
+    setSelectedOrderNumber("");
+    setSelectedOrderPlacedAt(null);
+    setOrderLines([]);
+    setSelectedOrderLineIds(/* @__PURE__ */ new Set());
+    setSelectedOrderLineQty({});
+    pruneImportedLineDrafts();
+  }, [pruneImportedLineDrafts]);
+  const selectListedOrder = React.useCallback((orderId) => {
+    const order = orders.find((candidate) => candidate.id === orderId);
+    if (!order) return;
+    setSelectedOrderId(order.id);
+    setSelectedOrderNumber(order.orderNumber);
+    setSelectedOrderPlacedAt(order.placedAt);
+    setManualOrderEntry(false);
+    setNoOrder(false);
+    setOrderReference("");
+    setOrderLines([]);
+    setSelectedOrderLineIds(/* @__PURE__ */ new Set());
+    setSelectedOrderLineQty({});
+    pruneImportedLineDrafts();
+  }, [orders, pruneImportedLineDrafts]);
+  const handleManualOrderChange = React.useCallback((checked) => {
+    const nextManualOrderEntry = checked === true;
+    setManualOrderEntry(nextManualOrderEntry);
+    if (nextManualOrderEntry) {
+      setNoOrder(false);
+      clearSelectedOrder();
+    } else {
+      setOrderReference("");
+    }
+  }, [clearSelectedOrder]);
+  const handleNoOrderChange = React.useCallback((checked) => {
+    const nextNoOrder = checked === true;
+    setNoOrder(nextNoOrder);
+    if (nextNoOrder) {
+      setManualOrderEntry(false);
+      setOrderReference("");
+      clearSelectedOrder();
+    }
+  }, [clearSelectedOrder]);
+  const toggleOrderLine = React.useCallback((orderLineId, checked) => {
+    setSelectedOrderLineIds((current) => {
+      const next = new Set(current);
+      if (checked === true) next.add(orderLineId);
+      else next.delete(orderLineId);
+      return next;
+    });
+  }, []);
+  const updateSelectedOrderLineQty = React.useCallback((orderLineId, qtyClaimed) => {
+    setSelectedOrderLineQty((current) => ({ ...current, [orderLineId]: qtyClaimed }));
+  }, []);
+  const selectedOrderLinesReady = React.useMemo(() => {
+    if (selectedOrderLineIds.size === 0) return false;
+    return Array.from(selectedOrderLineIds).every((orderLineId) => isPositiveQuantity(selectedOrderLineQty[orderLineId] ?? ""));
+  }, [selectedOrderLineIds, selectedOrderLineQty]);
+  const addSelectedOrderLines = React.useCallback(() => {
+    const selectedLines = orderLines.filter((line) => selectedOrderLineIds.has(line.orderLineId));
+    const nextDrafts = selectedLines.map((line) => {
+      const qtyClaimed = selectedOrderLineQty[line.orderLineId] ?? defaultQuantity(line.quantity);
+      if (!isPositiveQuantity(qtyClaimed)) return null;
+      return {
+        ...createLineDraft(),
+        orderLineId: line.orderLineId,
+        productId: line.productId ?? void 0,
+        productName: line.name ?? void 0,
+        sku: line.sku ?? "",
+        qtyClaimed,
+        purchaseDate: line.purchaseDate ?? void 0,
+        warrantyMonths: line.warrantyMonths ?? void 0
+      };
+    }).filter((line) => line !== null);
+    if (!nextDrafts.length) return;
+    setLines((current) => {
+      const base = current.length === 1 && isBlankLineDraft(current[0]) ? [] : current;
+      return [...base, ...nextDrafts];
+    });
+    setSelectedOrderLineIds(/* @__PURE__ */ new Set());
+  }, [orderLines, selectedOrderLineIds, selectedOrderLineQty]);
+  const selectValue = React.useCallback((value) => value || EMPTY_SELECT_VALUE, []);
+  const handleSelectChange = React.useCallback((setValue) => {
+    return (value) => setValue(value === EMPTY_SELECT_VALUE ? "" : value);
+  }, []);
+  const validateStep = React.useCallback((step) => {
+    if (step === "items") {
+      if (lines.length < 1) {
+        setError(t("warranty_claims.portal.validation.lineRequired"));
+        return false;
+      }
+      for (const line of lines) {
+        if (!line.faultDescription.trim()) {
+          setError(t("warranty_claims.portal.validation.faultDescriptionRequired"));
+          return false;
+        }
+        if (!isPositiveQuantity(line.qtyClaimed)) {
+          setError(t("warranty_claims.portal.validation.qtyPositive"));
+          return false;
+        }
+      }
+    }
+    if (step === "details" && !reasonCode.trim()) {
+      setError(t("warranty_claims.portal.validation.reasonRequired"));
+      return false;
+    }
+    setError(null);
+    return true;
+  }, [lines, reasonCode, t]);
+  const buildPayload = React.useCallback(() => {
+    if (!validateStep("items") || !validateStep("details")) return null;
+    const normalizedLines = lines.map((line) => ({
+      orderLineId: optionalText(line.orderLineId ?? ""),
+      productId: optionalText(line.productId ?? ""),
+      productName: optionalText(line.productName ?? ""),
+      sku: optionalText(line.sku),
+      serialNumber: optionalText(line.serialNumber),
+      faultCode: optionalText(line.faultCode),
+      faultDescription: line.faultDescription.trim(),
+      qtyClaimed: Number(line.qtyClaimed),
+      purchaseDate: line.purchaseDate,
+      warrantyMonths: line.warrantyMonths
+    }));
+    return {
+      // Only a real selected order becomes `orderId` (a UUID). A typed "my order isn't listed"
+      // reference travels as free text so the API no longer rejects it as a non-UUID (WQA-002).
+      orderId: noOrder ? void 0 : selectedOrderId || void 0,
+      orderReference: noOrder || selectedOrderId ? void 0 : optionalText(orderReference),
+      reasonCode: reasonCode.trim(),
+      notes: optionalText(notes),
+      lines: normalizedLines
+    };
+  }, [lines, noOrder, notes, orderReference, reasonCode, selectedOrderId, validateStep]);
+  const goToStep = React.useCallback((stepId) => {
+    if (!WIZARD_STEP_IDS.includes(stepId)) return;
+    const nextIndex = WIZARD_STEP_IDS.indexOf(stepId);
+    if (nextIndex <= currentStepIndex) {
+      setCurrentStep(stepId);
+      setError(null);
+    }
+  }, [currentStepIndex]);
+  const goBack = React.useCallback(() => {
+    if (currentStepIndex <= 0) return;
+    setCurrentStep(WIZARD_STEP_IDS[currentStepIndex - 1]);
+    setError(null);
+  }, [currentStepIndex]);
+  const goNext = React.useCallback((event) => {
+    event.preventDefault();
+    if (!validateStep(currentStep)) return;
+    if (currentStepIndex >= WIZARD_STEP_IDS.length - 1) return;
+    setCurrentStep(WIZARD_STEP_IDS[currentStepIndex + 1]);
+  }, [currentStep, currentStepIndex, validateStep]);
+  const addStagedAttachments = React.useCallback(async (event) => {
+    const files = Array.from(event.target.files ?? []);
+    setStagedFileInputKey((current) => current + 1);
+    if (!files.length) return;
+    const accepted = [];
+    for (const file of files) {
+      const validationError = await validateAttachmentFile(file, t);
+      if (validationError) {
+        flash(t("warranty_claims.portal.new.attachmentRejected", "{name}: {reason}", { name: file.name, reason: validationError }), "error");
+        continue;
+      }
+      accepted.push(createStagedAttachment(file));
+    }
+    if (accepted.length) {
+      setStagedFiles((current) => [...current, ...accepted]);
+    }
+  }, [t]);
+  const removeStagedAttachment = React.useCallback((localId) => {
+    setStagedFiles((current) => current.filter((staged) => staged.localId !== localId));
+  }, []);
+  const uploadStagedAttachments = React.useCallback(async (claimId) => {
+    const failedFiles = [];
+    for (const staged of stagedFiles) {
+      try {
+        const form = new FormData();
+        form.set("claimId", claimId);
+        form.set("file", staged.file);
+        const result = await guardedMutation.runMutation({
+          operation: () => apiCall("/api/warranty_claims/portal/attachments", {
+            method: "POST",
+            credentials: "include",
+            body: form
+          }),
+          context: {
+            moduleId: "warranty_claims",
+            entityId: "attachments.attachment",
+            operation: "portal_attachment_upload",
+            claimId,
+            formId: CREATE_MUTATION_CONTEXT_ID,
+            resourceKind: "attachments.attachment",
+            resourceId: claimId,
+            retryLastMutation: guardedMutation.retryLastMutation
+          },
+          mutationPayload: { claimId, fileName: staged.file.name, fileSize: staged.file.size }
+        });
+        if (!result.ok || !result.result?.ok) {
+          failedFiles.push(staged.file.name);
+        }
+      } catch {
+        failedFiles.push(staged.file.name);
+      }
+    }
+    return failedFiles;
+  }, [guardedMutation, stagedFiles]);
+  const submitClaim = React.useCallback(async () => {
+    if (submitting) return;
+    setError(null);
+    const payload = buildPayload();
+    if (!payload) return;
+    setSubmitting(true);
+    try {
+      const mutationPayload = { ...payload };
+      const result = await guardedMutation.runMutation({
+        operation: () => apiCall("/api/warranty_claims/portal/claims", {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          credentials: "include",
+          body: JSON.stringify(payload)
+        }),
+        context: {
+          moduleId: "warranty_claims",
+          entityId: "warranty_claims.claim",
+          operation: "portal_create",
+          formId: CREATE_MUTATION_CONTEXT_ID,
+          resourceKind: "warranty_claims.claim",
+          retryLastMutation: guardedMutation.retryLastMutation
+        },
+        mutationPayload
+      });
+      if (!result.ok || !result.result?.claimId) {
+        setError(result.status === 404 ? t("warranty_claims.errors.orderNotOwned") : t("warranty_claims.portal.new.error"));
+        return;
+      }
+      const failedFiles = await uploadStagedAttachments(result.result.claimId);
+      if (failedFiles.length) {
+        flash(
+          t("warranty_claims.portal.new.attachmentsPartialFailure", "Your claim was created, but these files could not be uploaded: {files}. You can add them again from the claim page.", { files: failedFiles.join(", ") }),
+          "warning"
+        );
+      }
+      flash(t("warranty_claims.portal.new.success"), "success");
+      router.push(`/${params.orgSlug}/portal/claims/${result.result.claimId}`);
+    } catch {
+      setError(t("warranty_claims.portal.new.error"));
+    } finally {
+      setSubmitting(false);
+    }
+  }, [buildPayload, guardedMutation, params.orgSlug, router, submitting, t, uploadStagedAttachments]);
+  const handleSubmit = React.useCallback((event) => {
+    event.preventDefault();
+    if (currentStep === "review") {
+      void submitClaim();
+    }
+  }, [currentStep, submitClaim]);
+  const handleKeyDown = React.useCallback((event) => {
+    if (event.key !== "Enter") return;
+    const target = event.target;
+    if (target instanceof HTMLTextAreaElement) return;
+    event.preventDefault();
+    if ((event.metaKey || event.ctrlKey) && currentStep === "review") {
+      void submitClaim();
+    }
+  }, [currentStep, submitClaim]);
+  const reasonOptions = portalOptions.reasons;
+  const faultCodeOptions = portalOptions.faultCodes;
+  const reasonLabel = React.useCallback((value) => localizeDictionaryLabel(t, "reason", value, optionLabel(reasonOptions, value)), [reasonOptions, t]);
+  const faultCodeLabel = React.useCallback((value) => localizeDictionaryLabel(t, "fault", value, optionLabel(faultCodeOptions, value)), [faultCodeOptions, t]);
+  const selectedReasonLabel = reasonCode ? reasonLabel(reasonCode) : t("warranty_claims.portal.value.notAvailable");
+  const renderReasonField = () => /* @__PURE__ */ jsx(FormField, { label: t("warranty_claims.form.reasonCode"), required: true, children: reasonOptions.length > 0 ? /* @__PURE__ */ jsxs(Select, { value: selectValue(reasonCode), onValueChange: handleSelectChange(setReasonCode), disabled: submitting, children: [
+    /* @__PURE__ */ jsx(SelectTrigger, { children: /* @__PURE__ */ jsx(SelectValue, { placeholder: t("warranty_claims.portal.new.reasonChoose") }) }),
+    /* @__PURE__ */ jsxs(SelectContent, { children: [
+      /* @__PURE__ */ jsx(SelectItem, { value: EMPTY_SELECT_VALUE, children: t("warranty_claims.portal.new.reasonChoose") }),
+      reasonCode && !reasonOptions.some((option) => option.value === reasonCode) ? /* @__PURE__ */ jsx(SelectItem, { value: reasonCode, children: reasonLabel(reasonCode) }) : null,
+      reasonOptions.map((option) => /* @__PURE__ */ jsx(SelectItem, { value: option.value, children: reasonLabel(option.value) }, option.value))
+    ] })
+  ] }) : /* @__PURE__ */ jsx(
+    Input,
+    {
+      value: reasonCode,
+      onChange: (event) => setReasonCode(event.target.value),
+      disabled: submitting,
+      required: true
+    }
+  ) });
+  const renderFaultCodeField = (line) => /* @__PURE__ */ jsx(FormField, { label: t("warranty_claims.form.faultCode"), children: faultCodeOptions.length > 0 ? /* @__PURE__ */ jsxs(
+    Select,
+    {
+      value: selectValue(line.faultCode),
+      onValueChange: handleSelectChange((value) => updateLine(line.localId, { faultCode: value })),
+      disabled: submitting,
+      children: [
+        /* @__PURE__ */ jsx(SelectTrigger, { children: /* @__PURE__ */ jsx(SelectValue, { placeholder: t("warranty_claims.portal.new.faultCodeChoose") }) }),
+        /* @__PURE__ */ jsxs(SelectContent, { children: [
+          /* @__PURE__ */ jsx(SelectItem, { value: EMPTY_SELECT_VALUE, children: t("warranty_claims.portal.new.faultCodeChoose") }),
+          line.faultCode && !faultCodeOptions.some((option) => option.value === line.faultCode) ? /* @__PURE__ */ jsx(SelectItem, { value: line.faultCode, children: faultCodeLabel(line.faultCode) }) : null,
+          faultCodeOptions.map((option) => /* @__PURE__ */ jsx(SelectItem, { value: option.value, children: faultCodeLabel(option.value) }, option.value))
+        ] })
+      ]
+    }
+  ) : /* @__PURE__ */ jsx(
+    Input,
+    {
+      value: line.faultCode,
+      onChange: (event) => updateLine(line.localId, { faultCode: event.target.value }),
+      disabled: submitting
+    }
+  ) });
+  if (loading) {
+    return /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center py-20", children: /* @__PURE__ */ jsx(Spinner, {}) });
+  }
+  if (!user) return null;
+  return /* @__PURE__ */ jsxs("form", { className: "flex flex-col gap-8", onSubmit: handleSubmit, onKeyDown: handleKeyDown, children: [
+    /* @__PURE__ */ jsx(
+      PortalPageHeader,
+      {
+        label: t("warranty_claims.portal.nav"),
+        title: t("warranty_claims.portal.new.title"),
+        description: t("warranty_claims.portal.new.description"),
+        action: /* @__PURE__ */ jsx(Button, { asChild: true, variant: "outline", children: /* @__PURE__ */ jsxs(Link, { href: `/${params.orgSlug}/portal/claims`, children: [
+          /* @__PURE__ */ jsx(ArrowLeft, { className: "size-4", "aria-hidden": "true" }),
+          t("warranty_claims.portal.new.back")
+        ] }) })
+      }
+    ),
+    error ? /* @__PURE__ */ jsx(ErrorMessage, { label: error }) : null,
+    /* @__PURE__ */ jsx(StepIndicator, { steps: wizardSteps, onStepClick: goToStep }),
+    currentStep === "order" ? /* @__PURE__ */ jsxs(PortalCard, { children: [
+      /* @__PURE__ */ jsx(
+        PortalCardHeader,
+        {
+          label: t("warranty_claims.portal.wizard.order"),
+          title: t("warranty_claims.portal.new.orderTitle"),
+          description: t("warranty_claims.portal.new.orderDescription")
+        }
+      ),
+      ordersUnavailable ? /* @__PURE__ */ jsxs("div", { className: "grid gap-4 md:grid-cols-2", children: [
+        /* @__PURE__ */ jsx(
+          FormField,
+          {
+            label: t("warranty_claims.portal.new.orderReference"),
+            description: t("warranty_claims.portal.new.orderReferenceHelp"),
+            children: /* @__PURE__ */ jsx(
+              Input,
+              {
+                value: orderReference,
+                onChange: (event) => setOrderReference(event.target.value),
+                disabled: submitting || noOrder
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsx("div", { className: "rounded-lg border border-border bg-muted/30 p-4", children: /* @__PURE__ */ jsx(
+          CheckboxField,
+          {
+            checked: noOrder,
+            onCheckedChange: handleNoOrderChange,
+            disabled: submitting,
+            label: t("warranty_claims.portal.new.noOrder"),
+            description: t("warranty_claims.portal.new.noOrderDescription")
+          }
+        ) })
+      ] }) : /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
+        /* @__PURE__ */ jsx(FormField, { label: t("warranty_claims.portal.new.orderSearch"), children: /* @__PURE__ */ jsx(
+          Input,
+          {
+            type: "search",
+            value: orderSearchInput,
+            onChange: (event) => setOrderSearchInput(event.target.value),
+            disabled: submitting,
+            placeholder: t("warranty_claims.portal.new.orderSearchPlaceholder")
+          }
+        ) }),
+        ordersLoading && orders.length === 0 ? /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center rounded-lg border border-border bg-muted/30 py-8", children: /* @__PURE__ */ jsx(Spinner, {}) }) : null,
+        orders.length > 0 ? /* @__PURE__ */ jsx(RadioGroup, { value: selectedOrderId, onValueChange: selectListedOrder, children: orders.map((order) => {
+          const selected = selectedOrderId === order.id;
+          return /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: `flex cursor-pointer items-start gap-3 rounded-lg border p-4 transition-colors ${selected ? "border-accent-indigo bg-accent/50" : "border-border bg-background hover:bg-muted/30"}`,
+              onClick: () => {
+                if (!submitting) selectListedOrder(order.id);
+              },
+              children: [
+                /* @__PURE__ */ jsx(
+                  Radio,
+                  {
+                    value: order.id,
+                    disabled: submitting,
+                    "aria-label": order.orderNumber,
+                    className: "mt-0.5"
+                  }
+                ),
+                /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+                  /* @__PURE__ */ jsx("p", { className: "font-medium text-foreground", children: order.orderNumber }),
+                  /* @__PURE__ */ jsxs("div", { className: "mt-2 flex flex-wrap gap-x-4 gap-y-1 text-xs text-muted-foreground", children: [
+                    /* @__PURE__ */ jsx("span", { children: formatDate(order.placedAt, t("warranty_claims.portal.value.notAvailable"), locale) }),
+                    /* @__PURE__ */ jsx("span", { children: formatOrderTotal(order.grandTotalGrossAmount, order.currencyCode, t("warranty_claims.portal.value.notAvailable"), locale) })
+                  ] })
+                ] })
+              ]
+            },
+            order.id
+          );
+        }) }) : null,
+        /* @__PURE__ */ jsxs("div", { className: "grid gap-4 md:grid-cols-2", children: [
+          /* @__PURE__ */ jsx("div", { className: "rounded-lg border border-border bg-muted/30 p-4", children: /* @__PURE__ */ jsx(
+            CheckboxField,
+            {
+              checked: manualOrderEntry,
+              onCheckedChange: handleManualOrderChange,
+              disabled: submitting,
+              label: t("warranty_claims.portal.new.orderNotListed"),
+              description: t("warranty_claims.portal.new.orderNotListedDescription")
+            }
+          ) }),
+          /* @__PURE__ */ jsx("div", { className: "rounded-lg border border-border bg-muted/30 p-4", children: /* @__PURE__ */ jsx(
+            CheckboxField,
+            {
+              checked: noOrder,
+              onCheckedChange: handleNoOrderChange,
+              disabled: submitting,
+              label: t("warranty_claims.portal.new.noOrder"),
+              description: t("warranty_claims.portal.new.noOrderDescription")
+            }
+          ) })
+        ] }),
+        manualOrderEntry ? /* @__PURE__ */ jsx(
+          FormField,
+          {
+            label: t("warranty_claims.portal.new.orderReference"),
+            description: t("warranty_claims.portal.new.orderReferenceHelp"),
+            children: /* @__PURE__ */ jsx(
+              Input,
+              {
+                value: orderReference,
+                onChange: (event) => setOrderReference(event.target.value),
+                disabled: submitting || noOrder
+              }
+            )
+          }
+        ) : null
+      ] })
+    ] }) : null,
+    currentStep === "items" ? /* @__PURE__ */ jsxs(PortalCard, { children: [
+      /* @__PURE__ */ jsx(
+        PortalCardHeader,
+        {
+          label: t("warranty_claims.portal.wizard.items"),
+          title: t("warranty_claims.portal.new.linesTitle"),
+          description: t("warranty_claims.portal.new.linesDescription"),
+          action: /* @__PURE__ */ jsxs(Button, { type: "button", variant: "outline", onClick: addLine, disabled: submitting, children: [
+            /* @__PURE__ */ jsx(Plus, { className: "size-4", "aria-hidden": "true" }),
+            t("warranty_claims.portal.new.addLine")
+          ] })
+        }
+      ),
+      /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
+        selectedOrderId && !orderLinesUnavailable ? /* @__PURE__ */ jsxs("div", { className: "rounded-lg border border-border bg-muted/30 p-4", children: [
+          /* @__PURE__ */ jsxs("div", { className: "mb-4 flex items-start justify-between gap-4", children: [
+            /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
+              /* @__PURE__ */ jsx("h3", { className: "text-sm font-semibold", children: t("warranty_claims.portal.new.orderLinesTitle") }),
+              /* @__PURE__ */ jsxs("p", { className: "mt-1 text-xs text-muted-foreground", children: [
+                selectedOrderNumber,
+                selectedOrderPlacedAt ? ` - ${formatDate(selectedOrderPlacedAt, t("warranty_claims.portal.value.notAvailable"), locale)}` : ""
+              ] })
+            ] }),
+            orderLinesLoading ? /* @__PURE__ */ jsx(Spinner, {}) : null
+          ] }),
+          orderLines.length > 0 ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3", children: [
+            orderLines.map((orderLine) => {
+              const checked = selectedOrderLineIds.has(orderLine.orderLineId);
+              const label = orderLine.name ?? orderLine.sku ?? t("warranty_claims.portal.value.unnamedLine");
+              return /* @__PURE__ */ jsx("div", { className: "rounded-lg border border-border bg-background p-4", children: /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3", children: [
+                /* @__PURE__ */ jsx(
+                  Checkbox,
+                  {
+                    checked,
+                    onCheckedChange: (value) => toggleOrderLine(orderLine.orderLineId, value),
+                    disabled: submitting,
+                    "aria-label": label,
+                    className: "mt-0.5"
+                  }
+                ),
+                /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+                  /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2 sm:flex-row sm:items-start sm:justify-between", children: [
+                    /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
+                      /* @__PURE__ */ jsx("p", { className: "font-medium text-foreground", children: label }),
+                      /* @__PURE__ */ jsxs("p", { className: "mt-1 text-xs text-muted-foreground", children: [
+                        orderLine.sku ?? t("warranty_claims.portal.value.notAvailable"),
+                        " - ",
+                        formatQuantity(orderLine.quantity, t("warranty_claims.portal.value.notAvailable"), locale)
+                      ] })
+                    ] }),
+                    orderLine.estimatedWarrantyStatus !== "unknown" ? /* @__PURE__ */ jsx(StatusBadge, { variant: warrantyStatusVariant(orderLine.estimatedWarrantyStatus), dot: true, children: t(warrantyStatusLabelKey(orderLine.estimatedWarrantyStatus)) }) : null
+                  ] }),
+                  /* @__PURE__ */ jsx(FormField, { className: "mt-3 max-w-40", label: t("warranty_claims.portal.new.qtyToClaim"), children: /* @__PURE__ */ jsx(
+                    Input,
+                    {
+                      type: "number",
+                      min: "0.01",
+                      step: "0.01",
+                      value: selectedOrderLineQty[orderLine.orderLineId] ?? defaultQuantity(orderLine.quantity),
+                      onChange: (event) => updateSelectedOrderLineQty(orderLine.orderLineId, event.target.value),
+                      disabled: submitting || !checked
+                    }
+                  ) })
+                ] })
+              ] }) }, orderLine.orderLineId);
+            }),
+            /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs(
+              Button,
+              {
+                type: "button",
+                variant: "outline",
+                onClick: addSelectedOrderLines,
+                disabled: submitting || !selectedOrderLinesReady,
+                children: [
+                  /* @__PURE__ */ jsx(Plus, { className: "size-4", "aria-hidden": "true" }),
+                  t("warranty_claims.portal.new.addSelectedItems")
+                ]
+              }
+            ) })
+          ] }) : null
+        ] }) : null,
+        lines.map((line, index) => /* @__PURE__ */ jsxs("div", { className: "rounded-lg border border-border bg-background p-4", children: [
+          /* @__PURE__ */ jsxs("div", { className: "mb-4 flex items-center justify-between gap-3", children: [
+            /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
+              /* @__PURE__ */ jsx("h3", { className: "text-sm font-semibold", children: t("warranty_claims.portal.new.lineLabel", { number: index + 1 }) }),
+              line.productName ? (
+                // Order-backed lines carry a product name but often no visible SKU (SKU comes
+                // from the catalog snapshot); show it so the line is never visually blank (WQA-004).
+                /* @__PURE__ */ jsx("p", { className: "mt-0.5 truncate text-xs text-muted-foreground", children: line.productName })
+              ) : null
+            ] }),
+            /* @__PURE__ */ jsx(
+              IconButton,
+              {
+                type: "button",
+                variant: "ghost",
+                "aria-label": t("warranty_claims.portal.new.removeLine"),
+                onClick: () => removeLine(line.localId),
+                disabled: submitting || lines.length === 1,
+                children: /* @__PURE__ */ jsx(Trash2, { className: "size-4", "aria-hidden": "true" })
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "grid gap-4 md:grid-cols-2", children: [
+            /* @__PURE__ */ jsx(FormField, { label: t("warranty_claims.portal.new.productOrSku"), children: /* @__PURE__ */ jsx(
+              Input,
+              {
+                value: line.sku,
+                onChange: (event) => updateLine(line.localId, { sku: event.target.value }),
+                disabled: submitting
+              }
+            ) }),
+            /* @__PURE__ */ jsx(FormField, { label: t("warranty_claims.form.serialNumber"), children: /* @__PURE__ */ jsx(
+              Input,
+              {
+                value: line.serialNumber,
+                onChange: (event) => {
+                  const value = event.target.value;
+                  updateLine(line.localId, { serialNumber: value });
+                  checkSerialDuplicate(line.localId, value);
+                },
+                disabled: submitting
+              }
+            ) }),
+            renderFaultCodeField(line),
+            /* @__PURE__ */ jsx(FormField, { label: t("warranty_claims.form.qtyClaimed"), required: true, children: /* @__PURE__ */ jsx(
+              Input,
+              {
+                type: "number",
+                min: "0.01",
+                step: "0.01",
+                value: line.qtyClaimed,
+                onChange: (event) => updateLine(line.localId, { qtyClaimed: event.target.value }),
+                disabled: submitting,
+                required: true
+              }
+            ) }),
+            /* @__PURE__ */ jsx(FormField, { className: "md:col-span-2", label: t("warranty_claims.form.faultDescription"), required: true, children: /* @__PURE__ */ jsx(
+              Textarea,
+              {
+                value: line.faultDescription,
+                onChange: (event) => updateLine(line.localId, { faultDescription: event.target.value }),
+                disabled: submitting,
+                required: true,
+                maxLength: 4e3,
+                showCount: true
+              }
+            ) })
+          ] }),
+          serialDuplicateWarnings[line.localId]?.length ? /* @__PURE__ */ jsx(Alert, { status: "warning", style: "lighter", className: "mt-4", children: /* @__PURE__ */ jsx(AlertDescription, { children: t("warranty_claims.portal.new.duplicateWarning", {
+            claimNumbers: serialDuplicateWarnings[line.localId].join(", ")
+          }) }) }) : null
+        ] }, line.localId))
+      ] })
+    ] }) : null,
+    currentStep === "details" ? /* @__PURE__ */ jsxs(PortalCard, { children: [
+      /* @__PURE__ */ jsx(
+        PortalCardHeader,
+        {
+          label: t("warranty_claims.portal.wizard.details"),
+          title: t("warranty_claims.portal.new.detailsTitle"),
+          description: t("warranty_claims.portal.new.detailsDescription")
+        }
+      ),
+      /* @__PURE__ */ jsxs("div", { className: "grid gap-4 lg:grid-cols-3", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4 lg:col-span-2", children: [
+          troubleshootingGuide ? /* @__PURE__ */ jsx("div", { className: "rounded-lg border border-border bg-muted/30 p-4", children: /* @__PURE__ */ jsx(
+            TroubleshootingWalker,
+            {
+              guide: troubleshootingGuide,
+              onResolve: (result) => {
+                if (result.reasonCode) setReasonCode(result.reasonCode);
+              }
+            }
+          ) }) : null,
+          renderReasonField(),
+          /* @__PURE__ */ jsx(FormField, { label: t("warranty_claims.form.notes"), children: /* @__PURE__ */ jsx(
+            Textarea,
+            {
+              value: notes,
+              onChange: (event) => setNotes(event.target.value),
+              disabled: submitting,
+              maxLength: 8e3,
+              showCount: true
+            }
+          ) })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3 rounded-lg border border-border bg-muted/30 p-4", children: [
+          /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("h3", { className: "text-sm font-semibold", children: t("warranty_claims.portal.new.attachmentsTitle", "Photos and documents") }),
+            /* @__PURE__ */ jsx("p", { className: "mt-1 text-xs text-muted-foreground", children: t("warranty_claims.portal.new.attachmentsHelp", "Optional. Photos of the fault help us review your claim faster. Files are uploaded when you submit the claim.") })
+          ] }),
+          /* @__PURE__ */ jsx(
+            Input,
+            {
+              type: "file",
+              multiple: true,
+              accept: ATTACHMENT_ACCEPT_TYPES,
+              onChange: (event) => {
+                void addStagedAttachments(event);
+              },
+              disabled: submitting,
+              "aria-label": t("warranty_claims.portal.new.attachmentsTitle", "Photos and documents")
+            },
+            stagedFileInputKey
+          ),
+          stagedFiles.length > 0 ? /* @__PURE__ */ jsx("ul", { className: "flex flex-col gap-2", children: stagedFiles.map((staged) => /* @__PURE__ */ jsxs(
+            "li",
+            {
+              className: "flex items-center justify-between gap-3 rounded-lg border border-border bg-background px-3 py-2",
+              children: [
+                /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [
+                  /* @__PURE__ */ jsx(FileText, { className: "size-4 shrink-0 text-muted-foreground", "aria-hidden": "true" }),
+                  /* @__PURE__ */ jsx("span", { className: "truncate text-sm", children: staged.file.name })
+                ] }),
+                /* @__PURE__ */ jsx(
+                  IconButton,
+                  {
+                    type: "button",
+                    variant: "ghost",
+                    "aria-label": t("warranty_claims.portal.new.removeAttachment", "Remove file"),
+                    onClick: () => removeStagedAttachment(staged.localId),
+                    disabled: submitting,
+                    children: /* @__PURE__ */ jsx(Trash2, { className: "size-4", "aria-hidden": "true" })
+                  }
+                )
+              ]
+            },
+            staged.localId
+          )) }) : null
+        ] })
+      ] })
+    ] }) : null,
+    currentStep === "review" ? /* @__PURE__ */ jsxs(PortalCard, { children: [
+      /* @__PURE__ */ jsx(
+        PortalCardHeader,
+        {
+          label: t("warranty_claims.portal.wizard.reviewSubmit"),
+          title: t("warranty_claims.portal.new.reviewTitle"),
+          description: t("warranty_claims.portal.new.reviewDescription")
+        }
+      ),
+      /* @__PURE__ */ jsxs("div", { className: "grid gap-4 lg:grid-cols-3", children: [
+        /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-4 lg:col-span-2", children: lines.map((line, index) => /* @__PURE__ */ jsxs("div", { className: "rounded-lg border border-border bg-background p-4", children: [
+          /* @__PURE__ */ jsx("h3", { className: "text-sm font-semibold", children: t("warranty_claims.portal.new.lineLabel", { number: index + 1 }) }),
+          /* @__PURE__ */ jsxs("dl", { className: "mt-4 grid gap-3 text-sm md:grid-cols-2", children: [
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx("dt", { className: "text-xs text-muted-foreground", children: t("warranty_claims.portal.new.productOrSku") }),
+              /* @__PURE__ */ jsx("dd", { className: "mt-1 font-medium", children: optionalText(line.productName ?? "") ?? optionalText(line.sku) ?? t("warranty_claims.portal.value.notAvailable") })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx("dt", { className: "text-xs text-muted-foreground", children: t("warranty_claims.form.serialNumber") }),
+              /* @__PURE__ */ jsx("dd", { className: "mt-1 font-medium", children: line.serialNumber.trim() || t("warranty_claims.portal.value.notAvailable") })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx("dt", { className: "text-xs text-muted-foreground", children: t("warranty_claims.form.faultCode") }),
+              /* @__PURE__ */ jsx("dd", { className: "mt-1 font-medium", children: line.faultCode ? faultCodeLabel(line.faultCode) : t("warranty_claims.portal.value.notAvailable") })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx("dt", { className: "text-xs text-muted-foreground", children: t("warranty_claims.form.qtyClaimed") }),
+              /* @__PURE__ */ jsx("dd", { className: "mt-1 font-medium", children: line.qtyClaimed })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "md:col-span-2", children: [
+              /* @__PURE__ */ jsx("dt", { className: "text-xs text-muted-foreground", children: t("warranty_claims.form.faultDescription") }),
+              /* @__PURE__ */ jsx("dd", { className: "mt-1 whitespace-pre-wrap text-sm font-medium", children: line.faultDescription.trim() })
+            ] })
+          ] })
+        ] }, line.localId)) }),
+        /* @__PURE__ */ jsxs("div", { className: "rounded-lg border border-border bg-muted/30 p-4", children: [
+          /* @__PURE__ */ jsx("h3", { className: "mb-3 text-sm font-semibold", children: t("warranty_claims.portal.new.summaryTitle") }),
+          /* @__PURE__ */ jsxs("dl", { className: "space-y-3 text-sm", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-4", children: [
+              /* @__PURE__ */ jsx("dt", { className: "text-muted-foreground", children: t("warranty_claims.portal.new.reviewOrder") }),
+              /* @__PURE__ */ jsx("dd", { className: "text-right font-medium", children: noOrder ? t("warranty_claims.portal.new.noOrder") : selectedOrderNumber || orderReference.trim() || t("warranty_claims.portal.value.notAvailable") })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-4", children: [
+              /* @__PURE__ */ jsx("dt", { className: "text-muted-foreground", children: t("warranty_claims.form.reasonCode") }),
+              /* @__PURE__ */ jsx("dd", { className: "text-right font-medium", children: selectedReasonLabel })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-4", children: [
+              /* @__PURE__ */ jsx("dt", { className: "text-muted-foreground", children: t("warranty_claims.portal.new.reviewLines") }),
+              /* @__PURE__ */ jsx("dd", { className: "font-medium", children: lines.length })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-4", children: [
+              /* @__PURE__ */ jsx("dt", { className: "text-muted-foreground", children: t("warranty_claims.portal.new.reviewNotes") }),
+              /* @__PURE__ */ jsx("dd", { className: "font-medium", children: notes.trim() ? t("warranty_claims.portal.value.yes") : t("warranty_claims.portal.value.no") })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-4", children: [
+              /* @__PURE__ */ jsx("dt", { className: "text-muted-foreground", children: t("warranty_claims.portal.new.reviewAttachments", "Attachments") }),
+              /* @__PURE__ */ jsx("dd", { className: "font-medium", children: stagedFiles.length })
+            ] })
+          ] })
+        ] })
+      ] })
+    ] }) : null,
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-col-reverse gap-3 sm:flex-row sm:justify-between", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex flex-col-reverse gap-3 sm:flex-row", children: [
+        /* @__PURE__ */ jsx(Button, { asChild: true, variant: "outline", children: /* @__PURE__ */ jsx(Link, { href: `/${params.orgSlug}/portal/claims`, children: t("warranty_claims.portal.new.cancel") }) }),
+        currentStepIndex > 0 ? /* @__PURE__ */ jsxs(
+          Button,
+          {
+            type: "button",
+            variant: "outline",
+            onClick: goBack,
+            disabled: submitting,
+            "aria-label": t("warranty_claims.portal.new.previousStep"),
+            children: [
+              /* @__PURE__ */ jsx(ArrowLeft, { className: "size-4", "aria-hidden": "true" }),
+              t("warranty_claims.portal.new.previousStep")
+            ]
+          }
+        ) : null
+      ] }),
+      currentStep === "review" ? /* @__PURE__ */ jsxs(Button, { type: "submit", disabled: submitting || !hasValidLines || !hasReason, "aria-label": t("warranty_claims.portal.submit"), children: [
+        /* @__PURE__ */ jsx(Send, { className: "size-4", "aria-hidden": "true" }),
+        submitting ? t("warranty_claims.portal.new.submitting") : t("warranty_claims.portal.submit")
+      ] }) : /* @__PURE__ */ jsxs(
+        Button,
+        {
+          type: "button",
+          onClick: goNext,
+          disabled: submitting,
+          "aria-label": t("warranty_claims.portal.new.nextStep"),
+          children: [
+            t("warranty_claims.portal.new.nextStep"),
+            /* @__PURE__ */ jsx(ArrowRight, { className: "size-4", "aria-hidden": "true" })
+          ]
+        }
+      )
+    ] })
+  ] });
+}
+export {
+  WarrantyClaimPortalNewPage as default
+};
+//# sourceMappingURL=page.js.map