[PM-8335] Show autofill suggestion when no autofill login items present (#9521)

This commit is contained in:
Shane Melton 2024-06-06 10:43:55 -07:00 committed by GitHub
parent 7d12d1a74f
commit 79968c2d32
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 18 additions and 23 deletions

View File

@ -4,25 +4,6 @@
[title]="'autofillSuggestions' | i18n"
[showRefresh]="showRefresh"
(onRefresh)="refreshCurrentTab()"
[description]="(showEmptyAutofillTip$ | async) ? ('autofillSuggestionsTip' | i18n) : null"
showAutofillButton
></app-vault-list-items-container>
<ng-container *ngIf="showEmptyAutofillTip$ | async">
<bit-section>
<bit-section-header>
<h2 bitTypography="h6">
{{ "autofillSuggestions" | i18n }}
</h2>
<button
*ngIf="showRefresh"
bitIconButton="bwi-refresh"
size="small"
type="button"
[appA11yTitle]="'refresh' | i18n"
(click)="refreshCurrentTab()"
></button>
</bit-section-header>
<span class="tw-text-muted tw-px-1" bitTypography="body2">{{
"autofillSuggestionsTip" | i18n
}}</span>
</bit-section>
</ng-container>

View File

@ -3,6 +3,7 @@ import { Component } from "@angular/core";
import { combineLatest, map, Observable } from "rxjs";
import { JslibModule } from "@bitwarden/angular/jslib.module";
import { CipherType } from "@bitwarden/common/vault/enums";
import {
IconButtonModule,
SectionComponent,
@ -45,7 +46,7 @@ export class AutofillVaultListItemsComponent {
/**
* Observable that determines whether the empty autofill tip should be shown.
* The tip is shown when there are no ciphers to autofill, no filter is applied, and autofill is allowed in
* The tip is shown when there are no login ciphers to autofill, no filter is applied, and autofill is allowed in
* the current context (e.g. not in a popout).
* @protected
*/
@ -54,7 +55,10 @@ export class AutofillVaultListItemsComponent {
this.autofillCiphers$,
this.vaultPopupItemsService.autofillAllowed$,
]).pipe(
map(([hasFilter, ciphers, canAutoFill]) => !hasFilter && canAutoFill && ciphers.length === 0),
map(
([hasFilter, ciphers, canAutoFill]) =>
!hasFilter && canAutoFill && ciphers.filter((c) => c.type == CipherType.Login).length === 0,
),
);
constructor(private vaultPopupItemsService: VaultPopupItemsService) {

View File

@ -1,4 +1,4 @@
<bit-section *ngIf="ciphers?.length > 0">
<bit-section *ngIf="ciphers?.length > 0 || description">
<bit-section-header>
<h2 bitTypography="h6">
{{ title }}
@ -13,6 +13,9 @@
></button>
<span bitTypography="body2" slot="end">{{ ciphers.length }}</span>
</bit-section-header>
<div *ngIf="description" class="tw-text-muted tw-px-1 tw-mb-2" bitTypography="body2">
{{ description }}
</div>
<bit-item-group>
<bit-item *ngFor="let cipher of ciphers">
<a

View File

@ -50,6 +50,13 @@ export class VaultListItemsContainerComponent {
@Input()
title: string;
/**
* Optional description for the vault list item section. Will be shown below the title even when
* no ciphers are available.
*/
@Input()
description: string;
/**
* Option to show a refresh button in the section header.
*/