From 7040bb01f4e287dde8851a96b3f93cf8eca8e722 Mon Sep 17 00:00:00 2001
From: Johannes Zellner <johannes@cloudron.io>
Date: Tue, 5 Nov 2019 22:08:48 +0100
Subject: [PATCH] Ensure groups configure dialogs have all users available

---
 src/js/client.js     |   2 +-
 src/views/users.html | 106 +++++++++++++++++++++----------------------
 src/views/users.js   |   9 ++++
 3 files changed, 63 insertions(+), 54 deletions(-)

diff --git a/src/js/client.js b/src/js/client.js
index 3d677b32a..a48cb675d 100644
--- a/src/js/client.js
+++ b/src/js/client.js
@@ -1028,7 +1028,7 @@ angular.module('Application').service('Client', ['$http', '$interval', '$timeout
             callback = search;
             search = '';
             page = 1;
-            perPage = 1000;
+            perPage = 5000;
         }
 
         var config = {
diff --git a/src/views/users.html b/src/views/users.html
index af70fa90d..15797e00a 100644
--- a/src/views/users.html
+++ b/src/views/users.html
@@ -163,68 +163,68 @@
 
 <!-- Modal add group -->
 <div class="modal fade" id="groupAddModal" tabindex="-1" role="dialog">
-    <div class="modal-dialog">
-        <div class="modal-content">
-            <div class="modal-header">
-                <h4 class="modal-title">Add Group</h4>
+  <div class="modal-dialog">
+    <div class="modal-content">
+      <div class="modal-header">
+        <h4 class="modal-title">Add Group</h4>
+      </div>
+      <div class="modal-body">
+        <form name="groupAddForm" role="form" novalidate ng-submit="groupAdd.submit()" autocomplete="off">
+          <div class="form-group" ng-class="{ 'has-error': (groupAddForm.name.$dirty && groupAddForm.name.$invalid) || (!groupAddForm.name.$dirty && groupAdd.error.name) }">
+            <label class="control-label" for="groupAddName">Name</label>
+            <div class="control-label" ng-show="(!groupAddForm.name.$dirty && groupAdd.error.name) || (groupAddForm.name.$dirty && groupAddForm.name.$invalid) || (!groupAddForm.name.$dirty && groupAdd.error.name)">
+              <small ng-show="groupAddForm.name.$error.required">A name is required</small>
+              <small ng-show="groupAddForm.name.$error.minlength">The name is too short</small>
+              <small ng-show="groupAddForm.name.$error.maxlength">The name is too long</small>
+              <small ng-show="!groupAddForm.name.$dirty && groupAdd.error.name">{{ groupAdd.error.name }}</small>
             </div>
-            <div class="modal-body">
-                <form name="groupAddForm" role="form" novalidate ng-submit="groupAdd.submit()" autocomplete="off">
-                    <div class="form-group" ng-class="{ 'has-error': (groupAddForm.name.$dirty && groupAddForm.name.$invalid) || (!groupAddForm.name.$dirty && groupAdd.error.name) }">
-                        <label class="control-label" for="groupAddName">Name</label>
-                        <div class="control-label" ng-show="(!groupAddForm.name.$dirty && groupAdd.error.name) || (groupAddForm.name.$dirty && groupAddForm.name.$invalid) || (!groupAddForm.name.$dirty && groupAdd.error.name)">
-                            <small ng-show="groupAddForm.name.$error.required">A name is required</small>
-                            <small ng-show="groupAddForm.name.$error.minlength">The name is too short</small>
-                            <small ng-show="groupAddForm.name.$error.maxlength">The name is too long</small>
-                            <small ng-show="!groupAddForm.name.$dirty && groupAdd.error.name">{{ groupAdd.error.name }}</small>
-                        </div>
-                        <input type="text" class="form-control" ng-model="groupAdd.name" id="groupAddName" name="name" ng-maxlength="200" ng-minlength="1" required autofocus>
-                    </div>
-                    <div class="form-group">
-                        <label class="control-label">Users</label>
-                        <div class="control-label">
-                            <multiselect ng-model="groupAdd.selectedUsers" options="(user.username || user.email) for user in users" data-compare-by="email" data-multiple="true" filter-after-rows="5" scroll-after-rows="10"></multiselect>
-                        </div>
-                    </div>
-                    <input class="hide" type="submit" ng-disabled="groupAddForm.$invalid || groupAdd.busy"/>
-                </form>
+            <input type="text" class="form-control" ng-model="groupAdd.name" id="groupAddName" name="name" ng-maxlength="200" ng-minlength="1" required autofocus>
+          </div>
+          <div class="form-group">
+            <label class="control-label">Users</label>
+            <div class="control-label">
+              <multiselect ng-model="groupAdd.selectedUsers" options="(user.username || user.email) for user in allUsers" data-compare-by="email" data-multiple="true" filter-after-rows="5" scroll-after-rows="10"></multiselect>
             </div>
-            <div class="modal-footer">
-                <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
-                <button type="button" class="btn btn-success" ng-click="groupAdd.submit()" ng-disabled="groupAddForm.$invalid || groupAdd.busy"><i class="fa fa-circle-notch fa-spin" ng-show="groupAdd.busy"></i> Add Group</button>
-            </div>
-        </div>
+          </div>
+          <input class="hide" type="submit" ng-disabled="groupAddForm.$invalid || groupAdd.busy"/>
+        </form>
+      </div>
+      <div class="modal-footer">
+        <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
+        <button type="button" class="btn btn-success" ng-click="groupAdd.submit()" ng-disabled="groupAddForm.$invalid || groupAdd.busy"><i class="fa fa-circle-notch fa-spin" ng-show="groupAdd.busy"></i> Add Group</button>
+      </div>
     </div>
+  </div>
 </div>
 
 <!-- Modal edit group -->
 <div class="modal fade" id="groupEditModal" tabindex="-1" role="dialog">
-    <div class="modal-dialog">
-        <div class="modal-content">
-            <div class="modal-header">
-                <h4 class="modal-title">Edit group {{ groupEdit.groupInfo.name }}</h4>
+  <div class="modal-dialog">
+    <div class="modal-content">
+      <div class="modal-header">
+        <h4 class="modal-title">Edit group {{ groupEdit.groupInfo.name }}</h4>
+      </div>
+      <div class="modal-body">
+        <form name="groupEdit_form" role="form" ng-submit="groupEdit.submit()" autocomplete="off">
+          <div class="form-group" ng-class="{ 'has-error': groupEditForm.groupName.$invalid }">
+            <label class="control-label">Group name</label>
+            <input type="text" class="form-control" ng-model="groupEdit.name" name="groupName" ng-disabled="groupEdit.busy" autofocus>
+          </div>
+          <div class="form-group">
+            <label class="control-label">Users</label>
+            <div class="control-label">
+              <multiselect ng-model="groupEdit.selectedUsers" options="(user.username || user.email) for user in allUsers" data-compare-by="email" data-multiple="true" filter-after-rows="5" scroll-after-rows="10"></multiselect>
             </div>
-            <div class="modal-body">
-                <form name="groupEdit_form" role="form" ng-submit="groupEdit.submit()" autocomplete="off">
-                    <div class="form-group" ng-class="{ 'has-error': groupEditForm.groupName.$invalid }">
-                        <label class="control-label">Group name</label>
-                        <input type="text" class="form-control" ng-model="groupEdit.name" name="groupName" ng-disabled="groupEdit.busy" autofocus>
-                    </div>
-                    <div class="form-group">
-                        <label class="control-label">Users</label>
-                        <div class="control-label">
-                            <multiselect ng-model="groupEdit.selectedUsers" options="(user.username || user.email) for user in users" data-compare-by="email" data-multiple="true" filter-after-rows="5" scroll-after-rows="10"></multiselect>
-                        </div>
-                    </div>
-                    <input class="hide" type="submit" ng-disabled="groupEdit_form.$invalid || useredit.busy"/>
-                </form>
-            </div>
-            <div class="modal-footer">
-                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
-                <button type="button" class="btn btn-success" ng-click="groupEdit.submit()" ng-disabled="groupEdit_form.$invalid || groupEdit.busy"><i class="fa fa-circle-notch fa-spin" ng-show="groupEdit.busy"></i> Save</button>
-            </div>
-        </div>
+          </div>
+          <input class="hide" type="submit" ng-disabled="groupEdit_form.$invalid || useredit.busy"/>
+        </form>
+      </div>
+      <div class="modal-footer">
+        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
+        <button type="button" class="btn btn-success" ng-click="groupEdit.submit()" ng-disabled="groupEdit_form.$invalid || groupEdit.busy"><i class="fa fa-circle-notch fa-spin" ng-show="groupEdit.busy"></i> Save</button>
+      </div>
     </div>
+  </div>
 </div>
 
 <!-- Modal remove group -->
diff --git a/src/views/users.js b/src/views/users.js
index 8ce4ba8c7..cd212b6df 100644
--- a/src/views/users.js
+++ b/src/views/users.js
@@ -27,6 +27,8 @@ angular.module('Application').controller('UsersController', ['$scope', '$locatio
     $scope.config = Client.getConfig();
     $scope.userInfo = Client.getUserInfo();
 
+    $scope.allUsers = [];
+
     $scope.userSearchString = '';
     $scope.currentPage = 1;
     $scope.pageItemCount = [
@@ -642,6 +644,13 @@ angular.module('Application').controller('UsersController', ['$scope', '$locatio
 
     Client.onReady(refresh);
     Client.onReady(loadExternalLdapConfig);
+    Client.onReady(function () {
+        Client.getUsers(function (error, results) {
+            if (error) return console.error(error);
+
+            $scope.allUsers = results;
+        });
+    });
 
     // setup all the dialog focus handling
     ['userAddModal', 'userRemoveModal', 'userEditModal', 'groupAddModal', 'groupEditModal', 'groupRemoveModal'].forEach(function (id) {