@medusajs/dashboard 2.10.4-snapshot-20250922195925 → 2.10.4-snapshot-20250923121159

package/src/i18n/translations/$schema.json

@@ -5830,9 +5830,23 @@
           "properties": {
             "description": {
               "type": "string"
+            },
+            "noRecordsMessage": {
+              "type": "string"
+            },
+            "noRecordsMessageEmpty": {
+              "type": "string"
+            },
+            "noRecordsMessageFiltered": {
+              "type": "string"
             }
           },
-          "required": ["description"],
+          "required": [
+            "description",
+            "noRecordsMessage",
+            "noRecordsMessageEmpty",
+            "noRecordsMessageFiltered"
+          ],
           "additionalProperties": false
         },
         "create": {
@@ -5872,9 +5886,12 @@
           "properties": {
             "confirmation": {
               "type": "string"
+            },
+            "successToast": {
+              "type": "string"
             }
           },
-          "required": ["confirmation"],
+          "required": ["confirmation", "successToast"],
           "additionalProperties": false
         },
         "fulfillmentProviders": {
@@ -10202,115 +10219,6 @@
       ],
       "additionalProperties": false
     },
-    "refundReasons": {
-      "type": "object",
-      "properties": {
-        "domain": {
-          "type": "string"
-        },
-        "subtitle": {
-          "type": "string"
-        },
-        "calloutHint": {
-          "type": "string"
-        },
-        "editReason": {
-          "type": "string"
-        },
-        "create": {
-          "type": "object",
-          "properties": {
-            "header": {
-              "type": "string"
-            },
-            "subtitle": {
-              "type": "string"
-            },
-            "hint": {
-              "type": "string"
-            },
-            "successToast": {
-              "type": "string"
-            }
-          },
-          "required": ["header", "subtitle", "hint", "successToast"],
-          "additionalProperties": false
-        },
-        "edit": {
-          "type": "object",
-          "properties": {
-            "header": {
-              "type": "string"
-            },
-            "subtitle": {
-              "type": "string"
-            },
-            "successToast": {
-              "type": "string"
-            }
-          },
-          "required": ["header", "subtitle", "successToast"],
-          "additionalProperties": false
-        },
-        "delete": {
-          "type": "object",
-          "properties": {
-            "confirmation": {
-              "type": "string"
-            },
-            "successToast": {
-              "type": "string"
-            }
-          },
-          "required": ["confirmation", "successToast"],
-          "additionalProperties": false
-        },
-        "fields": {
-          "type": "object",
-          "properties": {
-            "label": {
-              "type": "object",
-              "properties": {
-                "label": {
-                  "type": "string"
-                },
-                "placeholder": {
-                  "type": "string"
-                }
-              },
-              "required": ["label", "placeholder"],
-              "additionalProperties": false
-            },
-            "description": {
-              "type": "object",
-              "properties": {
-                "label": {
-                  "type": "string"
-                },
-                "placeholder": {
-                  "type": "string"
-                }
-              },
-              "required": ["label", "placeholder"],
-              "additionalProperties": false
-            }
-          },
-          "required": ["label", "description"],
-          "additionalProperties": false
-        }
-      },
-      "required": [
-        "domain",
-        "subtitle",
-        "calloutHint",
-        "editReason",
-        "create",
-        "edit",
-        "delete",
-        "fields"
-      ],
-      "additionalProperties": false
-    },
     "login": {
       "type": "object",
       "properties": {
@@ -11839,7 +11747,6 @@
     "salesChannels",
     "apiKeyManagement",
     "returnReasons",
-    "refundReasons",
     "login",
     "invite",
     "resetPassword",

package/src/i18n/translations/en.json

@@ -1534,7 +1534,10 @@
   "stockLocations": {
     "domain": "Locations & Shipping",
     "list": {
-      "description": "Manage your store's stock locations and shipping options."
+      "description": "Manage your store's stock locations and shipping options.",
+      "noRecordsMessage": "No records",
+      "noRecordsMessageEmpty": "No locations found",
+      "noRecordsMessageFiltered": "No locations found matching the filters"
     },
     "create": {
       "header": "Create Stock Location",
@@ -1547,7 +1550,8 @@
       "successToast": "Location {{name}} was successfully updated."
     },
     "delete": {
-      "confirmation": "You are about to delete the stock location \"{{name}}\". This action cannot be undone."
+      "confirmation": "You are about to delete the stock location \"{{name}}\". This action cannot be undone.",
+      "successToast": "Location \"{{name}}\" was successfully deleted."
     },
     "fulfillmentProviders": {
       "header": "Fulfillment Providers",
@@ -2740,37 +2744,6 @@
       }
     }
   },
-  "refundReasons": {
-    "domain": "Refund Reasons",
-    "subtitle": "Manage reasons for refunded items.",
-    "calloutHint": "Manage the reasons to categorize refunds.",
-    "editReason": "Edit Refund Reason",
-    "create": {
-      "header": "Add Refund Reason",
-      "subtitle": "Specify the most common reasons for refunds.",
-      "hint": "Create a new refund reason to categorize refunds.",
-      "successToast": "Refund reason {{label}} was successfully created."
-    },
-    "edit": {
-      "header": "Edit Refund Reason",
-      "subtitle": "Edit the value of the refund reason.",
-      "successToast": "Refund reason {{label}} was successfully updated."
-    },
-    "delete": {
-      "confirmation": "You are about to delete the refund reason \"{{label}}\". This action cannot be undone.",
-      "successToast": "Refund reason was successfully deleted."
-    },
-    "fields": {
-      "label": {
-        "label": "Label",
-        "placeholder": "Gesture of goodwill"
-      },
-      "description": {
-        "label": "Description",
-        "placeholder": "Customer had a bad shopping experience"
-      }
-    }
-  },
   "login": {
     "forgotPassword": "Forgot password? - <0>Reset</0>",
     "title": "Welcome to Medusa",

package/src/routes/locations/location-list/index.ts

@@ -1,2 +1 @@
-export { shippingListLoader as loader } from "./loader"
 export { LocationList as Component } from "./location-list"

package/src/routes/locations/location-list/location-list.tsx

@@ -1,34 +1,40 @@
 import { ShoppingBag, TruckFast } from "@medusajs/icons"
 import { Container, Heading } from "@medusajs/ui"
 import { useTranslation } from "react-i18next"
-import { useLoaderData } from "react-router-dom"
 
 import { useStockLocations } from "../../../hooks/api/stock-locations"
-import LocationListItem from "./components/location-list-item/location-list-item"
 import { LOCATION_LIST_FIELDS } from "./constants"
-import { shippingListLoader } from "./loader"
+import { useLocationListTableColumns } from "./use-location-list-table-columns"
+import { useLocationListTableQuery } from "./use-location-list-table-query"
 
+import { DataTable } from "../../../components/data-table"
 import { SidebarLink } from "../../../components/common/sidebar-link/sidebar-link"
 import { TwoColumnPage } from "../../../components/layout/pages"
 import { useExtension } from "../../../providers/extension-provider"
-import { LocationListHeader } from "./components/location-list-header"
+
+const PAGE_SIZE = 20
+const PREFIX = "loc"
 
 export function LocationList() {
-  const initialData = useLoaderData() as Awaited<
-    ReturnType<typeof shippingListLoader>
-  >
+  const { t } = useTranslation()
+
+  const searchParams = useLocationListTableQuery({
+    pageSize: PAGE_SIZE,
+    prefix: PREFIX,
+  })
 
   const {
     stock_locations: stockLocations = [],
+    count,
     isError,
     error,
-  } = useStockLocations(
-    {
-      fields: LOCATION_LIST_FIELDS,
-    },
-    { initialData }
-  )
+    isLoading,
+  } = useStockLocations({
+    fields: LOCATION_LIST_FIELDS,
+    ...searchParams,
+  })
 
+  const columns = useLocationListTableColumns()
   const { getWidgets } = useExtension()
 
   if (isError) {
@@ -46,12 +52,38 @@ export function LocationList() {
       showJSON
     >
       <TwoColumnPage.Main>
-        <LocationListHeader />
-        <div className="flex flex-col gap-3 lg:col-span-2">
-          {stockLocations.map((location) => (
-            <LocationListItem key={location.id} location={location} />
-          ))}
-        </div>
+        <Container className="flex flex-col divide-y p-0">
+          <DataTable
+            data={stockLocations}
+            columns={columns}
+            rowCount={count}
+            pageSize={PAGE_SIZE}
+            getRowId={(row) => row.id}
+            heading={t("stockLocations.domain")}
+            subHeading={t("stockLocations.list.description")}
+            emptyState={{
+              empty: {
+                heading: t("stockLocations.list.noRecordsMessage"),
+                description: t("stockLocations.list.noRecordsMessageEmpty"),
+              },
+              filtered: {
+                heading: t("stockLocations.list.noRecordsMessage"),
+                description: t("stockLocations.list.noRecordsMessageFiltered"),
+              },
+            }}
+            actions={[
+              {
+                label: t("actions.create"),
+                to: "create",
+              },
+            ]}
+            isLoading={isLoading}
+            rowHref={(row) => `/settings/locations/${row.id}`}
+            enableSearch={true}
+            prefix={PREFIX}
+            layout="fill"
+          />
+        </Container>
       </TwoColumnPage.Main>
       <TwoColumnPage.Sidebar>
         <LinksSection />

package/src/routes/locations/location-list/use-location-list-table-columns.tsx

@@ -0,0 +1,185 @@
+import { HttpTypes } from "@medusajs/types"
+import { PencilSquare, Trash } from "@medusajs/icons"
+import {
+  createDataTableColumnHelper,
+  StatusBadge,
+  toast,
+  usePrompt,
+} from "@medusajs/ui"
+import { useTranslation } from "react-i18next"
+import { useMemo } from "react"
+import { useNavigate } from "react-router-dom"
+import { FetchError } from "@medusajs/js-sdk"
+
+import { PlaceholderCell } from "../../../components/table/table-cells/common/placeholder-cell"
+import { getFormattedAddress } from "../../../lib/addresses"
+import { FulfillmentSetType } from "../common/constants"
+import { queryClient } from "../../../lib/query-client"
+import { stockLocationsQueryKeys } from "../../../hooks/api/stock-locations"
+import { ListSummary } from "../../../components/common/list-summary"
+import { sdk } from "../../../lib/client"
+
+const columnHelper = createDataTableColumnHelper<HttpTypes.AdminStockLocation>()
+
+export const useLocationListTableColumns = () => {
+  const { t } = useTranslation()
+  const navigate = useNavigate()
+  const prompt = usePrompt()
+
+  const handleDelete = async (location: HttpTypes.AdminStockLocation) => {
+    const result = await prompt({
+      title: t("general.areYouSure"),
+      description: t("stockLocations.delete.confirmation", {
+        name: location.name,
+      }),
+      confirmText: t("actions.remove"),
+      cancelText: t("actions.cancel"),
+    })
+
+    if (!result) {
+      return
+    }
+
+    try {
+      await sdk.admin.stockLocation.delete(location.id)
+      queryClient.invalidateQueries({
+        queryKey: stockLocationsQueryKeys.lists(),
+      })
+
+      queryClient.invalidateQueries({
+        queryKey: stockLocationsQueryKeys.detail(location.id),
+      })
+
+      toast.success(
+        t("stockLocations.delete.successToast", {
+          name: location.name,
+        })
+      )
+    } catch (e) {
+      toast.error((e as FetchError).message)
+    }
+  }
+
+  return useMemo(
+    () => [
+      columnHelper.accessor("name", {
+        header: t("fields.name"),
+        cell: ({ getValue }) => {
+          const name = getValue()
+          if (!name) {
+            return <PlaceholderCell />
+          }
+
+          return (
+            <span className="text-ui-fg-subtle text-small truncate">
+              {name}
+            </span>
+          )
+        },
+      }),
+      columnHelper.accessor("address", {
+        header: t("fields.address"),
+        cell: ({ getValue, row }) => {
+          const address = getValue()
+          const location = row.original
+
+          if (!address) {
+            return <PlaceholderCell />
+          }
+
+          return (
+            <div className="flex flex-col">
+              <span className="text-ui-fg-subtle text-small truncate">
+                {getFormattedAddress({
+                  address: location.address as HttpTypes.AdminOrderAddress,
+                }).join(", ")}
+              </span>
+            </div>
+          )
+        },
+      }),
+      columnHelper.accessor("fulfillment_sets", {
+        id: "shipping_fulfillment",
+        header: t("stockLocations.fulfillmentSets.shipping.header"),
+        cell: ({ getValue }) => {
+          const fulfillmentSets = getValue()
+          const shippingSet = fulfillmentSets?.find(
+            (f) => f.type === FulfillmentSetType.Shipping
+          )
+          const fulfillmentSetExists = !!shippingSet
+
+          return (
+            <StatusBadge color={fulfillmentSetExists ? "green" : "grey"}>
+              {t(
+                fulfillmentSetExists ? "statuses.enabled" : "statuses.disabled"
+              )}
+            </StatusBadge>
+          )
+        },
+      }),
+      columnHelper.accessor("fulfillment_sets", {
+        id: "pickup_fulfillment",
+        header: t("stockLocations.fulfillmentSets.pickup.header"),
+        cell: ({ getValue }) => {
+          const fulfillmentSets = getValue()
+          const pickupSet = fulfillmentSets?.find(
+            (f) => f.type === FulfillmentSetType.Pickup
+          )
+          const fulfillmentSetExists = !!pickupSet
+
+          return (
+            <StatusBadge color={fulfillmentSetExists ? "green" : "grey"}>
+              {t(
+                fulfillmentSetExists ? "statuses.enabled" : "statuses.disabled"
+              )}
+            </StatusBadge>
+          )
+        },
+      }),
+      columnHelper.accessor("sales_channels", {
+        header: t("stockLocations.salesChannels.label"),
+        cell: ({ getValue }) => {
+          const salesChannels = getValue()
+
+          if (!salesChannels?.length) {
+            return <PlaceholderCell />
+          }
+
+          return (
+            <div className="flex items-center">
+              <ListSummary
+                inline
+                n={1}
+                list={salesChannels.map((s) => s.name)}
+              />
+            </div>
+          )
+        },
+      }),
+      columnHelper.action({
+        actions: (ctx) => {
+          const location = ctx.row.original
+          return [
+            [
+              {
+                icon: <PencilSquare />,
+                label: t("actions.edit"),
+                onClick: () => {
+                  navigate(`/settings/locations/${location.id}/edit`)
+                },
+              },
+            ],
+            [
+              {
+                icon: <Trash />,
+                label: t("actions.delete"),
+                onClick: () => handleDelete(location),
+              },
+            ],
+          ]
+        },
+      }),
+    ],
+    []
+  )
+}

package/src/routes/locations/location-list/use-location-list-table-query.tsx

@@ -0,0 +1,22 @@
+import { HttpTypes } from "@medusajs/types"
+import { useQueryParams } from "../../../hooks/use-query-params"
+
+export const useLocationListTableQuery = ({
+  pageSize = 20,
+  prefix,
+}: {
+  pageSize?: number
+  prefix?: string
+}) => {
+  const queryObject = useQueryParams(["order", "offset", "q"], prefix)
+
+  const { offset, ...rest } = queryObject
+
+  const searchParams: HttpTypes.AdminStockLocationListParams = {
+    limit: pageSize,
+    offset: offset ? Number(offset) : 0,
+    ...rest,
+  }
+
+  return searchParams
+}

package/dist/chunk-BKJC5BGQ.mjs

@@ -1,53 +0,0 @@
-// src/components/common/badge-list-summary/badge-list-summary.tsx
-import { Badge, Tooltip, clx } from "@medusajs/ui";
-import { useTranslation } from "react-i18next";
-import { jsx, jsxs } from "react/jsx-runtime";
-var BadgeListSummary = ({
-  list,
-  className,
-  inline,
-  rounded = false,
-  n = 2
-}) => {
-  const { t } = useTranslation();
-  const title = t("general.plusCount", {
-    count: list.length - n
-  });
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      className: clx(
-        "text-ui-fg-subtle txt-compact-small gap-x-2 overflow-hidden",
-        {
-          "inline-flex": inline,
-          flex: !inline
-        },
-        className
-      ),
-      children: [
-        list.slice(0, n).map((item) => {
-          return /* @__PURE__ */ jsx(Badge, { rounded: rounded ? "full" : "base", size: "2xsmall", children: item }, item);
-        }),
-        list.length > n && /* @__PURE__ */ jsx("div", { className: "whitespace-nowrap", children: /* @__PURE__ */ jsx(
-          Tooltip,
-          {
-            content: /* @__PURE__ */ jsx("ul", { children: list.slice(n).map((c) => /* @__PURE__ */ jsx("li", { children: c }, c)) }),
-            children: /* @__PURE__ */ jsx(
-              Badge,
-              {
-                rounded: rounded ? "full" : "base",
-                size: "2xsmall",
-                className: "cursor-default whitespace-nowrap",
-                children: title
-              }
-            )
-          }
-        ) })
-      ]
-    }
-  );
-};
-
-export {
-  BadgeListSummary
-};

package/dist/chunk-YZJ3W776.mjs

@@ -1,87 +0,0 @@
-import {
-  queryClient
-} from "./chunk-FXYH54JP.mjs";
-import {
-  queryKeysFactory
-} from "./chunk-774WSTCC.mjs";
-import {
-  sdk
-} from "./chunk-DEQUVHHE.mjs";
-
-// src/hooks/api/refund-reasons.tsx
-import {
-  useMutation,
-  useQuery
-} from "@tanstack/react-query";
-var REFUND_REASONS_QUERY_KEY = "refund_reasons";
-var refundReasonsQueryKeys = queryKeysFactory(REFUND_REASONS_QUERY_KEY);
-var useRefundReasons = (query, options) => {
-  const { data, ...rest } = useQuery({
-    queryFn: () => sdk.admin.refundReason.list(query),
-    queryKey: refundReasonsQueryKeys.list(query),
-    ...options
-  });
-  return { ...data, ...rest };
-};
-var useRefundReason = (id, query, options) => {
-  const { data, ...rest } = useQuery({
-    queryFn: () => sdk.admin.refundReason.retrieve(id, query),
-    queryKey: refundReasonsQueryKeys.detail(id),
-    ...options
-  });
-  return { ...data, ...rest };
-};
-var useCreateRefundReason = (query, options) => {
-  return useMutation({
-    mutationFn: async (data) => sdk.admin.refundReason.create(data, query),
-    onSuccess: (data, variables, context) => {
-      queryClient.invalidateQueries({
-        queryKey: refundReasonsQueryKeys.lists()
-      });
-      options?.onSuccess?.(data, variables, context);
-    },
-    ...options
-  });
-};
-var useUpdateRefundReason = (id, query, options) => {
-  return useMutation({
-    mutationFn: async (data) => sdk.admin.refundReason.update(id, data, query),
-    onSuccess: (data, variables, context) => {
-      queryClient.invalidateQueries({
-        queryKey: refundReasonsQueryKeys.lists()
-      });
-      queryClient.invalidateQueries({
-        queryKey: refundReasonsQueryKeys.detail(data.refund_reason.id, query)
-      });
-      options?.onSuccess?.(data, variables, context);
-    },
-    ...options
-  });
-};
-var useDeleteRefundReason = (id, options) => {
-  return useMutation({
-    mutationFn: () => sdk.admin.refundReason.delete(id),
-    onSuccess: (data, variables, context) => {
-      queryClient.invalidateQueries({
-        queryKey: refundReasonsQueryKeys.lists()
-      });
-      queryClient.invalidateQueries({
-        queryKey: refundReasonsQueryKeys.detail(id)
-      });
-      queryClient.invalidateQueries({
-        queryKey: refundReasonsQueryKeys.details()
-      });
-      options?.onSuccess?.(data, variables, context);
-    },
-    ...options
-  });
-};
-
-export {
-  refundReasonsQueryKeys,
-  useRefundReasons,
-  useRefundReason,
-  useCreateRefundReason,
-  useUpdateRefundReason,
-  useDeleteRefundReason
-};