extern/egroupware_official
1
0
Fork 0
mirror of https://github.com/EGroupware/egroupware.git synced 2024-12-22 06:30:59 +01:00
Code Issues Packages Projects Releases Wiki Activity

SearchMixin: Change how loading spinner is done, "No results" now only shows after all searches are done.

Browse Source
This commit is contained in:
nathan 2024-01-08 11:33:53 -07:00
parent 518c8218d7
commit 76533722d1
1 changed files with 28 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
api/js/etemplate/Et2Select/SearchMixin.ts
View File

@ -257,6 +257,8 @@ export const Et2WithSearchMixin = dedupeMixin(<T extends Constructor<LitElement>
private _total_result_count = 0; private _total_result_count = 0;
protected _searchPromise = null;
/** /**
* These characters will end a free tag * These characters will end a free tag
* @type {string[]} * @type {string[]}
@ -491,8 +493,26 @@ export const Et2WithSearchMixin = dedupeMixin(<T extends Constructor<LitElement>
return nothing; return nothing;
} }
return html` const noSuggestions = html`
<div class="no-results">${this.egw().lang("no suggestions")}</div>`; <div class="no-results">${this.egw().lang("no suggestions")}</div>`;
if(!this._searchPromise)
{
return noSuggestions;
}
let noResults = this._searchPromise.then(() =>
{
return this._total_result_count == 0 ?
noSuggestions :
nothing;
});
return html`${until(
noResults,
html`
<sl-spinner></sl-spinner>`
)}`;
} }
/** /**
@ -1058,11 +1078,6 @@ export const Et2WithSearchMixin = dedupeMixin(<T extends Constructor<LitElement>
this.setAttribute("searching", ""); this.setAttribute("searching", "");
// Show a spinner
let spinner = document.createElement("sl-spinner");
spinner.slot = "expand-icon";
this.select.appendChild(spinner);
// Hide clear button // Hide clear button
let clear_button = <HTMLElement>this._searchInputNode?.shadowRoot?.querySelector(".input__clear"); let clear_button = <HTMLElement>this._searchInputNode?.shadowRoot?.querySelector(".input__clear");
if(clear_button) if(clear_button)
@ -1073,17 +1088,14 @@ export const Et2WithSearchMixin = dedupeMixin(<T extends Constructor<LitElement>
// Clear previous results // Clear previous results
this._total_result_count = 0; this._total_result_count = 0;
this._clearResults(); this._clearResults();
await this.updateComplete;
// Start the searches // Start the searches
return Promise.all([ this._searchPromise = Promise.all([
this.localSearch(this._searchInputNode.value, this.searchOptions), this.localSearch(this._searchInputNode.value, this.searchOptions),
this.remoteSearch(this._searchInputNode.value, this.searchOptions) this.remoteSearch(this._searchInputNode.value, this.searchOptions)
]).then(async() => ]).then(async() =>
{ {
this.removeAttribute("searching"); this.removeAttribute("searching");
// Remove spinner
spinner.remove();
// Restore clear button // Restore clear button
if(clear_button) if(clear_button)
@ -1091,7 +1103,13 @@ export const Et2WithSearchMixin = dedupeMixin(<T extends Constructor<LitElement>
clear_button.style.display = ""; clear_button.style.display = "";
} }
await this.updateComplete; await this.updateComplete;
this._searchPromise = null;
}); });
this.requestUpdate();
return this._searchPromise;
} }
/** /**