mgr/dashboard: Use forms in RGW user s3 key modal

Signed-off-by: Stephan Müller <smueller@suse.com>

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-s3-key-modal/rgw-user-s3-key-modal.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-s3-key-modal/rgw-user-s3-key-modal.component.html
index 043a6f87591dbe17fa52b133875f984c40050fe8..2560191b8a06787f8c03ba58fadaf188a43ff613 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-s3-key-modal/rgw-user-s3-key-modal.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-s3-key-modal/rgw-user-s3-key-modal.component.html
@@ -17,7 +17,7 @@
 
     <!-- Username -->
     <div class="form-group"
-         [ngClass]="{'has-error': (frm.submitted || formGroup.controls.user.dirty) && formGroup.controls.user.invalid}">
+         [ngClass]="{'has-error': formGroup.showError('user', frm)}">
       <label class="control-label col-sm-3"
              for="user"
              i18n>Username
@@ -45,7 +45,7 @@
                   [value]="userCandidate">{{ userCandidate }}</option>
         </select>
         <span class="help-block"
-              *ngIf="(frm.submitted || formGroup.controls.user.dirty) && formGroup.controls.user.hasError('required')"
+              *ngIf="formGroup.showError('user', frm, 'required')"
               i18n>
           This field is required.
         </span>
@@ -69,8 +69,8 @@
 
     <!-- Access key -->
     <div class="form-group"
-         [ngClass]="{'has-error': (frm.submitted || formGroup.controls.access_key.dirty) && formGroup.controls.access_key.invalid}"
-         *ngIf="!formGroup.controls.generate_key.value">
+         [ngClass]="{'has-error': formGroup.showError('access_key', frm)}"
+         *ngIf="!formGroup.getValue('generate_key')">
       <label class="control-label col-sm-3"
              for="access_key"
              i18n>Access key
@@ -97,7 +97,7 @@
           </span>
         </div>
         <span class="help-block"
-              *ngIf="(frm.submitted || formGroup.controls.access_key.dirty) && formGroup.controls.access_key.hasError('required')"
+              *ngIf="formGroup.showError('access_key', frm, 'required')"
               i18n>
           This field is required.
         </span>
@@ -106,8 +106,8 @@
 
     <!-- Secret key -->
     <div class="form-group"
-         [ngClass]="{'has-error': (frm.submitted || formGroup.controls.secret_key.dirty) && formGroup.controls.secret_key.invalid}"
-         *ngIf="!formGroup.controls.generate_key.value">
+         [ngClass]="{'has-error': formGroup.showError('secret_key', frm)}"
+         *ngIf="!formGroup.getValue('generate_key')">
       <label class="control-label col-sm-3"
              for="secret_key"
              i18n>Secret key
@@ -134,7 +134,7 @@
           </span>
         </div>
         <span class="help-block"
-              *ngIf="(frm.submitted || formGroup.controls.secret_key.dirty) && formGroup.controls.secret_key.hasError('required')"
+              *ngIf="formGroup.showError('secret_key', frm, 'required')"
               i18n>
           This field is required.
         </span>

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-s3-key-modal/rgw-user-s3-key-modal.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-s3-key-modal/rgw-user-s3-key-modal.component.ts
index e397cfb31c6cbb7f8bc03e81073460f4c06d9502..7514eada1e5ab3853a2c1f7a6b7abdaeba8a5521 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-s3-key-modal/rgw-user-s3-key-modal.component.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-s3-key-modal/rgw-user-s3-key-modal.component.ts
@@ -1,9 +1,11 @@
 import { Component, EventEmitter, Output } from '@angular/core';
-import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { Validators } from '@angular/forms';
 
 import * as _ from 'lodash';
 import { BsModalRef } from 'ngx-bootstrap/modal/bs-modal-ref.service';
 
+import { CdFormBuilder } from '../../../shared/forms/cd-form-builder';
+import { CdFormGroup } from '../../../shared/forms/cd-form-group';
 import { CdValidators } from '../../../shared/validators/cd-validators';
 import { RgwUserS3Key } from '../models/rgw-user-s3-key';
 
@@ -18,11 +20,11 @@ export class RgwUserS3KeyModalComponent {
    */
   @Output() submitAction = new EventEmitter();
 
-  formGroup: FormGroup;
+  formGroup: CdFormGroup;
   viewing = true;
   userCandidates: string[] = [];
 
-  constructor(private formBuilder: FormBuilder, public bsModalRef: BsModalRef) {
+  constructor(private formBuilder: CdFormBuilder, public bsModalRef: BsModalRef) {
     this.createForm();
     this.listenToChanges();
   }