From 62e58eaf9f700f56ee348da518cb78580b876ed6 Mon Sep 17 00:00:00 2001
From: Michael Jumper <mjumper@apache.org>
Date: Sat, 21 Jul 2018 13:23:46 -0700
Subject: [PATCH] GUACAMOLE-220: Migrate connection permission editor to
 tab-based views.

---
 .../directives/connectionPermissionEditor.js  | 41 ++++++++++++++++---
 .../templates/connectionPermissionEditor.html |  6 +--
 .../src/main/webapp/translations/en.json      |  8 ++--
 3 files changed, 42 insertions(+), 13 deletions(-)

diff --git a/guacamole/src/main/webapp/app/manage/directives/connectionPermissionEditor.js b/guacamole/src/main/webapp/app/manage/directives/connectionPermissionEditor.js
index 632de4906..43fa6c5b0 100644
--- a/guacamole/src/main/webapp/app/manage/directives/connectionPermissionEditor.js
+++ b/guacamole/src/main/webapp/app/manage/directives/connectionPermissionEditor.js
@@ -110,11 +110,40 @@ angular.module('manage').directive('connectionPermissionEditor', ['$injector',
         var readableRootGroups = null;
 
         /**
-         * Whether the items displayed within the connection permission editor
-         * should be limited to those which had explicit READ permission at the
-         * time the editor was loaded.
+         * The name of the tab within the connection permission editor which
+         * displays readable connections only.
+         *
+         * @constant
+         * @type String
          */
-        $scope.displayReadableOnly = false;
+        var SELECTED_CONNECTIONS = 'SELECTED_CONNECTIONS';
+
+        /**
+         * The name of the tab within the connection permission editor which
+         * displays all connections, regardless of whether they are readable.
+         *
+         * @constant
+         * @type String
+         */
+        var ALL_CONNECTIONS = 'ALL_CONNECTIONS';
+
+        /**
+         * The names of all tabs which should be available within the
+         * connection permission editor, in display order.
+         *
+         * @type String[]
+         */
+        $scope.tabs = [
+            SELECTED_CONNECTIONS,
+            ALL_CONNECTIONS
+        ];
+
+        /**
+         * The name of the currently selected tab.
+         *
+         * @type String
+         */
+        $scope.currentTab = ALL_CONNECTIONS;
 
         /**
          * Array of all connection properties that are filterable.
@@ -145,7 +174,7 @@ angular.module('manage').directive('connectionPermissionEditor', ['$injector',
          *     root connection groups within those data sources.
          */
         $scope.getRootGroups = function getRootGroups() {
-            return $scope.displayReadableOnly ? readableRootGroups : allRootGroups;
+            return $scope.currentTab === SELECTED_CONNECTIONS ? readableRootGroups : allRootGroups;
         };
 
         /**
@@ -312,7 +341,7 @@ angular.module('manage').directive('connectionPermissionEditor', ['$injector',
 
                 // Display only readable connections by default if at least one
                 // readable connection exists
-                $scope.displayReadableOnly = !!readableRootGroups[$scope.dataSource].children.length;
+                $scope.currentTab = !!readableRootGroups[$scope.dataSource].children.length ? SELECTED_CONNECTIONS : ALL_CONNECTIONS;
 
             });
 
diff --git a/guacamole/src/main/webapp/app/manage/templates/connectionPermissionEditor.html b/guacamole/src/main/webapp/app/manage/templates/connectionPermissionEditor.html
index 0e3a373a9..f010fb9ca 100644
--- a/guacamole/src/main/webapp/app/manage/templates/connectionPermissionEditor.html
+++ b/guacamole/src/main/webapp/app/manage/templates/connectionPermissionEditor.html
@@ -1,15 +1,13 @@
 <div class="connection-permissions">
-    <div class="header">
+    <div class="header tabbed">
         <h2>{{'MANAGE_USER.SECTION_HEADER_CONNECTIONS' | translate}}</h2>
-        <div class="filter">
-            <label><input type="checkbox" ng-model="displayReadableOnly"> {{'MANAGE_USER.' | translate}}</label>
-        </div>
         <guac-group-list-filter connection-groups="getRootGroups()"
             filtered-connection-groups="filteredRootGroups"
             placeholder="'MANAGE_USER.FIELD_PLACEHOLDER_FILTER' | translate"
             connection-properties="filteredConnectionProperties"
             connection-group-properties="filteredConnectionGroupProperties"></guac-group-list-filter>
     </div>
+    <guac-section-tabs namespace="MANAGE_USER" current="currentTab" tabs="tabs"></guac-section-tabs>
     <div class="section">
         <guac-group-list
             context="groupListContext"
diff --git a/guacamole/src/main/webapp/translations/en.json b/guacamole/src/main/webapp/translations/en.json
index fadbef48a..83e1f58e3 100644
--- a/guacamole/src/main/webapp/translations/en.json
+++ b/guacamole/src/main/webapp/translations/en.json
@@ -303,9 +303,11 @@
 
         "INFO_READ_ONLY" : "Sorry, but this user account cannot be edited.",
 
-        "SECTION_HEADER_CONNECTIONS" : "Connections",
-        "SECTION_HEADER_EDIT_USER"   : "Edit User",
-        "SECTION_HEADER_PERMISSIONS" : "Permissions",
+        "SECTION_HEADER_ALL_CONNECTIONS"      : "All Connections",
+        "SECTION_HEADER_CONNECTIONS"          : "Connections",
+        "SECTION_HEADER_EDIT_USER"            : "Edit User",
+        "SECTION_HEADER_PERMISSIONS"          : "Permissions",
+        "SECTION_HEADER_SELECTED_CONNECTIONS" : "Selected Connections",
 
         "TEXT_CONFIRM_DELETE" : "Users cannot be restored after they have been deleted. Are you sure you want to delete this user?"