@mercurjs/vendor 2.2.1 → 2.3.0-canary.1

package/dist/[id]-6FEVCKQU.js

@@ -0,0 +1,949 @@
+import {
+  INVENTORY_DETAIL_FIELDS
+} from "./chunk-VV2K3EBF.js";
+import {
+  TextCell,
+  TextHeader
+} from "./chunk-JHIMVLB2.js";
+import {
+  getFormattedCountry
+} from "./chunk-W6Y3PPU5.js";
+import "./chunk-JRTZWK77.js";
+import {
+  PlaceholderCell
+} from "./chunk-PHOCVOZ5.js";
+import {
+  SectionRow
+} from "./chunk-4TLP3TAA.js";
+import {
+  SidebarLink
+} from "./chunk-UST2RGWB.js";
+import "./chunk-U2EI2ZLM.js";
+import {
+  TwoColumnPage
+} from "./chunk-YV6MK4PZ.js";
+import "./chunk-FQERBIVS.js";
+import {
+  _DataTable,
+  useDataTable
+} from "./chunk-6GQLSWOO.js";
+import "./chunk-YN3FGNJM.js";
+import "./chunk-KCHYLLVG.js";
+import "./chunk-3EF54XFY.js";
+import {
+  useQueryParams
+} from "./chunk-THHRRYRS.js";
+import {
+  useDate
+} from "./chunk-LRD242C7.js";
+import {
+  Thumbnail
+} from "./chunk-WIYFXWRI.js";
+import {
+  TwoColumnPageSkeleton
+} from "./chunk-INNFZYX2.js";
+import {
+  ActionMenu
+} from "./chunk-BDGZ4EQO.js";
+import "./chunk-LAVHRER2.js";
+import "./chunk-QHQWEERJ.js";
+import "./chunk-Y7QKP6QU.js";
+import "./chunk-6YQR2AWM.js";
+import "./chunk-K5324KIX.js";
+import "./chunk-FV76G2D7.js";
+import "./chunk-GHDLST2P.js";
+import "./chunk-YVYYOBAE.js";
+import "./chunk-L2NJPDUD.js";
+import "./chunk-7LIENHWP.js";
+import "./chunk-NV2RZAHW.js";
+import "./chunk-MR6REQKT.js";
+import "./chunk-EPSDO2MJ.js";
+import "./chunk-BHEU34FL.js";
+import "./chunk-W34KDYZA.js";
+import "./chunk-II3CLUXA.js";
+import "./chunk-OCYVN77Z.js";
+import "./chunk-J2XUEO2E.js";
+import "./chunk-DETQ6IBQ.js";
+import "./chunk-VWPNMEOE.js";
+import {
+  useStockLocations
+} from "./chunk-O72AIZUN.js";
+import "./chunk-GL3XVUAY.js";
+import "./chunk-AHR2FIMC.js";
+import "./chunk-JYUHDM23.js";
+import {
+  useDeleteReservationItem,
+  useReservationItems
+} from "./chunk-7POOMBIN.js";
+import "./chunk-4U2BLH45.js";
+import {
+  inventoryItemsQueryKeys,
+  useDeleteInventoryItemLevel,
+  useInventoryItem,
+  useInventoryItemLevels
+} from "./chunk-EMUCGKHP.js";
+import "./chunk-A5DJIOHN.js";
+import {
+  queryClient
+} from "./chunk-RHKRREUU.js";
+import "./chunk-ZA2KFUFR.js";
+import {
+  fetchQuery
+} from "./chunk-DTGEFKK4.js";
+import "./chunk-NBMM2TZK.js";
+
+// src/pages/inventory/[id]/loader.tsx
+import { getLinkQuery } from "@mercurjs/dashboard-shared";
+var inventoryDetailQuery = (id) => {
+  const query = getLinkQuery("inventory_item", INVENTORY_DETAIL_FIELDS);
+  return {
+    queryKey: inventoryItemsQueryKeys.detail(id, query),
+    queryFn: async () => fetchQuery(
+      `/vendor/inventory-items/${id}?fields=${query.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";
+import { useLinkQuery, WidgetZone } from "@mercurjs/dashboard-shared";
+
+// src/pages/inventory/[id]/_components/inventory-item-attributes/attributes-section.tsx
+import { Container, Heading } from "@medusajs/ui";
+import { DisplayExtensionZone } from "@mercurjs/dashboard-shared";
+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.material"), value: inventoryItem.material }),
+    /* @__PURE__ */ jsx(
+      SectionRow,
+      {
+        title: t("fields.countryOfOrigin"),
+        value: getFormattedCountry(inventoryItem.origin_country)
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      DisplayExtensionZone,
+      {
+        model: "inventory_item",
+        zone: "attributes",
+        data: inventoryItem
+      }
+    )
+  ] });
+};
+
+// 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 { DisplayExtensionZone as DisplayExtensionZone2, DisplayField } from "@mercurjs/dashboard-shared";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var GENERAL_FIELD_IDS = ["title", "sku", "in_stock", "reserved", "available"];
+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;
+  const getQuantityFormat = (quantity) => {
+    if (quantity !== void 0 && !isNaN(quantity)) {
+      return t("inventory.quantityAcrossLocations", {
+        quantity,
+        locations: inventoryItem.location_levels?.length ?? "-"
+      });
+    }
+    return "-";
+  };
+  return /* @__PURE__ */ jsxs2(
+    Container2,
+    {
+      className: "divide-y p-0",
+      "data-testid": "inventory-item-general-section",
+      children: [
+        /* @__PURE__ */ jsxs2(
+          "div",
+          {
+            className: "flex items-center justify-between px-6 py-4",
+            "data-testid": "inventory-item-general-header",
+            children: [
+              /* @__PURE__ */ jsx2(
+                DisplayField,
+                {
+                  model: "inventory_item",
+                  zone: "general",
+                  id: "title",
+                  data: inventoryItem,
+                  children: /* @__PURE__ */ jsx2(Heading2, { "data-testid": "inventory-item-general-title", children: inventoryItem.title ?? inventoryItem.sku })
+                }
+              ),
+              /* @__PURE__ */ jsx2(
+                ActionMenu,
+                {
+                  groups: [
+                    {
+                      actions: [
+                        {
+                          icon: /* @__PURE__ */ jsx2(PencilSquare2, {}),
+                          label: t("actions.edit"),
+                          to: "edit"
+                        }
+                      ]
+                    }
+                  ],
+                  "data-testid": "inventory-item-general-action-menu"
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx2(
+          DisplayField,
+          {
+            model: "inventory_item",
+            zone: "general",
+            id: "sku",
+            data: inventoryItem,
+            children: /* @__PURE__ */ jsx2(SectionRow, { title: t("fields.sku"), value: inventoryItem.sku ?? "-" })
+          }
+        ),
+        /* @__PURE__ */ jsx2(
+          DisplayField,
+          {
+            model: "inventory_item",
+            zone: "general",
+            id: "in_stock",
+            data: inventoryItem,
+            children: /* @__PURE__ */ jsx2(
+              SectionRow,
+              {
+                title: t("fields.inStock"),
+                value: getQuantityFormat(stockedQuantity)
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsx2(
+          DisplayField,
+          {
+            model: "inventory_item",
+            zone: "general",
+            id: "reserved",
+            data: inventoryItem,
+            children: /* @__PURE__ */ jsx2(
+              SectionRow,
+              {
+                title: t("inventory.reserved"),
+                value: getQuantityFormat(reservedQuantity)
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsx2(
+          DisplayField,
+          {
+            model: "inventory_item",
+            zone: "general",
+            id: "available",
+            data: inventoryItem,
+            children: /* @__PURE__ */ jsx2(
+              SectionRow,
+              {
+                title: t("inventory.available"),
+                value: getQuantityFormat(availableQuantity)
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsx2(
+          DisplayExtensionZone2,
+          {
+            model: "inventory_item",
+            zone: "general",
+            data: inventoryItem,
+            builtInFieldIds: GENERAL_FIELD_IDS
+          }
+        )
+      ]
+    }
+  );
+};
+
+// src/pages/inventory/[id]/_components/inventory-item-location-levels.tsx
+import { Button, Container as Container3, Heading as Heading3 } from "@medusajs/ui";
+import { useTranslation as useTranslation6 } from "react-i18next";
+import { Link } from "react-router-dom";
+import { DisplayExtensionZone as DisplayExtensionZone3 } from "@mercurjs/dashboard-shared";
+
+// 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 { toast, 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 locationName = level.stock_locations?.map((location) => location.name).join(", ") ?? "";
+  const handleDelete = async () => {
+    const res = await prompt({
+      title: t("inventory.level.deleteTitle"),
+      description: t("inventory.level.deleteDescription", {
+        location: locationName
+      }),
+      confirmText: t("actions.delete"),
+      cancelText: t("actions.cancel")
+    });
+    if (!res) {
+      return;
+    }
+    await mutateAsync(void 0, {
+      onSuccess: () => toast.success(t("inventory.levelDeleted")),
+      onError: (e) => toast.error(e.message)
+    });
+  };
+  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("div", { className: "flex w-full items-center justify-end", children: /* @__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 { useTranslation as useTranslation5 } from "react-i18next";
+import { jsx as jsx5 } from "react/jsx-runtime";
+var PAGE_SIZE = 20;
+var ItemLocationListTable = ({
+  inventory_item_id
+}) => {
+  const { t } = useTranslation5();
+  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,
+      noRecords: {
+        title: t("inventory.locations.noRecordsTitle"),
+        message: t("inventory.locations.noRecordsMessage")
+      }
+    }
+  );
+};
+
+// 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 } = useTranslation6();
+  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 }),
+    /* @__PURE__ */ jsx6(
+      DisplayExtensionZone3,
+      {
+        model: "inventory_item",
+        zone: "locations",
+        data: inventoryItem
+      }
+    )
+  ] });
+};
+
+// src/pages/inventory/[id]/_components/inventory-item-reservations.tsx
+import { Button as Button2, Container as Container4, Heading as Heading4 } from "@medusajs/ui";
+import { DisplayExtensionZone as DisplayExtensionZone4 } from "@mercurjs/dashboard-shared";
+import { useTranslation as useTranslation11 } from "react-i18next";
+import { Link as Link2 } from "react-router-dom";
+
+// src/pages/inventory/[id]/_components/reservations-table/reservation-list-table.tsx
+import { useMemo as useMemo3 } from "react";
+import { useTranslation as useTranslation10 } from "react-i18next";
+
+// src/pages/inventory/[id]/_components/reservations-table/use-reservation-list-table-columns.tsx
+import { createColumnHelper as createColumnHelper2 } from "@tanstack/react-table";
+import { useMemo as useMemo2 } from "react";
+import { useTranslation as useTranslation9 } from "react-i18next";
+
+// src/components/table/table-cells/common/created-at-cell/created-at-cell.tsx
+import { Tooltip } from "@medusajs/ui";
+import { useTranslation as useTranslation7 } from "react-i18next";
+import { jsx as jsx7 } from "react/jsx-runtime";
+var CreatedAtCell = ({ date }) => {
+  const { getFullDate } = useDate();
+  if (!date) {
+    return /* @__PURE__ */ jsx7(PlaceholderCell, {});
+  }
+  return /* @__PURE__ */ jsx7("div", { className: "flex h-full w-full items-center overflow-hidden", children: /* @__PURE__ */ jsx7(
+    Tooltip,
+    {
+      className: "z-10",
+      content: /* @__PURE__ */ jsx7("span", { className: "text-pretty", children: `${getFullDate({
+        date,
+        includeTime: true
+      })}` }),
+      children: /* @__PURE__ */ jsx7("span", { className: "truncate", children: getFullDate({ date, includeTime: true }) })
+    }
+  ) });
+};
+
+// src/pages/inventory/[id]/_components/reservations-table/reservation-actions.tsx
+import { PencilSquare as PencilSquare4, Trash as Trash2 } from "@medusajs/icons";
+import { toast as toast2, usePrompt as usePrompt2 } from "@medusajs/ui";
+import { useTranslation as useTranslation8 } from "react-i18next";
+import { jsx as jsx8 } from "react/jsx-runtime";
+var ReservationActions = ({
+  reservation
+}) => {
+  const { t } = useTranslation8();
+  const prompt = usePrompt2();
+  const { mutateAsync } = useDeleteReservationItem(reservation.id);
+  const handleDelete = async () => {
+    if (reservation.line_item_id) {
+      await prompt({
+        title: t("inventory.reservation.deleteTitle"),
+        description: t("inventory.reservation.deleteBlockedDescription"),
+        confirmText: t("inventory.reservation.gotIt"),
+        cancelText: t("actions.cancel")
+      });
+      return;
+    }
+    const res = await prompt({
+      title: t("inventory.reservation.deleteTitle"),
+      description: t("inventory.reservation.deleteDescription"),
+      confirmText: t("actions.delete"),
+      cancelText: t("actions.cancel")
+    });
+    if (!res) {
+      return;
+    }
+    await mutateAsync(void 0, {
+      onSuccess: () => {
+        toast2.success(t("inventory.reservation.deleteSuccessToast"));
+      },
+      onError: (e) => {
+        toast2.error(e.message);
+      }
+    });
+  };
+  return /* @__PURE__ */ jsx8(
+    ActionMenu,
+    {
+      groups: [
+        {
+          actions: [
+            {
+              icon: /* @__PURE__ */ jsx8(PencilSquare4, {}),
+              label: t("actions.edit"),
+              to: `/reservations/${reservation.id}/edit`
+            }
+          ]
+        },
+        {
+          actions: [
+            {
+              icon: /* @__PURE__ */ jsx8(Trash2, {}),
+              label: t("actions.delete"),
+              onClick: handleDelete
+            }
+          ]
+        }
+      ],
+      "data-testid": `reservation-actions-${reservation.id}`
+    }
+  );
+};
+
+// src/pages/inventory/[id]/_components/reservations-table/use-reservation-list-table-columns.tsx
+import { jsx as jsx9 } from "react/jsx-runtime";
+var columnHelper2 = createColumnHelper2();
+var useReservationTableColumn = ({ sku }) => {
+  const { t } = useTranslation9();
+  return useMemo2(
+    () => [
+      columnHelper2.display({
+        id: "sku",
+        header: () => /* @__PURE__ */ jsx9(TextHeader, { text: t("fields.sku") }),
+        cell: () => {
+          return /* @__PURE__ */ jsx9(TextCell, { text: sku });
+        }
+      }),
+      columnHelper2.accessor("line_item.order_id", {
+        header: () => /* @__PURE__ */ jsx9(TextHeader, { text: t("inventory.reservation.orderID") }),
+        cell: ({ getValue }) => {
+          const orderId = getValue();
+          if (!orderId) {
+            return /* @__PURE__ */ jsx9(PlaceholderCell, {});
+          }
+          return /* @__PURE__ */ jsx9(TextCell, { text: orderId });
+        }
+      }),
+      columnHelper2.accessor("description", {
+        header: () => /* @__PURE__ */ jsx9(TextHeader, { text: t("fields.description") }),
+        cell: ({ getValue }) => {
+          const description = getValue();
+          if (!description) {
+            return /* @__PURE__ */ jsx9(PlaceholderCell, {});
+          }
+          return /* @__PURE__ */ jsx9(TextCell, { text: description });
+        }
+      }),
+      columnHelper2.accessor("location.name", {
+        header: () => /* @__PURE__ */ jsx9(TextHeader, { text: t("inventory.reservation.location") }),
+        cell: ({ getValue }) => {
+          const location = getValue();
+          if (!location) {
+            return /* @__PURE__ */ jsx9(PlaceholderCell, {});
+          }
+          return /* @__PURE__ */ jsx9(TextCell, { text: location });
+        }
+      }),
+      columnHelper2.accessor("created_at", {
+        header: () => /* @__PURE__ */ jsx9(TextHeader, { text: t("fields.createdAt") }),
+        cell: ({ getValue }) => /* @__PURE__ */ jsx9(CreatedAtCell, { date: getValue() })
+      }),
+      columnHelper2.accessor("quantity", {
+        header: () => /* @__PURE__ */ jsx9(TextHeader, { text: t("fields.quantity"), align: "right" }),
+        cell: ({ getValue }) => {
+          return /* @__PURE__ */ jsx9(TextCell, { text: getValue(), align: "right" });
+        }
+      }),
+      columnHelper2.display({
+        id: "actions",
+        cell: ({ row }) => /* @__PURE__ */ jsx9("div", { className: "flex w-full items-center justify-end", children: /* @__PURE__ */ jsx9(ReservationActions, { reservation: row.original }) })
+      })
+    ],
+    [t, sku]
+  );
+};
+
+// src/pages/inventory/[id]/_components/reservations-table/use-reservation-list-table-query.tsx
+var useReservationsTableQuery = ({
+  pageSize = 20,
+  prefix
+}) => {
+  const raw = useQueryParams(
+    [
+      "id",
+      "location_id",
+      "inventory_item_id",
+      "quantity",
+      "line_item_id",
+      "description",
+      "created_by"
+    ],
+    prefix
+  );
+  const { quantity, ...params } = raw;
+  const searchParams = {
+    limit: pageSize,
+    quantity: quantity ? JSON.parse(quantity) : void 0,
+    ...params
+  };
+  return {
+    searchParams,
+    raw
+  };
+};
+
+// src/pages/inventory/[id]/_components/reservations-table/reservation-list-table.tsx
+import { jsx as jsx10 } from "react/jsx-runtime";
+var PAGE_SIZE2 = 20;
+var ReservationItemTable = ({
+  inventoryItem
+}) => {
+  const { t } = useTranslation10();
+  const { searchParams, raw } = useReservationsTableQuery({
+    pageSize: PAGE_SIZE2
+  });
+  const { reservations, count, isPending } = useReservationItems({
+    ...searchParams,
+    fields: "+line_item.order_id",
+    inventory_item_id: [inventoryItem.id]
+  });
+  const { stock_locations } = useStockLocations({
+    id: (reservations || []).map((r) => r.location_id)
+  });
+  const data = useMemo3(() => {
+    const locationMap = new Map((stock_locations || []).map((l) => [l.id, l]));
+    return (reservations || []).map((r) => ({
+      ...r,
+      location: locationMap.get(r.location_id)
+    }));
+  }, [reservations, stock_locations]);
+  const columns = useReservationTableColumn({ sku: inventoryItem.sku });
+  const { table } = useDataTable({
+    data: data ?? [],
+    columns,
+    count,
+    enablePagination: true,
+    getRowId: (row) => row.id,
+    pageSize: PAGE_SIZE2
+  });
+  return /* @__PURE__ */ jsx10(
+    _DataTable,
+    {
+      table,
+      columns,
+      pageSize: PAGE_SIZE2,
+      count,
+      isLoading: isPending,
+      pagination: true,
+      queryObject: raw,
+      noRecords: {
+        title: t("inventory.reservations.noRecordsTitle"),
+        message: t("inventory.reservations.noRecordsMessage")
+      }
+    }
+  );
+};
+
+// src/pages/inventory/[id]/_components/inventory-item-reservations.tsx
+import { jsx as jsx11, jsxs as jsxs4 } from "react/jsx-runtime";
+var InventoryItemReservationsSection = ({
+  inventoryItem
+}) => {
+  const { t } = useTranslation11();
+  return /* @__PURE__ */ jsxs4(
+    Container4,
+    {
+      className: "divide-y p-0",
+      "data-testid": "inventory-item-reservations-section",
+      children: [
+        /* @__PURE__ */ jsxs4(
+          "div",
+          {
+            className: "flex items-center justify-between px-6 py-4",
+            "data-testid": "inventory-item-reservations-header",
+            children: [
+              /* @__PURE__ */ jsx11(Heading4, { "data-testid": "inventory-item-reservations-title", children: t("reservations.domain") }),
+              /* @__PURE__ */ jsx11(
+                Button2,
+                {
+                  size: "small",
+                  variant: "secondary",
+                  asChild: true,
+                  "data-testid": "inventory-create-reservation-button",
+                  children: /* @__PURE__ */ jsx11(Link2, { to: `/reservations/create?item_id=${inventoryItem.id}`, children: t("actions.create") })
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx11(ReservationItemTable, { inventoryItem }),
+        /* @__PURE__ */ jsx11(
+          DisplayExtensionZone4,
+          {
+            model: "inventory_item",
+            zone: "reservations",
+            data: inventoryItem
+          }
+        )
+      ]
+    }
+  );
+};
+
+// src/pages/inventory/[id]/_components/inventory-item-offers/associated-offers-section.tsx
+import { Container as Container5, Heading as Heading5 } from "@medusajs/ui";
+import { useTranslation as useTranslation12 } from "react-i18next";
+import { jsx as jsx12, jsxs as jsxs5 } from "react/jsx-runtime";
+var AssociatedOffersSection = ({
+  offers
+}) => {
+  const { t } = useTranslation12();
+  if (!offers?.length) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxs5(Container5, { className: "p-0", "data-testid": "inventory-item-offers-section", children: [
+    /* @__PURE__ */ jsx12("div", { className: "flex items-center justify-between px-6 py-4", children: /* @__PURE__ */ jsx12(Heading5, { level: "h2", "data-testid": "inventory-item-offers-title", children: t("inventory.associatedOffers") }) }),
+    offers.map((offer) => {
+      const variantTitle = offer.product_variant?.title;
+      const productTitle = offer.product_variant?.product?.title;
+      const label = variantTitle || offer.sku;
+      const description = [variantTitle, productTitle].filter(Boolean).join(" \xB7 ");
+      return /* @__PURE__ */ jsx12(
+        SidebarLink,
+        {
+          to: `/offers/${offer.product_id}/variants/${offer.id}`,
+          labelKey: label,
+          descriptionKey: description,
+          icon: /* @__PURE__ */ jsx12(
+            Thumbnail,
+            {
+              src: offer.product_variant?.product?.thumbnail ?? null
+            }
+          ),
+          dataTestid: `inventory-associated-offer-${offer.id}`
+        },
+        offer.id
+      );
+    })
+  ] });
+};
+
+// src/pages/inventory/[id]/inventory-detail-page.tsx
+import { Fragment, jsx as jsx13, jsxs as jsxs6 } from "react/jsx-runtime";
+var Root = ({ children }) => {
+  const { id } = useParams();
+  const initialData = useLoaderData();
+  const {
+    inventory_item,
+    isPending: isLoading,
+    isError,
+    error
+  } = useInventoryItem(
+    id,
+    useLinkQuery("inventory_item", INVENTORY_DETAIL_FIELDS),
+    { initialData }
+  );
+  if (isLoading || !inventory_item) {
+    return /* @__PURE__ */ jsx13(
+      TwoColumnPageSkeleton,
+      {
+        showJSON: true,
+        mainSections: 3,
+        sidebarSections: 2,
+        showMetadata: true
+      }
+    );
+  }
+  if (isError) {
+    throw error;
+  }
+  return /* @__PURE__ */ jsx13(Fragment, { children: Children.count(children) > 0 ? children : /* @__PURE__ */ jsxs6(TwoColumnPage, { data: inventory_item, showJSON: true, showMetadata: true, children: [
+    /* @__PURE__ */ jsx13(TwoColumnPage.Main, { children: /* @__PURE__ */ jsxs6(WidgetZone, { id: "inventory.detail.main", data: inventory_item, children: [
+      /* @__PURE__ */ jsx13(InventoryItemGeneralSection, { inventoryItem: inventory_item }),
+      /* @__PURE__ */ jsx13(
+        InventoryItemLocationLevelsSection,
+        {
+          inventoryItem: inventory_item
+        }
+      ),
+      /* @__PURE__ */ jsx13(
+        InventoryItemReservationsSection,
+        {
+          inventoryItem: inventory_item
+        }
+      )
+    ] }) }),
+    /* @__PURE__ */ jsx13(TwoColumnPage.Sidebar, { children: /* @__PURE__ */ jsxs6(WidgetZone, { id: "inventory.detail.side", data: inventory_item, children: [
+      /* @__PURE__ */ jsx13(
+        AssociatedOffersSection,
+        {
+          offers: inventory_item.offers
+        }
+      ),
+      /* @__PURE__ */ jsx13(
+        InventoryItemAttributeSection,
+        {
+          inventoryItem: inventory_item
+        }
+      )
+    ] }) })
+  ] }) });
+};
+var InventoryDetailPage = Object.assign(Root, {
+  Main: TwoColumnPage.Main,
+  Sidebar: TwoColumnPage.Sidebar,
+  MainGeneralSection: InventoryItemGeneralSection,
+  MainLocationLevelsSection: InventoryItemLocationLevelsSection,
+  MainReservationsSection: InventoryItemReservationsSection,
+  SidebarOffersSection: AssociatedOffersSection,
+  SidebarAttributeSection: InventoryItemAttributeSection
+});
+export {
+  InventoryDetailPage,
+  loader
+};