1
0
mirror of https://github.com/bitwarden/browser synced 2025-12-15 15:53:27 +00:00

[PM-10514] New TOTP Counter Component (#10486)

* new vault totp countdown component
This commit is contained in:
Jason Ng
2024-08-15 10:03:14 -04:00
committed by GitHub
parent 0b24789449
commit 72767dec74
5 changed files with 149 additions and 20 deletions

View File

@@ -3,7 +3,7 @@
<h2 bitTypography="h6">{{ "loginCredentials" | i18n }}</h2>
</bit-section-header>
<bit-card>
<bit-form-field [disableMargin]="!login.password && !login.totp">
<bit-form-field [disableMargin]="!cipher.login.password && !cipher.login.totp">
<bit-label>
{{ "username" | i18n }}
</bit-label>
@@ -11,7 +11,7 @@
readonly
bitInput
type="text"
[value]="login.username"
[value]="cipher.login.username"
aria-readonly="true"
data-testid="login-username"
/>
@@ -19,20 +19,20 @@
bitIconButton="bwi-clone"
bitSuffix
type="button"
[appCopyClick]="login.username"
[appCopyClick]="cipher.login.username"
[valueLabel]="'username' | i18n"
showToast
[appA11yTitle]="'copyValue' | i18n"
data-testid="toggle-username"
></button>
</bit-form-field>
<bit-form-field [disableMargin]="!login.totp">
<bit-form-field [disableMargin]="!cipher.login.totp">
<bit-label>{{ "password" | i18n }}</bit-label>
<input
readonly
bitInput
type="password"
[value]="login.password"
[value]="cipher.login.password"
aria-readonly="true"
data-testid="login-password"
/>
@@ -45,7 +45,7 @@
(toggledChange)="pwToggleValue($event)"
></button>
<button
*ngIf="viewPassword && passwordRevealed"
*ngIf="cipher.viewPassword && passwordRevealed"
bitIconButton="bwi-numbered-list"
bitSuffix
type="button"
@@ -58,7 +58,7 @@
bitIconButton="bwi-clone"
bitSuffix
type="button"
[appCopyClick]="login.password"
[appCopyClick]="cipher.login.password"
[valueLabel]="'password' | i18n"
showToast
[appA11yTitle]="'copyValue' | i18n"
@@ -66,9 +66,12 @@
></button>
</bit-form-field>
<ng-container *ngIf="showPasswordCount && passwordRevealed">
<bit-color-password [password]="login.password" [showCount]="true"></bit-color-password>
<bit-color-password
[password]="cipher.login.password"
[showCount]="true"
></bit-color-password>
</ng-container>
<bit-form-field disableMargin *ngIf="login.totp">
<bit-form-field disableMargin *ngIf="cipher.login.totp">
<bit-label
>{{ "verificationCodeTotp" | i18n }}
<span
@@ -84,17 +87,25 @@
<input
readonly
bitInput
type="text"
[value]="login.totp"
[type]="!(isPremium$ | async) ? 'password' : 'text'"
[value]="totpCopyCode || '*** ***'"
aria-readonly="true"
data-testid="login-totp"
[disabled]="!(isPremium$ | async)"
/>
<button
*ngIf="isPremium$ | async"
bitTotpCountdown
[cipher]="cipher"
bitSuffix
type="button"
(sendCopyCode)="setTotpCopyCode($event)"
></button>
<button
bitIconButton="bwi-clone"
bitSuffix
type="button"
[appCopyClick]="login.totp"
[appCopyClick]="totpCopyCode"
[valueLabel]="'verificationCodeTotp' | i18n"
showToast
[appA11yTitle]="'copyValue' | i18n"