fix(dashboard): update orders page filters to match interface expected by old DataTable component (#13994)

* Use correct filter interface for old data table component

* Add changeset
This commit is contained in:
Nicolas Gorga authored and GitHub committed 2025-11-07 10:16:21 +01:00
1 parent 9fdc00350a
commit 6898ca758c
2 files changed
+32 -17

No files matched your search

+5
View File
@@ -0,0 +1,5 @@
---
"@medusajs/dashboard": patch
---
fix(dashboard): update orders page filters to match interface expected by old DataTable component
@@ -1,19 +1,14 @@
import { useMemo } from "react" import { useMemo } from "react"
import { useTranslation } from "react-i18next" import { useTranslation } from "react-i18next"
import { createDataTableFilterHelper } from "@medusajs/ui" import { Filter } from "../../../../../components/table/data-table"
import { HttpTypes } from "@medusajs/types"
import { useDataTableDateFilters } from "../../../../../components/data-table/helpers/general/use-data-table-date-filters"
import { useRegions } from "../../../../../hooks/api/regions" import { useRegions } from "../../../../../hooks/api/regions"
import { useSalesChannels } from "../../../../../hooks/api/sales-channels" import { useSalesChannels } from "../../../../../hooks/api/sales-channels"
const filterHelper = createDataTableFilterHelper<HttpTypes.AdminOrder>()
/** /**
* Hook to create filters in the format expected by @medusajs/ui DataTable * Hook to create filters in the format expected by the deprecated DataTable component
*/ */
export const useOrderTableFilters = () => { export const useOrderTableFilters = () => {
const { t } = useTranslation() const { t } = useTranslation()
const dateFilters = useDataTableDateFilters()
const { regions } = useRegions({ const { regions } = useRegions({
limit: 1000, limit: 1000,
@@ -25,38 +20,53 @@ export const useOrderTableFilters = () => {
fields: "id,name", fields: "id,name",
}) })
// Until we migrate to the new DataTable component, we can't use `createDataTableFilterHelper` filter structure, since th identifier there is `is`
// while deprecated component expexts `key`. Will be ready to migrate once SUP-2651 is done
return useMemo(() => { return useMemo(() => {
const filters = [...dateFilters] const filters: Filter[] = [
{
key: "created_at",
label: t("fields.createdAt"),
type: "date",
},
{
key: "updated_at",
label: t("fields.updatedAt"),
type: "date",
},
]
if (regions?.length) { if (regions?.length) {
filters.push( filters.push({
filterHelper.accessor("region_id", { key: "region_id",
label: t("fields.region"), label: t("fields.region"),
type: "multiselect", type: "select",
multiple: true,
searchable: true,
options: regions.map((r) => ({ options: regions.map((r) => ({
label: r.name, label: r.name,
value: r.id, value: r.id,
})), })),
}) })
)
} }
if (sales_channels?.length) { if (sales_channels?.length) {
filters.push( filters.push({
filterHelper.accessor("sales_channel_id", { key: "sales_channel_id",
label: t("fields.salesChannel"), label: t("fields.salesChannel"),
type: "multiselect", type: "select",
multiple: true,
searchable: true,
options: sales_channels.map((s) => ({ options: sales_channels.map((s) => ({
label: s.name, label: s.name,
value: s.id, value: s.id,
})), })),
}) })
)
} }
// TODO: Add payment and fulfillment status filters when they are properly linked to orders // TODO: Add payment and fulfillment status filters when they are properly linked to orders
// Note: These filters are commented out in the legacy implementation as well // Note: These filters are commented out in the legacy implementation as well
return filters return filters
}, [regions, sales_channels, dateFilters, t]) }, [regions, sales_channels, t])
} }