andwati/zitadel
1
0
Fork 0
mirror of https://github.com/andwati/zitadel.git synced 2026-10-21 23:14:26 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(console): set initial password on user create (#2920)

Browse Source 
* fix: cnsl verified mail desc

* add initial password on user create

* change text
This commit is contained in:
Max Peintner
2022-01-04 10:56:29 +01:00
committed by GitHub
parent 6d78fe28f5
commit fcf0fcc301
9 changed files with 192 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files
console/src/app/modules/password-complexity-view/password-complexity-view.component.html
+37 -37
View File
@@ -1,42 +1,42 @@
<div class="validation-col" *ngIf="this.policy">
<div class="val" *ngIf="this.policy.minLength">
<div class="val" *ngIf="this.policy.minLength">
<i *ngIf="password?.value?.length === 0; else showSpinner" class="las la-times red"></i>
<i *ngIf="password?.value?.length === 0; else showSpinner" class="las la-times red"></i>
<ng-template #showSpinner>
<div *ngIf="(password?.errors?.minlength || password?.value?.length === 0) as currentError; else trueminlength"
class="sp-wrapper">
<mat-progress-spinner class="spinner" diameter="20" [color]="currentError ? 'warn': 'valid'"
mode="determinate" [value]="(password?.value?.length / policy.minLength) * 100">
</mat-progress-spinner>
</div>
</ng-template>
<ng-template #trueminlength>
<i class="las la-check green"></i>
</ng-template>
<ng-template #showSpinner>
<div *ngIf="(password?.errors?.minlength || password?.value?.length === 0) as currentError; else trueminlength"
class="complexity-sp-wrapper">
<mat-progress-spinner class="complexity-spinner" diameter="20" [color]="currentError ? 'warn': 'valid'"
mode="determinate" [value]="(password?.value?.length / policy.minLength) * 100">
</mat-progress-spinner>
</div>
</ng-template>
<ng-template #trueminlength>
<i class="las la-check green"></i>
</ng-template>
<span>{{ 'USER.PASSWORD.MINLENGTHERROR' | translate: {value: policy?.minLength} }}
({{password?.value?.length}}/{{ policy.minLength}})
</span>
</div>
<div class="val" *ngIf="this.policy.hasSymbol">
<i *ngIf="password?.errors?.symbolValidator" class="las la-times red"></i>
<i *ngIf="!password?.errors?.symbolValidator" class="las la-check green"></i>
<span> {{ 'USER.VALIDATION.SYMBOLERROR' | translate }}</span>
</div>
<div class="val" *ngIf="this.policy.hasNumber">
<i *ngIf="password?.errors?.numberValidator" class="las la-times red"></i>
<i *ngIf="!password?.errors?.numberValidator" class="las la-check green"></i>
<span> {{ 'USER.VALIDATION.NUMBERERROR' | translate }}</span>
</div>
<div class="val" *ngIf="this.policy.hasUppercase">
<i *ngIf="password?.errors?.upperCaseValidator" class="las la-times red"></i>
<i *ngIf="!password?.errors?.upperCaseValidator" class="las la-check green"></i>
<span> {{ 'USER.VALIDATION.UPPERCASEMISSING' | translate }}</span>
</div>
<div class="val" *ngIf="this.policy.hasLowercase">
<i *ngIf="password?.errors?.lowerCaseValidator" class="las la-times red"></i>
<i *ngIf="!password?.errors?.lowerCaseValidator" class="las la-check green"></i>
<span>{{ 'USER.VALIDATION.LOWERCASEMISSING' | translate }}</span>
</div>
<span>{{ 'USER.PASSWORD.MINLENGTHERROR' | translate: {value: policy?.minLength} }}
({{password?.value?.length}}/{{ policy.minLength}})
</span>
</div>
<div class="val" *ngIf="this.policy.hasSymbol">
<i *ngIf="password?.errors?.symbolValidator" class="las la-times red"></i>
<i *ngIf="!password?.errors?.symbolValidator" class="las la-check green"></i>
<span> {{ 'USER.VALIDATION.SYMBOLERROR' | translate }}</span>
</div>
<div class="val" *ngIf="this.policy.hasNumber">
<i *ngIf="password?.errors?.numberValidator" class="las la-times red"></i>
<i *ngIf="!password?.errors?.numberValidator" class="las la-check green"></i>
<span> {{ 'USER.VALIDATION.NUMBERERROR' | translate }}</span>
</div>
<div class="val" *ngIf="this.policy.hasUppercase">
<i *ngIf="password?.errors?.upperCaseValidator" class="las la-times red"></i>
<i *ngIf="!password?.errors?.upperCaseValidator" class="las la-check green"></i>
<span> {{ 'USER.VALIDATION.UPPERCASEMISSING' | translate }}</span>
</div>
<div class="val" *ngIf="this.policy.hasLowercase">
<i *ngIf="password?.errors?.lowerCaseValidator" class="las la-times red"></i>
<i *ngIf="!password?.errors?.lowerCaseValidator" class="las la-check green"></i>
<span>{{ 'USER.VALIDATION.LOWERCASEMISSING' | translate }}</span>
</div>
</div>
console/src/app/modules/password-complexity-view/password-complexity-view.component.scss
+4 -5
View File
@@ -1,4 +1,3 @@
.validation-col {
display: flex;
flex-wrap: wrap;
@@ -6,7 +5,7 @@
width: 100%;
&.between {
margin: 0 .5rem;
margin: 0 0.5rem;
}
.val {
@@ -20,20 +19,20 @@
color: var(--grey);
}
.sp-wrapper {
.complexity-sp-wrapper {
height: 20px;
width: 20px;
margin-right: 1rem;
i {
font-size: .9rem;
font-size: 0.9rem;
position: absolute;
top: 50%;
left: 50%;
transform: translateX(-50%) translateY(-50%);
}
.spinner[color='valid'] {
.complexity-spinner[color='valid'] {
color: #56a392;
}
}