@mercurjs/admin 2.2.0-canary.20 → 2.2.0-canary.22

package/dist/{chunk-2HMWS5UW.js → chunk-67RX3M6X.js}

@@ -1,3 +1,7 @@
+import {
+  getCollectionGallery,
+  getCollectionIcon
+} from "./chunk-BN6OOLJA.js";
 import {
   useProductTableColumns
 } from "./chunk-FWWPSH6V.js";
@@ -101,19 +105,142 @@ var CollectionGeneralSection = ({
   ] });
 };
 
+// src/pages/collections/collection-detail/components/collection-icon-section/collection-icon-section.tsx
+import { PencilSquare as PencilSquare2 } from "@medusajs/icons";
+import { Container as Container2, Heading as Heading2, Text as Text2 } from "@medusajs/ui";
+import { useTranslation as useTranslation2 } from "react-i18next";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var CollectionIconSection = ({
+  collection
+}) => {
+  const { t } = useTranslation2();
+  const icon = getCollectionIcon(collection.images);
+  return /* @__PURE__ */ jsxs2(Container2, { className: "divide-y p-0", "data-testid": "collection-icon-section", children: [
+    /* @__PURE__ */ jsxs2("div", { className: "flex items-center justify-between px-6 py-4", children: [
+      /* @__PURE__ */ jsx2(Heading2, { level: "h2", children: t("collections.icon.label") }),
+      /* @__PURE__ */ jsx2(
+        ActionMenu,
+        {
+          groups: [
+            {
+              actions: [
+                {
+                  label: t("actions.edit"),
+                  icon: /* @__PURE__ */ jsx2(PencilSquare2, {}),
+                  to: "icon/edit"
+                }
+              ]
+            }
+          ],
+          "data-testid": "collection-icon-section-menu"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx2("div", { className: "px-6 py-4", children: icon ? /* @__PURE__ */ jsx2("div", { className: "bg-ui-bg-base shadow-elevation-card-rest relative aspect-square w-24 overflow-hidden rounded-[8px]", children: /* @__PURE__ */ jsx2(
+      "img",
+      {
+        src: icon.url,
+        alt: "",
+        className: "size-full object-contain object-center p-2",
+        "data-testid": "collection-icon-section-image"
+      }
+    ) }) : /* @__PURE__ */ jsxs2("div", { className: "flex flex-col items-center justify-center gap-y-1 py-8", children: [
+      /* @__PURE__ */ jsx2(
+        Text2,
+        {
+          size: "small",
+          leading: "compact",
+          weight: "plus",
+          className: "text-ui-fg-subtle",
+          children: t("collections.icon.empty.header")
+        }
+      ),
+      /* @__PURE__ */ jsx2(Text2, { size: "small", className: "text-ui-fg-muted", children: t("collections.icon.empty.description") })
+    ] }) })
+  ] });
+};
+
+// src/pages/collections/collection-detail/components/collection-media-section/collection-media-section.tsx
+import { FeaturedBadge, PencilSquare as PencilSquare3, ThumbnailBadge } from "@medusajs/icons";
+import { Container as Container3, Heading as Heading3, Text as Text3, Tooltip } from "@medusajs/ui";
+import { useTranslation as useTranslation3 } from "react-i18next";
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+var CollectionMediaSection = ({
+  collection
+}) => {
+  const { t } = useTranslation3();
+  const gallery = getCollectionGallery(collection.images);
+  return /* @__PURE__ */ jsxs3(Container3, { className: "divide-y p-0", "data-testid": "collection-media-section", children: [
+    /* @__PURE__ */ jsxs3("div", { className: "flex items-center justify-between px-6 py-4", children: [
+      /* @__PURE__ */ jsx3(Heading3, { level: "h2", children: t("collections.media.label") }),
+      /* @__PURE__ */ jsx3(
+        ActionMenu,
+        {
+          groups: [
+            {
+              actions: [
+                {
+                  label: t("actions.edit"),
+                  icon: /* @__PURE__ */ jsx3(PencilSquare3, {}),
+                  to: "media?view=edit"
+                }
+              ]
+            }
+          ],
+          "data-testid": "collection-media-section-menu"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx3("div", { className: "px-6 py-4", children: gallery.length > 0 ? /* @__PURE__ */ jsx3("div", { className: "grid grid-cols-[repeat(auto-fill,minmax(96px,1fr))] gap-4", children: gallery.map((image) => /* @__PURE__ */ jsxs3(
+      "div",
+      {
+        className: "shadow-elevation-card-rest relative aspect-square size-full overflow-hidden rounded-[8px]",
+        "data-testid": `collection-media-section-item-${image.id}`,
+        children: [
+          /* @__PURE__ */ jsx3(
+            "img",
+            {
+              src: image.url,
+              alt: "",
+              className: "size-full object-cover object-center"
+            }
+          ),
+          (image.is_thumbnail || image.is_banner) && /* @__PURE__ */ jsxs3("div", { className: "absolute left-2 top-2 flex items-center gap-x-1", children: [
+            image.is_thumbnail && /* @__PURE__ */ jsx3(Tooltip, { content: t("collections.media.thumbnail"), children: /* @__PURE__ */ jsx3(ThumbnailBadge, {}) }),
+            image.is_banner && /* @__PURE__ */ jsx3(Tooltip, { content: t("collections.media.banner"), children: /* @__PURE__ */ jsx3(FeaturedBadge, { className: "text-ui-fg-interactive" }) })
+          ] })
+        ]
+      },
+      image.id
+    )) }) : /* @__PURE__ */ jsxs3("div", { className: "flex flex-col items-center justify-center gap-y-1 py-8", children: [
+      /* @__PURE__ */ jsx3(
+        Text3,
+        {
+          size: "small",
+          leading: "compact",
+          weight: "plus",
+          className: "text-ui-fg-subtle",
+          children: t("collections.media.empty.header")
+        }
+      ),
+      /* @__PURE__ */ jsx3(Text3, { size: "small", className: "text-ui-fg-muted", children: t("collections.media.empty.description") })
+    ] }) })
+  ] });
+};
+
 // src/pages/collections/collection-detail/components/collection-product-section/collection-product-section.tsx
-import { PencilSquare as PencilSquare2, Plus, Trash as Trash2 } from "@medusajs/icons";
-import { Checkbox, Container as Container2, Heading as Heading2, toast, usePrompt as usePrompt2 } from "@medusajs/ui";
+import { PencilSquare as PencilSquare4, Plus, Trash as Trash2 } from "@medusajs/icons";
+import { Checkbox, Container as Container4, Heading as Heading4, toast, usePrompt as usePrompt2 } from "@medusajs/ui";
 import { keepPreviousData } from "@tanstack/react-query";
 import { createColumnHelper } from "@tanstack/react-table";
 import { useMemo } from "react";
-import { useTranslation as useTranslation2 } from "react-i18next";
-import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+import { useTranslation as useTranslation4 } from "react-i18next";
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
 var PAGE_SIZE = 10;
 var CollectionProductSection = ({
   collection
 }) => {
-  const { t } = useTranslation2();
+  const { t } = useTranslation4();
   const { searchParams, raw } = useProductTableQuery({ pageSize: PAGE_SIZE });
   const { products, count, isLoading, isError, error } = useProducts(
     {
@@ -175,17 +302,17 @@ var CollectionProductSection = ({
   if (isError) {
     throw error;
   }
-  return /* @__PURE__ */ jsxs2(Container2, { className: "divide-y p-0", children: [
-    /* @__PURE__ */ jsxs2("div", { className: "flex items-center justify-between px-6 py-4", children: [
-      /* @__PURE__ */ jsx2(Heading2, { level: "h2", children: t("products.domain") }),
-      /* @__PURE__ */ jsx2(
+  return /* @__PURE__ */ jsxs4(Container4, { className: "divide-y p-0", children: [
+    /* @__PURE__ */ jsxs4("div", { className: "flex items-center justify-between px-6 py-4", children: [
+      /* @__PURE__ */ jsx4(Heading4, { level: "h2", children: t("products.domain") }),
+      /* @__PURE__ */ jsx4(
         ActionMenu,
         {
           groups: [
             {
               actions: [
                 {
-                  icon: /* @__PURE__ */ jsx2(Plus, {}),
+                  icon: /* @__PURE__ */ jsx4(Plus, {}),
                   label: t("actions.add"),
                   to: "products"
                 }
@@ -195,7 +322,7 @@ var CollectionProductSection = ({
         }
       )
     ] }),
-    /* @__PURE__ */ jsx2(
+    /* @__PURE__ */ jsx4(
       _DataTable,
       {
         table,
@@ -231,7 +358,7 @@ var ProductActions = ({
   product,
   collectionId
 }) => {
-  const { t } = useTranslation2();
+  const { t } = useTranslation4();
   const prompt = usePrompt2();
   const { mutateAsync } = useUpdateCollectionProducts(collectionId);
   const handleRemove = async () => {
@@ -264,14 +391,14 @@ var ProductActions = ({
       }
     );
   };
-  return /* @__PURE__ */ jsx2(
+  return /* @__PURE__ */ jsx4(
     ActionMenu,
     {
       groups: [
         {
           actions: [
             {
-              icon: /* @__PURE__ */ jsx2(PencilSquare2, {}),
+              icon: /* @__PURE__ */ jsx4(PencilSquare4, {}),
               label: t("actions.edit"),
               to: `/products/${product.id}/edit`
             }
@@ -280,7 +407,7 @@ var ProductActions = ({
         {
           actions: [
             {
-              icon: /* @__PURE__ */ jsx2(Trash2, {}),
+              icon: /* @__PURE__ */ jsx4(Trash2, {}),
               label: t("actions.remove"),
               onClick: handleRemove
             }
@@ -298,7 +425,7 @@ var useColumns = () => {
       columnHelper.display({
         id: "select",
         header: ({ table }) => {
-          return /* @__PURE__ */ jsx2(
+          return /* @__PURE__ */ jsx4(
             Checkbox,
             {
               checked: table.getIsSomePageRowsSelected() ? "indeterminate" : table.getIsAllPageRowsSelected(),
@@ -307,7 +434,7 @@ var useColumns = () => {
           );
         },
         cell: ({ row }) => {
-          return /* @__PURE__ */ jsx2(
+          return /* @__PURE__ */ jsx4(
             Checkbox,
             {
               checked: row.getIsSelected(),
@@ -324,7 +451,7 @@ var useColumns = () => {
         id: "actions",
         cell: ({ row, table }) => {
           const { collectionId } = table.options.meta;
-          return /* @__PURE__ */ jsx2(
+          return /* @__PURE__ */ jsx4(
             ProductActions,
             {
               product: row.original,
@@ -339,7 +466,7 @@ var useColumns = () => {
 };
 
 // src/pages/collections/collection-detail/collection-detail.tsx
-import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
 var Root = ({ children }) => {
   const initialData = useLoaderData();
   const { id } = useParams();
@@ -351,18 +478,22 @@ var Root = ({ children }) => {
     }
   );
   if (isLoading || !collection) {
-    return /* @__PURE__ */ jsx3(SingleColumnPageSkeleton, { sections: 2, showJSON: true, showMetadata: true });
+    return /* @__PURE__ */ jsx5(SingleColumnPageSkeleton, { sections: 4, showJSON: true, showMetadata: true });
   }
   if (isError) {
     throw error;
   }
-  return Children.count(children) > 0 ? /* @__PURE__ */ jsx3(SingleColumnPage, { showJSON: true, showMetadata: true, data: collection, children }) : /* @__PURE__ */ jsxs3(SingleColumnPage, { showJSON: true, showMetadata: true, data: collection, children: [
-    /* @__PURE__ */ jsx3(CollectionGeneralSection, { collection }),
-    /* @__PURE__ */ jsx3(CollectionProductSection, { collection })
+  return Children.count(children) > 0 ? /* @__PURE__ */ jsx5(SingleColumnPage, { showJSON: true, showMetadata: true, data: collection, children }) : /* @__PURE__ */ jsxs5(SingleColumnPage, { showJSON: true, showMetadata: true, data: collection, children: [
+    /* @__PURE__ */ jsx5(CollectionGeneralSection, { collection }),
+    /* @__PURE__ */ jsx5(CollectionMediaSection, { collection }),
+    /* @__PURE__ */ jsx5(CollectionIconSection, { collection }),
+    /* @__PURE__ */ jsx5(CollectionProductSection, { collection })
   ] });
 };
 var CollectionDetailPage = Object.assign(Root, {
   GeneralSection: CollectionGeneralSection,
+  MediaSection: CollectionMediaSection,
+  IconSection: CollectionIconSection,
   ProductSection: CollectionProductSection
 });
 

package/dist/{chunk-2MYHGOPY.js → chunk-7IVRL4AF.js}

@@ -35,7 +35,7 @@ import {
 import {
   useBatchPriceListPrices,
   usePriceList
-} from "./chunk-Z2UBJXTU.js";
+} from "./chunk-RDTFLHYO.js";
 import {
   useProducts
 } from "./chunk-M2E3PKA4.js";

package/dist/{chunk-7VPJ4C6F.js → chunk-7PAVVX2P.js}

@@ -1,6 +1,6 @@
 import {
   getPromotionStatus
-} from "./chunk-HI6L7DXI.js";
+} from "./chunk-K7EOVKKV.js";
 import {
   TextCell,
   TextHeader

package/dist/{chunk-HR7TFO2X.js → chunk-A3IFGUDD.js}

@@ -3,10 +3,10 @@ import {
 } from "./chunk-54EPH67T.js";
 import {
   useCustomerGroupTableFilters
-} from "./chunk-CMHI2RPL.js";
+} from "./chunk-AKSUGT5I.js";
 import {
   useCustomerGroupTableQuery
-} from "./chunk-VKOE5J66.js";
+} from "./chunk-3XOE4NV5.js";
 import {
   _DataTable,
   useDataTable
@@ -17,7 +17,7 @@ import {
 } from "./chunk-FWJLS7XD.js";
 import {
   useCustomerGroups
-} from "./chunk-PRBE5CM3.js";
+} from "./chunk-QYDWMBEX.js";
 
 // src/pages/price-lists/common/components/price-list-customer-group-rule-form/price-list-customer-group-rule-form.tsx
 import { Button, Checkbox } from "@medusajs/ui";

package/dist/{chunk-CMHI2RPL.js → chunk-AKSUGT5I.js}

@@ -1,8 +1,29 @@
+import {
+  useSellers
+} from "./chunk-LEG67A2R.js";
+
 // src/hooks/table/filters/use-customer-group-table-filters.tsx
 import { useTranslation } from "react-i18next";
 var useCustomerGroupTableFilters = () => {
   const { t } = useTranslation();
+  const { sellers } = useSellers({
+    limit: 1e3,
+    fields: "id,name"
+  });
   let filters = [];
+  if (sellers?.length) {
+    filters.push({
+      key: "seller_id",
+      label: t("fields.owner"),
+      type: "select",
+      multiple: true,
+      searchable: true,
+      options: sellers.map((s) => ({
+        label: s.name,
+        value: s.id
+      }))
+    });
+  }
   const dateFilters = [
     { label: t("fields.createdAt"), key: "created_at" },
     { label: t("fields.updatedAt"), key: "updated_at" }

package/dist/{chunk-7JZVZ5EX.js → chunk-ARN66CDK.js}

@@ -1,6 +1,6 @@
 import {
   useCollectionTableColumns
-} from "./chunk-JQV7CXEC.js";
+} from "./chunk-EDDKIVMF.js";
 import {
   useCollectionTableFilters
 } from "./chunk-KOURHC2N.js";

package/dist/{chunk-JEJQKTZO.js → chunk-ASNNJIW7.js}

@@ -1,14 +1,14 @@
 import {
   useDeleteCommissionRuleAction,
   useScopeReferenceNames
-} from "./chunk-RXRDZ47F.js";
+} from "./chunk-BHJFT3ST.js";
 import {
   formatCommissionValue,
   getIsActiveProps,
   getScopeSummary,
   getScopeTypeLabel,
   referenceIds
-} from "./chunk-PN5C4AND.js";
+} from "./chunk-STPSVH3T.js";
 import {
   SectionRow
 } from "./chunk-3XPXUIK3.js";

package/dist/{chunk-RXRDZ47F.js → chunk-BHJFT3ST.js}

@@ -22,10 +22,10 @@ var useDeleteCommissionRuleAction = (rule) => {
   const { mutateAsync } = useDeleteCommissionRule(rule.id);
   return async () => {
     const confirmed = await prompt({
-      title: t("general.areYouSure"),
+      title: t("commissions.delete.title", "Delete commission rule"),
       description: t("commissions.delete.description", {
         name: rule.name,
-        defaultValue: `Are you sure you want to delete the commission rule "${rule.name}"?`
+        defaultValue: `You are about to delete commission rule ${rule.name}. This action cannot be undone.`
       }),
       confirmText: t("actions.delete"),
       cancelText: t("actions.cancel")
@@ -37,7 +37,7 @@ var useDeleteCommissionRuleAction = (rule) => {
       onSuccess: () => {
         toast.success(
           t("commissions.delete.successToast", {
-            defaultValue: "Commission rule deleted"
+            defaultValue: "Commission rule was successfully deleted."
           })
         );
         navigate("/settings/commissions");