feat(quote-form): allow empty quantity input for operator convenience

- Updated the `DraftQuoteItem` interface to allow `quantity` to be an empty string, enabling operators to type counts directly without needing to delete a default value.
- Modified the `QuoteFormItemCard` to handle empty input gracefully, falling back to 1 on submission if the field is left blank.
- Adjusted the `addItem` function in `QuoteForm` to initialize `quantity` as an empty string, enhancing user experience during item addition.
This commit is contained in:
Dave 2026-08-18 07:28:25 +02:00
parent 8ed0952364
commit bfcddb9d82
3 changed files with 19 additions and 3 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 264 KiB

View file

@ -10,7 +10,12 @@ import { Textarea } from "@/components/ui/textarea";
export interface DraftQuoteItem {
id: string;
description: string;
quantity: number;
/**
* Line-item count the operator typed. Starts empty so the operator
* can type e.g. "22" without having to delete a default "1" first.
* Falls back to 1 on submit when left blank — see quote-form.tsx.
*/
quantity: number | "";
notes: string;
files: File[];
/**
@ -62,7 +67,15 @@ export function QuoteFormItemCard({ item, onChange, onRemove }: QuoteFormItemCar
type="number"
min={1}
value={item.quantity}
onChange={(e) => onChange({ quantity: Math.max(1, Number(e.target.value) || 1) })}
onChange={(e) => {
const raw = e.target.value;
// Empty input = "not entered yet". Submit falls back to 1.
if (raw === "") {
onChange({ quantity: "" });
} else {
onChange({ quantity: Math.max(1, Number(raw) || 1) });
}
}}
/>
</div>
<div className="space-y-2">

View file

@ -106,7 +106,10 @@ export function QuoteForm({ open, onOpenChange, onSaved }: QuoteFormProps) {
const addItem = () => {
setItems([
...items,
{ id: crypto.randomUUID(), description: "", quantity: 1, notes: "", files: [], sku: "" },
// Start with empty quantity so the operator can type the count
// directly (e.g. "22") without first deleting a "1". The submit
// path below falls back to 1 when the field is left blank.
{ id: crypto.randomUUID(), description: "", quantity: "", notes: "", files: [], sku: "" },
]);
};