ceph/src/pybind/mgr/dashboard/frontend/src/app/core/auth/user-password-form/user-password-form.component.ts

   1 import { Component } from '@angular/core';
   2 import { Validators } from '@angular/forms';
   3 import { Router } from '@angular/router';
   4
   5 import _ from 'lodash';
   6
   7 import { UserService } from '~/app/shared/api/user.service';
   8 import { ActionLabelsI18n } from '~/app/shared/constants/app.constants';
   9 import { Icons } from '~/app/shared/enum/icons.enum';
  10 import { NotificationType } from '~/app/shared/enum/notification-type.enum';
  11 import { CdFormBuilder } from '~/app/shared/forms/cd-form-builder';
  12 import { CdFormGroup } from '~/app/shared/forms/cd-form-group';
  13 import { CdValidators } from '~/app/shared/forms/cd-validators';
  14 import { AuthStorageService } from '~/app/shared/services/auth-storage.service';
  15 import { NotificationService } from '~/app/shared/services/notification.service';
  16 import { PasswordPolicyService } from '~/app/shared/services/password-policy.service';
  17
  18 @Component({
  19   selector: 'cd-user-password-form',
  20   templateUrl: './user-password-form.component.html',
  21   styleUrls: ['./user-password-form.component.scss']
  22 })
  23 export class UserPasswordFormComponent {
  24   userForm: CdFormGroup;
  25   action: string;
  26   resource: string;
  27   passwordPolicyHelpText = '';
  28   passwordStrengthLevelClass: string;
  29   passwordValuation: string;
  30   icons = Icons;
  31
  32   constructor(
  33     public actionLabels: ActionLabelsI18n,
  34     public notificationService: NotificationService,
  35     public userService: UserService,
  36     public authStorageService: AuthStorageService,
  37     public formBuilder: CdFormBuilder,
  38     public router: Router,
  39     public passwordPolicyService: PasswordPolicyService
  40   ) {
  41     this.action = this.actionLabels.CHANGE;
  42     this.resource = $localize`password`;
  43     this.createForm();
  44   }
  45
  46   createForm() {
  47     this.passwordPolicyService.getHelpText().subscribe((helpText: string) => {
  48       this.passwordPolicyHelpText = helpText;
  49     });
  50     this.userForm = this.formBuilder.group(
  51       {
  52         oldpassword: [
  53           null,
  54           [
  55             Validators.required,
  56             CdValidators.custom('notmatch', () => {
  57               return (
  58                 this.userForm &&
  59                 this.userForm.getValue('newpassword') === this.userForm.getValue('oldpassword')
  60               );
  61             })
  62           ]
  63         ],
  64         newpassword: [
  65           null,
  66           [
  67             Validators.required,
  68             CdValidators.custom('notmatch', () => {
  69               return (
  70                 this.userForm &&
  71                 this.userForm.getValue('oldpassword') === this.userForm.getValue('newpassword')
  72               );
  73             })
  74           ],
  75           [
  76             CdValidators.passwordPolicy(
  77               this.userService,
  78               () => this.authStorageService.getUsername(),
  79               (_valid: boolean, credits: number, valuation: string) => {
  80                 this.passwordStrengthLevelClass = this.passwordPolicyService.mapCreditsToCssClass(
  81                   credits
  82                 );
  83                 this.passwordValuation = _.defaultTo(valuation, '');
  84               }
  85             )
  86           ]
  87         ],
  88         confirmnewpassword: [null, [Validators.required]]
  89       },
  90       {
  91         validators: [CdValidators.match('newpassword', 'confirmnewpassword')]
  92       }
  93     );
  94   }
  95
  96   onSubmit() {
  97     if (this.userForm.pristine) {
  98       return;
  99     }
 100     const username = this.authStorageService.getUsername();
 101     const oldPassword = this.userForm.getValue('oldpassword');
 102     const newPassword = this.userForm.getValue('newpassword');
 103     this.userService.changePassword(username, oldPassword, newPassword).subscribe(
 104       () => this.onPasswordChange(),
 105       () => {
 106         this.userForm.setErrors({ cdSubmitButton: true });
 107       }
 108     );
 109   }
 110
 111   /**
 112    * The function that is called after the password has been changed.
 113    * Override this in derived classes to change the behaviour.
 114    */
 115   onPasswordChange() {
 116     this.notificationService.show(NotificationType.success, $localize`Updated user password"`);
 117     this.router.navigate(['/login']);
 118   }
 119 }