From 7bc5e527286ff98f50556fdd6cf0227381e5dfa2 Mon Sep 17 00:00:00 2001
From: Bill Oley <bill.oley@gmail.com>
Date: Mon, 20 May 2024 12:11:33 -0400
Subject: [PATCH] Fix wrapping of query and plan in vertical/default display

---
 .../querymetric/QueryMetricModel.java         | 12 +++---
 .../querymetric/QueryMetricModelFormat.java   |  2 -
 .../templates/querymetric-horizontal.html     |  6 +--
 .../main/resources/templates/querymetric.html | 37 ++++++++++++++-----
 4 files changed, 37 insertions(+), 20 deletions(-)

diff --git a/api/src/main/java/datawave/microservice/querymetric/QueryMetricModel.java b/api/src/main/java/datawave/microservice/querymetric/QueryMetricModel.java
index 712d5cd..9ff8941 100644
--- a/api/src/main/java/datawave/microservice/querymetric/QueryMetricModel.java
+++ b/api/src/main/java/datawave/microservice/querymetric/QueryMetricModel.java
@@ -2,6 +2,7 @@
 
 import java.text.NumberFormat;
 import java.text.SimpleDateFormat;
+import java.util.Arrays;
 import java.util.List;
 import java.util.stream.Collectors;
 
@@ -53,16 +54,17 @@ public String getProxyServersStr() {
         return getProxyServers() == null ? "" : StringUtils.join(getProxyServers(), "<BR/>");
     }
     
