@mercurjs/admin 2.0.0-canary.100

package/dist/chunk-U5MJIHLY.js

@@ -0,0 +1,87 @@
+import {
+  castNumber
+} from "./chunk-SMQT3ZNO.js";
+
+// src/pages/price-lists/common/utils.ts
+var getValues = (priceList) => {
+  const startsAt = priceList.starts_at;
+  const endsAt = priceList.ends_at;
+  const isExpired = endsAt ? new Date(endsAt) < /* @__PURE__ */ new Date() : false;
+  const isScheduled = startsAt ? new Date(startsAt) > /* @__PURE__ */ new Date() : false;
+  const isDraft = priceList.status === "draft" /* DRAFT */;
+  return {
+    isExpired,
+    isScheduled,
+    isDraft
+  };
+};
+var getPriceListStatus = (t, priceList) => {
+  const { isExpired, isScheduled, isDraft } = getValues(priceList);
+  let text = t("priceLists.fields.status.options.active");
+  let color = "green";
+  let status = "active" /* ACTIVE */;
+  if (isDraft) {
+    color = "grey";
+    text = t("priceLists.fields.status.options.draft");
+    status = "draft" /* DRAFT */;
+  }
+  if (isExpired) {
+    color = "red";
+    text = t("priceLists.fields.status.options.expired");
+    status = "expired" /* EXPIRED */;
+  }
+  if (isScheduled) {
+    color = "orange";
+    text = t("priceLists.fields.status.options.scheduled");
+    status = "scheduled" /* SCHEDULED */;
+  }
+  return {
+    color,
+    text,
+    status
+  };
+};
+var isProductRow = (row) => {
+  return "variants" in row;
+};
+var extractPricesFromVariants = (variantId, variant, regions) => {
+  const extractPriceDetails = (price, priceType, id) => {
+    const currencyCode = priceType === "currency" ? id : regions.find((r) => r.id === id)?.currency_code;
+    if (!currencyCode) {
+      throw new Response(
+        JSON.stringify({ message: "Currency code not found" }),
+        { status: 400, headers: { "Content-Type": "application/json" } }
+      );
+    }
+    return {
+      amount: castNumber(price.amount),
+      ...priceType === "region" ? { rules: { region_id: id } } : {},
+      currency_code: currencyCode,
+      variant_id: variantId
+    };
+  };
+  const currencyPrices = Object.entries(variant.currency_prices || {}).flatMap(
+    ([currencyCode, currencyPrice]) => {
+      return currencyPrice?.amount ? [extractPriceDetails(currencyPrice, "currency", currencyCode)] : [];
+    }
+  );
+  const regionPrices = Object.entries(variant.region_prices || {}).flatMap(
+    ([regionId, regionPrice]) => {
+      return regionPrice?.amount ? [extractPriceDetails(regionPrice, "region", regionId)] : [];
+    }
+  );
+  return [...currencyPrices, ...regionPrices];
+};
+var exctractPricesFromProducts = (products, regions) => {
+  return Object.values(products).flatMap(
+    ({ variants }) => Object.entries(variants).flatMap(
+      ([variantId, variant]) => extractPricesFromVariants(variantId, variant, regions)
+    )
+  );
+};
+
+export {
+  getPriceListStatus,
+  isProductRow,
+  exctractPricesFromProducts
+};

package/dist/chunk-U5QDMLTR.js

