fix(dashboard): allow to unset currency cell value (#9312)

**What**
- unset datagrid currency cell on delete press instead of setting it to 0
- consolidate pricing editors validations
- fix PL edit pricing schema

---

FIXES CC-529

packages/admin/dashboard/src/components/data-grid/hooks/use-data-grid-form-handlers.tsx

@@ -12,7 +12,7 @@ type UseDataGridFormHandlersOptions<TData, TFieldValues extends FieldValues> = {
 
 export const useDataGridFormHandlers = <
  TData,
- TFieldValues extends FieldValues
+ TFieldValues extends FieldValues,
 >({
  matrix,
  form,
@@ -119,7 +119,7 @@ export function convertArrayToPrimitive(
 ): any[] {
  switch (type) {
  case "number":
- return values.map(convertToNumber)
+ return values.map((v) => (v === "" ? v : convertToNumber(v)))
  case "boolean":
  return values.map(convertToBoolean)
  case "text":

packages/admin/dashboard/src/routes/locations/location-service-zone-shipping-option-create/components/create-shipping-options-form/create-shipping-options-form.tsx

@@ -62,25 +62,29 @@ export function CreateShippingOptionsForm({
  const handleSubmit = form.handleSubmit(async (data) => {
  const currencyPrices = Object.entries(data.currency_prices)
  .map(([code, value]) => {
- const amount = value ? castNumber(value) : undefined
+ if (value === "" || value === undefined) {
+ return undefined
+ }
 
  return {
  currency_code: code,
- amount: amount,
+ amount: castNumber(value),
  }
  })
- .filter((o) => !!o.amount) as { currency_code: string; amount: number }[]
+ .filter((o) => !!o) as { currency_code: string; amount: number }[]
 
  const regionPrices = Object.entries(data.region_prices)
  .map(([region_id, value]) => {
- const amount = value ? castNumber(value) : undefined
+ if (value === "" || value === undefined) {
+ return undefined
+ }
 
  return {
  region_id,
- amount: amount,
+ amount: castNumber(value),
  }
  })
- .filter((o) => !!o.amount) as { region_id: string; amount: number }[]
+ .filter((o) => !!o) as { region_id: string; amount: number }[]
 
  await mutateAsync(
  {

packages/admin/dashboard/src/routes/price-lists/common/schemas.ts

@@ -57,7 +57,7 @@ export type PriceListCreateProductsSchema = z.infer<
 >
 
 export const PriceListUpdateCurrencyPriceSchema = z.object({
- amount: z.string().nullish(),
+ amount: z.string().or(z.number()).optional(),
  id: z.string().nullish(),
 })
 
@@ -66,7 +66,7 @@ export type PriceListUpdateCurrencyPrice = z.infer<
 >
 
 export const PriceListUpdateRegionPriceSchema = z.object({
- amount: z.string().nullish(),
+ amount: z.string().or(z.number()).optional(),
  id: z.string().nullish(),
 })
 

packages/admin/dashboard/src/routes/price-lists/price-list-prices-edit/components/price-list-prices-edit-form/price-list-prices-edit-form.tsx

@@ -185,10 +185,13 @@ function convertToPriceArray(
 ) {
  const prices: PriceObject[] = []
 
- const regionCurrencyMap = regions.reduce((map, region) => {
- map[region.id] = region.currency_code
- return map
- }, {} as Record<string, string>)
+ const regionCurrencyMap = regions.reduce(
+ (map, region) => {
+ map[region.id] = region.currency_code
+ return map
+ },
+ {} as Record<string, string>
+ )
 
  for (const [_productId, product] of Object.entries(data || {})) {
  const { variants } = product || {}
@@ -200,7 +203,10 @@ function convertToPriceArray(
  for (const [currencyCode, currencyPrice] of Object.entries(
  currencyPrices || {}
  )) {
- if (currencyPrice?.amount) {
+ if (
+ currencyPrice?.amount !== "" &&
+ typeof currencyPrice?.amount !== "undefined"
+ ) {
  prices.push({
  variantId,
  currencyCode,
@@ -213,7 +219,10 @@ function convertToPriceArray(
  for (const [regionId, regionPrice] of Object.entries(
  regionPrices || {}
  )) {
- if (regionPrice?.amount) {
+ if (
+ regionPrice?.amount !== "" &&
+ typeof regionPrice?.amount !== "undefined"
+ ) {
  prices.push({
  variantId,
  regionId,
@@ -240,15 +249,21 @@ function comparePrices(initialPrices: PriceObject[], newPrices: PriceObject[]) {
  const pricesToCreate: HttpTypes.AdminCreatePriceListPrice[] = []
  const pricesToDelete: string[] = []
 
- const initialPriceMap = initialPrices.reduce((map, price) => {
- map[createMapKey(price)] = price
- return map
- }, {} as Record<string, (typeof initialPrices)[0]>)
+ const initialPriceMap = initialPrices.reduce(
+ (map, price) => {
+ map[createMapKey(price)] = price
+ return map
+ },
+ {} as Record<string, (typeof initialPrices)[0]>
+ )
 
- const newPriceMap = newPrices.reduce((map, price) => {
- map[createMapKey(price)] = price
- return map
- }, {} as Record<string, (typeof newPrices)[0]>)
+ const newPriceMap = newPrices.reduce(
+ (map, price) => {
+ map[createMapKey(price)] = price
+ return map
+ },
+ {} as Record<string, (typeof newPrices)[0]>
+ )
 
  const keys = new Set([
  ...Object.keys(initialPriceMap),

packages/admin/dashboard/src/routes/products/product-create-variant/components/create-product-variant-form/create-product-variant-form.tsx

@@ -74,10 +74,13 @@ export const CreateProductVariantForm = ({
  return {}
  }
 
- return regions.reduce((acc, reg) => {
- acc[reg.id] = reg.currency_code
- return acc
- }, {} as Record<string, string>)
+ return regions.reduce(
+ (acc, reg) => {
+ acc[reg.id] = reg.currency_code
+ return acc
+ },
+ {} as Record<string, string>
+ )
  }, [regions])
 
  const isManageInventoryEnabled = useWatch({
@@ -210,13 +213,13 @@ export const CreateProductVariantForm = ({
  options: data.options,
  prices: Object.entries(data.prices ?? {})
  .map(([currencyOrRegion, value]) => {
- const ret: AdminCreateProductVariantPrice = {}
- const amount = castNumber(value)
-
- if (isNaN(amount) || value === "") {
+ if (value === "" || value === undefined) {
  return undefined
  }
 
+ const ret: AdminCreateProductVariantPrice = {}
+ const amount = castNumber(value)
+
  if (currencyOrRegion.startsWith("reg_")) {
  ret.rules = { region_id: currencyOrRegion }
  ret.currency_code = regionsCurrencyMap[currencyOrRegion]

packages/admin/dashboard/src/routes/products/product-create/utils.ts

@@ -75,6 +75,10 @@ export const normalizeVariants = (
  .filter(Boolean),
  prices: Object.entries(variant.prices || {})
  .map(([key, value]: any) => {
+ if (value === "" || value === undefined) {
+ return undefined
+ }
+
  if (key.startsWith("reg_")) {
  return {
  currency_code: regionsCurrencyMap[key],

packages/admin/dashboard/src/routes/products/product-prices/pricing-edit.tsx

@@ -74,8 +74,11 @@ export const PricingEdit = ({
  const handleSubmit = form.handleSubmit(async (values) => {
  const reqData = values.variants.map((variant, ind) => ({
  id: variants[ind].id,
- prices: Object.entries(variant.prices || {}).map(
- ([currencyCodeOrRegionId, value]: any) => {
+ prices: Object.entries(variant.prices || {})
+ .filter(
+ ([_, value]) => value !== "" && typeof value !== "undefined" // deleted cells
+ )
+ .map(([currencyCodeOrRegionId, value]: any) => {
  const regionId = currencyCodeOrRegionId.startsWith("reg_")
  ? currencyCodeOrRegionId
  : undefined
@@ -105,8 +108,7 @@ export const PricingEdit = ({
  amount,
  ...(regionId ? { rules: { region_id: regionId } } : {}),
  }
- }
- ),
+ }),
  }))
 
  await mutateAsync(reqData, {