🐛 Fixing search

This commit is contained in:
Maxime Lalo 2023-09-19 15:52:23 +02:00
parent 5f1f9d3d00
commit bd38dd6a8d
2 changed files with 12 additions and 7 deletions

View File

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

View File

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