mirror of
https://github.com/bitwarden/browser.git
synced 2024-11-07 09:31:31 +01:00
[PM-14190] Replace history card with item component (#11775)
This commit is contained in:
parent
7ce26f7aea
commit
8af0b6e380
@ -1,23 +1,22 @@
|
||||
<bit-card *ngFor="let credential of credentials$ | async" class="tw-mb-2">
|
||||
<div class="tw-flex tw-justify-between tw-items-center">
|
||||
<div class="tw-flex tw-flex-col">
|
||||
<bit-color-password
|
||||
class="tw-font-mono"
|
||||
[password]="credential.credential"
|
||||
></bit-color-password>
|
||||
<span class="tw-text-muted" bitTypography="body1">{{
|
||||
credential.generationDate | date: "medium"
|
||||
}}</span>
|
||||
<bit-item *ngFor="let credential of credentials$ | async">
|
||||
<bit-item-content>
|
||||
<bit-color-password class="tw-font-mono" [password]="credential.credential" />
|
||||
<div slot="secondary">
|
||||
{{ credential.generationDate | date: "medium" }}
|
||||
</div>
|
||||
<button
|
||||
bitIconButton="bwi-clone"
|
||||
bitSuffix
|
||||
size="small"
|
||||
type="button"
|
||||
[appCopyClick]="credential.credential"
|
||||
[ariaLabel]="'copyPassword' | i18n"
|
||||
[appA11yTitle]="'copyPassword' | i18n"
|
||||
showToast
|
||||
></button>
|
||||
</div>
|
||||
</bit-card>
|
||||
</bit-item-content>
|
||||
<ng-container slot="end">
|
||||
<bit-item-action>
|
||||
<button
|
||||
type="button"
|
||||
bitIconButton="bwi-clone"
|
||||
[appCopyClick]="credential.credential"
|
||||
[valueLabel]="getGeneratedValueText(credential)"
|
||||
[appA11yTitle]="getCopyText(credential)"
|
||||
showToast
|
||||
>
|
||||
{{ getCopyText(credential) }}
|
||||
</button>
|
||||
</bit-item-action>
|
||||
</ng-container>
|
||||
</bit-item>
|
||||
|
@ -8,15 +8,18 @@ import { JslibModule } from "@bitwarden/angular/jslib.module";
|
||||
import { AccountService } from "@bitwarden/common/auth/abstractions/account.service";
|
||||
import { UserId } from "@bitwarden/common/types/guid";
|
||||
import {
|
||||
CardComponent,
|
||||
ColorPasswordModule,
|
||||
IconButtonModule,
|
||||
ItemModule,
|
||||
NoItemsModule,
|
||||
SectionComponent,
|
||||
SectionHeaderComponent,
|
||||
} from "@bitwarden/components";
|
||||
import { CredentialGeneratorService } from "@bitwarden/generator-core";
|
||||
import { GeneratedCredential, GeneratorHistoryService } from "@bitwarden/generator-history";
|
||||
|
||||
import { GeneratorModule } from "./generator.module";
|
||||
|
||||
@Component({
|
||||
standalone: true,
|
||||
selector: "bit-credential-generator-history",
|
||||
@ -28,9 +31,10 @@ import { GeneratedCredential, GeneratorHistoryService } from "@bitwarden/generat
|
||||
NoItemsModule,
|
||||
JslibModule,
|
||||
RouterLink,
|
||||
CardComponent,
|
||||
ItemModule,
|
||||
SectionComponent,
|
||||
SectionHeaderComponent,
|
||||
GeneratorModule,
|
||||
],
|
||||
})
|
||||
export class CredentialGeneratorHistoryComponent {
|
||||
@ -39,6 +43,7 @@ export class CredentialGeneratorHistoryComponent {
|
||||
|
||||
constructor(
|
||||
private accountService: AccountService,
|
||||
private generatorService: CredentialGeneratorService,
|
||||
private history: GeneratorHistoryService,
|
||||
) {
|
||||
this.accountService.activeAccount$
|
||||
@ -53,8 +58,18 @@ export class CredentialGeneratorHistoryComponent {
|
||||
.pipe(
|
||||
takeUntilDestroyed(),
|
||||
switchMap((id) => id && this.history.credentials$(id)),
|
||||
map((credentials) => credentials),
|
||||
map((credentials) => credentials.filter((c) => (c.credential ?? "") !== "")),
|
||||
)
|
||||
.subscribe(this.credentials$);
|
||||
}
|
||||
|
||||
protected getCopyText(credential: GeneratedCredential) {
|
||||
const info = this.generatorService.algorithm(credential.category);
|
||||
return info.copy;
|
||||
}
|
||||
|
||||
protected getGeneratedValueText(credential: GeneratedCredential) {
|
||||
const info = this.generatorService.algorithm(credential.category);
|
||||
return info.generatedValue;
|
||||
}
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user