@mercurjs/vendor 2.0.0-canary.0

package/dist/[id]-RGDXOC7T.js

@@ -0,0 +1,499 @@
+import {
+  INVENTORY_DETAIL_FIELDS
+} from "./chunk-ZEKV7LGF.js";
+import "./chunk-FQERBIVS.js";
+import {
+  PlaceholderCell
+} from "./chunk-PHOCVOZ5.js";
+import {
+  _DataTable,
+  useDataTable
+} from "./chunk-WHTS4G5K.js";
+import "./chunk-LYUCDASZ.js";
+import "./chunk-KAZ5BYTQ.js";
+import "./chunk-3EF54XFY.js";
+import {
+  SectionRow
+} from "./chunk-4TLP3TAA.js";
+import {
+  getFormattedCountry
+} from "./chunk-W6Y3PPU5.js";
+import {
+  TwoColumnPage
+} from "./chunk-RM5RSDYP.js";
+import {
+  Thumbnail
+} from "./chunk-WIYFXWRI.js";
+import {
+  useQueryParams
+} from "./chunk-THHRRYRS.js";
+import {
+  ActionMenu
+} from "./chunk-BDGZ4EQO.js";
+import "./chunk-CFETU5BI.js";
+import "./chunk-JRTZWK77.js";
+import "./chunk-LAVHRER2.js";
+import "./chunk-Y7QKP6QU.js";
+import {
+  TwoColumnPageSkeleton
+} from "./chunk-INNFZYX2.js";
+import {
+  inventoryItemsQueryKeys,
+  useDeleteInventoryItemLevel,
+  useInventoryItem,
+  useInventoryItemLevels
+} from "./chunk-WPFTRRWV.js";
+import "./chunk-A5DJIOHN.js";
+import {
+  queryClient
+} from "./chunk-RHKRREUU.js";
+import "./chunk-ZA2KFUFR.js";
+import {
+  fetchQuery
+} from "./chunk-Y224F4UU.js";
+import "./chunk-PKBMQBKP.js";
+
+// src/pages/inventory/[id]/loader.tsx
+var inventoryDetailQuery = (id) => ({
+  queryKey: inventoryItemsQueryKeys.detail(id),
+  queryFn: async () => fetchQuery(
+    `/vendor/inventory-items/${id}?fields=${INVENTORY_DETAIL_FIELDS}`,
+    { method: "GET" }
+  )
+});
+var loader = async ({ params }) => {
+  const id = params.id;
+  const query = inventoryDetailQuery(id);
+  return queryClient.ensureQueryData(query);
+};
+
+// src/pages/inventory/[id]/inventory-detail-page.tsx
+import { Children } from "react";
+import { useLoaderData, useParams } from "react-router-dom";
+
+// src/pages/inventory/[id]/_components/inventory-item-attributes/attributes-section.tsx
+import { Container, Heading } from "@medusajs/ui";
+import { PencilSquare } from "@medusajs/icons";
+import { useTranslation } from "react-i18next";
+import { jsx, jsxs } from "react/jsx-runtime";
+var InventoryItemAttributeSection = ({
+  inventoryItem
+}) => {
+  const { t } = useTranslation();
+  return /* @__PURE__ */ jsxs(Container, { className: "divide-y p-0", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between px-6 py-4", children: [
+      /* @__PURE__ */ jsx(Heading, { level: "h2", children: t("products.attributes") }),
+      /* @__PURE__ */ jsx(
+        ActionMenu,
+        {
+          groups: [
+            {
+              actions: [
+                {
+                  label: t("actions.edit"),
+                  to: "attributes",
+                  icon: /* @__PURE__ */ jsx(PencilSquare, {})
+                }
+              ]
+            }
+          ]
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx(SectionRow, { title: t("fields.height"), value: inventoryItem.height }),
+    /* @__PURE__ */ jsx(SectionRow, { title: t("fields.width"), value: inventoryItem.width }),
+    /* @__PURE__ */ jsx(SectionRow, { title: t("fields.length"), value: inventoryItem.length }),
+    /* @__PURE__ */ jsx(SectionRow, { title: t("fields.weight"), value: inventoryItem.weight }),
+    /* @__PURE__ */ jsx(SectionRow, { title: t("fields.midCode"), value: inventoryItem.mid_code }),
+    /* @__PURE__ */ jsx(SectionRow, { title: t("fields.hsCode"), value: inventoryItem.hs_code }),
+    /* @__PURE__ */ jsx(
+      SectionRow,
+      {
+        title: t("fields.countryOfOrigin"),
+        value: getFormattedCountry(inventoryItem.origin_country)
+      }
+    )
+  ] });
+};
+
+// src/pages/inventory/[id]/_components/inventory-item-general-section.tsx
+import { Container as Container2, Heading as Heading2 } from "@medusajs/ui";
+import { PencilSquare as PencilSquare2 } from "@medusajs/icons";
+import { useTranslation as useTranslation2 } from "react-i18next";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var InventoryItemGeneralSection = ({
+  inventoryItem
+}) => {
+  const { t } = useTranslation2();
+  const stockedQuantity = inventoryItem.location_levels?.reduce(
+    (acc, level) => acc + level.stocked_quantity,
+    0
+  ) || 0;
+  const reservedQuantity = inventoryItem.location_levels?.reduce(
+    (acc, level) => acc + level.reserved_quantity,
+    0
+  ) || 0;
+  const availableQuantity = stockedQuantity - reservedQuantity;
+  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__ */ jsxs2(Heading2, { children: [
+        inventoryItem.title ?? inventoryItem.sku,
+        " ",
+        t("fields.details")
+      ] }),
+      /* @__PURE__ */ jsx2(
+        ActionMenu,
+        {
+          groups: [
+            {
+              actions: [
+                {
+                  icon: /* @__PURE__ */ jsx2(PencilSquare2, {}),
+                  label: t("actions.edit"),
+                  to: "edit"
+                }
+              ]
+            }
+          ]
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx2(SectionRow, { title: t("fields.sku"), value: inventoryItem.sku ?? "-" }),
+    /* @__PURE__ */ jsx2(
+      SectionRow,
+      {
+        title: t("fields.inStock"),
+        value: getQuantityFormat(
+          stockedQuantity,
+          inventoryItem.location_levels?.length
+        )
+      }
+    ),
+    /* @__PURE__ */ jsx2(
+      SectionRow,
+      {
+        title: t("inventory.reserved"),
+        value: getQuantityFormat(
+          reservedQuantity,
+          inventoryItem.location_levels?.length
+        )
+      }
+    ),
+    /* @__PURE__ */ jsx2(
+      SectionRow,
+      {
+        title: t("inventory.available"),
+        value: getQuantityFormat(
+          availableQuantity,
+          inventoryItem.location_levels?.length
+        )
+      }
+    )
+  ] });
+};
+var getQuantityFormat = (quantity, locations) => {
+  if (quantity !== void 0 && !isNaN(quantity)) {
+    return `${quantity} across ${locations ?? "-"} locations`;
+  }
+  return "-";
+};
+
+// src/pages/inventory/[id]/_components/inventory-item-location-levels.tsx
+import { Button, Container as Container3, Heading as Heading3 } from "@medusajs/ui";
+import { useTranslation as useTranslation5 } from "react-i18next";
+import { Link } from "react-router-dom";
+
+// src/pages/inventory/[id]/_components/location-levels-table/use-location-list-table-columns.tsx
+import { createColumnHelper } from "@tanstack/react-table";
+import { useMemo } from "react";
+import { useTranslation as useTranslation4 } from "react-i18next";
+
+// src/pages/inventory/[id]/_components/location-levels-table/location-actions.tsx
+import { PencilSquare as PencilSquare3, Trash } from "@medusajs/icons";
+import { usePrompt } from "@medusajs/ui";
+import { useTranslation as useTranslation3 } from "react-i18next";
+import { jsx as jsx3 } from "react/jsx-runtime";
+var LocationActions = ({
+  level
+}) => {
+  const { t } = useTranslation3();
+  const prompt = usePrompt();
+  const { mutateAsync } = useDeleteInventoryItemLevel(
+    level.inventory_item_id,
+    level.location_id
+  );
+  const handleDelete = async () => {
+    const res = await prompt({
+      title: t("general.areYouSure"),
+      description: t("inventory.deleteWarning"),
+      confirmText: t("actions.delete"),
+      cancelText: t("actions.cancel")
+    });
+    if (!res) {
+      return;
+    }
+    await mutateAsync();
+  };
+  return /* @__PURE__ */ jsx3(
+    ActionMenu,
+    {
+      groups: [
+        {
+          actions: [
+            {
+              icon: /* @__PURE__ */ jsx3(PencilSquare3, {}),
+              label: t("actions.edit"),
+              to: `locations/${level.location_id}`
+            }
+          ]
+        },
+        {
+          actions: [
+            {
+              icon: /* @__PURE__ */ jsx3(Trash, {}),
+              label: t("actions.delete"),
+              onClick: handleDelete,
+              disabled: level.reserved_quantity > 0 || level.stocked_quantity > 0
+            }
+          ]
+        }
+      ]
+    }
+  );
+};
+
+// src/pages/inventory/[id]/_components/location-levels-table/use-location-list-table-columns.tsx
+import { jsx as jsx4 } from "react/jsx-runtime";
+var columnHelper = createColumnHelper();
+var useLocationListTableColumns = () => {
+  const { t } = useTranslation4();
+  return useMemo(
+    () => [
+      columnHelper.display({
+        id: "location",
+        header: t("fields.location"),
+        cell: ({ row }) => {
+          const locationName = row.original.stock_locations?.map((location) => location.name).join(", ");
+          if (!locationName) {
+            return /* @__PURE__ */ jsx4(PlaceholderCell, {});
+          }
+          return /* @__PURE__ */ jsx4("div", { className: "flex size-full items-center overflow-hidden", children: /* @__PURE__ */ jsx4("span", { className: "truncate", children: locationName.toString() }) });
+        }
+      }),
+      columnHelper.accessor("reserved_quantity", {
+        header: t("inventory.reserved"),
+        cell: ({ getValue }) => {
+          const quantity = getValue();
+          if (Number.isNaN(quantity)) {
+            return /* @__PURE__ */ jsx4(PlaceholderCell, {});
+          }
+          return /* @__PURE__ */ jsx4("div", { className: "flex size-full items-center overflow-hidden", children: /* @__PURE__ */ jsx4("span", { className: "truncate", children: quantity }) });
+        }
+      }),
+      columnHelper.accessor("stocked_quantity", {
+        header: t("fields.inStock"),
+        cell: ({ getValue }) => {
+          const stockedQuantity = getValue();
+          if (Number.isNaN(stockedQuantity)) {
+            return /* @__PURE__ */ jsx4(PlaceholderCell, {});
+          }
+          return /* @__PURE__ */ jsx4("div", { className: "flex size-full items-center overflow-hidden", children: /* @__PURE__ */ jsx4("span", { className: "truncate", children: stockedQuantity }) });
+        }
+      }),
+      columnHelper.accessor("available_quantity", {
+        header: t("inventory.available"),
+        cell: ({ getValue }) => {
+          const availableQuantity = getValue();
+          if (Number.isNaN(availableQuantity)) {
+            return /* @__PURE__ */ jsx4(PlaceholderCell, {});
+          }
+          return /* @__PURE__ */ jsx4("div", { className: "flex size-full items-center overflow-hidden", children: /* @__PURE__ */ jsx4("span", { className: "truncate", children: availableQuantity }) });
+        }
+      }),
+      columnHelper.display({
+        id: "actions",
+        cell: ({ row }) => /* @__PURE__ */ jsx4(LocationActions, { level: row.original })
+      })
+    ],
+    [t]
+  );
+};
+
+// src/pages/inventory/[id]/_components/location-levels-table/use-location-list-table-query.tsx
+var useLocationLevelTableQuery = ({
+  pageSize = 20,
+  prefix
+}) => {
+  const raw = useQueryParams(
+    [
+      "id",
+      "location_id",
+      "stocked_quantity",
+      "reserved_quantity",
+      "incoming_quantity",
+      "available_quantity",
+      "*stock_locations"
+    ],
+    prefix
+  );
+  const { reserved_quantity, stocked_quantity, available_quantity, ...params } = raw;
+  const searchParams = {
+    limit: pageSize,
+    reserved_quantity: reserved_quantity ? JSON.parse(reserved_quantity) : void 0,
+    stocked_quantity: stocked_quantity ? JSON.parse(stocked_quantity) : void 0,
+    available_quantity: available_quantity ? JSON.parse(available_quantity) : void 0,
+    ...params
+  };
+  return {
+    searchParams,
+    raw
+  };
+};
+
+// src/pages/inventory/[id]/_components/location-levels-table/location-list-table.tsx
+import { jsx as jsx5 } from "react/jsx-runtime";
+var PAGE_SIZE = 20;
+var ItemLocationListTable = ({
+  inventory_item_id
+}) => {
+  const { searchParams, raw } = useLocationLevelTableQuery({
+    pageSize: PAGE_SIZE
+  });
+  const { inventory_levels, count, isLoading } = useInventoryItemLevels(
+    inventory_item_id,
+    {
+      ...searchParams,
+      fields: "*stock_locations"
+    }
+  );
+  const columns = useLocationListTableColumns();
+  const filteredLocationLevels = inventory_levels?.filter(
+    (level) => level.stock_locations.length > 0
+  );
+  const { table } = useDataTable({
+    data: filteredLocationLevels ?? [],
+    columns,
+    count,
+    enablePagination: true,
+    getRowId: (row) => row.id,
+    pageSize: PAGE_SIZE
+  });
+  return /* @__PURE__ */ jsx5(
+    _DataTable,
+    {
+      table,
+      columns,
+      pageSize: PAGE_SIZE,
+      count: filteredLocationLevels?.length,
+      isLoading,
+      pagination: true,
+      queryObject: raw
+    }
+  );
+};
+
+// src/pages/inventory/[id]/_components/inventory-item-location-levels.tsx
+import { jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
+var InventoryItemLocationLevelsSection = ({
+  inventoryItem
+}) => {
+  const { t } = useTranslation5();
+  return /* @__PURE__ */ jsxs3(Container3, { className: "divide-y p-0", children: [
+    /* @__PURE__ */ jsxs3("div", { className: "flex items-center justify-between px-6 py-4", children: [
+      /* @__PURE__ */ jsx6(Heading3, { children: t("inventory.locationLevels") }),
+      /* @__PURE__ */ jsx6(Button, { size: "small", variant: "secondary", asChild: true, children: /* @__PURE__ */ jsx6(Link, { to: "locations", children: t("inventory.manageLocations") }) })
+    ] }),
+    /* @__PURE__ */ jsx6(ItemLocationListTable, { inventory_item_id: inventoryItem.id })
+  ] });
+};
+
+// src/pages/inventory/[id]/_components/inventory-item-variants/variants-section.tsx
+import { TriangleRightMini } from "@medusajs/icons";
+import { Container as Container4, Heading as Heading4 } from "@medusajs/ui";
+import { useTranslation as useTranslation6 } from "react-i18next";
+import { Link as Link2 } from "react-router-dom";
+import { jsx as jsx7, jsxs as jsxs4 } from "react/jsx-runtime";
+var InventoryItemVariantsSection = ({
+  variants
+}) => {
+  const { t } = useTranslation6();
+  if (!variants?.length) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxs4(Container4, { className: "p-0", children: [
+    /* @__PURE__ */ jsx7("div", { className: "flex items-center justify-between px-6 py-4", children: /* @__PURE__ */ jsx7(Heading4, { level: "h2", children: t("inventory.associatedVariants") }) }),
+    /* @__PURE__ */ jsx7("div", { className: "txt-small flex flex-col gap-2 px-2 pb-2", children: variants.map((variant) => {
+      const link = variant.product ? `/products/${variant.product.id}/variants/${variant.id}` : null;
+      const Inner = /* @__PURE__ */ jsx7("div", { className: "shadow-elevation-card-rest bg-ui-bg-component rounded-md px-4 py-2 transition-colors", children: /* @__PURE__ */ jsxs4("div", { className: "flex items-center gap-3", children: [
+        /* @__PURE__ */ jsx7("div", { className: "shadow-elevation-card-rest rounded-md", children: /* @__PURE__ */ jsx7(Thumbnail, { src: variant.product?.thumbnail }) }),
+        /* @__PURE__ */ jsxs4("div", { className: "flex flex-1 flex-col", children: [
+          /* @__PURE__ */ jsx7("span", { className: "text-ui-fg-base font-medium", children: variant.title }),
+          /* @__PURE__ */ jsx7("span", { className: "text-ui-fg-subtle", children: variant.options.map((o) => o.value).join(" \u22C5 ") })
+        ] }),
+        /* @__PURE__ */ jsx7("div", { className: "size-7 flex items-center justify-center", children: /* @__PURE__ */ jsx7(TriangleRightMini, { className: "text-ui-fg-muted" }) })
+      ] }) });
+      if (!link) {
+        return /* @__PURE__ */ jsx7("div", { children: Inner }, variant.id);
+      }
+      return /* @__PURE__ */ jsx7(
+        Link2,
+        {
+          to: link,
+          className: "outline-none focus-within:shadow-borders-interactive-with-focus rounded-md [&:hover>div]:bg-ui-bg-component-hover",
+          children: Inner
+        },
+        variant.id
+      );
+    }) })
+  ] });
+};
+
+// src/pages/inventory/[id]/inventory-detail-page.tsx
+import { Fragment, jsx as jsx8, jsxs as jsxs5 } from "react/jsx-runtime";
+var Root = ({ children }) => {
+  const { id } = useParams();
+  const initialData = useLoaderData();
+  const { inventory_item, isPending: isLoading } = useInventoryItem(
+    id,
+    { fields: INVENTORY_DETAIL_FIELDS },
+    { initialData }
+  );
+  if (isLoading || !inventory_item) {
+    return /* @__PURE__ */ jsx8(
+      TwoColumnPageSkeleton,
+      {
+        showJSON: true,
+        mainSections: 3,
+        sidebarSections: 2,
+        showMetadata: true
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx8(Fragment, { children: Children.count(children) > 0 ? children : /* @__PURE__ */ jsxs5(TwoColumnPage, { data: inventory_item, children: [
+    /* @__PURE__ */ jsxs5(TwoColumnPage.Main, { children: [
+      /* @__PURE__ */ jsx8(InventoryItemGeneralSection, { inventoryItem: inventory_item }),
+      /* @__PURE__ */ jsx8(InventoryItemLocationLevelsSection, { inventoryItem: inventory_item })
+    ] }),
+    /* @__PURE__ */ jsxs5(TwoColumnPage.Sidebar, { children: [
+      /* @__PURE__ */ jsx8(
+        InventoryItemVariantsSection,
+        {
+          variants: inventory_item.variants
+        }
+      ),
+      /* @__PURE__ */ jsx8(InventoryItemAttributeSection, { inventoryItem: inventory_item })
+    ] })
+  ] }) });
+};
+var InventoryDetailPage = Object.assign(Root, {
+  Main: TwoColumnPage.Main,
+  Sidebar: TwoColumnPage.Sidebar,
+  MainGeneralSection: InventoryItemGeneralSection,
+  MainLocationLevelsSection: InventoryItemLocationLevelsSection,
+  SidebarVariantsSection: InventoryItemVariantsSection,
+  SidebarAttributeSection: InventoryItemAttributeSection
+});
+export {
+  InventoryDetailPage,
+  loader
+};