@open-mercato/core 0.6.8-develop.6924.1.a8d208fcdc → 0.6.8-develop.6930.1.1e5976efc3

package/dist/modules/eudr/components/formConfig.js

@@ -0,0 +1,593 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { useT } from "@open-mercato/shared/lib/i18n/context";
+import { flash } from "@open-mercato/ui/backend/FlashMessages";
+import { readApiResultOrThrow } from "@open-mercato/ui/backend/utils/apiCall";
+import { createCrudFormError } from "@open-mercato/ui/backend/utils/serverErrors";
+import { LookupSelect } from "@open-mercato/ui/backend/inputs";
+import { IconButton } from "@open-mercato/ui/primitives/icon-button";
+import { Input } from "@open-mercato/ui/primitives/input";
+import { Plus, Trash2 } from "lucide-react";
+import {
+  EUDR_ACTIVITY_TYPES,
+  EUDR_ACTOR_ROLES,
+  EUDR_COMMODITIES,
+  EUDR_STATEMENT_STATUSES,
+  EUDR_SUBMISSION_STATUSES,
+  GEOJSON_TYPES
+} from "../data/validators.js";
+const GEOJSON_SIZE_LIMIT = 1048576;
+const PICKER_PAGE_SIZE = 20;
+function commodityOptions(translate) {
+  return EUDR_COMMODITIES.map((commodity) => ({
+    value: commodity,
+    label: translate(`eudr.commodity.${commodity}`)
+  }));
+}
+function submissionStatusOptions(translate) {
+  return EUDR_SUBMISSION_STATUSES.map((status) => ({
+    value: status,
+    label: translate(`eudr.submissionStatus.${status}`)
+  }));
+}
+function statementStatusOptions(translate) {
+  return EUDR_STATEMENT_STATUSES.map((status) => ({
+    value: status,
+    label: translate(`eudr.statementStatus.${status}`)
+  }));
+}
+function activityTypeOptions(translate) {
+  return EUDR_ACTIVITY_TYPES.map((activityType) => ({
+    value: activityType,
+    label: translate(`eudr.activityType.${activityType}`)
+  }));
+}
+function actorRoleOptions(translate) {
+  return EUDR_ACTOR_ROLES.map((actorRole) => ({
+    value: actorRole,
+    label: translate(`eudr.actorRole.${actorRole}`)
+  }));
+}
+function statusBadgeVariant(status) {
+  if (status === "submitted") return "info";
+  if (status === "verified" || status === "available") return "success";
+  if (status === "rejected") return "error";
+  if (status === "withdrawn") return "warning";
+  return "neutral";
+}
+function isRecord(value) {
+  return value !== null && typeof value === "object" && !Array.isArray(value);
+}
+function readString(record, keys) {
+  for (const key of keys) {
+    const value = record[key];
+    if (typeof value !== "string") continue;
+    const trimmed = value.trim();
+    if (trimmed.length > 0) return trimmed;
+  }
+  return null;
+}
+function normalizeProductOption(raw) {
+  if (!isRecord(raw)) return null;
+  const id = readString(raw, ["id"]);
+  if (!id) return null;
+  const title = readString(raw, ["title"]);
+  const sku = readString(raw, ["sku"]);
+  if (!title && !sku) return null;
+  const snapshot = {
+    ...title ? { name: title } : {},
+    ...sku ? { sku } : {}
+  };
+  return { value: id, label: title ?? sku ?? "", subtitle: title ? sku : null, snapshot };
+}
+function normalizeCompanyOption(raw) {
+  if (!isRecord(raw)) return null;
+  const id = readString(raw, ["id"]);
+  if (!id) return null;
+  const displayName = readString(raw, ["display_name", "displayName", "name"]);
+  if (!displayName) return null;
+  return {
+    value: id,
+    label: displayName,
+    snapshot: { displayName }
+  };
+}
+function normalizeMappingOption(raw, translate) {
+  if (!isRecord(raw)) return null;
+  const id = readString(raw, ["id"]);
+  if (!id) return null;
+  const productSnapshot = isRecord(raw.productSnapshot) ? raw.productSnapshot : null;
+  const productName = productSnapshot ? readString(productSnapshot, ["name"]) : null;
+  const productSku = productSnapshot ? readString(productSnapshot, ["sku"]) : null;
+  const commodity = readString(raw, ["commodity"]);
+  const hsCode = readString(raw, ["hsCode"]);
+  const label = productName ?? productSku ?? translate("eudr.common.recordUnavailable");
+  const subtitleSegments = [
+    productName ? productSku : null,
+    commodity ? translate(`eudr.commodity.${commodity}`) : null,
+    hsCode
+  ].filter((segment) => typeof segment === "string" && segment.length > 0);
+  return { value: id, label, subtitle: subtitleSegments.length ? subtitleSegments.join(" - ") : null };
+}
+function normalizeStatementOption(raw, translate) {
+  if (!isRecord(raw)) return null;
+  const id = readString(raw, ["id"]);
+  if (!id) return null;
+  const title = readString(raw, ["title"]);
+  const referenceNumber = readString(raw, ["referenceNumber"]);
+  const label = title ?? referenceNumber ?? translate("eudr.common.recordUnavailable");
+  return { value: id, label, subtitle: title ? referenceNumber : null };
+}
+function LookupSelectField({
+  id,
+  value,
+  onChange,
+  onSnapshot,
+  placeholder,
+  loadError,
+  disabled,
+  loadOptions,
+  loadSelectedOption
+}) {
+  const translate = useT();
+  const selectedValue = typeof value === "string" && value.length > 0 ? value : null;
+  const [selectedOption, setSelectedOption] = React.useState(null);
+  const knownOptionsRef = React.useRef(/* @__PURE__ */ new Map());
+  React.useEffect(() => {
+    if (!selectedValue) {
+      setSelectedOption(null);
+      return;
+    }
+    if (selectedOption?.value === selectedValue) return;
+    const known = knownOptionsRef.current.get(selectedValue);
+    if (known) {
+      setSelectedOption(known);
+      return;
+    }
+    let cancelled = false;
+    const markUnavailable = () => {
+      if (!cancelled) {
+        setSelectedOption({
+          value: selectedValue,
+          label: translate("eudr.common.recordUnavailable"),
+          unavailable: true
+        });
+      }
+    };
+    if (!loadSelectedOption) {
+      markUnavailable();
+      return;
+    }
+    loadSelectedOption(selectedValue).then((resolved) => {
+      if (cancelled) return;
+      if (resolved) {
+        knownOptionsRef.current.set(resolved.value, resolved);
+        setSelectedOption(resolved);
+      } else {
+        markUnavailable();
+      }
+    }).catch(markUnavailable);
+    return () => {
+      cancelled = true;
+    };
+  }, [loadSelectedOption, selectedOption, selectedValue, translate]);
+  React.useEffect(() => {
+    if (!onSnapshot || !selectedOption || selectedOption.unavailable) return;
+    onSnapshot(selectedOption.snapshot ?? null);
+  }, [onSnapshot, selectedOption]);
+  const selectedOptionRef = React.useRef(selectedOption);
+  React.useEffect(() => {
+    selectedOptionRef.current = selectedOption;
+  }, [selectedOption]);
+  const setQueryRef = React.useRef(null);
+  const fetchItems = React.useCallback(async (query) => {
+    let options = [];
+    try {
+      options = await loadOptions(query);
+    } catch (error) {
+      const message = error instanceof Error && error.message ? error.message : loadError;
+      flash(message, "error");
+      options = [];
+    }
+    for (const option of options) knownOptionsRef.current.set(option.value, option);
+    const selected = selectedOptionRef.current;
+    const merged = selected && !options.some((option) => option.value === selected.value) ? [selected, ...options] : options;
+    return merged.map((option) => ({
+      id: option.value,
+      title: option.label,
+      subtitle: option.subtitle ?? void 0
+    }));
+  }, [loadError, loadOptions]);
+  return /* @__PURE__ */ jsxs("div", { id, className: "space-y-2", children: [
+    selectedValue ? /* @__PURE__ */ jsxs("p", { className: "text-sm text-foreground", children: [
+      /* @__PURE__ */ jsx("span", { className: "font-medium", children: selectedOption?.label ?? "" }),
+      selectedOption?.subtitle ? /* @__PURE__ */ jsxs("span", { className: "text-muted-foreground", children: [
+        " \u2014 ",
+        selectedOption.subtitle
+      ] }) : null
+    ] }) : null,
+    /* @__PURE__ */ jsx(
+      LookupSelect,
+      {
+        value: selectedValue,
+        disabled,
+        searchPlaceholder: placeholder,
+        fetchItems,
+        onReady: (controls) => {
+          setQueryRef.current = controls.setQuery;
+        },
+        onChange: (nextValue) => {
+          if (!nextValue) {
+            onChange(void 0);
+            onSnapshot?.(null);
+            setSelectedOption(null);
+            return;
+          }
+          onChange(nextValue);
+          const nextOption = knownOptionsRef.current.get(nextValue) ?? null;
+          setSelectedOption(nextOption);
+          onSnapshot?.(nextOption?.snapshot ?? null);
+          setQueryRef.current?.("");
+        }
+      }
+    )
+  ] });
+}
+function ProductSelectField({
+  id,
+  value,
+  onChange,
+  onSnapshot,
+  placeholder,
+  loadError
+}) {
+  const loadProductOptions = React.useCallback(async (search) => {
+    const params = new URLSearchParams({ page: "1", pageSize: String(PICKER_PAGE_SIZE) });
+    if (search) params.set("search", search);
+    const payload = await readApiResultOrThrow(
+      `/api/catalog/products?${params.toString()}`,
+      void 0,
+      { errorMessage: loadError }
+    );
+    const items = Array.isArray(payload.items) ? payload.items : [];
+    return items.map((item) => normalizeProductOption(item)).filter((option) => option !== null);
+  }, [loadError]);
+  const loadSelectedProduct = React.useCallback(async (productId) => {
+    const payload = await readApiResultOrThrow(
+      `/api/catalog/products?id=${encodeURIComponent(productId)}&pageSize=1`,
+      void 0,
+      { errorMessage: loadError }
+    );
+    const items = Array.isArray(payload.items) ? payload.items : [];
+    return items.map((item) => normalizeProductOption(item)).find((option) => option?.value === productId) ?? null;
+  }, [loadError]);
+  return /* @__PURE__ */ jsx(
+    LookupSelectField,
+    {
+      id,
+      value,
+      onChange,
+      onSnapshot,
+      placeholder,
+      loadError,
+      loadOptions: loadProductOptions,
+      loadSelectedOption: loadSelectedProduct
+    }
+  );
+}
+function CompanySelectField({
+  id,
+  value,
+  onChange,
+  onSnapshot,
+  placeholder,
+  loadError
+}) {
+  const loadCompanyOptions = React.useCallback(async (search) => {
+    const params = new URLSearchParams({
+      page: "1",
+      pageSize: String(PICKER_PAGE_SIZE),
+      sortField: "name",
+      sortDir: "asc"
+    });
+    if (search) params.set("search", search);
+    const payload = await readApiResultOrThrow(
+      `/api/customers/companies?${params.toString()}`,
+      void 0,
+      { errorMessage: loadError }
+    );
+    const items = Array.isArray(payload.items) ? payload.items : [];
+    return items.map((item) => normalizeCompanyOption(item)).filter((option) => option !== null);
+  }, [loadError]);
+  const loadSelectedCompany = React.useCallback(async (companyId) => {
+    const payload = await readApiResultOrThrow(
+      `/api/customers/companies?id=${encodeURIComponent(companyId)}&pageSize=1`,
+      void 0,
+      { errorMessage: loadError }
+    );
+    const items = Array.isArray(payload.items) ? payload.items : [];
+    return items.map((item) => normalizeCompanyOption(item)).find((option) => option?.value === companyId) ?? null;
+  }, [loadError]);
+  return /* @__PURE__ */ jsx(
+    LookupSelectField,
+    {
+      id,
+      value,
+      onChange,
+      onSnapshot,
+      placeholder,
+      loadError,
+      loadOptions: loadCompanyOptions,
+      loadSelectedOption: loadSelectedCompany
+    }
+  );
+}
+function collectProductIds(items) {
+  const ids = [];
+  for (const item of items) {
+    if (!isRecord(item)) continue;
+    const id = readString(item, ["id"]);
+    if (id) ids.push(id);
+  }
+  return ids;
+}
+function MappingSelectField({
+  id,
+  value,
+  onChange,
+  placeholder,
+  loadError
+}) {
+  const translate = useT();
+  const loadMappingOptions = React.useCallback(async (search) => {
+    const mappingParams = new URLSearchParams({ page: "1", pageSize: String(PICKER_PAGE_SIZE) });
+    if (!search) {
+      const payload = await readApiResultOrThrow(
+        `/api/eudr/product-mappings?${mappingParams.toString()}`,
+        void 0,
+        { errorMessage: loadError }
+      );
+      const items = Array.isArray(payload.items) ? payload.items : [];
+      return items.map((item) => normalizeMappingOption(item, translate)).filter((option) => option !== null);
+    }
+    const productParams = new URLSearchParams({ page: "1", pageSize: String(PICKER_PAGE_SIZE), search });
+    const directParams = new URLSearchParams({ page: "1", pageSize: String(PICKER_PAGE_SIZE), search });
+    const [productsPayload, directPayload] = await Promise.all([
+      readApiResultOrThrow(
+        `/api/catalog/products?${productParams.toString()}`,
+        void 0,
+        { errorMessage: loadError }
+      ),
+      readApiResultOrThrow(
+        `/api/eudr/product-mappings?${directParams.toString()}`,
+        void 0,
+        { errorMessage: loadError }
+      )
+    ]);
+    const productIds = collectProductIds(Array.isArray(productsPayload.items) ? productsPayload.items : []);
+    let byProductItems = [];
+    if (productIds.length) {
+      const byProductParams = new URLSearchParams({
+        page: "1",
+        pageSize: String(PICKER_PAGE_SIZE),
+        productId: productIds.join(",")
+      });
+      const byProductPayload = await readApiResultOrThrow(
+        `/api/eudr/product-mappings?${byProductParams.toString()}`,
+        void 0,
+        { errorMessage: loadError }
+      );
+      byProductItems = Array.isArray(byProductPayload.items) ? byProductPayload.items : [];
+    }
+    const directItems = Array.isArray(directPayload.items) ? directPayload.items : [];
+    const merged = /* @__PURE__ */ new Map();
+    for (const item of [...byProductItems, ...directItems]) {
+      const option = normalizeMappingOption(item, translate);
+      if (option && !merged.has(option.value)) merged.set(option.value, option);
+    }
+    return Array.from(merged.values());
+  }, [loadError, translate]);
+  const loadSelectedMapping = React.useCallback(async (mappingId) => {
+    const payload = await readApiResultOrThrow(
+      `/api/eudr/product-mappings?id=${encodeURIComponent(mappingId)}&pageSize=1`,
+      void 0,
+      { errorMessage: loadError }
+    );
+    const items = Array.isArray(payload.items) ? payload.items : [];
+    return items.map((item) => normalizeMappingOption(item, translate)).find((option) => option?.value === mappingId) ?? null;
+  }, [loadError, translate]);
+  return /* @__PURE__ */ jsx(
+    LookupSelectField,
+    {
+      id,
+      value,
+      onChange,
+      placeholder,
+      loadError,
+      loadOptions: loadMappingOptions,
+      loadSelectedOption: loadSelectedMapping
+    }
+  );
+}
+function StatementSelectField({
+  id,
+  value,
+  onChange,
+  placeholder,
+  loadError
+}) {
+  const translate = useT();
+  const loadStatementOptions = React.useCallback(async (search) => {
+    const params = new URLSearchParams({ page: "1", pageSize: String(PICKER_PAGE_SIZE) });
+    if (search) params.set("search", search);
+    const payload = await readApiResultOrThrow(
+      `/api/eudr/statements?${params.toString()}`,
+      void 0,
+      { errorMessage: loadError }
+    );
+    const items = Array.isArray(payload.items) ? payload.items : [];
+    return items.map((item) => normalizeStatementOption(item, translate)).filter((option) => option !== null);
+  }, [loadError, translate]);
+  const loadSelectedStatement = React.useCallback(async (statementId) => {
+    const payload = await readApiResultOrThrow(
+      `/api/eudr/statements?id=${encodeURIComponent(statementId)}&pageSize=1`,
+      void 0,
+      { errorMessage: loadError }
+    );
+    const items = Array.isArray(payload.items) ? payload.items : [];
+    return items.map((item) => normalizeStatementOption(item, translate)).find((option) => option?.value === statementId) ?? null;
+  }, [loadError, translate]);
+  return /* @__PURE__ */ jsx(
+    LookupSelectField,
+    {
+      id,
+      value,
+      onChange,
+      placeholder,
+      loadError,
+      loadOptions: loadStatementOptions,
+      loadSelectedOption: loadSelectedStatement
+    }
+  );
+}
+function parseGeolocationInput(raw, translate) {
+  const trimmed = raw.trim();
+  if (!trimmed) return null;
+  let parsed;
+  try {
+    parsed = JSON.parse(trimmed);
+  } catch {
+    const message = translate("eudr.errors.geolocationInvalid");
+    throw createCrudFormError(message, { geolocation: message });
+  }
+  if (!isRecord(parsed)) {
+    const message = translate("eudr.errors.geolocationInvalid");
+    throw createCrudFormError(message, { geolocation: message });
+  }
+  const geoJsonType = parsed.type;
+  if (typeof geoJsonType !== "string" || !GEOJSON_TYPES.some((allowedType) => allowedType === geoJsonType)) {
+    const message = translate("eudr.errors.geolocationInvalid");
+    throw createCrudFormError(message, { geolocation: message });
+  }
+  if (JSON.stringify(parsed).length > GEOJSON_SIZE_LIMIT) {
+    const message = translate("eudr.errors.geolocationTooLarge");
+    throw createCrudFormError(message, { geolocation: message });
+  }
+  return parsed;
+}
+import { translateEudrCrudError } from "./crudErrorI18n.js";
+let referencedStatementRowKeySeq = 0;
+function normalizeReferencedStatements(value) {
+  if (!Array.isArray(value)) return [];
+  return value.map((entry) => {
+    if (!isRecord(entry)) return null;
+    const referenceNumber = readString(entry, ["referenceNumber"]) ?? "";
+    const verificationNumber = readString(entry, ["verificationNumber"]) ?? "";
+    return verificationNumber ? { referenceNumber, verificationNumber } : { referenceNumber };
+  }).filter((entry) => entry !== null);
+}
+function ReferencedStatementsField({
+  id,
+  value,
+  onChange,
+  disabled
+}) {
+  const translate = useT();
+  const rows = React.useMemo(() => normalizeReferencedStatements(value), [value]);
+  const hasIncompleteRows = rows.some((row) => row.referenceNumber.trim().length === 0);
+  const updateRow = React.useCallback((index, patch) => {
+    const nextRows = rows.map((row, rowIndex) => {
+      if (rowIndex !== index) return row;
+      const referenceNumber = patch.referenceNumber ?? row.referenceNumber;
+      const verificationNumber = patch.verificationNumber ?? row.verificationNumber ?? "";
+      return verificationNumber.trim() ? { referenceNumber, verificationNumber } : { referenceNumber };
+    });
+    onChange(nextRows);
+  }, [onChange, rows]);
+  const rowKeysRef = React.useRef([]);
+  if (rowKeysRef.current.length < rows.length) {
+    const nextKeys = [...rowKeysRef.current];
+    while (nextKeys.length < rows.length) {
+      referencedStatementRowKeySeq += 1;
+      nextKeys.push(`referenced-statement-${referencedStatementRowKeySeq}`);
+    }
+    rowKeysRef.current = nextKeys;
+  } else if (rowKeysRef.current.length > rows.length) {
+    rowKeysRef.current = rowKeysRef.current.slice(0, rows.length);
+  }
+  const rowKeys = rowKeysRef.current;
+  const removeRow = React.useCallback((index) => {
+    rowKeysRef.current = rowKeysRef.current.filter((_, keyIndex) => keyIndex !== index);
+    onChange(rows.filter((_, rowIndex) => rowIndex !== index));
+  }, [onChange, rows]);
+  return /* @__PURE__ */ jsxs("div", { id, className: "space-y-3", children: [
+    rows.length > 0 ? /* @__PURE__ */ jsx("div", { className: "space-y-2", children: rows.map((row, index) => /* @__PURE__ */ jsxs("div", { className: "grid gap-2 md:grid-cols-[1fr_1fr_auto]", children: [
+      /* @__PURE__ */ jsx(
+        Input,
+        {
+          value: row.referenceNumber,
+          disabled,
+          placeholder: translate("eudr.statements.form.referenceNumber"),
+          onChange: (event) => updateRow(index, { referenceNumber: event.target.value })
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Input,
+        {
+          value: row.verificationNumber ?? "",
+          disabled,
+          placeholder: translate("eudr.statements.form.verificationNumber"),
+          onChange: (event) => updateRow(index, { verificationNumber: event.target.value })
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        IconButton,
+        {
+          type: "button",
+          variant: "ghost",
+          disabled,
+          "aria-label": translate("eudr.statements.form.removeReferencedStatement"),
+          onClick: () => removeRow(index),
+          children: /* @__PURE__ */ jsx(Trash2, { className: "size-4", "aria-hidden": "true" })
+        }
+      )
+    ] }, rowKeys[index])) }) : /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: translate("eudr.statements.form.noReferencedStatements") }),
+    hasIncompleteRows ? /* @__PURE__ */ jsx("p", { className: "text-sm text-status-warning-text", children: translate("eudr.statements.form.referencedStatementsValidation") }) : null,
+    /* @__PURE__ */ jsx(
+      IconButton,
+      {
+        type: "button",
+        variant: "outline",
+        disabled,
+        "aria-label": translate("eudr.statements.form.addReferencedStatement"),
+        onClick: () => onChange([...rows, { referenceNumber: "" }]),
+        children: /* @__PURE__ */ jsx(Plus, { className: "size-4", "aria-hidden": "true" })
+      }
+    )
+  ] });
+}
+import { CountrySelectField } from "./CountrySelectField.js";
+import { OrderSelectField } from "./OrderSelectField.js";
+import { PlotMultiSelectField } from "./PlotMultiSelectField.js";
+export {
+  CompanySelectField,
+  CountrySelectField,
+  LookupSelectField,
+  MappingSelectField,
+  OrderSelectField,
+  PICKER_PAGE_SIZE,
+  PlotMultiSelectField,
+  ProductSelectField,
+  ReferencedStatementsField,
+  StatementSelectField,
+  activityTypeOptions,
+  actorRoleOptions,
+  commodityOptions,
+  parseGeolocationInput,
+  statementStatusOptions,
+  statusBadgeVariant,
+  submissionStatusOptions,
+  translateEudrCrudError
+};
+//# sourceMappingURL=formConfig.js.map