From 10dced877b44cc951ef37c64594410773408bfc4 Mon Sep 17 00:00:00 2001 From: Maxime Lalo Date: Tue, 9 May 2023 16:50:50 +0200 Subject: [PATCH] :sparkles: Fixing remove/edit of customers --- .../DesignSystem/RadioBox/index.tsx | 14 +++- .../Folder/AddClientToFolder/index.tsx | 80 ++++++++++++------- 2 files changed, 61 insertions(+), 33 deletions(-) diff --git a/src/front/Components/DesignSystem/RadioBox/index.tsx b/src/front/Components/DesignSystem/RadioBox/index.tsx index 5db4f30e..47fdd9ba 100644 --- a/src/front/Components/DesignSystem/RadioBox/index.tsx +++ b/src/front/Components/DesignSystem/RadioBox/index.tsx @@ -1,4 +1,5 @@ import React from "react"; + import Tooltip from "../ToolTip"; import Typography, { ITypo, ITypoColor } from "../Typography"; import classes from "./classes.module.scss"; @@ -7,12 +8,16 @@ type IProps = { children: React.ReactNode; name: string; toolTip?: string; - defaultChecked?: boolean; + checked?: boolean; onChange?: (event: React.ChangeEvent) => void; value: string; + disabled: boolean; }; export default class RadioBox extends React.Component { + static defaultProps = { + disabled: false, + }; public override render(): JSX.Element { return ( @@ -20,9 +25,10 @@ export default class RadioBox extends React.Component { {this.props.children} {this.props.toolTip && } @@ -30,4 +36,8 @@ export default class RadioBox extends React.Component { ); } + + public override componentDidMount(): void { + console.log(this.props); + } } diff --git a/src/front/Components/Layouts/Folder/AddClientToFolder/index.tsx b/src/front/Components/Layouts/Folder/AddClientToFolder/index.tsx index 5daf7a2d..170655ad 100644 --- a/src/front/Components/Layouts/Folder/AddClientToFolder/index.tsx +++ b/src/front/Components/Layouts/Folder/AddClientToFolder/index.tsx @@ -1,3 +1,7 @@ +import "reflect-metadata"; + +import Customers from "@Front/Api/LeCoffreApi/SuperAdmin/Customers/Customers"; +import Folders, { IPutFoldersParams } from "@Front/Api/LeCoffreApi/SuperAdmin/Folders/Folders"; import Button, { EButtonVariant } from "@Front/Components/DesignSystem/Button"; import Form from "@Front/Components/DesignSystem/Form"; import InputField from "@Front/Components/DesignSystem/Form/Elements/InputField"; @@ -7,24 +11,22 @@ import { IOption } from "@Front/Components/DesignSystem/Select"; import Typography, { ITypo } from "@Front/Components/DesignSystem/Typography"; import BackArrow from "@Front/Components/Elements/BackArrow"; import DefaultNotaryDashboard, { IDashBoardFolder } from "@Front/Components/LayoutTemplates/DefaultNotaryDashboard"; +import Module from "@Front/Config/Module"; +import { ECivility } from "le-coffre-resources/dist/Customer/Contact"; +import { Customer } from "le-coffre-resources/dist/Notary"; +import Link from "next/link"; import { NextRouter, useRouter } from "next/router"; import BasePage from "../../Base"; import classes from "./classes.module.scss"; -import Link from "next/link"; -import Module from "@Front/Config/Module"; -import { ECivility } from "le-coffre-resources/dist/Customer/Contact"; -import Folders, { IPutFoldersParams } from "@Front/Api/LeCoffreApi/SuperAdmin/Folders/Folders"; -import Customers from "@Front/Api/LeCoffreApi/SuperAdmin/Customers/Customers"; -import { Customer } from "le-coffre-resources/dist/Notary"; type IProps = {}; type IState = { selectedFolder: IDashBoardFolder | null; - isExistingClientSelected: boolean; - isNewClientSelected: boolean; - availableCustomers: Customer[] | null; + selectedOption: "new_customer" | "existing_customer"; + availableCustomers: Customer[]; selectedCustomers: readonly IOption[]; + existingCustomers: IOption[]; }; type IPropsClass = IProps & { @@ -36,10 +38,10 @@ class AddClientToFolderClass extends BasePage { super(props); this.state = { selectedFolder: null, - isExistingClientSelected: true, - isNewClientSelected: false, + selectedOption: "existing_customer", availableCustomers: [], selectedCustomers: [], + existingCustomers: [], }; this.onSelectedFolder = this.onSelectedFolder.bind(this); this.onExistingClientSelected = this.onExistingClientSelected.bind(this); @@ -61,24 +63,27 @@ class AddClientToFolderClass extends BasePage { Associer un ou plusieurs client(s)
- - Client existant - + {this.state.availableCustomers.length !== 0 && ( + + Client existant + + )} + Nouveau client
- {this.state.isExistingClientSelected && ( + {this.state.selectedOption === "existing_customer" && (
{
)} - {this.state.isNewClientSelected && ( + {this.state.selectedOption === "new_customer" && (
@@ -118,9 +123,21 @@ class AddClientToFolderClass extends BasePage { public override async componentDidMount() { const query = {}; const availableCustomers = await Customers.getInstance().get(query); - let preSelectedCustomers: IOption[] | undefined = await this.getFolderPreSelectedCustomers(this.props.selectedFolderUid); - const selectedCustomers = preSelectedCustomers ?? []; - this.setState({ availableCustomers, selectedCustomers }); + let preExistingCustomers: IOption[] | undefined = await this.getFolderPreSelectedCustomers(this.props.selectedFolderUid); + const existingCustomers = preExistingCustomers ?? []; + + existingCustomers.forEach((customer) => { + const index = availableCustomers.findIndex((availableCustomer) => availableCustomer.uid === customer.value); + if (index !== -1) availableCustomers.splice(index, 1); + }); + + if (availableCustomers.length === 0) { + this.setState({ + selectedOption: "new_customer", + }); + } + + this.setState({ availableCustomers, existingCustomers }); } private async getFolderPreSelectedCustomers(folderUid: string): Promise { @@ -137,10 +154,10 @@ class AddClientToFolderClass extends BasePage { }, }, }; - let preSelectedCustomers: IOption[] = []; + let preExistingCustomers: IOption[] = []; try { const folder = await Folders.getInstance().getByUid(folderUid, query); - preSelectedCustomers = folder.office_folder_has_customers!.map((folderHasCustomer) => { + preExistingCustomers = folder.office_folder_has_customers!.map((folderHasCustomer) => { return { label: folderHasCustomer.customer.contact?.first_name + " " + folderHasCustomer.customer.contact?.last_name, value: folderHasCustomer.customer.uid, @@ -150,7 +167,7 @@ class AddClientToFolderClass extends BasePage { this.props.router.push(Module.getInstance().get().modules.pages["404"].props.path); return; } - return preSelectedCustomers; + return preExistingCustomers; } private getSelectedOptions(): IOption[] { @@ -173,11 +190,11 @@ class AddClientToFolderClass extends BasePage { } private onExistingClientSelected(): void { - this.setState({ isExistingClientSelected: true, isNewClientSelected: false }); + this.setState({ selectedOption: "existing_customer" }); } private onNewClientSelected(): void { - this.setState({ isExistingClientSelected: false, isNewClientSelected: true }); + this.setState({ selectedOption: "new_customer" }); } private async onFormSubmit( @@ -188,13 +205,14 @@ class AddClientToFolderClass extends BasePage { ) { values["civility"] = ECivility.MALE; // TODO: should maybe be deleted later or added to the form - let customersToLink: IPutFoldersParams["office_folder_has_customers"] = this.state.selectedCustomers.map((customer) => { + const allCustomersToLink = this.state.selectedCustomers.concat(this.state.existingCustomers); + let customersToLink: IPutFoldersParams["office_folder_has_customers"] = allCustomersToLink.map((customer) => { return { customer: { uid: customer.value }, }; }) as IPutFoldersParams["office_folder_has_customers"]; - if (this.state.isNewClientSelected) { + if (this.state.selectedOption === "new_customer") { const customer: Customer = await Customers.getInstance().post({ contact: values, });