@mercurjs/admin 2.0.0-canary.24

package/dist/product-metadata-572YVJH3.js

@@ -0,0 +1,80 @@
+import {
+  MetadataForm
+} from "./chunk-JISYRXUS.js";
+import "./chunk-TKGWSUEI.js";
+import "./chunk-U2ZFCAPX.js";
+import "./chunk-MWOKFNRO.js";
+import "./chunk-3QSRE5LS.js";
+import "./chunk-INNFZYX2.js";
+import "./chunk-LAVHRER2.js";
+import "./chunk-Y7QKP6QU.js";
+import "./chunk-ORW4HNX5.js";
+import "./chunk-ODBDAABQ.js";
+import "./chunk-YGQUBTKR.js";
+import "./chunk-362QMJZM.js";
+import "./chunk-FODCCP6C.js";
+import "./chunk-AWZFIP25.js";
+import "./chunk-2QKPRGNK.js";
+import "./chunk-XBMLI2YI.js";
+import "./chunk-XL52SYWY.js";
+import "./chunk-NS5CHWOH.js";
+import "./chunk-WDZFLCSQ.js";
+import "./chunk-VVTSF42Z.js";
+import "./chunk-D3KDXELJ.js";
+import "./chunk-2MKZ4HD4.js";
+import "./chunk-OGYWOPHZ.js";
+import "./chunk-U62GYN4A.js";
+import "./chunk-KTKL7M34.js";
+import "./chunk-JJVGCTKT.js";
+import "./chunk-I43SCBL3.js";
+import "./chunk-LLWK3OR6.js";
+import "./chunk-HYUGYB23.js";
+import "./chunk-XCMR2HTV.js";
+import "./chunk-CI5Z6FGV.js";
+import "./chunk-LCZXAT4Q.js";
+import "./chunk-S6LPCNXQ.js";
+import {
+  useProduct,
+  useUpdateProduct
+} from "./chunk-T435NFHC.js";
+import "./chunk-2KCF3ZIB.js";
+import "./chunk-ZYNBKBY3.js";
+import "./chunk-NBMM2TZK.js";
+
+// src/pages/products/product-metadata/product-metadata.tsx
+import { useParams } from "react-router-dom";
+import { ClientError } from "@mercurjs/client";
+import { jsx } from "react/jsx-runtime";
+var ProductMetadata = () => {
+  const { id } = useParams();
+  const { product, isPending, isError, error } = useProduct(id);
+  const { mutateAsync, isPending: isMutating } = useUpdateProduct(id);
+  if (isError) {
+    throw error;
+  }
+  const handleSubmit = async (params, callbacks) => {
+    try {
+      const result = await mutateAsync({
+        metadata: params.metadata === void 0 ? void 0 : params.metadata
+      });
+      callbacks.onSuccess?.();
+      return result;
+    } catch (error2) {
+      const message = error2 instanceof ClientError ? error2.message : "An error occurred";
+      callbacks.onError?.(message);
+      throw error2;
+    }
+  };
+  return /* @__PURE__ */ jsx(
+    MetadataForm,
+    {
+      metadata: product?.metadata,
+      hook: handleSubmit,
+      isPending,
+      isMutating
+    }
+  );
+};
+export {
+  ProductMetadata as Component
+};

package/dist/product-organization-LVKRBJOQ.js

