Upstream/bitwarden-browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser.git synced 2024-11-21 11:35:34 +01:00
Code Issues Projects Releases Wiki Activity

[PM-14190] Replace history card with item component (#11775)

Browse Source
This commit is contained in:
✨ Audrey ✨ 2024-10-30 09:43:18 -04:00 committed by GitHub
parent 7ce26f7aea
commit 8af0b6e380
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 39 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
libs/tools/generator/components/src/credential-generator-history.component.html
View File

@ -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>

21
libs/tools/generator/components/src/credential-generator-history.component.ts
View File

@ -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;
}
}