From 21c48d0b6a61476cad4068362e7fa1c79cd4fae6 Mon Sep 17 00:00:00 2001
From: Karl <karl@k-world.me.uk>
Date: Sat, 19 Jul 2025 10:20:47 +0100
Subject: [PATCH] show current entries in dns

---
 templates/config_dashboard.html | 36 ++++++++++++++++++++++-----------
 1 file changed, 24 insertions(+), 12 deletions(-)

diff --git a/templates/config_dashboard.html b/templates/config_dashboard.html
index 3ed57c4..085b163 100644
--- a/templates/config_dashboard.html
+++ b/templates/config_dashboard.html
@@ -21,9 +21,17 @@
                 </div>
             </div>
         </div>
-        <ul class="list-group list-group-flush" id="dns-list">
-            <!-- DNS entries will be loaded here -->
-        </ul>
+        <table class="table table-striped mt-3">
+            <thead>
+                <tr>
+                    <th>DNS Entry</th>
+                    <th style="width: 10%;">Actions</th>
+                </tr>
+            </thead>
+            <tbody id="dns-list-table-body">
+                <!-- DNS entries will be loaded here -->
+            </tbody>
+        </table>
     </div>
 </div>
 {% endblock %}
@@ -33,7 +41,7 @@
 <script>
     document.addEventListener('DOMContentLoaded', function() {
         // DNS Manager
-        const dnsList = document.getElementById('dns-list');
+        const dnsListTableBody = document.getElementById('dns-list-table-body');
         const addDnsBtn = document.getElementById('add-dns-btn');
         const dnsEntryInput = document.getElementById('dns-entry-input');
 
@@ -41,20 +49,24 @@
             fetch("{{ config.BASE_URL }}/dns")
                 .then(response => response.json())
                 .then(data => {
-                    dnsList.innerHTML = '';
+                    dnsListTableBody.innerHTML = '';
                     if (data.length === 0) {
-                        dnsList.innerHTML = '<li class="list-group-item">No DNS entries found.</li>';
+                        const row = dnsListTableBody.insertRow();
+                        const cell = row.insertCell();
+                        cell.colSpan = 2;
+                        cell.textContent = 'No DNS entries found.';
+                        cell.classList.add('text-center');
                     } else {
                         data.forEach(entry => {
-                            const li = document.createElement('li');
-                            li.className = 'list-group-item d-flex justify-content-between align-items-center';
-                            li.textContent = entry;
+                            const row = dnsListTableBody.insertRow();
+                            const entryCell = row.insertCell();
+                            entryCell.textContent = entry;
+                            const actionCell = row.insertCell();
                             const removeBtn = document.createElement('button');
                             removeBtn.className = 'btn btn-danger btn-sm';
-                            removeBtn.textContent = 'Remove';
+                            removeBtn.textContent = 'Delete';
                             removeBtn.addEventListener('click', () => removeDnsEntry(entry));
-                            li.appendChild(removeBtn);
-                            dnsList.appendChild(li);
+                            actionCell.appendChild(removeBtn);
                         });
                     }
                 });