diff --git a/src/front/Components/DesignSystem/RadioBox/index.tsx b/src/front/Components/DesignSystem/RadioBox/index.tsx index 5db4f30e..f41d50ce 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,17 @@ type IProps = { children: React.ReactNode; name: string; toolTip?: string; + checked?: boolean; defaultChecked?: 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 +26,11 @@ export default class RadioBox extends React.Component { {this.props.children} {this.props.toolTip && } diff --git a/src/front/Components/Layouts/Folder/AddClientToFolder/index.tsx b/src/front/Components/Layouts/Folder/AddClientToFolder/index.tsx index 5daf7a2d..da0e9378 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,26 @@ 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"; +enum ESelectedOption { + EXISTING_CUSTOMER = "existing_customer", + NEW_CUSTOMER = "new_customer", +} type IProps = {}; type IState = { selectedFolder: IDashBoardFolder | null; - isExistingClientSelected: boolean; - isNewClientSelected: boolean; - availableCustomers: Customer[] | null; + selectedOption: ESelectedOption; + availableCustomers: Customer[]; selectedCustomers: readonly IOption[]; + existingCustomers: IOption[]; }; type IPropsClass = IProps & { @@ -36,10 +42,10 @@ class AddClientToFolderClass extends BasePage { super(props); this.state = { selectedFolder: null, - isExistingClientSelected: true, - isNewClientSelected: false, + selectedOption: ESelectedOption.EXISTING_CUSTOMER, availableCustomers: [], selectedCustomers: [], + existingCustomers: [], }; this.onSelectedFolder = this.onSelectedFolder.bind(this); this.onExistingClientSelected = this.onExistingClientSelected.bind(this); @@ -61,24 +67,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 +127,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: ESelectedOption.NEW_CUSTOMER, + }); + } + + this.setState({ availableCustomers, existingCustomers }); } private async getFolderPreSelectedCustomers(folderUid: string): Promise { @@ -137,10 +158,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 +171,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 +194,11 @@ class AddClientToFolderClass extends BasePage { } private onExistingClientSelected(): void { - this.setState({ isExistingClientSelected: true, isNewClientSelected: false }); + this.setState({ selectedOption: ESelectedOption.EXISTING_CUSTOMER }); } private onNewClientSelected(): void { - this.setState({ isExistingClientSelected: false, isNewClientSelected: true }); + this.setState({ selectedOption: ESelectedOption.NEW_CUSTOMER }); } private async onFormSubmit( @@ -188,13 +209,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, });