From a5113e8d25ff6b3fa3e9da76d7c3d5ba23f794a0 Mon Sep 17 00:00:00 2001
From: Nabil Adouani <nabil.adouani@gmail.com>
Date: Wed, 22 Jul 2020 12:08:31 +0200
Subject: [PATCH] #1332 Add quick filters and sorting ins users list

---
 .../components/organisation/OrgUserListCmp.js |  8 ++++-
 .../admin/organisation/OrgDetailsCtrl.js      | 31 ++++++++++++++++++-
 .../services/common/data/PaginatedQuerySrv.js |  6 +++-
 .../services/common/ui/FilteringSrv.js        | 16 +++++++++-
 .../app/views/components/org/user.list.html   | 18 +++++++++--
 .../partials/admin/organisation/details.html  | 23 +++++++++++++-
 6 files changed, 95 insertions(+), 7 deletions(-)

diff --git a/frontend/app/scripts/components/organisation/OrgUserListCmp.js b/frontend/app/scripts/components/organisation/OrgUserListCmp.js
index 517b323309..15f91da50f 100644
--- a/frontend/app/scripts/components/organisation/OrgUserListCmp.js
+++ b/frontend/app/scripts/components/organisation/OrgUserListCmp.js
@@ -14,6 +14,10 @@
                     self.canSetPass = this.setPasswordEnabled;
                 };
 
+                self.sortByField = function(field) {
+                    this.onSort({field: field});
+                };
+
                 self.reload = function() {
                     self.onReload();
                 };
@@ -201,10 +205,12 @@
             templateUrl: 'views/components/org/user.list.html',
             bindings: {
                 users: '<',
+                sort: '<',
                 mfaEnabled: '<',
                 setPasswordEnabled: '<',
                 onReload: '&',
-                onEdit: '&'
+                onEdit: '&',
+                onSort: '&'
             }
         });
 })();
diff --git a/frontend/app/scripts/controllers/admin/organisation/OrgDetailsCtrl.js b/frontend/app/scripts/controllers/admin/organisation/OrgDetailsCtrl.js
index 80238ad282..ebf7e33fbd 100644
--- a/frontend/app/scripts/controllers/admin/organisation/OrgDetailsCtrl.js
+++ b/frontend/app/scripts/controllers/admin/organisation/OrgDetailsCtrl.js
@@ -22,7 +22,7 @@
                         showFilters: true,
                         showStats: false,
                         pageSize: 15,
-                        //sort: ['-flag', '-startDate']
+                        sort: ['+login']
                     },
                     defaultFilter: []
                 });
@@ -59,6 +59,12 @@
                         headers: {
                             'X-Organisation': self.org.name
                         }
+                    },
+                    onFailure: function(err) {
+                        if(err && err.status === 400) {
+                            self.filtering.resetContext();
+                            self.loadUsers();
+                        }
                     }
                 });
             };
@@ -103,5 +109,28 @@
                 this.search();
             };
 
+            this.filterBy = function(field, value) {
+                self.filtering.clearFilters()
+                    .then(function(){
+                        self.addFilterValue(field, value);
+                    });
+            };
+
+            this.sortByField = function(field) {
+                var context = this.filtering.context;
+                var currentSort = Array.isArray(context.sort) ? context.sort[0] : context.sort;
+                var sort = null;
+
+                if(currentSort && currentSort.substr(1) !== field) {
+                    sort = ['+' + field];
+                } else {
+                    sort = [(currentSort === '+' + field) ? '-'+field : '+'+field];
+                }
+
+                self.users.sort = sort;
+                self.users.update();
+                self.filtering.setSort(sort);
+            };
+
         });
 })();
diff --git a/frontend/app/scripts/services/common/data/PaginatedQuerySrv.js b/frontend/app/scripts/services/common/data/PaginatedQuerySrv.js
index ef9350a001..eb596c3854 100644
--- a/frontend/app/scripts/services/common/data/PaginatedQuerySrv.js
+++ b/frontend/app/scripts/services/common/data/PaginatedQuerySrv.js
@@ -25,6 +25,7 @@
                 this.filter = options.filter;
                 this.sort = options.sort;
                 this.onUpdate = options.onUpdate;
+                this.onFailure = options.onFailure;
                 this.skipStream = options.skipStream;
                 this.streamObjectType = options.streamObjectType || options.objectType;
                 this.guard = options.guard || undefined;
@@ -147,6 +148,10 @@
                                 self.onUpdate(updates);
                             }
                         }
+                    }).catch(function(err) {
+                        if(self.onFailure) {
+                            self.onFailure(err);
+                        }
                     });
 
                     // get the total if not cached
@@ -170,7 +175,6 @@
                 this.update();
             };
 
-
         });
 
 })();
diff --git a/frontend/app/scripts/services/common/ui/FilteringSrv.js b/frontend/app/scripts/services/common/ui/FilteringSrv.js
index 7da40cfba4..95486168b6 100644
--- a/frontend/app/scripts/services/common/ui/FilteringSrv.js
+++ b/frontend/app/scripts/services/common/ui/FilteringSrv.js
@@ -6,13 +6,14 @@
                 var self = this;
 
                 this.entity = entity;