@@ -0,0 +1,294 @@
+import {
+  useProductTableColumns
+} from "./chunk-3CKTAFTR.js";
+import {
+  _DataTable,
+  useDataTable
+} from "./chunk-ULJ3OMWU.js";
+import {
+  SingleColumnPage
+} from "./chunk-XIZLPYEE.js";
+import {
+  ActionMenu
+} from "./chunk-BDGZ4EQO.js";
+import {
+  useProductTableFilters
+} from "./chunk-6S72GJRI.js";
+import {
+  useProductTableQuery
+} from "./chunk-VVWB3GIK.js";
+import {
+  useDeleteProduct,
+  useProducts
+} from "./chunk-WBNGBRBK.js";
+
+// src/pages/products/product-list/product-list.tsx
+import { Children as Children2 } from "react";
+
+// src/pages/products/product-list/components/product-list-table/product-list-table.tsx
+import { PencilSquare, Trash } from "@medusajs/icons";
+import { Button, Container, Heading, toast, usePrompt } from "@medusajs/ui";
+import { keepPreviousData } from "@tanstack/react-query";
+import { createColumnHelper } from "@tanstack/react-table";
+import { useMemo, Children } from "react";
+import { useTranslation } from "react-i18next";
+import { Link, Outlet, useLoaderData, useLocation } from "react-router-dom";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var PAGE_SIZE = 20;
+var ProductListTitle = () => {
+  const { t } = useTranslation();
+  return /* @__PURE__ */ jsx(Heading, { level: "h2", "data-testid": "products-list-title", children: t("products.domain") });
+};
+var ProductListCreateButton = () => {
+  const { t } = useTranslation();
+  return /* @__PURE__ */ jsx(
+    Button,
+    {
+      size: "small",
+      variant: "secondary",
+      asChild: true,
+      "data-testid": "products-create-button",
+      children: /* @__PURE__ */ jsx(Link, { to: "create", "data-testid": "products-create-link", children: t("actions.create") })
+    }
+  );
+};
+var ProductListExportButton = () => {
+  const { t } = useTranslation();
+  const location = useLocation();
+  return /* @__PURE__ */ jsx(
+    Button,
+    {
+      size: "small",
+      variant: "secondary",
+      asChild: true,
+      "data-testid": "products-export-button",
+      children: /* @__PURE__ */ jsx(
+        Link,
+        {
+          to: `export${location.search}`,
+          "data-testid": "products-export-link",
+          children: t("actions.export")
+        }
+      )
+    }
+  );
+};
+var ProductListImportButton = () => {
+  const { t } = useTranslation();
+  const location = useLocation();
+  return /* @__PURE__ */ jsx(
+    Button,
+    {
+      size: "small",
+      variant: "secondary",
+      asChild: true,
+      "data-testid": "products-import-button",
+      children: /* @__PURE__ */ jsx(
+        Link,
+        {
+          to: `import${location.search}`,
+          "data-testid": "products-import-link",
+          children: t("actions.import")
+        }
+      )
+    }
+  );
+};
+var ProductListActions = ({ children }) => {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: "flex items-center justify-center gap-x-2",
+      "data-testid": "products-list-actions",
+      children: Children.count(children) > 0 ? children : /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(ProductListExportButton, {}),
+        /* @__PURE__ */ jsx(ProductListImportButton, {}),
+        /* @__PURE__ */ jsx(ProductListCreateButton, {})
+      ] })
+    }
+  );
+};
+var ProductListHeader = ({ children }) => {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: "flex items-center justify-between px-6 py-4",
+      "data-testid": "products-list-header",
+      children: Children.count(children) > 0 ? children : /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(ProductListTitle, {}),
+        /* @__PURE__ */ jsx(ProductListActions, {})
+      ] })
+    }
+  );
+};
+var ProductListDataTable = () => {
+  const { t } = useTranslation();
+  const initialData = useLoaderData();
+  const { searchParams, raw } = useProductTableQuery({ pageSize: PAGE_SIZE });
+  const { products, count, isLoading, isError, error } = useProducts(
+    {
+      ...searchParams,
+      is_giftcard: false
+    },
+    {
+      initialData,
+      placeholderData: keepPreviousData
+    }
+  );
+  const filters = useProductTableFilters();
+  const columns = useColumns();
+  const { table } = useDataTable({
+    data: products ?? [],
+    columns,
+    count,
+    enablePagination: true,
+    pageSize: PAGE_SIZE,
+    getRowId: (row) => row.id
+  });
+  if (isError) {
+    throw error;
+  }
+  return /* @__PURE__ */ jsx("div", { "data-testid": "products-data-table", children: /* @__PURE__ */ jsx(
+    _DataTable,
+    {
+      table,
+      columns,
+      count,
+      pageSize: PAGE_SIZE,
+      filters,
+      search: true,
+      pagination: true,
+      isLoading,
+      queryObject: raw,
+      navigateTo: (row) => `${row.original.id}`,
+      orderBy: [
+        { key: "title", label: t("fields.title") },
+        { key: "created_at", label: t("fields.createdAt") },
+        { key: "updated_at", label: t("fields.updatedAt") }
+      ],
+      noRecords: {
+        message: t("products.list.noRecordsMessage")
+      }
+    }
+  ) });
+};
+var ProductListTable = ({ children }) => {
+  return /* @__PURE__ */ jsxs(Container, { className: "divide-y p-0", "data-testid": "products-list-table", children: [
+    Children.count(children) > 0 ? children : /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(ProductListHeader, {}),
+      /* @__PURE__ */ jsx(ProductListDataTable, {})
+    ] }),
+    /* @__PURE__ */ jsx(Outlet, {})
+  ] });
+};
+var ProductActions = ({ product }) => {
+  const { t } = useTranslation();
+  const prompt = usePrompt();
+  const { mutateAsync } = useDeleteProduct(product.id);
+  const handleDelete = async () => {
+    const res = await prompt({
+      title: t("general.areYouSure"),
+      description: t("products.deleteWarning", {
+        title: product.title
+      }),
+      confirmText: t("actions.delete"),
+      cancelText: t("actions.cancel")
+    });
+    if (!res) {
+      return;
+    }
+    await mutateAsync(void 0, {
+      onSuccess: () => {
+        toast.success(t("products.toasts.delete.success.header"), {
+          description: t("products.toasts.delete.success.description", {
+            title: product.title
+          })
+        });
+      },
+      onError: (e) => {
+        toast.error(t("products.toasts.delete.error.header"), {
+          description: e.message
+        });
+      }
+    });
+  };
+  return /* @__PURE__ */ jsx(
+    ActionMenu,
+    {
+      groups: [
+        {
+          actions: [
+            {
+              icon: /* @__PURE__ */ jsx(PencilSquare, {}),
+              label: t("actions.edit"),
+              to: `/products/${product.id}/edit`
+            }
+          ]
+        },
+        {
+          actions: [
+            {
+              icon: /* @__PURE__ */ jsx(Trash, {}),
+              label: t("actions.delete"),
+              onClick: handleDelete
+            }
+          ]
+        }
+      ],
+      "data-testid": `product-actions-${product.id}`
+    }
+  );
+};
+var columnHelper = createColumnHelper();
+var useColumns = () => {
+  const base = useProductTableColumns();
+  const columns = useMemo(
+    () => [
+      ...base,
+      columnHelper.display({
+        id: "seller",
+        header: "Seller",
+        cell: ({ row }) => {
+          const seller = row.original.seller;
+          return seller?.name || "-";
+        }
+      }),
+      columnHelper.display({
+        id: "actions",
+        header: () => /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: "flex h-full w-full items-center",
+            "data-testid": "products-table-header-actions",
+            children: /* @__PURE__ */ jsx("span", { "data-testid": "products-table-header-actions-text" })
+          }
+        ),
+        cell: ({ row }) => {
+          return /* @__PURE__ */ jsx(ProductActions, { product: row.original });
+        }
+      })
+    ],
+    [base]
+  );
+  return columns;
+};
+
+// src/pages/products/product-list/product-list.tsx
+import { jsx as jsx2 } from "react/jsx-runtime";
+var Root = ({ children }) => {
+  return /* @__PURE__ */ jsx2("div", { "data-testid": "products-page", children: /* @__PURE__ */ jsx2(SingleColumnPage, { children: Children2.count(children) > 0 ? children : /* @__PURE__ */ jsx2(ProductListTable, {}) }) });
+};
+var ProductListPage = Object.assign(Root, {
+  Table: ProductListTable,
+  Header: ProductListHeader,
+  HeaderTitle: ProductListTitle,
+  HeaderActions: ProductListActions,
+  HeaderCreateButton: ProductListCreateButton,
+  HeaderExportButton: ProductListExportButton,
+  HeaderImportButton: ProductListImportButton,
+  DataTable: ProductListDataTable
+});
+
+export {
+  ProductListPage
+};

