From e4487c8bf0e6fe062d86c779eb5347364f9752ce Mon Sep 17 00:00:00 2001
From: Mark Veidemanis <m@zm.is>
Date: Thu, 21 Jul 2022 13:52:24 +0100
Subject: [PATCH] Retheme Insights page to not use panels

---
 core/templates/ui/insights/channels.html |  30 ++---
 core/templates/ui/insights/info.html     | 144 ++++++++++++-----------
 core/templates/ui/insights/meta.html     |  27 +++--
 core/templates/ui/insights/nicks.html    |  30 ++---
 4 files changed, 122 insertions(+), 109 deletions(-)

diff --git a/core/templates/ui/insights/channels.html b/core/templates/ui/insights/channels.html
index c17c3b4..5c9fe97 100644
--- a/core/templates/ui/insights/channels.html
+++ b/core/templates/ui/insights/channels.html
@@ -1,19 +1,21 @@
 <div id="channels">
-  <div class="content">
-    <ol type="1">
+  <div class="content" style="max-height: 30em; overflow: auto;">
+    <table class="table is-fullwidth is-hoverable">
       {% for chan in chans %}
-        <li>
-          <span
-            hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'
-            hx-post="{% url 'modal_drilldown' %}"
-            hx-vals='{"net": "{{ net }}", "nick": "{{ nick }}", "channel": "{{ chan }}"}'
-            hx-target="#modals-here" 
-            hx-trigger="click"
-            class="button is-small">
-            {{ chan }}
-          </span>
-        </li>
+        <tr>
+          <td>
+            <span
+              hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'
+              hx-post="{% url 'modal_drilldown' %}"
+              hx-vals='{"net": "{{ net }}", "nick": "{{ nick }}", "channel": "{{ chan }}"}'
+              hx-target="#modals-here" 
+              hx-trigger="click"
+              class="button is-small">
+              {{ chan }}
+            </span>
+          </td>
+        </tr>
       {% endfor %}
-    </ol>
+    </table>
   </div>
 </div>
\ No newline at end of file
diff --git a/core/templates/ui/insights/info.html b/core/templates/ui/insights/info.html
index 207a8a4..9a9d84c 100644
--- a/core/templates/ui/insights/info.html
+++ b/core/templates/ui/insights/info.html
@@ -29,77 +29,79 @@
 </div>
 <div id="info">
   {% if item is not None %}
-    <div class="table-container">
-      <table class="table is-fullwidth is-hoverable">
-        <tbody>
-          <tr>
-            <th>src</th>
-            <td>
-              {% if item.src == 'irc' %}
-                <span class="icon" data-tooltip="IRC">
-                  <i class="fa-solid fa-hashtag" aria-hidden="true"></i>
-                </span>
-                IRC
-              {% elif item.src == 'dis' %}
-                <span class="icon" data-tooltip="Discord">
-                  <i class="fa-brands fa-discord" aria-hidden="true"></i>
-                </span>
-                Discord
-              {% endif %}
-            </td>
-          </tr>
-          <tr>
-            <th>nick</th>
-            <td>
-              {% if item.online is True %}
-                <span class="icon has-text-success has-tooltip-success" data-tooltip="Online">
-                  <i class="fa-solid fa-circle"></i>
-                </span>
-                {{ item.nick }}
-              {% elif item.online is False %}
-                <span class="icon has-text-danger has-tooltip-danger" data-tooltip="Offline">
-                  <i class="fa-solid fa-circle"></i>
-                </span>
-                {{ item.nick }}
-              {% else %}
-                <span class="icon has-text-warning has-tooltip-warning" data-tooltip="Unknown">
-                  <i class="fa-solid fa-circle"></i>
-                </span>
-                {{ item.nick }}
-              {% endif %}
-              {% if item.num_chans is not None %}
-                <span class="tag">
-                  {{ item.num_chans }}
-                </span>
-              {% endif %}
-            </td>
-          </tr>
-          <tr>
-            <th>host</th>
-            <td>{{ item.host }}</td>
-          </tr>
-          <tr>
-            <th>actions</th>
-            <td>
-              {% if item.src == 'irc' %}
-                <button
-                  hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'
-                  hx-post="{% url 'modal_insights' %}"
-                  hx-vals='{"net": "{{ item.net }}", "nick": "{{ item.nick }}", "channel": "{{ item.channel }}"}'
-                  hx-target="#modals-here" 
-                  hx-trigger="click"
-                  class="button is-small">
-                  Information
-                </button>
-              {% endif %}
-            </td>
-          </tr>
-          <tr>
-            <th>net</th>
-            <td>{{ item.net }}</td>
-          </tr>
-        </tbody>
-      </table>
+    <div class="content" style="max-height: 30em; overflow: auto;">
+      <div class="table-container">
+        <table class="table is-fullwidth is-hoverable">
+          <tbody>
+            <tr>
+              <th>src</th>
+              <td>
+                {% if item.src == 'irc' %}
+                  <span class="icon" data-tooltip="IRC">
+                    <i class="fa-solid fa-hashtag" aria-hidden="true"></i>
+                  </span>
+                  IRC
+                {% elif item.src == 'dis' %}
+                  <span class="icon" data-tooltip="Discord">
+                    <i class="fa-brands fa-discord" aria-hidden="true"></i>
+                  </span>
+                  Discord
+                {% endif %}
+              </td>
+            </tr>
+            <tr>
+              <th>nick</th>
+              <td>
+                {% if item.online is True %}
+                  <span class="icon has-text-success has-tooltip-success" data-tooltip="Online">
+                    <i class="fa-solid fa-circle"></i>
+                  </span>
+                  {{ item.nick }}
+                {% elif item.online is False %}
+                  <span class="icon has-text-danger has-tooltip-danger" data-tooltip="Offline">
+                    <i class="fa-solid fa-circle"></i>
+                  </span>
+                  {{ item.nick }}
+                {% else %}
+                  <span class="icon has-text-warning has-tooltip-warning" data-tooltip="Unknown">
+                    <i class="fa-solid fa-circle"></i>
+                  </span>
+                  {{ item.nick }}
+                {% endif %}
+                {% if item.num_chans is not None %}
+                  <span class="tag">
+                    {{ item.num_chans }}
+                  </span>
+                {% endif %}
+              </td>
+            </tr>
+            <tr>
+              <th>host</th>
+              <td>{{ item.host }}</td>
+            </tr>
+            <tr>
+              <th>actions</th>
+              <td>
+                {% if item.src == 'irc' %}
+                  <button
+                    hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'
+                    hx-post="{% url 'modal_insights' %}"
+                    hx-vals='{"net": "{{ item.net }}", "nick": "{{ item.nick }}", "channel": "{{ item.channel }}"}'
+                    hx-target="#modals-here" 
+                    hx-trigger="click"
+                    class="button is-small">
+                    Information
+                  </button>
+                {% endif %}
+              </td>
+            </tr>
+            <tr>
+              <th>net</th>
+              <td>{{ item.net }}</td>
+            </tr>
+          </tbody>
+        </table>
+      </div>
     </div>
   {% endif %}
 </div>
