Merge branch 'staging' into dev

src/front/Components/DesignSystem/BlockList/classes.module.scss

@@ -21,7 +21,7 @@
 		display: inline-flex;
 		justify-content: space-between;
 		align-items: center;
-
+		overflow-wrap: anywhere;
 		.warning {
 			margin-left: 32px;
 		}

src/front/Components/DesignSystem/FolderBoxInformation/classes.module.scss

@@ -23,13 +23,13 @@
 		.text-container {
 			display: flex;
 			flex-direction: column;
+			overflow-wrap: anywhere;
 
 			> :first-child {
 				margin-bottom: 12px;
 			}
 		}
 
-
 		@media (max-width: $screen-ls) {
 			grid-template-columns: 1fr 1fr;
 		}
@@ -37,8 +37,6 @@
 		@media (max-width: $screen-s) {
 			grid-template-columns: 1fr;
 		}
-
-
 	}
 
 	.edit-icon-container {
@@ -54,5 +52,4 @@
 			margin-top: 24px;
 		}
 	}
-
 }

src/front/Components/DesignSystem/FolderListContainer/index.tsx

@@ -26,6 +26,7 @@ type IPropsClass = IProps & {
 
 type IState = {
 	filteredFolders: OfficeFolder[];
+	blocks: IBlock[];
 };
 
 class FolderListContainerClass extends React.Component<IPropsClass, IState> {
@@ -36,6 +37,7 @@ class FolderListContainerClass extends React.Component<IPropsClass, IState> {
 		super(props);
 		this.state = {
 			filteredFolders: this.props.folders,
+			blocks: this.getBlocks(this.props.folders),
 		};
 		this.filterFolders = this.filterFolders.bind(this);
 		this.onSelectedFolder = this.onSelectedFolder.bind(this);
@@ -50,7 +52,7 @@ class FolderListContainerClass extends React.Component<IPropsClass, IState> {
 						<SearchBar onChange={this.filterFolders} placeholder="Chercher un dossier" />
 					</div>
 					<div className={classes["folderlist-container"]}>
-						<BlockList blocks={this.getBlocks()} onSelectedBlock={this.onSelectedFolder} />
+						<BlockList blocks={this.state.blocks} onSelectedBlock={this.onSelectedFolder} />
 					</div>
 				</div>
 				{!this.props.isArchived && (
@@ -73,8 +75,8 @@ class FolderListContainerClass extends React.Component<IPropsClass, IState> {
 		);
 	}
 
-	private getBlocks(): IBlock[] {
+	private getBlocks(folders: OfficeFolder[]): IBlock[] {
-		const pendingFolders = this.props.folders
+		const pendingFolders = folders
 			.filter((folder) => {
 				const pendingDocuments = (folder.documents ?? []).filter(
 					(document) => document.document_status === EDocumentStatus.DEPOSITED,
@@ -85,7 +87,7 @@ class FolderListContainerClass extends React.Component<IPropsClass, IState> {
 				return folder1.created_at! > folder2.created_at! ? -1 : 1;
 			});
 
-		const otherFolders = this.props.folders
+		const otherFolders = folders
 			.filter((folder) => {
 				const pendingDocuments = (folder.documents ?? []).filter(
 					(document) => document.document_status === EDocumentStatus.DEPOSITED,
@@ -104,6 +106,7 @@ class FolderListContainerClass extends React.Component<IPropsClass, IState> {
 			};
 		});
 	}
+
 	private onSelectedFolder(block: IBlock) {
 		const folder = this.props.folders.find((folder) => folder.uid === block.id);
 		if (!folder) return;
@@ -116,19 +119,21 @@ class FolderListContainerClass extends React.Component<IPropsClass, IState> {
 		const filteredFolders: OfficeFolder[] = this.props.folders.filter((folder) => {
 			const name = folder.name.toLowerCase();
 			const number = folder.folder_number.toLowerCase();
-
+			value = value.toLowerCase();
 			if (folder.customers) {
 				const customerNames = folder.customers
 					.map((customer) => {
 						return `${customer.contact?.first_name.toLowerCase()} ${customer.contact?.last_name.toLowerCase()}`;
 					})
 					.join(", ");
+
 				return name.includes(value) || number.includes(value) || customerNames.includes(value);
 			}
 
 			return name.includes(value) || number.includes(value);
 		});
-		this.setState({ filteredFolders });
+
+		this.setState({ filteredFolders, blocks: this.getBlocks(filteredFolders) });
 	}
 }
 

src/front/Components/Layouts/Folder/UpdateFolderCollaborators/index.tsx

@@ -24,7 +24,9 @@ type IState = {
 	selectedFolder: OfficeFolder | null;
 	selectedOption?: ERadioBoxValue;
 	availableCollaborators: User[];
+	defaultCheckedAllOffice: boolean;
 	selectedCollaborators: readonly IOption[];
+	loading: boolean;
 };
 
 enum ERadioBoxValue {
@@ -39,6 +41,9 @@ class UpdateFolderCollaboratorsClass extends BasePage<IPropsClass, IState> {
 			selectedFolder: null,
 			availableCollaborators: [],
 			selectedCollaborators: [],
+			defaultCheckedAllOffice: false,
+			selectedOption: ERadioBoxValue.SELECTION,
+			loading: true,
 		};
 		this.onSelectedFolder = this.onSelectedFolder.bind(this);
 		this.onSelectedOptionAllOffice = this.onSelectedOptionAllOffice.bind(this);
@@ -55,6 +60,7 @@ class UpdateFolderCollaboratorsClass extends BasePage<IPropsClass, IState> {
 				value: collaborator.uid,
 			};
 		});
+
 		return (
 			<DefaultNotaryDashboard title={"Ajouter client(s)"} onSelectedFolder={this.onSelectedFolder}>
 				<div className={classes["root"]}>
@@ -63,12 +69,21 @@ class UpdateFolderCollaboratorsClass extends BasePage<IPropsClass, IState> {
 					</div>
 					<Typography typo={ITypo.H1Bis}>Modifier les collaborateurs</Typography>
 
+					{!this.state.loading && (
 						<Form className={classes["form"]} onSubmit={this.onFormSubmit}>
 							<div className={classes["content"]}>
-							<RadioBox name="office" value={ERadioBoxValue.ALL} defaultChecked onChange={this.onSelectedOptionAllOffice}>
+								<RadioBox
+									name="office"
+									value={ERadioBoxValue.ALL}
+									defaultChecked={this.state.defaultCheckedAllOffice}
+									onChange={this.onSelectedOptionAllOffice}>
 									Tout l'office
 								</RadioBox>
-							<RadioBox name="office" value={ERadioBoxValue.SELECTION} onChange={this.onSelectedOptionSpecific}>
+								<RadioBox
+									name="office"
+									value={ERadioBoxValue.SELECTION}
+									defaultChecked={!this.state.defaultCheckedAllOffice}
+									onChange={this.onSelectedOptionSpecific}>
 									Sélectionner des collaborateurs
 								</RadioBox>
 							</div>
@@ -91,6 +106,7 @@ class UpdateFolderCollaboratorsClass extends BasePage<IPropsClass, IState> {
 								<Button type="submit">Enregistrer</Button>
 							</div>
 						</Form>
+					)}
 				</div>
 			</DefaultNotaryDashboard>
 		);
@@ -121,11 +137,6 @@ class UpdateFolderCollaboratorsClass extends BasePage<IPropsClass, IState> {
 					value: collaborator.uid,
 				};
 			});
-			this.setState({ selectedCollaborators: preSelectedCollaborators });
-		} catch (error) {
-			this.props.router.push(Module.getInstance().get().modules.pages["404"].props.path);
-			return;
-		}
 
 			// no need to pass query 'where' param here, default query for notaries include only users which are in the same office as the caller
 			const userQuery: IGetUsersParams = {
@@ -140,8 +151,19 @@ class UpdateFolderCollaboratorsClass extends BasePage<IPropsClass, IState> {
 			};
 
 			const availableCollaborators = await Users.getInstance().get(userQuery);
-		console.log(availableCollaborators)
+
-		this.setState({ availableCollaborators });
+			this.setState({
+				loading: false,
+				availableCollaborators,
+				selectedCollaborators: preSelectedCollaborators,
+				defaultCheckedAllOffice: preSelectedCollaborators.length === availableCollaborators.length,
+				selectedOption:
+					preSelectedCollaborators.length === availableCollaborators.length ? ERadioBoxValue.ALL : ERadioBoxValue.SELECTION,
+			});
+		} catch (error) {
+			this.props.router.push(Module.getInstance().get().modules.pages["404"].props.path);
+			return;
+		}
 	}
 
 	private onSelectedOptionAllOffice(event: React.ChangeEvent<HTMLInputElement>) {