AC-2390 Migrate Password Generator component (#8799)

This commit is contained in:
KiruthigaManivannan 2024-05-21 18:46:31 +05:30 committed by GitHub
parent e2c90310a3
commit 7053d0c7ec
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 62 additions and 142 deletions

View File

@ -1,144 +1,64 @@
<div [formGroup]="data"> <div [formGroup]="data">
<div class="form-group"> <bit-form-control>
<div class="form-check"> <input type="checkbox" bitCheckbox [formControl]="enabled" id="enabled" />
<input <bit-label>{{ "turnOn" | i18n }}</bit-label>
class="form-check-input" </bit-form-control>
type="checkbox"
id="enabled" <div class="tw-grid tw-grid-cols-12 tw-gap-4">
[formControl]="enabled" <bit-form-field class="tw-col-span-6 tw-mb-0">
name="Enabled" <bit-label>{{ "defaultType" | i18n }}</bit-label>
/> <bit-select formControlName="defaultType" id="defaultType">
<label class="form-check-label" for="enabled">{{ "turnOn" | i18n }}</label> <bit-option *ngFor="let o of defaultTypes" [value]="o.value" [label]="o.name"></bit-option>
</div> </bit-select>
</bit-form-field>
</div> </div>
<div class="row"> <h3 bitTypography="h3" class="tw-mt-4">{{ "password" | i18n }}</h3>
<div class="col-6 form-group mb-0"> <div class="tw-grid tw-grid-cols-12 tw-gap-4">
<label for="defaultType">{{ "defaultType" | i18n }}</label> <bit-form-field class="tw-col-span-6">
<select <bit-label>{{ "minLength" | i18n }}</bit-label>
id="defaultType" <input bitInput type="number" min="5" max="128" formControlName="minLength" />
name="defaultType" </bit-form-field>
formControlName="defaultType"
class="form-control"
>
<option *ngFor="let o of defaultTypes" [ngValue]="o.value">{{ o.name }}</option>
</select>
</div> </div>
<div class="tw-grid tw-grid-cols-12 tw-gap-4">
<bit-form-field class="tw-col-span-6">
<bit-label>{{ "minNumbers" | i18n }}</bit-label>
<input bitInput type="number" min="0" max="9" formControlName="minNumbers" />
</bit-form-field>
<bit-form-field class="tw-col-span-6">
<bit-label>{{ "minSpecial" | i18n }}</bit-label>
<input bitInput type="number" min="0" max="9" formControlName="minSpecial" />
</bit-form-field>
</div> </div>
<h3 class="mt-4">{{ "password" | i18n }}</h3> <bit-form-control>
<div class="row"> <input type="checkbox" bitCheckbox formControlName="useUpper" id="useUpper" />
<div class="col-6 form-group"> <bit-label>A-Z</bit-label>
<label for="minLength">{{ "minLength" | i18n }}</label> </bit-form-control>
<input <bit-form-control>
id="minLength" <input type="checkbox" bitCheckbox formControlName="useLower" id="useLower" />
class="form-control" <bit-label>a-z</bit-label>
type="number" </bit-form-control>
name="minLength" <bit-form-control>
min="5" <input type="checkbox" bitCheckbox formControlName="useNumbers" id="useNumbers" />
max="128" <bit-label>0-9</bit-label>
formControlName="minLength" </bit-form-control>
/> <bit-form-control>
</div> <input type="checkbox" bitCheckbox formControlName="useSpecial" id="useSpecial" />
</div> <bit-label>!@#$%^&amp;*</bit-label>
<div class="row"> </bit-form-control>
<div class="col-6 form-group"> <h3 bitTypography="h3" class="tw-mt-4">{{ "passphrase" | i18n }}</h3>
<label for="minNumbers">{{ "minNumbers" | i18n }}</label> <div class="tw-grid tw-grid-cols-12 tw-gap-4">
<input <bit-form-field class="tw-col-span-6">
id="minNumbers" <bit-label>{{ "minimumNumberOfWords" | i18n }}</bit-label>
class="form-control" <input bitInput type="number" min="3" max="20" formControlName="minNumberWords" />
type="number" </bit-form-field>
name="minNumbers"
min="0"
max="9"
formControlName="minNumbers"
/>
</div>
<div class="col-6 form-group">
<label for="minSpecial">{{ "minSpecial" | i18n }}</label>
<input
id="minSpecial"
class="form-control"
type="number"
name="minSpecial"
min="0"
max="9"
formControlName="minSpecial"
/>
</div>
</div>
<div class="form-check">
<input
class="form-check-input"
type="checkbox"
id="useUpper"
formControlName="useUpper"
name="useUpper"
/>
<label class="form-check-label" for="useUpper">A-Z</label>
</div>
<div class="form-check">
<input
class="form-check-input"
type="checkbox"
id="useLower"
name="useLower"
formControlName="useLower"
/>
<label class="form-check-label" for="useLower">a-z</label>
</div>
<div class="form-check">
<input
class="form-check-input"
type="checkbox"
id="useNumbers"
name="useNumbers"
formControlName="useNumbers"
/>
<label class="form-check-label" for="useNumbers">0-9</label>
</div>
<div class="form-check">
<input
class="form-check-input"
type="checkbox"
id="useSpecial"
name="useSpecial"
formControlName="useSpecial"
/>
<label class="form-check-label" for="useSpecial">!@#$%^&amp;*</label>
</div>
<h3 class="mt-4">{{ "passphrase" | i18n }}</h3>
<div class="row">
<div class="col-6 form-group">
<label for="minNumberWords">{{ "minimumNumberOfWords" | i18n }}</label>
<input
id="minNumberWords"
class="form-control"
type="number"
name="minNumberWords"
min="3"
max="20"
formControlName="minNumberWords"
/>
</div>
</div>
<div class="form-check">
<input
class="form-check-input"
type="checkbox"
id="capitalize"
name="capitalize"
formControlName="capitalize"
/>
<label class="form-check-label" for="capitalize">{{ "capitalize" | i18n }}</label>
</div>
<div class="form-check">
<input
class="form-check-input"
type="checkbox"
id="includeNumber"
name="includeNumber"
formControlName="includeNumber"
/>
<label class="form-check-label" for="includeNumber">{{ "includeNumber" | i18n }}</label>
</div> </div>
<bit-form-control>
<input type="checkbox" bitCheckbox formControlName="capitalize" id="capitalize" />
<bit-label>{{ "capitalize" | i18n }}</bit-label>
</bit-form-control>
<bit-form-control>
<input type="checkbox" bitCheckbox formControlName="includeNumber" id="includeNumber" />
<bit-label>{{ "includeNumber" | i18n }}</bit-label>
</bit-form-control>
</div> </div>

View File

@ -1,5 +1,5 @@
import { Component } from "@angular/core"; import { Component } from "@angular/core";
import { UntypedFormBuilder } from "@angular/forms"; import { UntypedFormBuilder, Validators } from "@angular/forms";
import { PolicyType } from "@bitwarden/common/admin-console/enums"; import { PolicyType } from "@bitwarden/common/admin-console/enums";
import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service"; import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
@ -20,14 +20,14 @@ export class PasswordGeneratorPolicy extends BasePolicy {
export class PasswordGeneratorPolicyComponent extends BasePolicyComponent { export class PasswordGeneratorPolicyComponent extends BasePolicyComponent {
data = this.formBuilder.group({ data = this.formBuilder.group({
defaultType: [null], defaultType: [null],
minLength: [null], minLength: [null, [Validators.min(5), Validators.max(128)]],
useUpper: [null], useUpper: [null],
useLower: [null], useLower: [null],
useNumbers: [null], useNumbers: [null],
useSpecial: [null], useSpecial: [null],
minNumbers: [null], minNumbers: [null, [Validators.min(0), Validators.max(9)]],
minSpecial: [null], minSpecial: [null, [Validators.min(0), Validators.max(9)]],
minNumberWords: [null], minNumberWords: [null, [Validators.min(3), Validators.max(20)]],
capitalize: [null], capitalize: [null],
includeNumber: [null], includeNumber: [null],
}); });