@mercurjs/admin 2.2.0-canary.8 → 2.2.0-rc.0

package/dist/{chunk-LSLPZITW.js → chunk-LVRCEGL7.js}

@@ -1,16 +1,20 @@
+import {
+  getCollectionGallery,
+  getCollectionIcon
+} from "./chunk-VM56ZITS.js";
 import {
   useProductTableColumns
-} from "./chunk-OMBP3YSV.js";
+} from "./chunk-OYZIFLLC.js";
 import {
   useProductTableFilters
-} from "./chunk-HJKZBCDB.js";
+} from "./chunk-4346EIRG.js";
 import {
   useProductTableQuery
-} from "./chunk-LYZDVZWA.js";
+} from "./chunk-H7NIKMPE.js";
 import {
   _DataTable,
   useDataTable
-} from "./chunk-NQEXDLYH.js";
+} from "./chunk-6ZVV2XHU.js";
 import {
   SingleColumnPage
 } from "./chunk-H6MYB7GB.js";
@@ -18,7 +22,7 @@ import {
   useCollection,
   useDeleteCollection,
   useUpdateCollectionProducts
-} from "./chunk-2ZRWLCYP.js";
+} from "./chunk-BNFTJW4L.js";
 import {
   ActionMenu
 } from "./chunk-BDGZ4EQO.js";
@@ -27,7 +31,7 @@ import {
 } from "./chunk-INNFZYX2.js";
 import {
   useProducts
-} from "./chunk-ZRFWXNT3.js";
+} from "./chunk-ZKHF75MZ.js";
 
 // src/pages/collections/collection-detail/collection-detail.tsx
 import { Children } from "react";
@@ -101,19 +105,143 @@ 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.media_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 { PencilSquare as PencilSquare3, ThumbnailBadge } from "@medusajs/icons";
+import { ListBadge } from "@mercurjs/dashboard-shared";
+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.media_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(ListBadge, {}) })
+          ] })
+        ]
+      },
+      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 +303,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 +323,7 @@ var CollectionProductSection = ({
         }
       )
     ] }),
