Improve rendering of search results (#2750)

scripts/pi-hole/js/search.js

@@ -48,16 +48,19 @@ function eventsource(partial) {
         (numDomains > 0 ? ":" : ".") +
         "<br><br>";
       for (const domain of res.domains) {
+        const color = domain.type === "deny" ? "red" : "green";
         result +=
           "  - <a href='groups-domains.lp?domainid=" +
           domain.id +
-          "' target='_blank'><strong class='text-green'>" +
+          "' target='_blank'><strong>" +
           utils.escapeHtml(domain.domain) +
-          "</strong></a><br>    " +
+          "</strong></a><br>    <strong class='text-" +
+          color +
+          "'>" +
           domain.kind +
           " " +
           domain.type +
-          " domain<br>    added:         " +
+          " domain</strong><br>    added:         " +
           utils.renderTimestamp(domain.date_added, "display") +
           "<br>    last modified: " +
           utils.renderTimestamp(domain.date_modified, "display") +
@@ -88,7 +91,7 @@ function eventsource(partial) {
       result +=
         "Found " +
         numAdlists +
-        " adlist" +
+        " list" +
         (numAdlists !== 1 ? "s" : "") +
         " <em>" +
         verb +
@@ -99,12 +102,18 @@ function eventsource(partial) {
         "<br><br>";
       for (const address of Object.keys(grouped)) {
         const adlist = grouped[address][0];
+        const color = adlist.type === "block" ? "red" : "green";
         result +=
           "  - <a href='groups-adlists.lp?adlistid=" +
           adlist.id +
           "' target='_blank'>" +
           utils.escapeHtml(address) +
-          "</a><br>    added:         " +
+          "</a><br>    <strong class='text-" +
+          color +
+          "'>" +
+          adlist.type +
+          " list</strong>" +
+          "<br>    added:         " +
           utils.renderTimestamp(adlist.date_added, "display") +
           "<br>    last modified: " +
           utils.renderTimestamp(adlist.date_modified, "display") +
@@ -122,18 +131,50 @@ function eventsource(partial) {
           (adlist.comment !== null && adlist.comment.length > 0
             ? '<br>    comment: "' + utils.escapeHtml(adlist.comment) + '"'
             : "<br>    no comment") +
-          "<br>";
+          "<br>    matching entries:<br>";
         for (const adlists of grouped[address]) {
           result +=
-            "    - <strong class='text-green'>" +
-            utils.escapeHtml(adlists.domain) +
-            "</strong><br>";
+            "    - <strong class='text-blue'>" + utils.escapeHtml(adlists.domain) + "</strong><br>";
         }
 
         result += "<br>";
       }
 
-      result += "Search took " + (1000 * data.took).toFixed(1) + " ms";
+      result += "Number of results per type:<br>";
+      result +=
+        "  - <strong class='text-blue'>" +
+        data.search.results.domains.exact +
+        "</strong> exact domain matches<br>";
+      result +=
+        "  - <strong class='text-blue'>" +
+        data.search.results.domains.regex +
+        "</strong> regex domain matches<br>";
+      result +=
+        "  - <strong class='text-blue'>" +
+        data.search.results.gravity.allow +
+        "</strong> allowlist (antigravity) matches<br>";
+      result +=
+        "  - <strong class='text-blue'>" +
+        data.search.results.gravity.block +
+        "</strong> blocklist (gravity) matches<br>";
+
+      if (
+        data.search.results.gravity.allow > data.search.parameters.N ||
+        data.search.results.gravity.block > data.search.parameters.N ||
+        data.search.results.domains.exact > data.search.parameters.N ||
+        data.search.results.domains.regex > data.search.parameters.N
+      ) {
+        result +=
+          "<br><br><strong class='text-green'>Note:</strong> " +
+          "The number of results to return per type is limited to " +
+          data.search.parameters.N +
+          " entries.<br>      There are " +
+          data.search.results.total +
+          " matching entries in total.<br>      Consider " +
+          "using a more specific search term or increase N.<br>";
+      }
+
+      result += "<br>Search took " + (1000 * data.took).toFixed(1) + " ms";
 
       ta.append(result);
     })

scripts/pi-hole/lua/sidebar.lp

@@ -230,7 +230,7 @@
                         <!-- Query Lists -->
                         <li class="<? if scriptname == 'search' then ?> active<? end ?>">
                             <a href="<?=webhome?>search">
-                                <i class="fa fa-fw menu-icon fa-search"></i> <span>Search Adlists</span>
+                                <i class="fa fa-fw menu-icon fa-search"></i> <span>Search Lists</span>
                             </a>
                         </li>
                         <!-- Network -->

search.lp

@@ -11,7 +11,7 @@ mg.include('scripts/pi-hole/lua/header_authenticated.lp','r')
 ?>
 <!-- Title -->
 <div class="page-header">
-    <h1>Find Blocked Domain In Lists</h1>
+    <h1>Find Domains In Lists</h1>
 </div>
 <div class="row">
     <div class="col-md-12">