@@ -0,0 +1,312 @@
+import {
+  CategoryCombobox
+} from "./chunk-5LZ2G4ZX.js";
+import {
+  useComboboxData
+} from "./chunk-O67KME6D.js";
+import {
+  Combobox
+} from "./chunk-AW77UWCZ.js";
+import "./chunk-TKGWSUEI.js";
+import {
+  KeyboundForm
+} from "./chunk-U2ZFCAPX.js";
+import {
+  RouteDrawer,
+  useRouteModal
+} from "./chunk-MWOKFNRO.js";
+import {
+  Form
+} from "./chunk-3QSRE5LS.js";
+import "./chunk-INNFZYX2.js";
+import "./chunk-XCMR2HTV.js";
+import {
+  useProduct,
+  useUpdateProduct
+} from "./chunk-T435NFHC.js";
+import "./chunk-2KCF3ZIB.js";
+import {
+  sdk
+} from "./chunk-ZYNBKBY3.js";
+import "./chunk-NBMM2TZK.js";
+
+// src/pages/products/product-organization/product-organization.tsx
+import { Heading } from "@medusajs/ui";
+import { useTranslation as useTranslation2 } from "react-i18next";
+import { useParams } from "react-router-dom";
+
+// src/pages/products/product-organization/components/product-organization-form/product-organization-form.tsx
+import { Button, toast } from "@medusajs/ui";
+import { useTranslation } from "react-i18next";
+import * as zod from "zod";
+import { useForm } from "react-hook-form";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { jsx, jsxs } from "react/jsx-runtime";
+var ProductOrganizationSchema = zod.object({
+  type_id: zod.string().nullable(),
+  collection_id: zod.string().nullable(),
+  category_ids: zod.array(zod.string()),
+  tag_ids: zod.array(zod.string())
+});
+var ProductOrganizationForm = ({
+  product
+}) => {
+  const { t } = useTranslation();
+  const { handleSuccess } = useRouteModal();
+  const collections = useComboboxData({
+    queryKey: ["product_collections"],
+    queryFn: (params) => sdk.admin.collections.query(params),
+    getOptions: (data) => data.collections.map((collection) => ({
+      label: collection.title,
+      value: collection.id
+    }))
+  });
+  const types = useComboboxData({
+    queryKey: ["product_types"],
+    queryFn: (params) => sdk.admin.productTypes.query(params),
+    getOptions: (data) => data.product_types.map((type) => ({
+      label: type.value,
+      value: type.id
+    }))
+  });
+  const tags = useComboboxData({
+    queryKey: ["product_tags"],
+    queryFn: (params) => sdk.admin.productTags.query(params),
+    getOptions: (data) => data.product_tags.map((tag) => ({
+      label: tag.value,
+      value: tag.id
+    }))
+  });
+  const form = useForm({
+    defaultValues: {
+      type_id: product.type_id ?? "",
+      collection_id: product.collection_id ?? "",
+      category_ids: product.categories?.map((c) => c.id) || [],
+      tag_ids: product.tags?.map((t2) => t2.id) || []
+    },
+    resolver: zodResolver(ProductOrganizationSchema)
+  });
+  const { mutateAsync, isPending } = useUpdateProduct(product.id);
+  const handleSubmit = form.handleSubmit(async (data) => {
+    await mutateAsync(
+      {
+        type_id: data.type_id || null,
+        collection_id: data.collection_id || null,
+        categories: data.category_ids.map((c) => ({ id: c })),
+        tags: data.tag_ids?.map((t2) => ({ id: t2 }))
+      },
+      {
+        onSuccess: ({ product: product2 }) => {
+          toast.success(
+            t("products.organization.edit.toasts.success", {
+              title: product2.title
+            })
+          );
+          handleSuccess();
+        },
+        onError: (error) => {
+          toast.error(error.message);
+        }
+      }
+    );
+  });
+  return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, "data-testid": "product-organization-form", children: /* @__PURE__ */ jsxs(
+    KeyboundForm,
+    {
+      onSubmit: handleSubmit,
+      className: "flex h-full flex-col",
+      "data-testid": "product-organization-keybound-form",
+      children: [
+        /* @__PURE__ */ jsx(RouteDrawer.Body, { "data-testid": "product-organization-form-body", children: /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: "flex h-full flex-col gap-y-4",
+            "data-testid": "product-organization-form-fields",
+            children: [
+              /* @__PURE__ */ jsx(
+                Form.Field,
+                {
+                  control: form.control,
+                  name: "type_id",
+                  render: ({ field }) => {
+                    return /* @__PURE__ */ jsxs(Form.Item, { "data-testid": "product-organization-form-type-item", children: [
+                      /* @__PURE__ */ jsx(
+                        Form.Label,
+                        {
+                          optional: true,
+                          "data-testid": "product-organization-form-type-label",
+                          children: t("products.fields.type.label")
+                        }
+                      ),
+                      /* @__PURE__ */ jsx(Form.Control, { "data-testid": "product-organization-form-type-control", children: /* @__PURE__ */ jsx(
+                        Combobox,
+                        {
+                          ...field,
+                          options: types.options,
+                          searchValue: types.searchValue,
+                          onSearchValueChange: types.onSearchValueChange,
+                          fetchNextPage: types.fetchNextPage,
+                          "data-testid": "product-organization-form-type-combobox"
+                        }
+                      ) }),
+                      /* @__PURE__ */ jsx(Form.ErrorMessage, { "data-testid": "product-organization-form-type-error" })
+                    ] });
+                  }
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                Form.Field,
+                {
+                  control: form.control,
+                  name: "collection_id",
+                  render: ({ field }) => {
+                    return /* @__PURE__ */ jsxs(Form.Item, { "data-testid": "product-organization-form-collection-item", children: [
+                      /* @__PURE__ */ jsx(
+                        Form.Label,
+                        {
+                          optional: true,
+                          "data-testid": "product-organization-form-collection-label",
+                          children: t("products.fields.collection.label")
+                        }
+                      ),
+                      /* @__PURE__ */ jsx(Form.Control, { "data-testid": "product-organization-form-collection-control", children: /* @__PURE__ */ jsx(
+                        Combobox,
+                        {
+                          ...field,
+                          multiple: false,
+                          options: collections.options,
+                          onSearchValueChange: collections.onSearchValueChange,
+                          searchValue: collections.searchValue,
+                          "data-testid": "product-organization-form-collection-combobox"
+                        }
+                      ) }),
+                      /* @__PURE__ */ jsx(Form.ErrorMessage, { "data-testid": "product-organization-form-collection-error" })
+                    ] });
+                  }
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                Form.Field,
+                {
+                  control: form.control,
+                  name: "category_ids",
+                  render: ({ field }) => {
+                    return /* @__PURE__ */ jsxs(Form.Item, { "data-testid": "product-organization-form-categories-item", children: [
+                      /* @__PURE__ */ jsx(
+                        Form.Label,
+                        {
+                          optional: true,
+                          "data-testid": "product-organization-form-categories-label",
+                          children: t("products.fields.categories.label")
+                        }
+                      ),
+                      /* @__PURE__ */ jsx(Form.Control, { "data-testid": "product-organization-form-categories-control", children: /* @__PURE__ */ jsx(
+                        CategoryCombobox,
+                        {
+                          ...field,
+                          "data-testid": "product-organization-form-categories-combobox"
+                        }
+                      ) }),
+                      /* @__PURE__ */ jsx(Form.ErrorMessage, { "data-testid": "product-organization-form-categories-error" })
+                    ] });
+                  }
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                Form.Field,
+                {
+                  control: form.control,
+                  name: "tag_ids",
+                  render: ({ field }) => {
+                    return /* @__PURE__ */ jsxs(Form.Item, { "data-testid": "product-organization-form-tags-item", children: [
+                      /* @__PURE__ */ jsx(
+                        Form.Label,
+                        {
+                          optional: true,
+                          "data-testid": "product-organization-form-tags-label",
+                          children: t("products.fields.tags.label")
+                        }
+                      ),
+                      /* @__PURE__ */ jsx(Form.Control, { "data-testid": "product-organization-form-tags-control", children: /* @__PURE__ */ jsx(
+                        Combobox,
+                        {
+                          ...field,
+                          multiple: true,
+                          options: tags.options,
+                          onSearchValueChange: tags.onSearchValueChange,
+                          searchValue: tags.searchValue,
+                          "data-testid": "product-organization-form-tags-combobox"
+                        }
+                      ) }),
+                      /* @__PURE__ */ jsx(Form.ErrorMessage, { "data-testid": "product-organization-form-tags-error" })
+                    ] });
+                  }
+                }
+              )
+            ]
+          }
+        ) }),
+        /* @__PURE__ */ jsx(RouteDrawer.Footer, { "data-testid": "product-organization-form-footer", children: /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: "flex items-center justify-end gap-x-2",
+            "data-testid": "product-organization-form-footer-actions",
+            children: [
+              /* @__PURE__ */ jsx(
+                RouteDrawer.Close,
+                {
+                  asChild: true,
+                  "data-testid": "product-organization-form-cancel-button-wrapper",
+                  children: /* @__PURE__ */ jsx(
+                    Button,
+                    {
+                      size: "small",
+                      variant: "secondary",
+                      "data-testid": "product-organization-form-cancel-button",
+                      children: t("actions.cancel")
+                    }
+                  )
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                Button,
+                {
+                  size: "small",
+                  type: "submit",
+                  isLoading: isPending,
+                  "data-testid": "product-organization-form-save-button",
+                  children: t("actions.save")
+                }
+              )
+            ]
+          }
+        ) })
+      ]
+    }
+  ) });
+};
+
+// src/pages/products/product-organization/product-organization.tsx
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var ProductOrganization = () => {
+  const { id } = useParams();
+  const { t } = useTranslation2();
+  const { product, isLoading, isError, error } = useProduct(id);
+  if (isError) {
+    throw error;
+  }
+  return /* @__PURE__ */ jsxs2(RouteDrawer, { "data-testid": "product-organization-drawer", children: [
+    /* @__PURE__ */ jsx2(RouteDrawer.Header, { "data-testid": "product-organization-drawer-header", children: /* @__PURE__ */ jsx2(
+      RouteDrawer.Title,
+      {
+        asChild: true,
+        "data-testid": "product-organization-drawer-title",
+        children: /* @__PURE__ */ jsx2(Heading, { "data-testid": "product-organization-drawer-title-text", children: t("products.organization.edit.header") })
+      }
+    ) }),
+    !isLoading && product && /* @__PURE__ */ jsx2(ProductOrganizationForm, { product })
+  ] });
+};
+export {
+  ProductOrganization as Component
+};