package/dist/chunk-UI2BJVP5.js

@@ -0,0 +1,170 @@
+import {
+  DataGridCellContainer,
+  useCombinedRefs,
+  useDataGridCell,
+  useDataGridCellError
+} from "./chunk-U3OWJE7V.js";
+import {
+  ConditionalTooltip
+} from "./chunk-LAVHRER2.js";
+
+// src/components/data-grid/components/data-grid-toggleable-number-cell.tsx
+import { Switch } from "@medusajs/ui";
+import { useEffect, useRef, useState } from "react";
+import CurrencyInput from "react-currency-input-field";
+import { Controller } from "react-hook-form";
+import { jsx } from "react/jsx-runtime";
+var DataGridTogglableNumberCell = ({
+  context,
+  disabledToggleTooltip,
+  ...rest
+}) => {
+  const { field, control, renderProps } = useDataGridCell({
+    context
+  });
+  const errorProps = useDataGridCellError({ context });
+  const { container, input } = renderProps;
+  return /* @__PURE__ */ jsx(
+    Controller,
+    {
+      control,
+      name: field,
+      render: ({ field: field2 }) => {
+        return /* @__PURE__ */ jsx(
+          DataGridCellContainer,
+          {
+            ...container,
+            ...errorProps,
+            outerComponent: /* @__PURE__ */ jsx(
+              OuterComponent,
+              {
+                field: field2,
+                inputProps: input,
+                isAnchor: container.isAnchor,
+                tooltip: disabledToggleTooltip
+              }
+            ),
+            children: /* @__PURE__ */ jsx(Inner, { field: field2, inputProps: input, ...rest })
+          }
+        );
+      }
+    }
+  );
+};
+var OuterComponent = ({
+  field,
+  inputProps,
+  isAnchor,
+  tooltip
+}) => {
+  const buttonRef = useRef(null);
+  const { value } = field;
+  const { onChange } = inputProps;
+  const [localValue, setLocalValue] = useState(value);
+  useEffect(() => {
+    setLocalValue(value);
+  }, [value]);
+  const handleCheckedChange = (update) => {
+    const newValue = { ...localValue, checked: update };
+    if (!update && !newValue.disabledToggle) {
+      newValue.quantity = "";
+    }
+    if (update && newValue.quantity === "") {
+      newValue.quantity = 0;
+    }
+    setLocalValue(newValue);
+    onChange(newValue, value);
+  };
+  useEffect(() => {
+    const handleKeyDown = (e) => {
+      if (isAnchor && e.key.toLowerCase() === "x") {
+        e.preventDefault();
+        buttonRef.current?.click();
+      }
+    };
+    document.addEventListener("keydown", handleKeyDown);
+    return () => document.removeEventListener("keydown", handleKeyDown);
+  }, [isAnchor]);
+  return /* @__PURE__ */ jsx(
+    ConditionalTooltip,
+    {
+      showTooltip: localValue.disabledToggle && tooltip,
+      content: tooltip,
+      children: /* @__PURE__ */ jsx("div", { className: "absolute inset-y-0 left-4 z-[3] flex w-fit items-center justify-center", children: /* @__PURE__ */ jsx(
+        Switch,
+        {
+          dir: "ltr",
+          ref: buttonRef,
+          size: "small",
+          className: "shrink-0 rtl:rotate-180",
+          checked: localValue.checked,
+          disabled: localValue.disabledToggle,
+          onCheckedChange: handleCheckedChange
+        }
+      ) })
+    }
+  );
+};
+var Inner = ({
+  field,
+  inputProps,
+  placeholder,
+  ...props
+}) => {
+  const { ref, value, onChange: _, onBlur, ...fieldProps } = field;
+  const {
+    ref: inputRef,
+    onChange,
+    onBlur: onInputBlur,
+    onFocus,
+    ...attributes
+  } = inputProps;
+  const [localValue, setLocalValue] = useState(value);
+  useEffect(() => {
+    setLocalValue(value);
+  }, [value]);
+  const combinedRefs = useCombinedRefs(inputRef, ref);
+  const handleInputChange = (updatedValue, _name, _values) => {
+    const ensuredValue = updatedValue !== void 0 ? updatedValue : "";
+    const newValue = { ...localValue, quantity: ensuredValue };
+    if (ensuredValue !== "") {
+      newValue.checked = true;
+    } else if (newValue.checked && newValue.disabledToggle === false) {
+      newValue.checked = false;
+    }
+    setLocalValue(newValue);
+  };
+  const handleOnChange = () => {
+    if (localValue.disabledToggle && localValue.quantity === "") {
+      localValue.quantity = 0;
+    }
+    onChange(localValue, value);
+  };
+  return /* @__PURE__ */ jsx("div", { className: "flex size-full items-center gap-x-2", children: /* @__PURE__ */ jsx(
+    CurrencyInput,
+    {
+      ...fieldProps,
+      ...attributes,
+      ...props,
+      ref: combinedRefs,
+      className: "txt-compact-small w-full flex-1 cursor-default appearance-none bg-transparent pl-8 text-right outline-none",
+      value: localValue?.quantity,
+      onValueChange: handleInputChange,
+      formatValueOnBlur: true,
+      onBlur: () => {
+        onBlur();
+        onInputBlur();
+        handleOnChange();
+      },
+      onFocus,
+      decimalsLimit: 0,
+      autoComplete: "off",
+      tabIndex: -1,
+      placeholder: !localValue.checked ? placeholder : void 0
+    }
+  ) });
+};
+
+export {
+  DataGridTogglableNumberCell
+};