medusa-product-helper 0.0.4 → 0.0.7

package/.medusa/server/src/admin/index.mjs

@@ -1,61 +1,8 @@
-import { defineWidgetConfig } from "@medusajs/admin-sdk";
-import { useEffect, useState, useMemo, useRef } from "react";
 import { jsxs, jsx, Fragment } from "react/jsx-runtime";
+import { defineWidgetConfig } from "@medusajs/admin-sdk";
 import { Container, Heading, Badge, Text, Skeleton, InlineTip, Button, Switch, Textarea, Input, toast } from "@medusajs/ui";
+import { useState, useEffect, useMemo, useRef } from "react";
 import { useQuery, useQueryClient } from "@tanstack/react-query";
-const HideDefaultMetadataWidget = () => {
-  useEffect(() => {
-    const hideMetadataSection = () => {
-      const headings = document.querySelectorAll("h2");
-      headings.forEach((heading) => {
-        var _a;
-        if (((_a = heading.textContent) == null ? void 0 : _a.trim()) === "Metadata") {
-          let container = heading.parentElement;
-          while (container && container !== document.body) {
-            const hasContainerClass = container.classList.toString().includes("Container");
-            const isInSidebar = container.closest('[class*="Sidebar"]') || container.closest('[class*="sidebar"]');
-            if (hasContainerClass || isInSidebar) {
-              const editLink = container.querySelector('a[href*="metadata/edit"]');
-              const badge = container.querySelector('div[class*="Badge"]');
-              if (editLink && badge) {
-                container.style.display = "none";
-                container.setAttribute("data-metadata-hidden", "true");
-                return;
-              }
-            }
-            container = container.parentElement;
-          }
-        }
-      });
-    };
-    const runHide = () => {
-      setTimeout(hideMetadataSection, 100);
-    };
-    runHide();
-    const observer = new MutationObserver(() => {
-      const alreadyHidden = document.querySelector('[data-metadata-hidden="true"]');
-      if (!alreadyHidden) {
-        runHide();
-      }
-    });
-    observer.observe(document.body, {
-      childList: true,
-      subtree: true
-    });
-    return () => {
-      observer.disconnect();
-      const hidden = document.querySelector('[data-metadata-hidden="true"]');
-      if (hidden) {
-        hidden.style.display = "";
-        hidden.removeAttribute("data-metadata-hidden");
-      }
-    };
-  }, []);
-  return null;
-};
-defineWidgetConfig({
-  zone: "product.details.side.before"
-});
 const METADATA_FIELD_TYPES = ["number", "text", "file", "bool"];
 const VALID_FIELD_TYPES = new Set(METADATA_FIELD_TYPES);
 function normalizeMetadataDescriptors(input) {
@@ -77,10 +24,12 @@ function normalizeMetadataDescriptors(input) {
       continue;
     }
     const label = getNormalizedLabel(item.label);
+    const filterable = typeof item.filterable === "boolean" ? item.filterable : Boolean(item.filterable);
     normalized.push({
       key,
       type,
-      ...label ? { label } : {}
+      ...label ? { label } : {},
+      ...filterable ? { filterable: true } : {}
     });
     seenKeys.add(key);
   }
@@ -236,11 +185,11 @@ function isDeepEqual(a, b) {
 }
 const CONFIG_ENDPOINT = "/admin/product-metadata-config";
 const QUERY_KEY = ["medusa-product-helper", "metadata-config"];