-    /* @__PURE__ */ jsx2(
+    /* @__PURE__ */ jsx4(
       _DataTable,
       {
         table,
@@ -231,7 +359,7 @@ var ProductActions = ({
   product,
   collectionId
 }) => {
-  const { t } = useTranslation2();
+  const { t } = useTranslation4();
   const prompt = usePrompt2();
   const { mutateAsync } = useUpdateCollectionProducts(collectionId);
   const handleRemove = async () => {
@@ -264,14 +392,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 +408,7 @@ var ProductActions = ({
         {
           actions: [
             {
-              icon: /* @__PURE__ */ jsx2(Trash2, {}),
+              icon: /* @__PURE__ */ jsx4(Trash2, {}),
               label: t("actions.remove"),
               onClick: handleRemove
             }
@@ -297,34 +425,30 @@ var useColumns = () => {
     () => [
       columnHelper.display({
         id: "select",
-        header: ({ table }) => {
-          return /* @__PURE__ */ jsx2(
-            Checkbox,
-            {
-              checked: table.getIsSomePageRowsSelected() ? "indeterminate" : table.getIsAllPageRowsSelected(),
-              onCheckedChange: (value) => table.toggleAllPageRowsSelected(!!value)
-            }
-          );
-        },
-        cell: ({ row }) => {
-          return /* @__PURE__ */ jsx2(
-            Checkbox,
-            {
-              checked: row.getIsSelected(),
-              onCheckedChange: (value) => row.toggleSelected(!!value),
-              onClick: (e) => {
-                e.stopPropagation();
-              }
-            }
-          );
-        }
+        header: ({ table }) => /* @__PURE__ */ jsx4(
+          Checkbox,
+          {
+            checked: table.getIsSomePageRowsSelected() ? "indeterminate" : table.getIsAllPageRowsSelected(),
+            onCheckedChange: (value) => table.toggleAllPageRowsSelected(!!value),
+            "data-testid": "products-table-header-select-checkbox"
+          }
+        ),
+        cell: ({ row }) => /* @__PURE__ */ jsx4(
+          Checkbox,
+          {
+            checked: row.getIsSelected(),
+            onCheckedChange: (value) => row.toggleSelected(!!value),
+            onClick: (e) => e.stopPropagation(),
+            "data-testid": `products-table-cell-${row.id}-select-checkbox`
+          }
+        )
       }),
       ...columns,
       columnHelper.display({
         id: "actions",
         cell: ({ row, table }) => {
           const { collectionId } = table.options.meta;
-          return /* @__PURE__ */ jsx2(
+          return /* @__PURE__ */ jsx4(
             ProductActions,
             {
               product: row.original,
@@ -339,7 +463,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 +475,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-ZBWL72TB.js → chunk-LXZXXOJ3.js}

@@ -57,18 +57,8 @@ var fetchQuery = async (url, {
   }
   return response.json();
 };
-var uploadFilesQuery = async (files) => {
-  const formData = new FormData();
-  for (const { file } of files) {
-    formData.append("files", file);
-  }
-  return sdk.admin.uploads.mutate({
-    fetchOptions: { body: formData }
-  });
-};
 
 export {
   sdk,
-  fetchQuery,
-  uploadFilesQuery
+  fetchQuery
 };

package/dist/{chunk-B2STTXQV.js → chunk-ML7UVBKL.js}

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

package/dist/{chunk-DAXXLQKB.js → chunk-MO7TNIVQ.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-ZA2KFUFR.js";
 import {
   sdk
-} from "./chunk-ZBWL72TB.js";
+} from "./chunk-LXZXXOJ3.js";
 
 // src/hooks/api/currencies.tsx
 import { useQuery } from "@tanstack/react-query";

package/dist/{chunk-I7L2Q6AL.js → chunk-MOG7LT73.js}

@@ -1,37 +1,33 @@
 import {
   PriceListCustomerGroupRuleForm
-} from "./chunk-HR7TFO2X.js";
+} from "./chunk-CHMIK6PK.js";
 import {
   PriceListCreateProductsSchema,
   PriceListRulesSchema,
   usePriceListCurrencyData,
   usePriceListGridColumns
-} from "./chunk-UXGLM3B4.js";
+} from "./chunk-NEGOGYEO.js";
 import {
   exctractPricesFromProducts,
   isProductRow
 } from "./chunk-U5MJIHLY.js";
 import {
   useProductTableColumns
-} from "./chunk-OMBP3YSV.js";
+} from "./chunk-OYZIFLLC.js";
 import {
   useProductTableFilters
-} from "./chunk-HJKZBCDB.js";
+} from "./chunk-4346EIRG.js";
 import {
   useProductTableQuery
-} from "./chunk-LYZDVZWA.js";
-import {
-  _DataTable,
-  useDataTable
-} from "./chunk-NQEXDLYH.js";
+} from "./chunk-H7NIKMPE.js";
 import {
   TabbedForm,
   defineTabMeta,
   useTabbedForm
-} from "./chunk-4LXBQTFN.js";
+} from "./chunk-FREUYHMS.js";
 import {
   DataGrid
-} from "./chunk-KT7X72J4.js";
+} from "./chunk-JXSXBSV6.js";
 import {
   RouteFocusModal,
   StackedFocusModal,
@@ -41,15 +37,19 @@ import {
 import {
   Form
 } from "./chunk-3QSRE5LS.js";
+import {
+  _DataTable,
+  useDataTable
+} from "./chunk-6ZVV2XHU.js";
 import {
   useCreatePriceList
-} from "./chunk-E5WBU7ZR.js";
+} from "./chunk-LSMTJU6Y.js";
 import {
   useDocumentDirection
 } from "./chunk-Y7QKP6QU.js";
 import {
   useProducts
-} from "./chunk-ZRFWXNT3.js";
+} from "./chunk-ZKHF75MZ.js";
 
 // src/pages/price-lists/price-list-create/components/price-list-create-form/schema.ts
 import { z } from "zod";

package/dist/{chunk-FEC24V7X.js → chunk-MW47LDBT.js}

@@ -1,6 +1,6 @@
 import {
   productsQueryKeys
-} from "./chunk-ZRFWXNT3.js";
+} from "./chunk-ZKHF75MZ.js";
 import {
   queryClient
 } from "./chunk-RHKRREUU.js";
@@ -9,7 +9,7 @@ import {
 } from "./chunk-ZA2KFUFR.js";
 import {
   sdk
-} from "./chunk-ZBWL72TB.js";
+} from "./chunk-LXZXXOJ3.js";
 
 // src/hooks/api/sales-channels.tsx
 import {

package/dist/{chunk-SONUZNDT.js → chunk-MZOINNCV.js}

@@ -1,6 +1,6 @@
 import {
   useDeletePriceListAction
-} from "./chunk-PR7Y27BW.js";
+} from "./chunk-QDUZCJ7F.js";
 import {
   getPriceListStatus
 } from "./chunk-U5MJIHLY.js";
@@ -14,7 +14,7 @@ import {
 import {
   _DataTable,
   useDataTable
-} from "./chunk-NQEXDLYH.js";
+} from "./chunk-6ZVV2XHU.js";
 import {
   SingleColumnPage
 } from "./chunk-H6MYB7GB.js";
@@ -23,7 +23,7 @@ import {
 } from "./chunk-THHRRYRS.js";
 import {
   usePriceLists
-} from "./chunk-E5WBU7ZR.js";
+} from "./chunk-LSMTJU6Y.js";
 import {
   ActionMenu
 } from "./chunk-BDGZ4EQO.js";

package/dist/{chunk-UXGLM3B4.js → chunk-NEGOGYEO.js}

@@ -5,19 +5,19 @@ import {
   DataGrid,
   createDataGridHelper,
   createDataGridPriceColumns
-} from "./chunk-KT7X72J4.js";
+} from "./chunk-JXSXBSV6.js";
 import {
   Thumbnail
 } from "./chunk-WIYFXWRI.js";
 import {
   useRegions
-} from "./chunk-ESPLVOFC.js";
+} from "./chunk-VHCDSNXF.js";
 import {
   useStore
-} from "./chunk-FXWKGNRV.js";
+} from "./chunk-EJY35WBK.js";
 import {
   usePricePreferences
-} from "./chunk-VDKOJ5WD.js";
+} from "./chunk-GYRTURN7.js";
 
 // src/pages/price-lists/common/hooks/use-price-list-currency-data.tsx
 var usePriceListCurrencyData = () => {

package/dist/{chunk-FGWD66ZZ.js → chunk-NISAIYSW.js}

@@ -1,25 +1,25 @@
 import {
   useDeleteProductTagAction
-} from "./chunk-OPX5O57R.js";
+} from "./chunk-QE4R2KT3.js";
 import {
   useProductTableColumns
-} from "./chunk-OMBP3YSV.js";
+} from "./chunk-OYZIFLLC.js";
 import {
   useProductTableFilters
-} from "./chunk-HJKZBCDB.js";
+} from "./chunk-4346EIRG.js";
 import {
   useProductTableQuery
-} from "./chunk-LYZDVZWA.js";
+} from "./chunk-H7NIKMPE.js";
 import {
   _DataTable,
   useDataTable
-} from "./chunk-NQEXDLYH.js";
+} from "./chunk-6ZVV2XHU.js";
 import {
   SingleColumnPage
 } from "./chunk-H6MYB7GB.js";
 import {
   useProductTag
-} from "./chunk-LYREZINJ.js";
+} from "./chunk-ABS7HMLY.js";
 import {
   ActionMenu
 } from "./chunk-BDGZ4EQO.js";