-    public String getQueryStyle() {
-        return isJexlQuery(parameters) ? "white-space: pre; word-wrap: break-word;" : "word-wrap: break-word;";
-    }
-    
     public String getParametersStr() {
         return parameters == null ? "" : toFormattedParametersString(parameters);
     }
     
     public String getQueryAuthorizationsStr() {
-        return getQueryAuthorizations() == null ? "" : getQueryAuthorizations().replaceAll(",", " ");
+        String queryAuthorizations = getQueryAuthorizations();
+        if (queryAuthorizations == null) {
+            return "";
+        } else {
+            return Arrays.stream(queryAuthorizations.split(",")).sorted().collect(Collectors.joining(" "));
+        }
     }
     
     public String getPredictionsStr() {
diff --git a/api/src/main/java/datawave/microservice/querymetric/QueryMetricModelFormat.java b/api/src/main/java/datawave/microservice/querymetric/QueryMetricModelFormat.java
index 18552df..6b42b63 100644
--- a/api/src/main/java/datawave/microservice/querymetric/QueryMetricModelFormat.java
+++ b/api/src/main/java/datawave/microservice/querymetric/QueryMetricModelFormat.java
@@ -24,8 +24,6 @@ public interface QueryMetricModelFormat {
     
     String getProxyServersStr();
     
-    String getQueryStyle();
-    
     String getParametersStr();
     
     String getQueryAuthorizationsStr();
diff --git a/api/src/main/resources/templates/querymetric-horizontal.html b/api/src/main/resources/templates/querymetric-horizontal.html
index 707b88e..6286cd6 100644
--- a/api/src/main/resources/templates/querymetric-horizontal.html
+++ b/api/src/main/resources/templates/querymetric-horizontal.html
@@ -78,7 +78,7 @@ <h1>Query Metrics</h1>
                 <td th:text="${metric.queryType}"></td>
                 <td th:text="${metric.queryLogic}"></td>
                 <!--/* Note the HTML for the Query and Query Plan are set later... See scripts at end of this tr element */-->
-                <td th:id="query + ${metricIter.index + 1}" th:style="${metric.queryStyle}"></td>
+                <td th:id="query + ${metricIter.index + 1}" style="white-space: pre; word-wrap: break-word;"></td>
                 <td th:id="query-plan + ${metricIter.index + 1}" style="white-space: pre; word-wrap: break-word;"></td>
                 <td th:text="${metric.queryName}"></td>
                 <td style="min-width:125px !important;" th:text="${metric.beginDateStr}"></td>
@@ -105,8 +105,8 @@ <h1>Query Metrics</h1>
                 <td th:text="${metric.totalBytesSentStr}"></td>
                 <td th:text="${metric.lifecycle}"></td>
                 <td th:text="${metric.elapsedTimeStr}"></td>
-                <td style="word-wrap: break-word;" th:text="${metric.errorCode}"></td>
-                <td style="word-wrap: break-word;" th:text="${metric.errorMessage}"></td>
+                <td style="overflow-wrap: anywhere;" th:text="${metric.errorCode}"></td>
+                <td style="overflow-wrap: anywhere;" th:text="${metric.errorMessage}"></td>
 
                 <!--/*
                     Makes the metric's query and the metric's query plan interactive (highlight matching parens on mouse over, clicking a paren brings
diff --git a/api/src/main/resources/templates/querymetric.html b/api/src/main/resources/templates/querymetric.html
index fe03acb..bdbc71c 100644
--- a/api/src/main/resources/templates/querymetric.html
+++ b/api/src/main/resources/templates/querymetric.html
@@ -30,19 +30,36 @@ <h1>Query Metrics</h1>
     <div th:each="metric,metricIter : ${metricList}">
         <table class="metric">
             <tr class="highlight"><td>Visibility</td><td th:text="${metric.columnVisibility}"></td></tr>
-            <tr><td>Query Date</td><td style="min-width:125px !important;" th:text="${metric.createDateStr}"></td></tr>
+            <tr><td>Query Date</td><td th:text="${metric.createDateStr}"></td></tr>
             <tr class="highlight"><td>User</td><td th:text="${metric.user}"></td></tr>
-            <tr><td>UserDN</td><td style="min-width:500px !important;" th:text="${metric.userDN}"></td></tr>
+            <tr><td>UserDN</td><td th:text="${metric.userDN}"></td></tr>
             <tr class="highlight"><td>Proxy Server(s)</td><td th:utext="${metric.proxyServersStr}"></td></tr>
             <tr><td>Query Id</td><td><a th:href="${metric.queryIdUrl}" th:text="${metric.queryId}"></a></td></tr>
             <tr class="highlight"><td>Query Logic</td><td th:text="${metric.queryLogic}"></td></tr>
             <tr><td>Query Name</td><td th:text="${metric.queryName}"></td></tr>
             <tr class="highlight"><td>Query Type</td><td th:text="${metric.queryType}"></td>
-            <tr><td>Begin Date</td><td style="min-width:125px !important;" th:text="${metric.beginDateStr}"></td></tr>
-            <tr class="highlight"><td>End Date</td><td style="min-width:125px !important;" th:text="${metric.endDateStr}"></td></tr>
+            <tr><td>Begin Date</td><td th:text="${metric.beginDateStr}"></td></tr>
+            <tr class="highlight"><td>End Date</td><td th:text="${metric.endDateStr}"></td></tr>
             <tr><td>Versions</td><td th:utext="${metric.versionStr}"></td></tr>
-            <tr class="highlight"><td>Query Auths</td><td style="word-wrap: break-word; min-width:300px !important;" th:text="${metric.queryAuthorizationsStr}"></td></tr>
-            <tr><td>Parameters</td><td style="white-space: pre; word-wrap: break-word;" th:utext="${metric.parametersStr}"></td></tr>
+
+            <tr class="highlight" th:id="'queryauths' + ${metricIter.index + 1} + '-placeholder'">
+                <td>Query Auths (<a th:onClick="|toggleDisplay('queryauths${metricIter.index + 1}')|">show</a>)</td>
+                <td>click link to show/hide</td>
+            </tr>
+            <tr class="highlight" th:id="'queryauths' + ${metricIter.index + 1} + '-value'" hidden="true">
+                <td>Query Auths (<a th:onClick="|toggleDisplay('queryauths${metricIter.index + 1}')|">hide</a>)</td>
+                <td style="overflow-wrap: anywhere" th:text="${metric.queryAuthorizationsStr}"></td>
+            </tr>
+
+            <tr th:id="'parameters' + ${metricIter.index + 1} + '-placeholder'">
+                <td>Parameters (<a th:onClick="|toggleDisplay('parameters${metricIter.index + 1}')|">show</a>)</td>
+                <td>click link to show/hide</td>
+            </tr>
+            <tr th:id="'parameters' + ${metricIter.index + 1} + '-value'" hidden="true">
+                <td>Parameters (<a th:onClick="|toggleDisplay('parameters${metricIter.index + 1}')|">hide</a>)</td>
+                <td style="overflow-wrap: anywhere;" th:utext="${metric.parametersStr}"></td>
+            </tr>
+
             <!--/* Note the HTML for the Query and Query Plan are set later... See scripts at end of these tr elements */-->
             <tr class="highlight" th:id="'query' + ${metricIter.index + 1} + '-placeholder'">
                 <td>Query (<a th:onClick="|toggleDisplay('query${metricIter.index + 1}')|">show</a>)</td>
@@ -50,7 +67,7 @@ <h1>Query Metrics</h1>
             </tr>
             <tr class="highlight" th:id="'query' + ${metricIter.index + 1} + '-value'" hidden="true">
                 <td id="query-header">Query (<a th:onClick="|toggleDisplay('query${metricIter.index + 1}')|">hide</a>)</td>
-                <td th:id="'query' + ${metricIter.index + 1}" th:style="${metric.queryStyle}"/>
+                <td th:id="'query' + ${metricIter.index + 1}" style="overflow-wrap: anywhere;"/>
             </tr>
 
             <tr th:id="'query-plan' + ${metricIter.index + 1} + '-placeholder'">
@@ -59,7 +76,7 @@ <h1>Query Metrics</h1>
             </tr>
             <tr th:id="'query-plan' + ${metricIter.index + 1} + '-value'" hidden="true">
                 <td>Query Plan (<a th:onClick="|toggleDisplay('query-plan${metricIter.index + 1}')|">hide</a>)</td>
-                <td th:id="'query-plan' + ${metricIter.index + 1}" style="white-space: pre; word-wrap: break-word;"/>
+                <td th:id="'query-plan' + ${metricIter.index + 1}" style="overflow-wrap: anywhere;"/>
             </tr>
             <tr class="highlight"><td>Predictions</td><td th:text="${metric.predictionsStr}"></td></tr>
             <tr><td>Server</td><td th:text="${metric.host}"></td></tr>
@@ -67,8 +84,8 @@ <h1>Query Metrics</h1>
             <tr><td>Lifecycle</td><td th:text="${metric.lifecycle}"></td></tr>
             <tr class="highlight"><td>Number Pages</td><td th:text="${metric.numPagesStr}"></td></tr>
             <tr><td>Number Results</td><td th:text="${metric.numResultsStr}"></td></tr>
-            <tr class="highlight"><td>Error Code</td><td style="word-wrap: break-word;" th:text="${metric.errorCode}"></td></tr>
-            <tr><td>Error Message</td><td style="word-wrap: break-word;" th:text="${metric.errorMessage}"></td></tr>
+            <tr class="highlight"><td>Error Code</td><td style="overflow-wrap: anywhere;" th:text="${metric.errorCode}"></td></tr>
+            <tr><td>Error Message</td><td style="overflow-wrap: anywhere;" th:text="${metric.errorMessage}"></td></tr>
             <tr class="highlight"><td>Login Time (ms)</td><td th:text="${metric.loginTimeStr}"></td></tr>
             <tr><td>Query Setup Time (ms)</td><td th:text="${metric.setupTimeStr}"></td></tr>
             <tr class="highlight"><td>Query Setup Call Time (ms)</td><td th:text="${metric.createCallTimeStr}"></td></tr>