From 321406d066229212ac8342891806a9fd11feff59 Mon Sep 17 00:00:00 2001
From: Sridhar Sivakumar
Date: Tue, 30 Apr 2024 14:53:37 +0530
Subject: [PATCH] Add search, sort and pagination feature to probes table
(#464)
Co-authored-by: Adrien Lecharpentier
---
war/package.json | 3 ++-
war/src/main/js/index.js | 10 ++++++++
war/src/main/less/index.less | 1 +
.../resources/templates/probes/listing.html | 2 +-
war/yarn.lock | 25 +++++++++++++++++++
5 files changed, 39 insertions(+), 2 deletions(-)
diff --git a/war/package.json b/war/package.json
index 6ff773d74..e32492c1a 100644
--- a/war/package.json
+++ b/war/package.json
@@ -24,7 +24,8 @@
"webpack-remove-empty-scripts": "1.0.4"
},
"dependencies": {
- "ionicons": "7.3.1"
+ "ionicons": "7.3.1",
+ "simple-datatables": "9.0.3"
},
"browserslist": [
"defaults",
diff --git a/war/src/main/js/index.js b/war/src/main/js/index.js
index 3f34bda50..ba762a0c6 100644
--- a/war/src/main/js/index.js
+++ b/war/src/main/js/index.js
@@ -1,9 +1,19 @@
import {defineCustomElements} from "ionicons/dist/loader";
+import { DataTable } from "simple-datatables";
defineCustomElements(window, {
resourcesUrl: '/',
});
+const probesTable = document.getElementById('probes-table');
+if (probesTable !== null) {
+ new DataTable("#probes-table", {
+ perPageSelect: [10, 25, 50],
+ columns: [
+ { select: 1, sortable: false },
+ ]
+ });
+}
const updateCollapseIcon = (container, target) => {
if (target.classList.contains('show')) {
diff --git a/war/src/main/less/index.less b/war/src/main/less/index.less
index fb655ad0a..5ce13fe5e 100644
--- a/war/src/main/less/index.less
+++ b/war/src/main/less/index.less
@@ -7,6 +7,7 @@
@import './modules/page-footer';
@import './modules/score';
@import './modules/table';
+@import '~simple-datatables/src/css/style.css';
html {
font-size: 16px !important;
diff --git a/war/src/main/resources/templates/probes/listing.html b/war/src/main/resources/templates/probes/listing.html
index e08250f9d..b10161834 100644
--- a/war/src/main/resources/templates/probes/listing.html
+++ b/war/src/main/resources/templates/probes/listing.html
@@ -12,7 +12,7 @@ Probes
Raw results of the probes execution can be found on the
results page.
-
+
ID |
diff --git a/war/yarn.lock b/war/yarn.lock
index aff52e5ee..e39c73c50 100644
--- a/war/yarn.lock
+++ b/war/yarn.lock
@@ -1071,6 +1071,13 @@ __metadata:
languageName: node
linkType: hard
+"dayjs@npm:^1.11.10":
+ version: 1.11.10
+ resolution: "dayjs@npm:1.11.10"
+ checksum: 27e8f5bc01c0a76f36c656e62ab7f08c2e7b040b09e613cd4844abf03fb258e0350f0a83b02c887b84d771c1f11e092deda0beef8c6df2a1afbc3f6c1fade279
+ languageName: node
+ linkType: hard
+
"del@npm:^4.1.1":
version: 4.1.1
resolution: "del@npm:4.1.1"
@@ -1086,6 +1093,13 @@ __metadata:
languageName: node
linkType: hard
+"diff-dom@npm:^5.1.3":
+ version: 5.1.3
+ resolution: "diff-dom@npm:5.1.3"
+ checksum: c3eecb6a0487e49b8429474994d9236959805666699e9074cf9c9a7e39f6a11818a9b80a2c4af58ec74496c08bbae7eb53b64184817e79699fba1f8f21a2ffe5
+ languageName: node
+ linkType: hard
+
"dom-serializer@npm:^2.0.0":
version: 2.0.0
resolution: "dom-serializer@npm:2.0.0"
@@ -2160,6 +2174,7 @@ __metadata:
path: "npm:0.12.7"
postcss: "npm:8.4.38"
postcss-loader: "npm:8.1.1"
+ simple-datatables: "npm:9.0.3"
style-loader: "npm:3.3.4"
webpack: "npm:5.91.0"
webpack-cli: "npm:5.1.4"
@@ -2809,6 +2824,16 @@ __metadata:
languageName: node
linkType: hard
+"simple-datatables@npm:9.0.3":
+ version: 9.0.3
+ resolution: "simple-datatables@npm:9.0.3"
+ dependencies:
+ dayjs: "npm:^1.11.10"
+ diff-dom: "npm:^5.1.3"
+ checksum: 0a68e2b124b5c9d8f582b697a8584cca13137834768fd713d8fd07542112389264cbafe9acc23ef486ec65fff0798a77bc8750bfc600aa4253681895dcef4fa0
+ languageName: node
+ linkType: hard
+
"slash@npm:^5.1.0":
version: 5.1.0
resolution: "slash@npm:5.1.0"