+                this.state = undefined;
                 this.sectionName = sectionName;
                 this.config = config;
                 this.defaults = config.defaults || {};
                 this.defaultFilter = config.defaultFilter || {};
 
                 this.initContext = function(state) {
-
+                    self.state = state;
                     return DashboardSrv.getMetadata(this.config.version || 'v0')
                         .then(function(response) {
                             self.metadata = response;
@@ -116,6 +117,19 @@
                     localStorageService.set(self.sectionName, self.context);
                 };
 
+                this.resetContext = function() {
+                    self.context = {
+                        state: self.state,
+                        showFilters: self.defaults.showFilters || false,
+                        showStats: self.defaults.showStats || false,
+                        pageSize: self.defaults.pageSize || 15,
+                        sort: self.defaults.sort || [],
+                        filters: self.defaultFilter || []
+                    };
+
+                    self.storeContext();
+                };
+
                 this.addFilterValue = function (field, value) {
                     var filterDef = self.attributes[field];
 
diff --git a/frontend/app/views/components/org/user.list.html b/frontend/app/views/components/org/user.list.html
index 8eedbee8b7..1339b507ff 100644
--- a/frontend/app/views/components/org/user.list.html
+++ b/frontend/app/views/components/org/user.list.html
@@ -14,8 +14,22 @@
             <thead>
                 <tr>
                     <th style="width: 80px">Status</th>
-                    <th>Login</th>
-                    <th style="width: 150px">Full Name</th>
+                    <th>
+                        <a href class="text-default" ng-click="$ctrl.sortByField('login')">
+                            Login
+                            <i ng-show="$ctrl.sort.indexOf('+login') === -1 && $ctrl.sort.indexOf('-login') === -1" class="fa fa-sort"></i>
+                            <i ng-show="$ctrl.sort.indexOf('+login') !== -1" class="fa fa-caret-up"></i>
+                            <i ng-show="$ctrl.sort.indexOf('-login') !== -1" class="fa fa-caret-down"></i>
+                        </a>
+                    </th>
+                    <th style="width: 150px">
+                        <a href class="text-default" ng-click="$ctrl.sortByField('name')">
+                            Full Name
+                            <i ng-show="$ctrl.sort.indexOf('+name') === -1 && $ctrl.sort.indexOf('-name') === -1" class="fa fa-sort"></i>
+                            <i ng-show="$ctrl.sort.indexOf('+name') !== -1" class="fa fa-caret-up"></i>
+                            <i ng-show="$ctrl.sort.indexOf('-name') !== -1" class="fa fa-caret-down"></i>
+                        </a>
+                    </th>
                     <th style="width: 140px">Profile</th>
                     <th>Password</th>
                     <th>API Key</th>
diff --git a/frontend/app/views/partials/admin/organisation/details.html b/frontend/app/views/partials/admin/organisation/details.html
index 8fcfb6b51f..e5504fc555 100644
--- a/frontend/app/views/partials/admin/organisation/details.html
+++ b/frontend/app/views/partials/admin/organisation/details.html
@@ -57,6 +57,21 @@ <h3 class="box-title">
                                             <i class="fa fa-plus"></i>
                                             Create new user
                                         </button>
+                                        <div class="btn-group" uib-dropdown>
+                                            <button class="btn btn-sm btn-primary dropdown-toggle" uib-dropdown-toggle type="button">
+                                                <i class="fa fa-filter"></i>
+                                                Quick Filters
+                                                <span class="caret"></span>
+                                            </button>
+                                            <ul class="dropdown-menu" uib-dropdown-menu>
+                                                <li>
+                                                    <a class="clickable" ng-click="$vm.filterBy('locked', false)"><i class="fa fa-unlock-alt"></i> Active users</a>
+                                                </li>
+                                                <li>
+                                                    <a class="clickable" ng-click="$vm.filterBy('locked', true)"><i class="fa fa-lock"></i> Locked users</a>
+                                                </li>
+                                            </ul>
+                                        </div>
 
                                         <div class="btn-group pull-right" role="group">
                                             <page-sizer collection="$vm.users" sizes="[10, 15, 30, 100]"></page-sizer>
@@ -83,7 +98,13 @@ <h3 class="box-title">
                                     </div>
                                 </div>
                             </div>
-                            <org-user-list users="$vm.users" on-reload="$vm.loadUsers()" on-edit="$vm.showUserDialog(user)" set-password-enabled="$vm.canSetPass" mfa-enabled="$vm.canChangeMfa"></org-user-list>
+                            <org-user-list users="$vm.users"
+                                on-reload="$vm.loadUsers()"
+                                on-edit="$vm.showUserDialog(user)"
+                                on-sort="$vm.sortByField(field)"
+                                sort="$vm.filtering.context.sort"
+                                set-password-enabled="$vm.canSetPass"
+                                mfa-enabled="$vm.canChangeMfa"></org-user-list>
                         </div>
                     </uib-tab>
                     <uib-tab index="1" if-permission="manageCaseTemplate">