Reset form state on dialog close in NewCustomerModal
- Add `resetForm` utility to restore initial modal state. - Automatically reset form state when dialog closes or a new customer is created to improve UX.
This commit is contained in:
@@ -75,6 +75,7 @@ export function NewCustomerModal({onCustomerCreated}: Readonly<NewCustomerModalP
|
||||
if (onCustomerCreated) {
|
||||
onCustomerCreated();
|
||||
}
|
||||
resetForm();
|
||||
} catch (err) {
|
||||
handleError(err);
|
||||
}
|
||||
@@ -123,6 +124,20 @@ export function NewCustomerModal({onCustomerCreated}: Readonly<NewCustomerModalP
|
||||
setNotes(updated);
|
||||
};
|
||||
|
||||
const resetForm = () => {
|
||||
setStep(1); // Reset to step 1
|
||||
setEmail("");
|
||||
setName("");
|
||||
setCompanyName("");
|
||||
setPhoneNumbers([{note: "", number: ""}]);
|
||||
setNotes([{text: ""}]);
|
||||
setStreet("");
|
||||
setZip("");
|
||||
setCity("");
|
||||
setMatches([]);
|
||||
setShowDetailModal(false);
|
||||
};
|
||||
|
||||
const renderStepOne = () => (
|
||||
<div className="space-y-4">
|
||||
<div className="space-y-2">
|
||||
@@ -227,6 +242,9 @@ export function NewCustomerModal({onCustomerCreated}: Readonly<NewCustomerModalP
|
||||
return (
|
||||
<>
|
||||
<Dialog open={open} onOpenChange={() => {
|
||||
if (!open) {
|
||||
resetForm();
|
||||
}
|
||||
// Prevent closing on backdrop click - modal can only be closed explicitly
|
||||
}}>
|
||||
<DialogTrigger asChild>
|
||||
@@ -257,7 +275,7 @@ export function NewCustomerModal({onCustomerCreated}: Readonly<NewCustomerModalP
|
||||
{step === 1 ? (
|
||||
<Button
|
||||
onClick={() => setStep(2)}
|
||||
// disabled={!email || !name || !companyName || phoneNumbers.length === 0 || !phoneNumbers.some(p => p.number.trim()) || emailExists}
|
||||
disabled={!email || !name || !companyName || phoneNumbers.length === 0 || !phoneNumbers.some(p => p.number.trim()) || emailExists}
|
||||
>
|
||||
Weiter
|
||||
</Button>
|
||||
|
||||
Reference in New Issue
Block a user