Warn the user on group deletion if it still has members

webadmin/src/views/users.html

@@ -185,6 +185,12 @@
                 <h4 class="modal-title">Delete group {{ groupRemove.group.name }}</h4>
             </div>
             <div class="modal-body">
+                <div ng-show="groupRemove.memberCount" class="text-danger">
+                    <b>This group still has {{ groupRemove.memberCount }} members. Are you sure this group is not used?</b>
+                    <br/>
+                    <br/>
+                </div>
+
                 <form name="groupRemoveForm" role="form" novalidate ng-submit="groupRemove.submit()" autocomplete="off">
                     <input type="password" style="display: none;">
                     <div class="form-group" ng-class="{ 'has-error': (groupRemoveForm.password.$dirty && groupRemoveForm.password.$invalid) || (!groupRemoveForm.password.$dirty && groupRemove.error.password)}">

webadmin/src/views/users.js

@@ -86,6 +86,7 @@ angular.module('Application').controller('UsersController', ['$scope', '$locatio
         error: {},
         group: null,
         password: '',
+        memberCount: 0,
 
         show: function (group) {
             $scope.groupRemove.busy = false;
@@ -98,7 +99,13 @@ angular.module('Application').controller('UsersController', ['$scope', '$locatio
             $scope.groupRemoveForm.$setUntouched();
             $scope.groupRemoveForm.$setPristine();
 
-            $('#groupRemoveModal').modal('show');
+            Client.getGroup(group.id, function (error, result) {
+                if (error) return console.error('Unable to fetch group information.', error.statusCode, error.message);
+
+                $scope.groupRemove.memberCount = result.userIds.length;
+
+                $('#groupRemoveModal').modal('show');
+            });
         },
 
         submit: function () {