[accumulo] branch main updated: Convert table in replication.js to DataTable (#2793)

[domgarguilo]

This is an automated email from the ASF dual-hosted git repository.

domgarguilo pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/accumulo.git


The following commit(s) were added to refs/heads/main by this push:
     new 2e74f4d050 Convert table in replication.js to DataTable (#2793)
2e74f4d050 is described below

commit 2e74f4d05031e6aa224292dfea89fa553be0cf3d
Author: Dom G <dominic.gargu...@gmail.com>
AuthorDate: Wed Jul 6 12:40:19 2022 -0400

    Convert table in replication.js to DataTable (#2793)
    
    * Convert table to Datatable
---
 .../accumulo/monitor/resources/js/replication.js   | 81 +++++++++++-----------
 .../accumulo/monitor/templates/replication.ftl     |  2 +-
 2 files changed, 42 insertions(+), 41 deletions(-)

diff --git 
a/server/monitor/src/main/resources/org/apache/accumulo/monitor/resources/js/replication.js
 
b/server/monitor/src/main/resources/org/apache/accumulo/monitor/resources/js/replication.js
index 72ab7a150a..bdfd2fe9b2 100644
--- 
a/server/monitor/src/main/resources/org/apache/accumulo/monitor/resources/js/replication.js
+++ 
b/server/monitor/src/main/resources/org/apache/accumulo/monitor/resources/js/replication.js
@@ -18,20 +18,13 @@
  */
 "use strict";
 
-/**
- * Creates replication initial table
- */
-$(document).ready(function () {
-  refreshReplication();
-});
+var replicationStatsTable;
 
 /**
- * Makes the REST calls, generates the tables with the new information
+ * Populates the table with the new information
  */
 function refreshReplication() {
-  getReplication().then(function () {
-    refreshReplicationsTable();
-  });
+  ajaxReloadTable(replicationStatsTable);
 }
 
 /**
@@ -42,37 +35,45 @@ function refresh() {
 }
 
 /**
- * Generates the replication table
+ * Creates replication initial table
  */
-function refreshReplicationsTable() {
-  clearTableBody('replicationStats');
-
-  var data = sessionStorage.replication === undefined ? [] : 
JSON.parse(sessionStorage.replication);
-
-  if (data.length === 0) {
-    var items = [];
-    items.push(createEmptyRow(5, 'Replication is disabled by default. 
Replication table is currently offline.'));
-    $('<tr/>', {
-      html: items.join('')
-    }).appendTo('#replicationStats tbody');
-  } else {
-    $.each(data, function (key, val) {
-      var items = [];
-      items.push(createFirstCell(val.tableName, val.tableName));
-
-      items.push(createRightCell(val.peerName, val.peerName));
-
-      items.push(createRightCell(val.remoteIdentifier, val.remoteIdentifier));
-
-      items.push(createRightCell(val.replicaSystemType, 
val.replicaSystemType));
+$(document).ready(function () {
 
-      items.push(createRightCell(val.filesNeedingReplication,
-        bigNumberForQuantity(val.filesNeedingReplication)));
+  replicationStatsTable = $('#replicationStats').DataTable({
+    "ajax": {
+      "url": "/rest/replication",
+      "dataSrc": ""
+    },
+    "stateSave": true,
+    "columns": [{
+        "data": "tableName",
+        "width": "25%"
+      },
+      {
+        "data": "peerName",
+        "width": "20%"
+      },
+      {
+        "data": "remoteIdentifier",
+        "width": "25%"
+      },
+      {
+        "data": "replicaSystemType",
+        "width": "15%"
+      },
+      {
+        "data": "filesNeedingReplication",
+        "width": "15%",
+        "render": function (data, type) {
+          if (type === 'display') {
+            data = bigNumberForQuantity(data);
+          }
+          return data;
+        }
+      }
+    ]
+  });
 
-      $('<tr/>', {
-        html: items.join('')
-      }).appendTo('#replicationStats tbody');
+  refreshReplication();
 
-    });
-  }
-}
+});
diff --git 
a/server/monitor/src/main/resources/org/apache/accumulo/monitor/templates/replication.ftl
 
b/server/monitor/src/main/resources/org/apache/accumulo/monitor/templates/replication.ftl
index e7fb25f538..04c9aed04e 100644
--- 
a/server/monitor/src/main/resources/org/apache/accumulo/monitor/templates/replication.ftl
+++ 
b/server/monitor/src/main/resources/org/apache/accumulo/monitor/templates/replication.ftl
@@ -28,7 +28,7 @@
           <table id="replicationStats" class="table table-bordered 
table-striped table-condensed">
             <thead>
               <tr>
-                <th class="firstcell">Table&nbsp;</th>
+                <th>Table&nbsp;</th>
                 <th>Peer&nbsp;</th>
                 <th>Remote&nbsp;Identifier&nbsp;</th>
                 <th>Replica&nbsp;System&nbsp;Type&nbsp;</th>