4nk/lecoffre-front
4
0
Fork 0
Code Issues 1 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

🐛 Validation error handling

Browse Source
This commit is contained in:
Maxime Lalo 2023-10-10 15:10:12 +02:00
parent 46d747d89f
commit 0c47a0d7a1
1 changed files with 29 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
src/front/Components/Layouts/Folder/UpdateClient/index.tsx
View File

@ -5,7 +5,7 @@ import TextField from "@Front/Components/DesignSystem/Form/TextField";
import Confirm from "@Front/Components/DesignSystem/Modal/Confirm";
import Typography, { ITypo } from "@Front/Components/DesignSystem/Typography";
import BackArrow from "@Front/Components/Elements/BackArrow";
import DefaultNotaryDashboard from "@Front/Components/LayoutTemplates/DefaultNotaryDashboard";
import DefaultNotaryDashboard from "@Front/Components/LayoutTemplates/DefaultNotaryDashboard";
import Module from "@Front/Config/Module";
import { Contact, Customer, OfficeFolder } from "le-coffre-resources/dist/Notary";
import Link from "next/link";
@ -14,6 +14,8 @@ import { ChangeEvent } from "react";
import BasePage from "../../Base";
import classes from "./classes.module.scss";
import { Address } from "le-coffre-resources/dist/Customer";
import { ValidationError } from "class-validator";
type IProps = {};
@ -34,6 +36,7 @@ type IState = {
inputAddress: string;
folder: OfficeFolder | null;
customer: Customer | null;
validationError: ValidationError[];
};
class UpdateClientClass extends BasePage<IPropsClass, IState> {
constructor(props: IPropsClass) {
@ -50,6 +53,7 @@ class UpdateClientClass extends BasePage<IPropsClass, IState> {
inputAddress: "",
folder: null,
customer: null,
validationError: [],
};
this.onSelectedFolder = this.onSelectedFolder.bind(this);
this.onChangeNameInput = this.onChangeNameInput.bind(this);
@ -83,24 +87,28 @@ class UpdateClientClass extends BasePage<IPropsClass, IState> {
placeholder="Nom"
onChange={this.onChangeNameInput}
defaultValue={this.state.customer?.contact?.first_name}
validationError={this.state.validationError.find((error) => error.property === "first_name")}
/>
<TextField
name="last_name"
placeholder="Prénom"
onChange={this.onChangeFirstNameInput}
defaultValue={this.state.customer?.contact?.last_name}
validationError={this.state.validationError.find((error) => error.property === "last_name")}
/>
<TextField
name="email"
placeholder="E-mail"
onChange={this.onChangeEmailInput}
defaultValue={this.state.customer?.contact?.email}
validationError={this.state.validationError.find((error) => error.property === "email")}
/>
<TextField
name="cell_phone_number"
placeholder="Numéro de téléphone"
onChange={this.onChangePhoneNumberInput}
defaultValue={this.state.customer?.contact?.cell_phone_number ?? ""}
validationError={this.state.validationError.find((error) => error.property === "cell_phone_number")}
/>
<TextField
name="birthdate"
@ -108,6 +116,7 @@ class UpdateClientClass extends BasePage<IPropsClass, IState> {
required={false}
onChange={this.onChangeBirthDateInput}
defaultValue={this.state.customer?.contact?.birthdate?.toString() ?? ""}
validationError={this.state.validationError.find((error) => error.property === "birthdate")}
/>
<TextField
name="address"
@ -167,25 +176,33 @@ class UpdateClientClass extends BasePage<IPropsClass, IState> {
[key: string]: string;
},
) {
const contact = {
const contact = Contact.hydrate<Contact>({
first_name: values["first_name"],
last_name: values["last_name"],
email: values["email"],
cell_phone_number: values["cell_phone_number"],
birthdate: values["birthdate"] === "" ? null : values["birthdate"],
address:
values["address"] === ""
? null
: {
address: values["address"],
},
} as Contact;
birthdate: values["birthdate"] === "" ? null : new Date(values["birthdate"]!),
address: values["address"] ? Address.hydrate<Address>({ address: values["address"] }) : undefined,
});
try {
await contact.validateOrReject?.({ groups: ["createCustomer"], forbidUnknownValues: false });
} catch (validationErrors) {
console.log(validationErrors);
this.setState({
validationError: validationErrors as ValidationError[],
});
return;
}
try {
await Customers.getInstance().put(this.props.customerUid, { contact });
this.props.router.push(this.backwardPath);
} catch (e) {
console.error(e);
} catch (backError) {
if (!Array.isArray(backError)) return;
this.setState({
validationError: backError as ValidationError[],
});
}
}