-const useProductMetadataConfig = () => {
+const useMetadataConfig = (entity) => {
   return useQuery({
-    queryKey: QUERY_KEY,
+    queryKey: [...QUERY_KEY, entity],
     queryFn: async () => {
-      const response = await fetch(CONFIG_ENDPOINT, {
+      const response = await fetch(`${CONFIG_ENDPOINT}?entity=${entity}`, {
         credentials: "include"
       });
       if (!response.ok) {
@@ -252,9 +201,11 @@ const useProductMetadataConfig = () => {
     staleTime: 5 * 60 * 1e3
   });
 };
-const CONFIG_DOCS_URL = "https://docs.medusajs.com/admin/extension-points/widgets#product-details";
-const ProductMetadataTableWidget = ({ data }) => {
-  const { data: descriptors = [], isPending, isError } = useProductMetadataConfig();
+const useProductMetadataConfig = () => useMetadataConfig("product");
+const useCategoryMetadataConfig = () => useMetadataConfig("category");
+const CONFIG_DOCS_URL$1 = "https://docs.medusajs.com/admin/extension-points/widgets#product-category-details";
+const CategoryMetadataTableWidget = ({ data }) => {
+  const { data: descriptors = [], isPending, isError } = useCategoryMetadataConfig();
   const metadata = (data == null ? void 0 : data.metadata) ?? {};
   const [baselineMetadata, setBaselineMetadata] = useState(metadata);
   const queryClient = useQueryClient();
@@ -315,7 +266,7 @@ const ProductMetadataTableWidget = ({ data }) => {
         values,
         originalMetadata: baselineMetadata
       });
-      const response = await fetch(`/admin/products/${data.id}`, {
+      const response = await fetch(`/admin/product-categories/${data.id}`, {
         method: "POST",
         credentials: "include",
         headers: {
@@ -330,12 +281,12 @@ const ProductMetadataTableWidget = ({ data }) => {
         throw new Error((payload == null ? void 0 : payload.message) ?? "Unable to save metadata");
       }
       const updated = await response.json();
-      const nextMetadata = updated.product.metadata;
+      const nextMetadata = updated.product_category.metadata;
       setBaselineMetadata(nextMetadata);
       setValues(buildInitialFormState(descriptors, nextMetadata));
       toast.success("Metadata saved");
       await queryClient.invalidateQueries({
-        queryKey: ["products"]
+        queryKey: ["product-categories"]
       });
     } catch (error) {
       toast.error(error instanceof Error ? error.message : "Save failed");
@@ -364,7 +315,7 @@ const ProductMetadataTableWidget = ({ data }) => {
         "a",
         {
           className: "text-ui-fg-interactive underline",
-          href: CONFIG_DOCS_URL,
+          href: CONFIG_DOCS_URL$1,
           target: "_blank",
           rel: "noreferrer",
           children: "Learn how to configure it."
@@ -407,7 +358,7 @@ const ProductMetadataTableWidget = ({ data }) => {
             ),
             /* @__PURE__ */ jsx("td", { className: "align-top px-4 py-4", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-2", children: [
               /* @__PURE__ */ jsx(
-                ValueField,
+                ValueField$1,
                 {
                   descriptor,
                   value,
@@ -421,7 +372,7 @@ const ProductMetadataTableWidget = ({ data }) => {
         }) })
       ] }) }),
       /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-3 border-t border-ui-border-subtle pt-3 md:flex-row md:items-center md:justify-between", children: [
-        /* @__PURE__ */ jsx(Text, { className: "text-ui-fg-muted", children: "Changes are stored on the product metadata object. Clearing a field removes the corresponding key on save." }),
+        /* @__PURE__ */ jsx(Text, { className: "text-ui-fg-muted", children: "Changes are stored on the category metadata object. Clearing a field removes the corresponding key on save." }),
         /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-2", children: [
           /* @__PURE__ */ jsx(
             Button,
@@ -448,7 +399,7 @@ const ProductMetadataTableWidget = ({ data }) => {
     ] })
   ] });
 };
-const ValueField = ({
+const ValueField$1 = ({
   descriptor,
   value,
   onStringChange,
@@ -587,17 +538,599 @@ const ValueField = ({
   ] });
 };
 defineWidgetConfig({
-  zone: "product.details.after"
+  zone: "product_category.details.after"
 });
-const i18nTranslations0 = {};
-const widgetModule = { widgets: [
-  {
-    Component: HideDefaultMetadataWidget,
-    zone: ["product.details.side.before"]
-  },
-  {
-    Component: ProductMetadataTableWidget,
-    zone: ["product.details.after"]
+const HideCategoryDefaultMetadataWidget = () => {
+  useEffect(() => {
+    const hideMetadataSection = () => {
+      const headings = document.querySelectorAll("h2");
+      headings.forEach((heading) => {
+        var _a;
+        if (((_a = heading.textContent) == null ? void 0 : _a.trim()) === "Metadata") {
+          let container = heading.parentElement;
+          while (container && container !== document.body) {
+            const hasContainerClass = container.classList.toString().includes("Container");
+            const isInSidebar = container.closest('[class*="Sidebar"]') || container.closest('[class*="sidebar"]');
+            if (hasContainerClass || isInSidebar) {
+              const editLink = container.querySelector('a[href*="metadata/edit"]');
+              const badge = container.querySelector('div[class*="Badge"]');
+              if (editLink && badge) {
+                container.style.display = "none";
+                container.setAttribute("data-category-metadata-hidden", "true");
+                return;
+              }
+            }
+            container = container.parentElement;
+          }
+        }
+      });
+    };
+    const runHide = () => {
+      setTimeout(hideMetadataSection, 100);
+    };
+    runHide();
+    const observer = new MutationObserver(() => {
+      const alreadyHidden = document.querySelector(
+        '[data-category-metadata-hidden="true"]'
+      );
+      if (!alreadyHidden) {
+        runHide();
+      }
+    });
+    observer.observe(document.body, {
+      childList: true,
+      subtree: true
+    });
+    return () => {
+      observer.disconnect();
+      const hidden = document.querySelector(
+        '[data-category-metadata-hidden="true"]'
+      );
+      if (hidden) {
+        hidden.style.display = "";
+        hidden.removeAttribute("data-category-metadata-hidden");
+      }
+    };
+  }, []);
+  return null;
+};
+defineWidgetConfig({
+  zone: "product_category.details.side.before"
+});
+const HideDefaultMetadataWidget = () => {
+  useEffect(() => {
+    const hideMetadataSection = () => {
+      const headings = document.querySelectorAll("h2");
+      headings.forEach((heading) => {
+        var _a;
+        if (((_a = heading.textContent) == null ? void 0 : _a.trim()) === "Metadata") {
+          let container = heading.parentElement;
+          while (container && container !== document.body) {
+            const hasContainerClass = container.classList.toString().includes("Container");
+            const isInSidebar = container.closest('[class*="Sidebar"]') || container.closest('[class*="sidebar"]');
+            if (hasContainerClass || isInSidebar) {
+              const editLink = container.querySelector('a[href*="metadata/edit"]');
+              const badge = container.querySelector('div[class*="Badge"]');
+              if (editLink && badge) {
+                container.style.display = "none";
+                container.setAttribute("data-metadata-hidden", "true");
+                return;
+              }
+            }
+            container = container.parentElement;
+          }
+        }
+      });
+    };
+    const runHide = () => {
+      setTimeout(hideMetadataSection, 100);
+    };
+    runHide();
+    const observer = new MutationObserver(() => {
+      const alreadyHidden = document.querySelector('[data-metadata-hidden="true"]');
+      if (!alreadyHidden) {
+        runHide();
+      }
+    });
+    observer.observe(document.body, {
+      childList: true,
+      subtree: true
+    });
+    return () => {
+      observer.disconnect();
+      const hidden = document.querySelector('[data-metadata-hidden="true"]');
+      if (hidden) {
+        hidden.style.display = "";
+        hidden.removeAttribute("data-metadata-hidden");
+      }
+    };
+  }, []);
+  return null;
+};
+defineWidgetConfig({
+  zone: "product.details.side.before"
+});
+const CONFIG_DOCS_URL = "https://docs.medusajs.com/admin/extension-points/widgets#product-details";
+const ProductMetadataTableWidget = ({ data }) => {
+  const { data: descriptors = [], isPending, isError } = useProductMetadataConfig();
+  const metadata = (data == null ? void 0 : data.metadata) ?? {};
+  const [baselineMetadata, setBaselineMetadata] = useState(metadata);
+  const queryClient = useQueryClient();
+  useEffect(() => {
+    setBaselineMetadata(metadata);
+  }, [metadata]);
+  const initialState = useMemo(
+    () => buildInitialFormState(descriptors, baselineMetadata),
+    [descriptors, baselineMetadata]
+  );
+  const [values, setValues] = useState(
+    initialState
+  );
+  const [isSaving, setIsSaving] = useState(false);
+  useEffect(() => {
+    setValues(initialState);
+  }, [initialState]);
+  const errors = useMemo(() => {
+    return descriptors.reduce((acc, descriptor) => {
+      const error = validateValueForDescriptor(descriptor, values[descriptor.key]);
+      if (error) {
+        acc[descriptor.key] = error;
+      }
+      return acc;
+    }, {});
+  }, [descriptors, values]);
+  const hasErrors = Object.keys(errors).length > 0;
+  const isDirty = useMemo(() => {
+    return hasMetadataChanges({
+      descriptors,
+      values,
+      originalMetadata: baselineMetadata
+    });
+  }, [descriptors, values, baselineMetadata]);
+  const handleStringChange = (key, nextValue) => {
+    setValues((prev) => ({
+      ...prev,
+      [key]: nextValue
+    }));
+  };
+  const handleBooleanChange = (key, nextValue) => {
+    setValues((prev) => ({
+      ...prev,
+      [key]: nextValue
+    }));
+  };
+  const handleReset = () => {
+    setValues(initialState);
+  };
+  const handleSubmit = async () => {
+    if (!(data == null ? void 0 : data.id) || !descriptors.length) {
+      return;
+    }
+    setIsSaving(true);
+    try {
+      const metadataPayload = buildMetadataPayload({
+        descriptors,
+        values,
+        originalMetadata: baselineMetadata
+      });
+      const response = await fetch(`/admin/products/${data.id}`, {
+        method: "POST",
+        credentials: "include",
+        headers: {
+          "Content-Type": "application/json"
+        },
+        body: JSON.stringify({
+          metadata: metadataPayload
+        })
+      });
+      if (!response.ok) {
+        const payload = await response.json().catch(() => null);
+        throw new Error((payload == null ? void 0 : payload.message) ?? "Unable to save metadata");
+      }
+      const updated = await response.json();
+      const nextMetadata = updated.product.metadata;
+      setBaselineMetadata(nextMetadata);
+      setValues(buildInitialFormState(descriptors, nextMetadata));
+      toast.success("Metadata saved");
+      await queryClient.invalidateQueries({
+        queryKey: ["products"]
+      });
+    } catch (error) {
+      toast.error(error instanceof Error ? error.message : "Save failed");
+    } finally {
+      setIsSaving(false);
+    }
+  };
+  return /* @__PURE__ */ jsxs(Container, { className: "flex flex-col gap-y-4", children: [
+    /* @__PURE__ */ jsxs("header", { className: "flex flex-col gap-y-1", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-3", children: [
+        /* @__PURE__ */ jsx(Heading, { level: "h2", children: "Metadata" }),
+        /* @__PURE__ */ jsx(Badge, { size: "2xsmall", rounded: "full", children: descriptors.length })
+      ] }),
+      /* @__PURE__ */ jsx(Text, { className: "text-ui-fg-subtle", children: "Structured metadata mapped to the keys you configured in the plugin options." })
+    ] }),
+    isPending ? /* @__PURE__ */ jsx(Skeleton, { className: "h-[160px] w-full" }) : isError ? /* @__PURE__ */ jsxs(InlineTip, { variant: "error", label: "Configuration unavailable", children: [
+      "Unable to load metadata configuration for this plugin. Confirm that the plugin is registered with options in ",
+      /* @__PURE__ */ jsx("code", { children: "medusa-config.ts" }),
+      "."
+    ] }) : !descriptors.length ? /* @__PURE__ */ jsxs(InlineTip, { variant: "info", label: "No configured metadata keys", children: [
+      "Provide a ",
+      /* @__PURE__ */ jsx("code", { children: "metadataDescriptors" }),
+      " array in the plugin options to control which keys show up here.",
+      " ",
+      /* @__PURE__ */ jsx(
+        "a",
+        {
+          className: "text-ui-fg-interactive underline",
+          href: CONFIG_DOCS_URL,
+          target: "_blank",
+          rel: "noreferrer",
+          children: "Learn how to configure it."
+        }
+      )
+    ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx("div", { className: "overflow-hidden rounded-lg border border-ui-border-base", children: /* @__PURE__ */ jsxs("table", { className: "min-w-full divide-y divide-ui-border-base", children: [
+        /* @__PURE__ */ jsx("thead", { className: "bg-ui-bg-subtle", children: /* @__PURE__ */ jsxs("tr", { children: [
+          /* @__PURE__ */ jsx(
+            "th",
+            {
+              scope: "col",
+              className: "txt-compact-xsmall-plus text-left uppercase tracking-wide text-ui-fg-muted px-4 py-3",
+              children: "Label"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "th",
+            {
+              scope: "col",
+              className: "txt-compact-xsmall-plus text-left uppercase tracking-wide text-ui-fg-muted px-4 py-3",
+              children: "Value"
+            }
+          )
+        ] }) }),
+        /* @__PURE__ */ jsx("tbody", { className: "divide-y divide-ui-border-subtle bg-ui-bg-base", children: descriptors.map((descriptor) => {
+          const value = values[descriptor.key];
+          const error = errors[descriptor.key];
+          return /* @__PURE__ */ jsxs("tr", { children: [
+            /* @__PURE__ */ jsx(
+              "th",
+              {
+                scope: "row",
+                className: "txt-compact-medium text-ui-fg-base align-top px-4 py-4",
+                children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-1", children: [
+                  /* @__PURE__ */ jsx("span", { children: descriptor.label ?? descriptor.key }),
+                  /* @__PURE__ */ jsx("span", { className: "txt-compact-xsmall-plus text-ui-fg-muted uppercase tracking-wide", children: descriptor.type })
+                ] })
+              }
+            ),
+            /* @__PURE__ */ jsx("td", { className: "align-top px-4 py-4", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-2", children: [
+              /* @__PURE__ */ jsx(
+                ValueField,
+                {
+                  descriptor,
+                  value,
+                  onStringChange: handleStringChange,
+                  onBooleanChange: handleBooleanChange
+                }
+              ),
+              error && /* @__PURE__ */ jsx(Text, { className: "txt-compact-small text-ui-fg-error", children: error })
+            ] }) })
+          ] }, descriptor.key);
+        }) })
+      ] }) }),
+      /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-3 border-t border-ui-border-subtle pt-3 md:flex-row md:items-center md:justify-between", children: [
+        /* @__PURE__ */ jsx(Text, { className: "text-ui-fg-muted", children: "Changes are stored on the product metadata object. Clearing a field removes the corresponding key on save." }),
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-2", children: [
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              variant: "secondary",
+              size: "small",
+              disabled: !isDirty || isSaving,
+              onClick: handleReset,
+              children: "Reset"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              size: "small",
+              onClick: handleSubmit,
+              disabled: !isDirty || hasErrors || isSaving,
+              isLoading: isSaving,
+              children: "Save metadata"
+            }
+          )
+        ] })
+      ] })
+    ] })
+  ] });
+};
+const ValueField = ({
+  descriptor,
+  value,
+  onStringChange,
+  onBooleanChange
+}) => {
+  const fileInputRef = useRef(null);
+  const [isUploading, setIsUploading] = useState(false);
+  const handleFileUpload = async (event) => {
+    var _a;
+    const file = (_a = event.target.files) == null ? void 0 : _a[0];
+    if (!file) {
+      return;
+    }
+    setIsUploading(true);
+    try {
+      const formData = new FormData();
+      formData.append("files", file);
+      const response = await fetch("/admin/uploads", {
+        method: "POST",
+        credentials: "include",
+        body: formData
+      });
+      if (!response.ok) {
+        const payload = await response.json().catch(() => null);
+        throw new Error((payload == null ? void 0 : payload.message) ?? "File upload failed");
+      }
+      const result = await response.json();
+      if (result.files && result.files.length > 0) {
+        const uploadedFile = result.files[0];
+        const fileUrl = uploadedFile.url || uploadedFile.key;
+        if (fileUrl) {
+          onStringChange(descriptor.key, fileUrl);
+          toast.success("File uploaded successfully");
+        } else {
+          throw new Error("File upload succeeded but no URL returned");
+        }
+      } else {
+        throw new Error("File upload failed - no files returned");
+      }
+    } catch (error) {
+      toast.error(
+        error instanceof Error ? error.message : "Failed to upload file"
+      );
+    } finally {
+      setIsUploading(false);
+      if (fileInputRef.current) {
+        fileInputRef.current.value = "";
+      }
+    }
+  };
+  if (descriptor.type === "bool") {
+    return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-2", children: [
+      /* @__PURE__ */ jsx(
+        Switch,
+        {
+          checked: Boolean(value),
+          onCheckedChange: (checked) => onBooleanChange(descriptor.key, Boolean(checked)),
+          "aria-label": `Toggle ${descriptor.label ?? descriptor.key}`
+        }
+      ),
+      /* @__PURE__ */ jsx(Text, { className: "txt-compact-small text-ui-fg-muted", children: Boolean(value) ? "True" : "False" })
+    ] });
+  }
+  if (descriptor.type === "text") {
+    return /* @__PURE__ */ jsx(
+      Textarea,
+      {
+        value: value ?? "",
+        placeholder: "Enter text",
+        rows: 3,
+        onChange: (event) => onStringChange(descriptor.key, event.target.value)
+      }
+    );
+  }
+  if (descriptor.type === "number") {
+    return /* @__PURE__ */ jsx(
+      Input,
+      {
+        type: "text",
+        inputMode: "decimal",
+        placeholder: "0.00",
+        value: value ?? "",
+        onChange: (event) => onStringChange(descriptor.key, event.target.value)
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-2", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-2", children: [
+      /* @__PURE__ */ jsx(
+        Input,
+        {
+          type: "url",
+          placeholder: "https://example.com/file",
+          value: value ?? "",
+          onChange: (event) => onStringChange(descriptor.key, event.target.value),
+          className: "flex-1"
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          ref: fileInputRef,
+          type: "file",
+          className: "hidden",
+          onChange: handleFileUpload,
+          disabled: isUploading,
+          "aria-label": `Upload file for ${descriptor.label ?? descriptor.key}`
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          type: "button",
+          variant: "secondary",
+          size: "small",
+          onClick: () => {
+            var _a;
+            return (_a = fileInputRef.current) == null ? void 0 : _a.click();
+          },
+          disabled: isUploading,
+          isLoading: isUploading,
+          children: isUploading ? "Uploading..." : "Upload"
+        }
+      )
+    ] }),
+    typeof value === "string" && value && /* @__PURE__ */ jsx(
+      "a",
+      {
+        className: "txt-compact-small-plus text-ui-fg-interactive underline",
+        href: value,
+        target: "_blank",
+        rel: "noreferrer",
+        children: "View file"
+      }
+    )
+  ] });
+};
+defineWidgetConfig({
+  zone: "product.details.after"
+});
+const fetchJson = async (path) => {
+  const response = await fetch(path, {
+    credentials: "include"
+  });
+  const payload = await response.json().catch(() => null);
+  if (!response.ok) {
+    throw new Error(
+      (payload == null ? void 0 : payload.message) ?? "Unable to load wishlist statistics from the server"
+    );
+  }
+  return payload;
+};
+const ProductWishlistStatsWidget = ({ data }) => {
+  const productId = data == null ? void 0 : data.id;
+  const {
+    data: productStats,
+    isPending: isProductStatsPending,
+    isError: isProductStatsError,
+    error: productStatsError
+  } = useQuery({
+    queryKey: ["wishlist", "product", productId],
+    enabled: Boolean(productId),
+    queryFn: () => fetchJson(
+      `/admin/wishlist/stats?product_id=${productId}`
+    ),
+    refetchInterval: 6e4
+  });
+  const {
+    data: allStats,
+    isPending: isAllStatsPending,
+    isError: isAllStatsError,
+    error: allStatsError
+  } = useQuery({
+    queryKey: ["wishlist", "stats"],
+    queryFn: () => fetchJson("/admin/wishlist/stats"),
+    staleTime: 6e4
+  });
+  const topFive = useMemo(() => {
+    var _a;
+    if (!((_a = allStats == null ? void 0 : allStats.stats) == null ? void 0 : _a.length)) {
+      return [];
+    }
+    return [...allStats.stats].sort((a, b) => b.wishlist_count - a.wishlist_count).slice(0, 5);
+  }, [allStats]);
+  const productWishlistCount = (productStats == null ? void 0 : productStats.wishlist_count) ?? 0;
+  const productIsTopWishlisted = topFive.some(
+    (stat) => stat.product_id === productId
+  );
+  return /* @__PURE__ */ jsxs(Container, { className: "flex flex-col gap-y-4", children: [
+    /* @__PURE__ */ jsxs("header", { className: "flex flex-col gap-y-1", children: [
+      /* @__PURE__ */ jsx(Heading, { level: "h2", children: "Wishlist performance" }),
+      /* @__PURE__ */ jsx(Text, { className: "text-ui-fg-subtle", children: "Track how often this product appears in customer wishlists and see the current top performers." })
+    ] }),
+    !productId ? /* @__PURE__ */ jsx(InlineTip, { variant: "info", label: "Product not loaded yet", children: "Open a product detail record to view wishlist insights." }) : isProductStatsPending ? /* @__PURE__ */ jsx(Skeleton, { className: "h-[96px] w-full rounded-lg" }) : isProductStatsError ? /* @__PURE__ */ jsx(InlineTip, { variant: "error", label: "Unable to load product stats", children: productStatsError instanceof Error ? productStatsError.message : "Unknown error" }) : /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-2 rounded-lg border border-ui-border-base bg-ui-bg-base p-4", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-2", children: [
+        /* @__PURE__ */ jsx(Text, { className: "txt-compact-xsmall-plus uppercase tracking-wide text-ui-fg-muted", children: "This product" }),
+        productIsTopWishlisted && /* @__PURE__ */ jsx(Badge, { size: "2xsmall", rounded: "full", color: "green", children: "Top 5" })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-1", children: [
+        /* @__PURE__ */ jsx(Heading, { level: "h1", className: "text-[32px] leading-none", children: productWishlistCount }),
+        /* @__PURE__ */ jsx(Text, { className: "text-ui-fg-subtle", children: productWishlistCount === 1 ? "customer has saved this product." : "customers have saved this product." })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-3 rounded-lg border border-ui-border-base bg-ui-bg-subtle p-4", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-x-4", children: [
+        /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsx(Text, { className: "txt-compact-xsmall-plus uppercase tracking-wide text-ui-fg-muted", children: "Storewide insights" }),
+          /* @__PURE__ */ jsx(Heading, { level: "h3", children: "Top wishlisted products" })
+        ] }),
+        productId && /* @__PURE__ */ jsx(Badge, { size: "2xsmall", color: "grey", children: productIsTopWishlisted ? "In top 5" : "Not in top 5" })
+      ] }),
+      isAllStatsPending ? /* @__PURE__ */ jsx(Skeleton, { className: "h-[160px] w-full rounded-lg" }) : isAllStatsError ? /* @__PURE__ */ jsx(InlineTip, { variant: "error", label: "Unable to load storewide stats", children: allStatsError instanceof Error ? allStatsError.message : "Unknown error" }) : !topFive.length ? /* @__PURE__ */ jsx(InlineTip, { variant: "info", label: "No wishlist activity yet", children: "Customers have not saved any products to their wishlists yet. Once they do, the most popular products will show up here." }) : /* @__PURE__ */ jsx("div", { className: "overflow-hidden rounded-lg border border-ui-border-base bg-ui-bg-base", children: /* @__PURE__ */ jsxs("table", { className: "min-w-full divide-y divide-ui-border-base", children: [
+        /* @__PURE__ */ jsx("thead", { className: "bg-ui-bg-field", children: /* @__PURE__ */ jsxs("tr", { children: [
+          /* @__PURE__ */ jsx(
+            "th",
+            {
+              scope: "col",
+              className: "px-4 py-2 text-left text-[11px] font-semibold uppercase tracking-wide text-ui-fg-muted",
+              children: "#"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "th",
+            {
+              scope: "col",
+              className: "px-4 py-2 text-left text-[11px] font-semibold uppercase tracking-wide text-ui-fg-muted",
+              children: "Product ID"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "th",
+            {
+              scope: "col",
+              className: "px-4 py-2 text-right text-[11px] font-semibold uppercase tracking-wide text-ui-fg-muted",
+              children: "Wishlists"
+            }
+          )
+        ] }) }),
+        /* @__PURE__ */ jsx("tbody", { className: "divide-y divide-ui-border-subtle", children: topFive.map((stat, index) => /* @__PURE__ */ jsxs(
+          "tr",
+          {
+            className: stat.product_id === productId ? "bg-ui-bg-subtle" : "bg-ui-bg-base",
+            children: [
+              /* @__PURE__ */ jsxs("td", { className: "px-4 py-3 text-sm font-medium text-ui-fg-subtle", children: [
+                "#",
+                index + 1
+              ] }),
+              /* @__PURE__ */ jsx("td", { className: "px-4 py-3", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-2", children: [
+                /* @__PURE__ */ jsx(Text, { className: "font-mono text-sm", children: stat.product_id }),
+                stat.product_id === productId && /* @__PURE__ */ jsx(Badge, { size: "2xsmall", color: "green", children: "Current" })
+              ] }) }),
+              /* @__PURE__ */ jsx("td", { className: "px-4 py-3 text-right text-sm font-semibold", children: stat.wishlist_count.toLocaleString() })
+            ]
+          },
+          stat.product_id
+        )) })
+      ] }) })
+    ] })
+  ] });
+};
+defineWidgetConfig({
+  zone: "product.details.side.after"
+});
+const i18nTranslations0 = {};
+const widgetModule = { widgets: [
+  {
+    Component: CategoryMetadataTableWidget,
+    zone: ["product_category.details.after"]
+  },
+  {
+    Component: HideCategoryDefaultMetadataWidget,
+    zone: ["product_category.details.side.before"]
+  },
+  {
+    Component: HideDefaultMetadataWidget,
+    zone: ["product.details.side.before"]
+  },
+  {
+    Component: ProductMetadataTableWidget,
+    zone: ["product.details.after"]
+  },
+  {
+    Component: ProductWishlistStatsWidget,
+    zone: ["product.details.side.after"]
   }
 ] };
 const routeModule = {