NIFI-2795 Sys Diagnostics in Cluster UI

- Cleaning up tab resize loop
- Pre-authorizing sys diagnostics api calls
- Addressing issues filtering the tables in the cluster table.
- Addressing issues sorting the tables in the cluster page.

nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-client-dto/src/main/java/org/apache/nifi/web/api/entity/CurrentUserEntity.java

@@ -35,6 +35,7 @@ public class CurrentUserEntity extends Entity {
     private PermissionsDTO tenantsPermissions;
     private PermissionsDTO controllerPermissions;
     private PermissionsDTO policiesPermissions;
+    private PermissionsDTO systemPermissions;
 
     /**
      * @return the user identity being serialized
@@ -119,4 +120,16 @@ public class CurrentUserEntity extends Entity {
     public void setPoliciesPermissions(PermissionsDTO policiesPermissions) {
         this.policiesPermissions = policiesPermissions;
     }
+
+    /**
+     * @return permissions for accessing the system
+     */
+    @ApiModelProperty("Permissions for accessing system.")
+    public PermissionsDTO getSystemPermissions() {
+        return systemPermissions;
+    }
+
+    public void setSystemPermissions(PermissionsDTO systemPermissions) {
+        this.systemPermissions = systemPermissions;
+    }
 }

nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-api/src/main/java/org/apache/nifi/authorization/AuthorizableLookup.java

@@ -262,4 +262,13 @@ public interface AuthorizableLookup {
      * @return authorizable
      */
     Authorizable getAuthorizableFromResource(final String resource);
+
+
+    /**
+     * Get the authorizable for access to the System resource.
+     *
+     * @return authorizable
+     */
+    Authorizable getSystem();
+
 }

nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-api/src/main/java/org/apache/nifi/authorization/StandardAuthorizableLookup.java

@@ -98,6 +98,18 @@ class StandardAuthorizableLookup implements AuthorizableLookup {
         }
     };
 
+    private static final Authorizable SYSTEM_AUTHORIZABLE = new Authorizable() {
+        @Override
+        public Authorizable getParentAuthorizable() {
+            return null;
+        }
+
+        @Override
+        public Resource getResource() {
+            return ResourceFactory.getSystemResource();
+        }
+    };
+
     // nifi core components
     private ControllerFacade controllerFacade;
 
@@ -708,6 +720,11 @@ class StandardAuthorizableLookup implements AuthorizableLookup {
         return group.findConnectable(id);
     }
 
+    @Override
+    public Authorizable getSystem() {
+        return SYSTEM_AUTHORIZABLE;
+    }
+
     public void setProcessorDAO(ProcessorDAO processorDAO) {
         this.processorDAO = processorDAO;
     }

nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-api/src/main/java/org/apache/nifi/web/StandardNiFiServiceFacade.java

@@ -2919,6 +2919,7 @@ public class StandardNiFiServiceFacade implements NiFiServiceFacade {
         entity.setTenantsPermissions(dtoFactory.createPermissionsDto(authorizableLookup.getTenant()));
         entity.setControllerPermissions(dtoFactory.createPermissionsDto(authorizableLookup.getController()));
         entity.setPoliciesPermissions(dtoFactory.createPermissionsDto(authorizableLookup.getPolicies()));
+        entity.setSystemPermissions(dtoFactory.createPermissionsDto(authorizableLookup.getSystem()));
         return entity;
     }
 

nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/pages/cluster.jsp

@@ -23,6 +23,7 @@
         <link rel="shortcut icon" href="images/nifi16.ico"/>
         <link rel="stylesheet" href="css/reset.css" type="text/css" />
         ${nf.cluster.style.tags}
+        <link rel="stylesheet" href="js/jquery/tabbs/jquery.tabbs.css?${project.version}" type="text/css" />
         <link rel="stylesheet" href="js/jquery/combo/jquery.combo.css?${project.version}" type="text/css" />
         <link rel="stylesheet" href="js/jquery/modal/jquery.modal.css?${project.version}" type="text/css" />
         <link rel="stylesheet" href="js/jquery/qtip2/jquery.qtip.min.css?" type="text/css" />
@@ -35,6 +36,7 @@
         <script type="text/javascript" src="js/jquery/jquery-2.1.1.min.js"></script>
         <script type="text/javascript" src="js/jquery/jquery.base64.js"></script>
         <script type="text/javascript" src="js/jquery/jquery.center.js"></script>
+        <script type="text/javascript" src="js/jquery/tabbs/jquery.tabbs.js?${project.version}"></script>
         <script type="text/javascript" src="js/jquery/combo/jquery.combo.js?${project.version}"></script>
         <script type="text/javascript" src="js/jquery/modal/jquery.modal.js?${project.version}"></script>
         <script type="text/javascript" src="js/jquery/jquery.ellipsis.js"></script>

nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/cluster/cluster-content.jsp

@@ -18,17 +18,34 @@
 <div id="cluster">
     <div id="cluster-header-and-filter">
         <div id="cluster-header-text">NiFi Cluster</div>
-        <div id="cluster-filter-controls">
+    </div>
+    <div id="cluster-tabs" class="tab-container"></div>
+    <div id="cluster-tabs-content">
+        <div id="cluster-filter-controls" class="filter-controls">
             <div id="cluster-filter-stats" class="filter-status">
-                Displaying&nbsp;<span id="displayed-nodes"></span>&nbsp;of&nbsp;<span id="total-nodes"></span>
+                Displaying&nbsp;<span id="displayed-rows"></span>&nbsp;of&nbsp;<span id="total-rows"></span>
             </div>
             <div id="cluster-filter-container" class="filter-container">
                 <input type="text" id="cluster-filter" class="filter" placeholder="Filter"/>
                 <div id="cluster-filter-type" class="filter-type"></div>
             </div>
         </div>
+        <div id="cluster-nodes-tab-content" class="configuration-tab">
+            <div id="cluster-nodes-table" class="cluster-tabbed-table"></div>
+        </div>
+        <div id="cluster-system-tab-content" class="configuration-tab">
+            <div id="cluster-system-table" class="cluster-tabbed-table"></div>
+        </div>
+        <div id="cluster-jvm-tab-content" class="configuration-tab">
+            <div id="cluster-jvm-table" class="cluster-tabbed-table"></div>
+        </div>
+        <div id="cluster-flowfile-tab-content" class="configuration-tab">
+            <div id="cluster-flowfile-table" class="cluster-tabbed-table"></div>
+        </div>
+        <div id="cluster-content-tab-content" class="configuration-tab">
+            <div id="cluster-content-table" class="cluster-tabbed-table"></div>
+        </div>
     </div>
-    <div id="cluster-table"></div>
 </div>
 <div id="cluster-refresh-container">
     <button id="refresh-button" class="refresh-button pointer fa fa-refresh" title="Refresh"></button>

nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/cluster.css

@@ -27,8 +27,8 @@
     overflow: auto;
 }
 
-#cluster-header-and-filter {
+#cluster-filter-controls {
-    height: 98px;
+    z-index: 1;
 }
 
 #cluster-header-text {
@@ -39,6 +39,10 @@
     margin-bottom: 30px;
 }
 
+#cluster-tabs-content {
+    top: 80px;
+}
+
 #cluster-refresh-container {
     position: absolute;
     bottom: 0px;
@@ -63,17 +67,27 @@
     padding-top: 10px;
 }
 
-/* counters table */
+/* cluster table */
 
-#cluster-table {
+.cluster-tabbed-table {
     position: absolute;
-    top: 98px;
+    top: 70px;
     left: 0px;
     bottom: 47px;
     right: 0px;
     min-height: 150px;
 }
 
+#cluster-tabs-content .slick-cell.cell-right {
+    text-align: right;
+    padding-right: 16px;
+    padding-left: 2px;
+}
+
+#cluster-tabs-content .slick-header-column.header-right {
+    text-align: right;
+}
+
 span.sorted {
     text-decoration: underline;
 }

nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/cluster/nf-cluster.js

@@ -128,17 +128,17 @@ nf.Cluster = (function () {
                         $('#cluster-table').css('bottom', 127);
                         $('#cluster-refresh-container').css('margin', 40);
                     }
-
-                    // configure the initial grid height
-                    nf.ClusterTable.resetTableSize();
                 };
 
                 // set the initial size
                 setBodySize();
 
-                // create the counters table
+                // create the cluster table
                 nf.ClusterTable.init();
 
+                // resize to fit
+                nf.ClusterTable.resetTableSize();
+
                 // load the table
                 nf.ClusterTable.loadClusterTable().done(function () {
                     // once the table is initialized, finish initializing the page

nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/nf-common.js

@@ -337,6 +337,19 @@ nf.Common = (function () {
             }
         },
 
+        /**
+         * Determines whether the current user can access system diagnostics.
+         *
+         * @returns {boolean}
+         */
+        canAccessSystem: function () {
+            if (nf.Common.isDefinedAndNotNull(nf.Common.currentUser)) {
+                return nf.Common.currentUser.systemPermissions.canRead === true;
+            } else {
+                return false;
+            }
+        },
+
         /**
          * Adds a mouse over effect for the specified selector using
          * the specified styles.