refactor: update NumberInput usage to utilize defaultValue and improve field handling in forms

This commit is contained in:
Marco Pedone 2025-11-21 14:09:06 +01:00
parent 5df7e8cef8
commit 70e24b5abe
4 changed files with 59 additions and 47 deletions

View file

@ -152,6 +152,7 @@ export const NumberInput = forwardRef<HTMLInputElement, NumberInputProps>(
className="h-1/2 rounded-l-none rounded-br-none border-input border-b-[0.5px] border-l-0 px-2 focus-visible:relative"
disabled={value === max}
onClick={handleIncrement}
type="button"
variant="outline"
>
<ChevronUp size={15} />
@ -161,6 +162,7 @@ export const NumberInput = forwardRef<HTMLInputElement, NumberInputProps>(
className="h-1/2 rounded-l-none rounded-tr-none border-input border-t-[0.5px] border-l-0 px-2 focus-visible:relative"
disabled={value === min}
onClick={handleDecrement}
type="button"
variant="outline"
>
<ChevronDown size={15} />

View file

@ -620,6 +620,7 @@ const StabileSection = () => {
<span className="font-semibold">Budget (da preferenze servizio):</span>
<NumberInput
allowNegative={false}
defaultValue={value}
min={0}
onValueChange={(val) => {
if (val !== undefined) {
@ -628,7 +629,6 @@ const StabileSection = () => {
}}
stepper={50}
suffix=" €"
value={value}
/>
</div>
<p>

View file

@ -1004,30 +1004,34 @@ export const AnnuncioEditForm = ({ data }: { data: AnnunciWithMedia }) => {
<FormField
control={form.control}
name="prezzo"
render={({ field }) => (
<FormItem>
<div className="flex flex-wrap items-center gap-x-2">
<FormLabel htmlFor="prezzo">Prezzo</FormLabel>{" "}
<FormMessage />
</div>
render={({ field }) => {
const { value, onChange, ...rest } = field;
<FormControl>
<NumberInput
suffix=" €"
{...field}
decimalScale={2}
decimalSeparator=","
fixedDecimalScale
id="prezzo"
min={0}
onValueChange={(v) => {
field.onChange((v || 0) * 100);
}}
value={Number(field.value) / 100}
/>
</FormControl>
</FormItem>
)}
return (
<FormItem>
<div className="flex flex-wrap items-center gap-x-2">
<FormLabel htmlFor="prezzo">Prezzo</FormLabel>{" "}
<FormMessage />
</div>
<FormControl>
<NumberInput
decimalScale={2}
{...rest}
decimalSeparator=","
defaultValue={Number(value) / 100}
fixedDecimalScale
id="prezzo"
min={0}
onValueChange={(v) => {
onChange((Number(v) || 0) * 100);
}}
suffix=" €"
/>
</FormControl>
</FormItem>
);
}}
/>
}
children2={

View file

@ -409,30 +409,36 @@ export const FormPrezzo = ({
<FormField
control={form.control}
name="prezzo_cent"
render={({ field }) => (
<FormItem>
<div className="flex flex-wrap items-center gap-x-2">
<FormLabel htmlFor="prezzo">Prezzo</FormLabel>
<FormMessage />
</div>
<FormControl>
<NumberInput
suffix=" €"
{...field}
decimalScale={2}
decimalSeparator=","
fixedDecimalScale
id="prezzo"
min={0}
onValueChange={(v) => {
field.onChange((v || 0) * 100);
}}
value={Number(field.value) / 100}
/>
</FormControl>
</FormItem>
)}
render={({ field }) => {
const { value, onChange, ...rest } = field;
return (
<FormItem>
<div className="flex flex-wrap items-center gap-x-2">
<FormLabel htmlFor="prezzo">Prezzo</FormLabel>{" "}
<FormMessage />
</div>
<FormControl>
<NumberInput
decimalScale={2}
{...rest}
decimalSeparator=","
defaultValue={Number(value) / 100}
fixedDecimalScale
id="prezzo"
min={0}
onValueChange={(v) => {
onChange((Number(v) || 0) * 100);
}}
suffix=" €"
/>
</FormControl>
</FormItem>
);
}}
/>
<FormField
control={form.control}
name="sconto"