@@ -28,7 +28,7 @@ import {
 } from "./chunk-INNFZYX2.js";
 import {
   useProducts
-} from "./chunk-ZRFWXNT3.js";
+} from "./chunk-ZKHF75MZ.js";
 
 // src/pages/product-tags/product-tag-detail/product-tag-detail.tsx
 import { Children } from "react";

package/dist/{chunk-GP4J42UD.js → chunk-NOKCLBAL.js}

@@ -4,7 +4,7 @@ import {
 import {
   useDeleteUser,
   useUser
-} from "./chunk-GKGLVDDV.js";
+} from "./chunk-A2F5MDPU.js";
 import {
   ActionMenu
 } from "./chunk-BDGZ4EQO.js";

package/dist/{chunk-YNHS5G26.js → chunk-NQ2RDSI3.js}

@@ -4,13 +4,13 @@ import {
 import {
   taxRegionsQueryKeys,
   useTaxRegion
-} from "./chunk-LYD3C73Z.js";
+} from "./chunk-JI7HMGMO.js";
 import {
   queryClient
 } from "./chunk-RHKRREUU.js";
 import {
   sdk
-} from "./chunk-ZBWL72TB.js";
+} from "./chunk-LXZXXOJ3.js";
 
 // src/pages/tax-regions/tax-region-detail/breadcrumb.tsx
 import { jsx } from "react/jsx-runtime";

package/dist/{chunk-U4IQFWPI.js → chunk-NWSKT55Z.js}

@@ -4,14 +4,14 @@ import {
 import {
   useDeleteReturnReason,
   useReturnReasons
-} from "./chunk-2FGRDEAD.js";
+} from "./chunk-RQQ53CQJ.js";
 import {
   useReturnReasonTableQuery
-} from "./chunk-URZCZO6F.js";
+} from "./chunk-WKDHY2DJ.js";
 import {
   _DataTable,
   useDataTable
-} from "./chunk-NQEXDLYH.js";
+} from "./chunk-6ZVV2XHU.js";
 import {
   SingleColumnPage
 } from "./chunk-H6MYB7GB.js";