package/dist/product-prices-K5YM2TL6.js

@@ -0,0 +1,266 @@
+import {
+  DataGrid,
+  createDataGridHelper,
+  createDataGridPriceColumns
+} from "./chunk-KUWNYCGL.js";
+import "./chunk-IQPN4PZJ.js";
+import {
+  castNumber
+} from "./chunk-SMQT3ZNO.js";
+import "./chunk-TKGWSUEI.js";
+import {
+  KeyboundForm
+} from "./chunk-U2ZFCAPX.js";
+import {
+  RouteFocusModal,
+  useRouteModal
+} from "./chunk-MWOKFNRO.js";
+import "./chunk-3QSRE5LS.js";
+import "./chunk-INNFZYX2.js";
+import "./chunk-LAVHRER2.js";
+import "./chunk-Y7QKP6QU.js";
+import {
+  useRegions
+} from "./chunk-CI5Z6FGV.js";
+import {
+  useStore
+} from "./chunk-LCZXAT4Q.js";
+import {
+  usePricePreferences
+} from "./chunk-S6LPCNXQ.js";
+import {
+  useProduct,
+  useUpdateProductVariantsBatch
+} from "./chunk-T435NFHC.js";
+import "./chunk-2KCF3ZIB.js";
+import "./chunk-ZYNBKBY3.js";
+import "./chunk-NBMM2TZK.js";
+
+// src/pages/products/product-prices/product-prices.tsx
+import { useParams } from "react-router-dom";
+
+// src/pages/products/product-prices/pricing-edit.tsx
+import { useMemo as useMemo2 } from "react";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { Button } from "@medusajs/ui";
+import { useForm } from "react-hook-form";
+import { useTranslation as useTranslation2 } from "react-i18next";
+import * as zod from "zod";
+
+// src/pages/products/common/variant-pricing-form.tsx
+import { useMemo } from "react";
+import { useWatch } from "react-hook-form";
+import { useTranslation } from "react-i18next";
+import { jsx } from "react/jsx-runtime";
+var VariantPricingForm = ({
+  form,
+  "data-testid": dataTestId
+}) => {
+  const { store } = useStore();
+  const { regions } = useRegions({ limit: 9999 });
+  const { price_preferences: pricePreferences } = usePricePreferences({});
+  const { setCloseOnEscape } = useRouteModal();
+  const columns = useVariantPriceGridColumns({
+    currencies: store?.supported_currencies,
+    regions,
+    pricePreferences
+  });
+  const variants = useWatch({
+    control: form.control,
+    name: "variants"
+  });
+  return /* @__PURE__ */ jsx("div", { "data-testid": dataTestId, children: /* @__PURE__ */ jsx(
+    DataGrid,
+    {
+      columns,
+      data: variants,
+      state: form,
+      onEditingChange: (editing) => setCloseOnEscape(!editing),
+      "data-testid": dataTestId
+    }
+  ) });
+};
+var columnHelper = createDataGridHelper();
+var useVariantPriceGridColumns = ({
+  currencies = [],
+  regions = [],
+  pricePreferences = []
+}) => {
+  const { t } = useTranslation();
+  return useMemo(() => {
+    return [
+      columnHelper.column({
+        id: t("fields.title"),
+        header: t("fields.title"),
+        cell: (context) => {
+          const entity = context.row.original;
+          return /* @__PURE__ */ jsx(DataGrid.ReadonlyCell, { context, children: /* @__PURE__ */ jsx("div", { className: "flex h-full w-full items-center gap-x-2 overflow-hidden", children: /* @__PURE__ */ jsx("span", { className: "truncate", children: entity.title }) }) });
+        },
+        disableHiding: true
+      }),
+      ...createDataGridPriceColumns({
+        currencies: currencies.map((c) => c.currency_code),
+        regions,
+        pricePreferences,
+        getFieldName: (context, value) => {
+          if (context.column.id?.startsWith("currency_prices")) {
+            return `variants.${context.row.index}.prices.${value}`;
+          }
+          return `variants.${context.row.index}.prices.${value}`;
+        },
+        t
+      })
+    ];
+  }, [t, currencies, regions, pricePreferences]);
+};
+
+// src/pages/products/product-prices/pricing-edit.tsx
+import { jsx as jsx2, jsxs } from "react/jsx-runtime";
+var UpdateVariantPricesSchema = zod.object({
+  variants: zod.array(
+    zod.object({
+      prices: zod.record(zod.string(), zod.string().or(zod.number()).optional()).optional()
+    })
+  )
+});
+var PricingEdit = ({
+  product,
+  variantId
+}) => {
+  const { t } = useTranslation2();
+  const { handleSuccess } = useRouteModal();
+  const { mutateAsync, isPending } = useUpdateProductVariantsBatch(product.id);
+  const { regions } = useRegions({ limit: 9999 });
+  const regionsCurrencyMap = useMemo2(() => {
+    if (!regions?.length) {
+      return {};
+    }
+    return regions.reduce((acc, reg) => {
+      acc[reg.id] = reg.currency_code;
+      return acc;
+    }, {});
+  }, [regions]);
+  const variants = variantId ? product.variants?.filter((v) => v.id === variantId) : product.variants;
+  const form = useForm({
+    defaultValues: {
+      variants: variants?.map((variant) => ({
+        title: variant.title,
+        prices: variant.prices.reduce((acc, price) => {
+          if (price.rules?.region_id) {
+            acc[price.rules.region_id] = price.amount;
+          } else {
+            acc[price.currency_code] = price.amount;
+          }
+          return acc;
+        }, {})
+      }))
+    },
+    resolver: zodResolver(UpdateVariantPricesSchema, {})
+  });
+  const handleSubmit = form.handleSubmit(async (values) => {
+    const reqData = values.variants.map((variant, ind) => ({
+      id: variants[ind].id,
+      prices: Object.entries(variant.prices || {}).filter(
+        ([_, value]) => value !== "" && typeof value !== "undefined"
+        // deleted cells
+      ).map(([currencyCodeOrRegionId, value]) => {
+        const regionId = currencyCodeOrRegionId.startsWith("reg_") ? currencyCodeOrRegionId : void 0;
+        const currencyCode = currencyCodeOrRegionId.startsWith("reg_") ? regionsCurrencyMap[regionId] : currencyCodeOrRegionId;
+        let existingId = void 0;
+        if (regionId) {
+          existingId = variants?.[ind]?.prices?.find((p) => p.rules["region_id"] === regionId)?.id;
+        } else {
+          existingId = variants?.[ind]?.prices?.find(
+            (p) => p.currency_code === currencyCode && Object.keys(p.rules ?? {}).length === 0
+          )?.id;
+        }
+        const amount = castNumber(value);
+        return {
+          id: existingId,
+          currency_code: currencyCode,
+          amount,
+          ...regionId ? { rules: { region_id: regionId } } : {}
+        };
+      })
+    }));
+    await mutateAsync(reqData, {
+      onSuccess: () => {
+        handleSuccess("..");
+      }
+    });
+  });
+  return /* @__PURE__ */ jsx2(
+    RouteFocusModal.Form,
+    {
+      form,
+      "data-testid": "product-prices-form",
+      children: /* @__PURE__ */ jsxs(
+        KeyboundForm,
+        {
+          onSubmit: handleSubmit,
+          className: "flex size-full flex-col",
+          children: [
+            /* @__PURE__ */ jsx2(RouteFocusModal.Header, { "data-testid": "product-prices-form-header" }),
+            /* @__PURE__ */ jsx2(
+              RouteFocusModal.Body,
+              {
+                className: "flex flex-col overflow-hidden",
+                "data-testid": "product-prices-form-body",
+                children: /* @__PURE__ */ jsx2("div", { "data-testid": "product-prices-form-variant-pricing-wrapper", children: /* @__PURE__ */ jsx2(
+                  VariantPricingForm,
+                  {
+                    form,
+                    "data-testid": "product-prices-form-variant-pricing"
+                  }
+                ) })
+              }
+            ),
+            /* @__PURE__ */ jsx2(RouteFocusModal.Footer, { "data-testid": "product-prices-form-footer", children: /* @__PURE__ */ jsxs(
+              "div",
+              {
+                className: "flex w-full items-center justify-end gap-x-2",
+                "data-testid": "product-prices-form-footer-actions",
+                children: [
+                  /* @__PURE__ */ jsx2(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx2(
+                    Button,
+                    {
+                      variant: "secondary",
+                      size: "small",
+                      "data-testid": "product-prices-form-cancel-button",
+                      children: t("actions.cancel")
+                    }
+                  ) }),
+                  /* @__PURE__ */ jsx2(
+                    Button,
+                    {
+                      type: "submit",
+                      variant: "primary",
+                      size: "small",
+                      isLoading: isPending,
+                      "data-testid": "product-prices-form-save-button",
+                      children: t("actions.save")
+                    }
+                  )
+                ]
+              }
+            ) })
+          ]
+        }
+      )
+    }
+  );
+};
+
+// src/pages/products/product-prices/product-prices.tsx
+import { jsx as jsx3 } from "react/jsx-runtime";
+var ProductPrices = () => {
+  const { id, variant_id } = useParams();
+  const { product, isLoading, isError, error } = useProduct(id);
+  if (isError) {
+    throw error;
+  }
+  return /* @__PURE__ */ jsx3(RouteFocusModal, { "data-testid": "product-prices-modal", children: !isLoading && product && /* @__PURE__ */ jsx3(PricingEdit, { product, variantId: variant_id }) });
+};
+export {
+  ProductPrices as Component
+};