fix(dashboard): refund form input (#11993)
**What** - fix refund form input issues
This commit is contained in:
@@ -8,7 +8,7 @@ import {
|
||||
Textarea,
|
||||
toast,
|
||||
} from "@medusajs/ui"
|
||||
import { useEffect } from "react"
|
||||
import { useEffect, useMemo } from "react"
|
||||
import { useForm } from "react-hook-form"
|
||||
import { useTranslation } from "react-i18next"
|
||||
import { useNavigate, useSearchParams } from "react-router-dom"
|
||||
@@ -17,10 +17,11 @@ import { Form } from "../../../../../components/common/form"
|
||||
import { RouteDrawer, useRouteModal } from "../../../../../components/modals"
|
||||
import { KeyboundForm } from "../../../../../components/utilities/keybound-form"
|
||||
import { useRefundPayment } from "../../../../../hooks/api"
|
||||
import { getCurrencySymbol } from "../../../../../lib/data/currencies"
|
||||
import { currencies } from "../../../../../lib/data/currencies"
|
||||
import { formatCurrency } from "../../../../../lib/format-currency"
|
||||
import { getLocaleAmount } from "../../../../../lib/money-amount-helpers"
|
||||
import { getPaymentsFromOrder } from "../../../order-detail/components/order-payment-section"
|
||||
import { formatValue } from "react-currency-input-field"
|
||||
|
||||
type CreateRefundFormProps = {
|
||||
order: HttpTypes.AdminOrder
|
||||
@@ -28,7 +29,7 @@ type CreateRefundFormProps = {
|
||||
}
|
||||
|
||||
const CreateRefundSchema = zod.object({
|
||||
amount: zod.number(),
|
||||
amount: zod.string().or(zod.number()),
|
||||
refund_reason_id: zod.string().nullish(),
|
||||
note: zod.string().optional(),
|
||||
})
|
||||
@@ -45,6 +46,12 @@ export const CreateRefundForm = ({
|
||||
const payments = getPaymentsFromOrder(order)
|
||||
const payment = payments.find((p) => p.id === paymentId)!
|
||||
const paymentAmount = payment?.amount || 0
|
||||
|
||||
const currency = useMemo(
|
||||
() => currencies[order.currency_code.toUpperCase()],
|
||||
[order.currency_code]
|
||||
)
|
||||
|
||||
const form = useForm<zod.infer<typeof CreateRefundSchema>>({
|
||||
defaultValues: {
|
||||
amount: paymentAmount,
|
||||
@@ -72,7 +79,7 @@ export const CreateRefundForm = ({
|
||||
const handleSubmit = form.handleSubmit(async (data) => {
|
||||
await mutateAsync(
|
||||
{
|
||||
amount: data.amount,
|
||||
amount: parseFloat(data.amount as string),
|
||||
refund_reason_id: data.refund_reason_id,
|
||||
note: data.note,
|
||||
},
|
||||
@@ -166,28 +173,18 @@ export const CreateRefundForm = ({
|
||||
<CurrencyInput
|
||||
{...field}
|
||||
min={0}
|
||||
onValueChange={(value) => {
|
||||
const fieldValue = value ? parseInt(value) : ""
|
||||
|
||||
if (fieldValue && !isNaN(fieldValue)) {
|
||||
if (fieldValue < 0 || fieldValue > paymentAmount) {
|
||||
form.setError(`amount`, {
|
||||
type: "manual",
|
||||
message: t(
|
||||
"orders.payment.createRefundWrongQuantity",
|
||||
{ number: paymentAmount }
|
||||
),
|
||||
})
|
||||
} else {
|
||||
form.clearErrors(`amount`)
|
||||
}
|
||||
}
|
||||
|
||||
onChange(fieldValue)
|
||||
}}
|
||||
code={order.currency_code}
|
||||
symbol={getCurrencySymbol(order.currency_code)}
|
||||
placeholder={formatValue({
|
||||
value: "0",
|
||||
decimalScale: currency.decimal_digits,
|
||||
})}
|
||||
decimalScale={currency.decimal_digits}
|
||||
symbol={currency.symbol_native}
|
||||
code={currency.code}
|
||||
value={field.value}
|
||||
onValueChange={(_value, _name, values) =>
|
||||
onChange(values?.value ? values?.value : "")
|
||||
}
|
||||
autoFocus
|
||||
/>
|
||||
</Form.Control>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user