1
0
mirror of https://github.com/bitwarden/browser.git synced 2024-11-25 12:15:18 +01:00

update search state to show contextual no results view messages (#11570)

This commit is contained in:
Jonathan Prusik 2024-10-21 09:47:01 -04:00 committed by GitHub
parent cbb6cf42aa
commit 6335dd6cd7
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 36 additions and 15 deletions

View File

@ -49,17 +49,22 @@
<!-- Display when no matching ciphers exist -->
<ng-container *ngIf="!displayedCiphers.length">
<bit-no-items class="tw-text-main" [icon]="noResultsIcon">
<ng-container slot="title">{{ "noMatchingLoginsForSite" | i18n }}</ng-container>
<ng-container slot="description">{{ "searchSavePasskeyNewLogin" | i18n }}</ng-container>
<ng-container slot="title">{{
(hasSearched ? "noItemsMatchSearch" : "noMatchingLoginsForSite") | i18n
}}</ng-container>
<ng-container slot="description">{{
(hasSearched ? "searchSavePasskeyNewLogin" : "clearFiltersOrTryAnother") | i18n
}}</ng-container>
<button
bitButton
buttonType="primary"
slot="button"
type="button"
(click)="saveNewLogin()"
(click)="hasSearched ? clearSearch() : saveNewLogin()"
[loading]="loading"
>
{{ "savePasskeyNewLogin" | i18n }}
{{ (hasSearched ? "multiSelectClearAll" : "savePasskeyNewLogin") | i18n }}
</button>
</bit-no-items>
</ng-container>
@ -100,17 +105,22 @@
<!-- Display when no matching ciphers exist -->
<ng-container *ngIf="!displayedCiphers.length">
<bit-no-items class="tw-text-main" [icon]="noResultsIcon">
<ng-container slot="title">{{ "noItemsMatchSearch" | i18n }}</ng-container>
<ng-container slot="description">{{ "clearFiltersOrTryAnother" | i18n }}</ng-container>
<ng-container slot="title">{{
(hasSearched ? "noItemsMatchSearch" : "noMatchingLoginsForSite") | i18n
}}</ng-container>
<ng-container slot="description">{{
(hasSearched ? "searchSavePasskeyNewLogin" : "clearFiltersOrTryAnother") | i18n
}}</ng-container>
<button
bitButton
buttonType="primary"
slot="button"
type="button"
(click)="saveNewLogin()"
(click)="hasSearched ? clearSearch() : saveNewLogin()"
[loading]="loading"
>
{{ "savePasskeyNewLogin" | i18n }}
{{ (hasSearched ? "multiSelectClearAll" : "savePasskeyNewLogin") | i18n }}
</button>
</bit-no-items>
</ng-container>

View File

@ -91,7 +91,6 @@ interface ViewData {
export class Fido2Component implements OnInit, OnDestroy {
private destroy$ = new Subject<void>();
private message$ = new BehaviorSubject<BrowserFido2Message>(null);
private hasSearched = false;
protected BrowserFido2MessageTypes = BrowserFido2MessageTypes;
protected cipher: CipherView;
protected ciphers?: CipherView[] = [];
@ -104,6 +103,7 @@ export class Fido2Component implements OnInit, OnDestroy {
protected noResultsIcon = Icons.NoResults;
protected passkeyAction: PasskeyActionValue = PasskeyActions.Register;
protected PasskeyActions = PasskeyActions;
protected hasSearched = false;
protected searchText: string;
protected searchTypeSearch = false;
protected senderTabId?: string;
@ -370,19 +370,30 @@ export class Fido2Component implements OnInit, OnDestroy {
return this.equivalentDomains;
}
async clearSearch() {
this.searchText = "";
await this.setDisplayedCiphersToAllDomainMatch();
}
protected async setDisplayedCiphersToAllDomainMatch() {
const equivalentDomains = await this.getEquivalentDomains();
this.displayedCiphers = this.ciphers.filter((cipher) =>
cipher.login.matchesUri(this.url, equivalentDomains),
);
}
protected async search() {
this.hasSearched = await this.searchService.isSearchable(this.searchText);
if (this.hasSearched) {
this.hasSearched = true;
const isSearchable = await this.searchService.isSearchable(this.searchText);
if (isSearchable) {
this.displayedCiphers = await this.searchService.searchCiphers(
this.searchText,
null,
this.ciphers,
);
} else {
const equivalentDomains = await this.getEquivalentDomains();
this.displayedCiphers = this.ciphers.filter((cipher) =>
cipher.login.matchesUri(this.url, equivalentDomains),
);
await this.setDisplayedCiphersToAllDomainMatch();
}
}