feat(group): Delegate the management of a group

fix gravitee-io/issues#1100

src/management/configuration/configuration.route.ts

@@ -16,7 +16,6 @@
 import ViewService from '../../services/view.service';
 import TenantService from '../../services/tenant.service';
 import TagService from '../../services/tag.service';
-import SidenavService from '../../components/sidenav/sidenav.service';
 import PortalPagesService from '../../services/portalPages.service';
 import MetadataService from "../../services/metadata.service";
 import RoleService from "../../services/role.service";
@@ -25,6 +24,7 @@ import {HookScope} from "../../entities/hookScope";
 import NotificationSettingsService from "../../services/notificationSettings.service";
 import TopApiService from "../../services/top-api.service";
 import UserService from "../../services/user.service";
+import _ = require('lodash');
 
 export default configurationRouterConfig;
 
@@ -44,7 +44,7 @@ function configurationRouterConfig($stateProvider: ng.ui.IStateProvider) {
         perms: {
           only: [
             //hack only read permissions is necessary but READ is also allowed for API_PUBLISHER
-            'portal-view-r', 'portal-metadata-r', 'portal-top_apis-r',
+            'portal-view-r', 'portal-metadata-r', 'portal-top_apis-r', 'management-group-r',
             'management-tag-c', 'management-tenant-c', 'management-group-c', 'management-role-c', 'portal-documentation-c',
             'management-tag-u', 'management-tenant-u', 'management-group-u', 'management-role-u', 'portal-documentation-u',
             'management-tag-d', 'management-tenant-d', 'management-group-d', 'management-role-d', 'portal-documentation-d'
@@ -106,7 +106,7 @@ function configurationRouterConfig($stateProvider: ng.ui.IStateProvider) {
       resolve: {
         groups: (GroupService: GroupService) =>
           GroupService.list().then(response =>
-            response.data)
+            _.filter(response.data, 'manageable'))
       },
       data: {
         menu: null,

src/management/configuration/group/group.html

@@ -26,16 +26,25 @@
     <table md-table ng-init="orderGrp = 'name'">
         <thead md-head md-order="orderGrp">
         <tr md-row>
-            <th md-column width="30%" md-order-by="name">Name</th>
-            <th md-column width="30%">API Role</th>
-            <th md-column width="30%">Application Role</th>
-            <th md-column width="10%"></th>
+            <th md-column width="22%" md-order-by="name">Name</th>
+            <th md-column width="22%">Group Admin</th>
+            <th md-column width="22%">API Role</th>
+            <th md-column width="22%">Application Role</th>
+            <th md-column width="12%"></th>
         </tr>
         </thead>
         <tbody md-body>
         <tr md-row
             ng-repeat="member in $ctrl.members | orderBy: orderGrp">
             <td md-cell>{{member.displayName}}</td>
+            <td md-cell>
+                <md-checkbox ng-model="member.roles['GROUP']"
+                             ng-true-value="'ADMIN'"
+                             ng-false-value="''"
+                             ng-change="$ctrl.updateRole(member)"
+                             aria-label="Administrator of this group">
+                </md-checkbox>
+            </td>
             <td md-cell>
                 <md-select ng-model="member.roles['API']"
                            aria-label="API Role"

src/management/configuration/groups/groups.component.ts

@@ -16,6 +16,7 @@
 import _ = require('lodash');
 import GroupService from "../../../services/group.service";
 import NotificationService from "../../../services/notification.service";
+import UserService from "../../../services/user.service";
 
 const GroupsComponent: ng.IComponentOptions = {
   bindings: {
@@ -24,6 +25,7 @@ const GroupsComponent: ng.IComponentOptions = {
   template: require("./groups.html"),
   controller: function (
     GroupService: GroupService,
+    UserService: UserService,
     NotificationService: NotificationService,
     $mdDialog: angular.material.IDialogService,
     $state: ng.ui.IStateService
@@ -64,7 +66,7 @@ const GroupsComponent: ng.IComponentOptions = {
           GroupService.create(newGroup).then(() => {
             NotificationService.show('Group ' + newGroup.name + ' has been removed.');
             GroupService.list().then( (response) => {
-                this.groups = response.data;
+              this.groups = _.filter(response.data, 'manageable');
                 this.initEventRules();
               }
             );
@@ -91,7 +93,7 @@ const GroupsComponent: ng.IComponentOptions = {
           GroupService.update(groupId, updatedGroup).then(() => {
             NotificationService.show('Group ' + updatedGroup.name + ' has been updated.');
             GroupService.list().then( (response) => {
-                this.groups = response.data;
+              this.groups = _.filter(response.data, 'manageable');
                 this.initEventRules();
               }
             );
@@ -116,7 +118,7 @@ const GroupsComponent: ng.IComponentOptions = {
           GroupService.remove(groupId).then( () => {
             NotificationService.show('Group ' + groupName + ' has been deleted.');
             GroupService.list().then( (response) => {
-                this.groups = response.data;
+                this.groups = _.filter(response.data, 'manageable');
                 this.initEventRules();
               }
             );
@@ -126,17 +128,21 @@ const GroupsComponent: ng.IComponentOptions = {
     };
 
     this.saveEventRules = (group: any) => {
-      GroupService.update(group.id, {
-        name: group.name,
-        defaultApi: this.apiByDefault[group.id],
-        defaultApplication: this.applicationByDefault[group.id]
-      }).then(() => {
-        NotificationService.show('Group ' + group.name + ' has been updated.');
-      });
+      if (group.manageable) {
+        GroupService.update(group.id, {
+          name: group.name,
+          defaultApi: this.apiByDefault[group.id],
+          defaultApplication: this.applicationByDefault[group.id]
+        }).then(() => {
+          NotificationService.show('Group ' + group.name + ' has been updated.');
+        });
+      }
     };
 
     this.selectGroup = (group: any) => {
-      $state.go('management.settings.group', {groupId: group.id});
+      if (group.manageable) {
+        $state.go('management.settings.group', {groupId: group.id});
+      }
     };
   }
 };

src/management/configuration/groups/groups.html

@@ -52,11 +52,11 @@
             </td>
             <td md-cell ng-click="$event.stopPropagation()">
                 <div layout="row" layout-align="end center">
-                    <span style="padding: 0 20px;">
+                    <span style="padding: 0 20px;" ng-if="group.manageable">
                         <md-tooltip md-direction="top">edit</md-tooltip>
                         <ng-md-icon icon="mode_edit" ng-click="$ctrl.showRenameGroupModal($event, group.id, group.name, group.event_rules)" aria-label="rename-group"></ng-md-icon>
                     </span>
-                    <span>
+                    <span ng-if="group.manageable">
                         <md-tooltip md-direction="top">delete</md-tooltip>
                         <ng-md-icon icon="delete" ng-click="$ctrl.removeGroup($event, group.id, group.name)" aria-label="delete-group"></ng-md-icon>
                     </span>

src/management/configuration/settings.component.ts

@@ -17,6 +17,7 @@
 import SidenavService from "../../components/sidenav/sidenav.service";
 import {IScope} from "angular";
 import UserService from "../../services/user.service";
+import _ = require('lodash');
 
 const SettingsComponent: ng.IComponentOptions = {
 
@@ -29,33 +30,78 @@ const SettingsComponent: ng.IComponentOptions = {
   ) {
     'ngInject';
     this.$state = $state;
+    this.settingsMenu = {
+      // PORTAL
+      documentations: {
+        perm: UserService.isUserHasPermissions(
+          ['portal-documentation-c', 'portal-documentation-u', 'portal-documentation-d']),
+        goTo: 'management.settings.pages'
+      },
+      metadata: {
+        perm: UserService.isUserHasPermissions(
+          ['portal-metadata-c', 'portal-metadata-u', 'portal-metadata-d']),
+        goTo: 'management.settings.metadata'
+      },
+      views: {
+        perm: UserService.isUserHasPermissions(
+          ['portal-view-c', 'portal-view-u', 'portal-view-d']),
+        goTo: 'management.settings.views'
+      },
+      topApis: {
+        perm: UserService.isUserHasPermissions(
+          ['portal-top_apis-c', 'portal-top_apis-u', 'portal-top_apis-d']),
+        goTo: 'management.settings.top-apis'
+      },
+
+      // GATEWAYS
+      tags: {
+        perm: UserService.isUserHasPermissions(
+          ['management-tag-c', 'management-tag-u', 'management-tag-d']),
+        goTo: 'management.settings.tags'
+      },
+      tenants: {
+        perm: UserService.isUserHasPermissions(
+          ['management-tenant-c', 'management-tenant-u', 'management-tenant-d']),
+        goTo: 'management.settings.tenants'
+      },
+
+      // USER MANAGEMENT
+      users: {
+        perm: UserService.isUserHasPermissions(
+          ['management-user-c', 'management-user-u', 'management-user-d']),
+        goTo: 'management.settings.users'
+      },
+      groups: {
+        perm: UserService.isUserHasPermissions(
+          ['management-group-c', 'management-group-r', 'management-group-u', 'management-group-d']),
+        goTo: 'management.settings.groups'
+      },
+      roles: {
+        perm: UserService.isUserHasPermissions(
+          ['management-role-c', 'management-role-u', 'management-role-d']),
+        goTo: 'management.settings.roles'
+      },
+
+      // ALERT
+      notifications: {
+        perm: UserService.isUserHasPermissions(
+          ['management-notification-c', 'management-notification-u', 'management-notification-d']),
+        goTo: 'management.settings.notifications'
+      }};
 
     this.$onInit = () => {
       if ($state.current.name === 'management.settings') {
         $rootScope.$broadcast('reduceSideNav');
         SidenavService.setCurrentResource('SETTINGS');
 
-        if (UserService.isUserHasPermissions(['portal-documentation-r'])) {
-          $state.go('management.settings.pages');
-        } else if (UserService.isUserHasPermissions(['portal-metadata-r'])) {
-          $state.go("management.settings.metadata");
-        } else if (UserService.isUserHasPermissions(['portal-view-r'])) {
-          $state.go("management.settings.views");
-        } else if (UserService.isUserHasPermissions(['portal-top_apis-r'])) {
-          $state.go("management.settings.top-apis");
-        } else if (UserService.isUserHasPermissions(['management-tag-r'])) {
-          $state.go("management.settings.tags");
-        } else if (UserService.isUserHasPermissions(['management-tenant-r'])) {
-          $state.go("management.settings.tenants");
-        } else if (UserService.isUserHasPermissions(['management-group-r'])) {
-          $state.go("management.settings.groups");
-        } else if (UserService.isUserHasPermissions(['management-role-r'])) {
-          $state.go("management.settings.roles");
-        } else if (UserService.isUserHasPermissions(['management-notification-r'])) {
-          $state.go("management.settings.notifications");
+        for ( let entry of _.keys(this.settingsMenu)) {
+          if (this.settingsMenu[entry].perm) {
+            $state.go(this.settingsMenu[entry].goTo);
+            break;
+          }
         }
       }
-    }
+    };
   }
 };
 

src/management/configuration/settings.html

@@ -21,72 +21,82 @@
         <div class="menu" flex="15">
             <div class="md-headline">Settings</div>
 
-            <div class="aui-nav-heading">
+            <div class="aui-nav-heading"
+                 ng-if="$ctrl.settingsMenu.documentations.perm
+                 || $ctrl.settingsMenu.metadata.perm
+                 || $ctrl.settingsMenu.settings.perm
+                 || $ctrl.settingsMenu.topApis.perm">
                 <strong>Portal</strong>
             </div>
             <ul class="aui-nav">
                 <li class="iterable-item" ui-sref-active="aui-nav-selected"
-                    permission permission-only='portal-documentation-r'>
-                    <a class="execute" ui-sref="management.settings.pages">Documentation</a>
+                    ng-if="$ctrl.settingsMenu.documentations.perm">
+                    <a class="execute" ui-sref="{{$ctrl.settingsMenu.documentations.goTo}}">Documentation</a>
                 </li>
                 <li class="iterable-item" ui-sref-active="aui-nav-selected"
-                    permission permission-only='portal-metadata-r'>
-                    <a class="execute" ui-sref="management.settings.metadata">Metadata</a>
+                    ng-if="$ctrl.settingsMenu.metadata.perm">
+                    <a class="execute" ui-sref="{{$ctrl.settingsMenu.metadata.goTo}}">Metadata</a>
                 </li>
                 <li class="iterable-item" ui-sref-active="aui-nav-selected"
-                    permission permission-only='portal-view-r'>
-                    <a class="execute" ui-sref="management.settings.views">Views</a>
+                    ng-if="$ctrl.settingsMenu.settings.perm">
+                    <a class="execute" ui-sref="{{$ctrl.settingsMenu.settings.goTo}}">Views</a>
                 </li>
                 <li class="iterable-item" ui-sref-active="aui-nav-selected"
-                    permission permission-only='portal-top_apis-r'>
-                    <a class="execute" ui-sref="management.settings.top-apis">Top APIs</a>
+                    ng-if="$ctrl.settingsMenu.topApis.perm">
+                    <a class="execute" ui-sref="{{$ctrl.settingsMenu.topApis.goTo}}">Top APIs</a>
                 </li>
             </ul>
 
 
-            <div class="aui-nav-heading">
+            <div class="aui-nav-heading"
+                 ng-if="$ctrl.settingsMenu.tags.perm
+                 || $ctrl.settingsMenu.tenants.perm">
                 <strong>Gateway</strong>
             </div>
             <ul class="aui-nav">
                 <li class="iterable-item" ui-sref-active="aui-nav-selected"
-                    permission permission-only='management-tag-r'>
-                    <a class="execute" ui-sref="management.settings.tags">Sharding Tags</a>
+                    ng-if="$ctrl.settingsMenu.tags.perm">
+                    <a class="execute" ui-sref="{{$ctrl.settingsMenu.tags.goTo}}">Sharding Tags</a>
                 </li>
                 <li class="iterable-item" ui-sref-active="aui-nav-selected"
-                    permission permission-only='management-tenant-r'>
-                    <a class="execute" ui-sref="management.settings.tenants">Tenants</a>
+                    ng-if="$ctrl.settingsMenu.tenants.perm">
+                    <a class="execute" ui-sref="{{$ctrl.settingsMenu.tenants.goTo}}">Tenants</a>
                 </li>
             </ul>
 
-            <div class="aui-nav-heading">
+            <div class="aui-nav-heading"
+                 ng-if="$ctrl.settingsMenu.users.perm
+                 || $ctrl.settingsMenu.groups.perm
+                 || $ctrl.settingsMenu.roles.perm">
                 <strong>User Management</strong>
             </div>
             <ul class="aui-nav">
                 <li class="iterable-item"
                     ng-class="{'aui-nav-selected': $ctrl.$state.includes('management.settings.users') || $ctrl.$state.includes('management.settings.user') }"
-                    permission permission-only='management-user-r'>
-                    <a class="execute" ui-sref="management.settings.users">Users</a>
+                    ng-if="$ctrl.settingsMenu.users.perm">
+                    <a class="execute" ui-sref="{{$ctrl.settingsMenu.users.goTo}}">Users</a>
                 </li>
                 <li class="iterable-item"
                     ng-class="{'aui-nav-selected': $ctrl.$state.includes('management.settings.groups') || $ctrl.$state.includes('management.settings.group') }"
-                    permission permission-only='management-group-r'>
-                    <a class="execute" ui-sref="management.settings.groups">Groups</a>
+                    ng-if="$ctrl.settingsMenu.groups.perm">
+                    <a class="execute" ui-sref="{{$ctrl.settingsMenu.groups.goTo}}">Groups</a>
                 </li>
                 <li class="iterable-item"
                     ng-class="{'aui-nav-selected': $ctrl.$state.includes('management.settings.roles') || $ctrl.$state.includes('management.settings.rolenew') || $ctrl.$state.includes('management.settings.roleedit') || $ctrl.$state.includes('management.settings.rolemembers') }"
-                    permission permission-only='management-role-r'>
-                    <a class="execute" ui-sref="management.settings.roles">Roles</a>
+                    ng-if="$ctrl.settingsMenu.roles.perm">
+                    <a class="execute" ui-sref="{{$ctrl.settingsMenu.roles.goTo}}">Roles</a>
                 </li>
             </ul>
 
 
-            <div class="aui-nav-heading">
+            <div class="aui-nav-heading"
+                 ng-if="$ctrl.settingsMenu.notifications.perm">
                 <strong>Alerts</strong>
             </div>
             <ul class="aui-nav">
                 <li class="iterable-item" ui-sref-active="aui-nav-selected"
-                    permission permission-only='management-notification-r'>
-                    <a class="execute" ui-sref="management.settings.notifications">Notifications</a>
+                    ng-if="$ctrl.settingsMenu.notifications.perm">
+                    <a class="execute" ui-sref="{{$ctrl.settingsMenu.notifications.goTo}}">Notifications</a>
                 </li>
             </ul>
         </div>

src/management/configuration/user/user.html

@@ -70,6 +70,7 @@
         <thead md-head>
         <tr md-row>
             <th md-column>Name</th>
+            <th md-column>Group Admin</th>
             <th md-column>API Role</th>
             <th md-column>Application Role</th>
             <th md-column></th>
@@ -81,6 +82,14 @@
         </tr>
         <tr md-row ng-repeat="group in $ctrl.groups">
             <td md-cell>{{group.name}}</td>
+            <td md-cell>
+                <md-checkbox ng-model="group.roles['GROUP']"
+                             ng-true-value="'ADMIN'"
+                             ng-false-value="''"
+                             ng-change="$ctrl.updateGroupRole(group)"
+                             aria-label="Administrator of this group">
+                </md-checkbox>
+            </td>
             <td md-cell>
                 <md-select ng-model="group.roles['API']" aria-label="membership-api-role" ng-change="$ctrl.updateGroupRole(group)">
                     <md-option ng-value="role.name" ng-repeat="role in $ctrl.apiRoles" ng-disabled="role.system">{{role.name}}</md-option>

src/management/management.run.ts

@@ -15,7 +15,6 @@
  */
 /* global setInterval:false, clearInterval:false, screen:false */
 import UserService from '../services/user.service';
-import _ = require('lodash');
 
 function runBlock($rootScope, $window, $http, $mdSidenav, $transitions,
                   $timeout, UserService: UserService, Constants, PermissionStrategies) {