From: Alfonso Martínez <almartin@redhat.com>
Date: Wed, 22 Jan 2020 15:05:12 +0000 (+0100)
Subject: mgr/dashboard: disable 'Add Capability' button when all the capabilities are added
X-Git-Tag: v14.2.8~95^2
X-Git-Url: http://git.apps.os.sepia.ceph.com/?a=commitdiff_plain;h=27eb4d924cc00885b314c30b01aaad83c8a2fb5e;p=ceph.git

mgr/dashboard: disable 'Add Capability' button when all the capabilities are added

Fixes: https://tracker.ceph.com/issues/43564
Signed-off-by: Alfonso Martínez <almartin@redhat.com>
(cherry picked from commit 4ef0e2c1ba2c7c2b12556f5ee7a593ae4ba99144)

Conflicts:
  src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-form/rgw-user-form.component.html

- Change applied manually in conflicting file.
---

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/models/rgw-user-capabilities.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/models/rgw-user-capabilities.ts
new file mode 100644
index 0000000000000..dac6986c761a9
--- /dev/null
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/models/rgw-user-capabilities.ts
@@ -0,0 +1,15 @@
+export enum RgwUserAvailableCapability {
+  USERS = 'users',
+  BUCKETS = 'buckets',
+  METADATA = 'metadata',
+  USAGE = 'usage',
+  ZONE = 'zone'
+}
+
+export class RgwUserCapabilities {
+  static readonly capabilities = RgwUserAvailableCapability;
+
+  static getAll(): string[] {
+    return Object.values(RgwUserCapabilities.capabilities);
+  }
+}
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-capability-modal/rgw-user-capability-modal.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-capability-modal/rgw-user-capability-modal.component.ts
index f6d9d30ad5283..d890aa902eeff 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-capability-modal/rgw-user-capability-modal.component.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-capability-modal/rgw-user-capability-modal.component.ts
@@ -8,6 +8,7 @@ import { I18n } from '@ngx-translate/i18n-polyfill';
 import { ActionLabelsI18n } from '../../../shared/constants/app.constants';
 import { CdFormBuilder } from '../../../shared/forms/cd-form-builder';
 import { CdFormGroup } from '../../../shared/forms/cd-form-group';
+import { RgwUserCapabilities } from '../models/rgw-user-capabilities';
 import { RgwUserCapability } from '../models/rgw-user-capability';
 
 @Component({
@@ -78,7 +79,7 @@ export class RgwUserCapabilityModalComponent {
       usedTypes.push(capability.type);
     });
     this.types = [];
-    ['users', 'buckets', 'metadata', 'usage', 'zone'].forEach((type) => {
+    RgwUserCapabilities.getAll().forEach((type) => {
       if (_.indexOf(usedTypes, type) === -1) {
         this.types.push(type);
       }
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-form/rgw-user-form.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-form/rgw-user-form.component.html
index c41346c6bb064..8feb271497d36 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-form/rgw-user-form.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-form/rgw-user-form.component.html
@@ -391,6 +391,11 @@
             <span class="form-control no-border">
               <button type="button"
                       class="btn btn-sm btn-default btn-label pull-right tc_addCapButton"
+                      [disabled]="hasAllCapabilities()"
+                      i18n-tooltip
+                      tooltip="All capabilities are already added."
+                      [isDisabled]="!hasAllCapabilities()"
+                      triggers="pointerenter pointerleave"
                       (click)="showCapabilityModal()">
                 <i class="fa fa-fw fa-plus"></i>
                 <ng-container i18n>{{ actionLabels.ADD | titlecase }} {{ capabilityLabel | upperFirst }}</ng-container>
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-form/rgw-user-form.component.spec.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-form/rgw-user-form.component.spec.ts
index 3ae9ca145aad5..e73319c4ec036 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-form/rgw-user-form.component.spec.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-form/rgw-user-form.component.spec.ts
@@ -5,6 +5,7 @@ import { Router } from '@angular/router';
 import { RouterTestingModule } from '@angular/router/testing';
 
 import { BsModalService } from 'ngx-bootstrap/modal';
+import { TooltipModule } from 'ngx-bootstrap/tooltip';
 import { ToastrModule } from 'ngx-toastr';
 import { of as observableOf } from 'rxjs';
 
@@ -13,6 +14,8 @@ import { RgwUserService } from '../../../shared/api/rgw-user.service';
 import { NotificationType } from '../../../shared/enum/notification-type.enum';
 import { NotificationService } from '../../../shared/services/notification.service';
 import { SharedModule } from '../../../shared/shared.module';
+import { RgwUserCapabilities } from '../models/rgw-user-capabilities';
+import { RgwUserCapability } from '../models/rgw-user-capability';
 import { RgwUserS3Key } from '../models/rgw-user-s3-key';
 import { RgwUserFormComponent } from './rgw-user-form.component';
 
@@ -29,7 +32,8 @@ describe('RgwUserFormComponent', () => {
       ReactiveFormsModule,
       RouterTestingModule,
       SharedModule,
-      ToastrModule.forRoot()
+      ToastrModule.forRoot(),
+      TooltipModule.forRoot()
     ],
     providers: [BsModalService, i18nProviders]
   });
@@ -216,4 +220,31 @@ describe('RgwUserFormComponent', () => {
       );
     });
   });
+
+  describe('RgwUserCapabilities', () => {
+    it('capability button disabled when all capabilities are added', () => {
+      component.editing = true;
+      for (const capabilityType of RgwUserCapabilities.getAll()) {
+        const capability = new RgwUserCapability();
+        capability.type = capabilityType;
+        capability.perm = 'read';
+        component.setCapability(capability);
+      }
+
+      fixture.detectChanges();
+
+      expect(component.hasAllCapabilities()).toBeTruthy();
+      const capabilityButton = fixture.debugElement.nativeElement.querySelector('.tc_addCapButton');
+      expect(capabilityButton.disabled).toBeTruthy();
+    });
+
+    it('capability button not disabled when not all capabilities are added', () => {
+      component.editing = true;
+
+      fixture.detectChanges();
+
+      const capabilityButton = fixture.debugElement.nativeElement.querySelector('.tc_addCapButton');
+      expect(capabilityButton.disabled).toBeFalsy();
+    });
+  });
 });
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-form/rgw-user-form.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-form/rgw-user-form.component.ts
index 47ccc2092b0f2..aa22c55cc5bec 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-form/rgw-user-form.component.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-form/rgw-user-form.component.ts
@@ -15,6 +15,7 @@ import { CdFormGroup } from '../../../shared/forms/cd-form-group';
 import { CdValidators, isEmptyInputValue } from '../../../shared/forms/cd-validators';
 import { FormatterService } from '../../../shared/services/formatter.service';
 import { NotificationService } from '../../../shared/services/notification.service';
+import { RgwUserCapabilities } from '../models/rgw-user-capabilities';
 import { RgwUserCapability } from '../models/rgw-user-capability';
 import { RgwUserS3Key } from '../models/rgw-user-s3-key';
 import { RgwUserSubuser } from '../models/rgw-user-subuser';
@@ -375,6 +376,10 @@ export class RgwUserFormComponent implements OnInit {
     this.userForm.markAsDirty();
   }
 
+  hasAllCapabilities() {
+    return !_.difference(RgwUserCapabilities.getAll(), _.map(this.capabilities, 'type')).length;
+  }
+
   /**
    * Add/Update a S3 key.
    */