fix(admin): Price input (#4530)

* initial fix for number inputs

* add changeset

packages/admin-ui/ui/src/components/forms/general/prices-form/nested-price.tsx

@@ -1,14 +1,15 @@
-import clsx from "clsx"
-import { Controller } from "react-hook-form"
 import { NestedPriceObject, PricesFormType } from "."
-import useToggleState from "../../../../hooks/use-toggle-state"
-import { currencies } from "../../../../utils/currencies"
-import { NestedForm } from "../../../../utils/nested-form"
-import IncludesTaxTooltip from "../../../atoms/includes-tax-tooltip"
+
 import CoinsIcon from "../../../fundamentals/icons/coins-icon"
+import { Controller } from "react-hook-form"
+import IncludesTaxTooltip from "../../../atoms/includes-tax-tooltip"
 import MapPinIcon from "../../../fundamentals/icons/map-pin-icon"
-import TriangleRightIcon from "../../../fundamentals/icons/triangle-right-icon"
+import { NestedForm } from "../../../../utils/nested-form"
 import PriceFormInput from "./price-form-input"
+import TriangleRightIcon from "../../../fundamentals/icons/triangle-right-icon"
+import clsx from "clsx"
+import { currencies } from "../../../../utils/currencies"
+import useToggleState from "../../../../hooks/use-toggle-state"
 
 type Props = {
   form: NestedForm<PricesFormType>

packages/admin-ui/ui/src/components/forms/general/prices-form/price-form-input.tsx

@@ -1,14 +1,15 @@
-import clsx from "clsx"
 import { useCallback, useEffect, useState } from "react"
+
 import AmountField from "react-currency-input-field"
-import { currencies } from "../../../../utils/currencies"
 import InputError from "../../../atoms/input-error"
 import InputHeader from "../../../fundamentals/input-header"
+import clsx from "clsx"
+import { currencies } from "../../../../utils/currencies"
 
 type Props = {
   currencyCode: string
   amount?: number | null
-  onChange: (amount?: number) => void
+  onChange: (amount?: number | null) => void
   errors?: { [x: string]: unknown }
   name?: string
   label?: string
@@ -51,7 +52,7 @@ const PriceFormInput = ({
       const numericalValue = Math.round(floatValue * 10 ** decimal_digits)
       onChange(numericalValue)
     } else {
-      onChange(undefined)
+      onChange(null)
     }
     setFormattedValue(value)
   }

packages/admin-ui/ui/src/components/organisms/medusa-price-input/index.tsx

@@ -1,7 +1,9 @@
 import * as React from "react"
-import { CurrencyType } from "../../../utils/currencies"
+
 import PriceInput, { PriceInputProps } from "../price-input"
 
+import { CurrencyType } from "../../../utils/currencies"
+
 type MedusaPriceInputProps = {
   amount: number
   currency: CurrencyType
@@ -34,7 +36,7 @@ function MedusaPriceInput(props: MedusaPriceInputProps) {
       const numericalValue = Math.round(floatValue * 10 ** decimal_digits)
       onChange(numericalValue)
     } else {
-      onChange(undefined)
+      onChange(null)
     }
     setRawValue(value)
   }