\ No newline at end of file
diff --git a/core/templates/ui/insights/meta.html b/core/templates/ui/insights/meta.html
index 1e34fdf..fd971c7 100644
--- a/core/templates/ui/insights/meta.html
+++ b/core/templates/ui/insights/meta.html
@@ -1,12 +1,19 @@
 <div id="meta">
-  <i class="fa-solid fa-hashtag" aria-hidden="true"></i>
-  <span
-    hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'
-    hx-post="{% url 'modal_drilldown' %}"
-    hx-vals='{"net": "{{ net }}", "nick": "{{ nick }}", "channel": "{{ chan }}"}'
-    hx-target="#modals-here" 
-    hx-trigger="click"
-    class="button is-small">
-    bbb
-  </span>
+  <div class="content" style="max-height: 30em; overflow: auto;">
+    <table class="table is-fullwidth is-hoverable">
+      <tr>
+        <td>
+          <span
+            hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'
+            hx-post="{% url 'modal_drilldown' %}"
+            hx-vals='{"net": "{{ net }}", "nick": "{{ nick }}", "channel": "{{ chan }}"}'
+            hx-target="#modals-here" 
+            hx-trigger="click"
+            class="button is-small">
+            bbb
+          </span>
+        </td>
+      </tr>
+    </table>
+  </div>
 </div>
\ No newline at end of file
diff --git a/core/templates/ui/insights/nicks.html b/core/templates/ui/insights/nicks.html
index 49c02bf..b59f3d7 100644
--- a/core/templates/ui/insights/nicks.html
+++ b/core/templates/ui/insights/nicks.html
@@ -1,19 +1,21 @@
 <div id="nicks">
-  <div class="content">
-    <ol type="1">
+  <div class="content" style="max-height: 30em; overflow: auto;">
+    <table class="table is-fullwidth is-hoverable">
       {% for nick in nicks %}
-        <li>
-          <span
-            hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'
-            hx-post="{% url 'modal_drilldown' %}"
-            hx-vals='{"net": "{{ net }}", "nick": "{{ nick }}", "channel": "{{ chan }}"}'
-            hx-target="#modals-here" 
-            hx-trigger="click"
-            class="button is-small">
-            {{ nick }}
-          </span>
-        </li>
+        <tr>
+          <td>
+            <span
+              hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'
+              hx-post="{% url 'modal_drilldown' %}"
+              hx-vals='{"net": "{{ net }}", "nick": "{{ nick }}", "channel": "{{ chan }}"}'
+              hx-target="#modals-here" 
+              hx-trigger="click"
+              class="button is-small">
+              {{ nick }}
+            </span>
+          </td>
+        </tr>
       {% endfor %}
-    </ol>
+    </table>
   </div>
 </div>
\ No newline at end of file