fix(dashboard): Show SO name in DataGrid (#9554)

**What**
- Adds a Readonly cell with the SO name in the pricing DataGrid.

Resolves CC-555
This commit is contained in:
Kasper Fabricius Kristensen authored and GitHub committed 2024-10-14 10:05:21 +00:00
1 parent 5a60a2a329
commit 3edb5d3470
2 files changed
+40 -16

No files matched your search

@@ -1,13 +1,21 @@
import { HttpTypes } from "@medusajs/types" import { HttpTypes } from "@medusajs/types"
import { useMemo } from "react" import { useMemo } from "react"
import { useTranslation } from "react-i18next" import { useTranslation } from "react-i18next"
import {
createDataGridHelper,
DataGrid,
} from "../../../../components/data-grid"
import { createDataGridPriceColumns } from "../../../../components/data-grid/helpers/create-data-grid-price-columns" import { createDataGridPriceColumns } from "../../../../components/data-grid/helpers/create-data-grid-price-columns"
const columnHelper = createDataGridHelper()
export const useShippingOptionPriceColumns = ({ export const useShippingOptionPriceColumns = ({
name,
currencies = [], currencies = [],
regions = [], regions = [],
pricePreferences = [], pricePreferences = [],
}: { }: {
name: string
currencies?: string[] currencies?: string[]
regions?: HttpTypes.AdminRegion[] regions?: HttpTypes.AdminRegion[]
pricePreferences?: HttpTypes.AdminPricePreference[] pricePreferences?: HttpTypes.AdminPricePreference[]
@@ -15,18 +23,31 @@ export const useShippingOptionPriceColumns = ({
const { t } = useTranslation() const { t } = useTranslation()
return useMemo(() => { return useMemo(() => {
return createDataGridPriceColumns({ return [
currencies, columnHelper.column({
regions, id: "name",
pricePreferences, header: t("fields.name"),
getFieldName: (context, value) => { cell: (context) => {
if (context.column.id.startsWith("currency_prices")) { return (
return `currency_prices.${value}` <DataGrid.ReadonlyCell context={context}>
} {name}
</DataGrid.ReadonlyCell>
)
},
}),
...createDataGridPriceColumns({
currencies,
regions,
pricePreferences,
getFieldName: (context, value) => {
if (context.column.id?.startsWith("currency_prices")) {
return `currency_prices.${value}`
}
return `region_prices.${value}` return `region_prices.${value}`
}, },
t, t,
}) }),
}, [t, currencies, regions, pricePreferences]) ]
}, [t, currencies, regions, pricePreferences, name])
} }
@@ -112,6 +112,7 @@ export function EditShippingOptionsPricingForm({
const { setCloseOnEscape } = useRouteModal() const { setCloseOnEscape } = useRouteModal()
const columns = useShippingOptionPriceColumns({ const columns = useShippingOptionPriceColumns({
name: shippingOption.name,
currencies, currencies,
regions, regions,
pricePreferences, pricePreferences,
@@ -129,7 +130,9 @@ export function EditShippingOptionsPricingForm({
return undefined return undefined
} }
const currencyExists = currencies.some(currencyCode => currencyCode.toLowerCase() == code.toLowerCase()) const currencyExists = currencies.some(
(currencyCode) => currencyCode.toLowerCase() == code.toLowerCase()
)
if (!currencyExists) { if (!currencyExists) {
return undefined return undefined
} }
@@ -162,8 +165,8 @@ export function EditShippingOptionsPricingForm({
// Check if the region_id exists in the regions array to avoid // Check if the region_id exists in the regions array to avoid
// sending updates of region prices where the region has been // sending updates of region prices where the region has been
// deleted // deleted
const regionExists = regions?.some(region => region.id === region_id) const regionExists = regions?.some((region) => region.id === region_id)
if (!regionExists) { if (!regionExists) {
return undefined return undefined
} }