From 67ec3faa543072cf7a12c4775a34dcc9b4d7aef2 Mon Sep 17 00:00:00 2001
From: Joachim Wiberg <troglobit@gmail.com>
Date: Sun, 14 Jun 2026 22:04:06 +0200
Subject: [PATCH] webui: relocate and reorder some menu items

External services like the mdns-browser and the web console belong in
the User Menu next to the bundled user guide.  They all open another
browser tab and provide another service.

Place common tasks close to each other and high up: Interface overview,
routing table, and firewall.  Feels slightly better imo.

Signed-off-by: Joachim Wiberg <troglobit@gmail.com>
---
 src/webui/templates/layouts/base.html    | 17 ++++++-
 src/webui/templates/layouts/sidebar.html | 60 ++++++++----------------
 2 files changed, 36 insertions(+), 41 deletions(-)

diff --git a/src/webui/templates/layouts/base.html b/src/webui/templates/layouts/base.html
index 2f960a9c..4eb345c9 100644
--- a/src/webui/templates/layouts/base.html
+++ b/src/webui/templates/layouts/base.html
@@ -92,13 +92,28 @@
                 Off
                 {{template "icon-check"}}
               </button>
-              {{if .Capabilities.Has "docs"}}
+              {{if or (.Capabilities.Has "docs") (.Capabilities.Has "netbrowse") (.Capabilities.Has "console")}}
               <div class="dropdown-divider"></div>
+              {{if .Capabilities.Has "docs"}}
               <a class="dropdown-item" href="/guide/" target="_blank" rel="noopener">
                 {{template "icon-book"}}
                 User Guide
               </a>
               {{end}}
+              {{if .Capabilities.Has "netbrowse"}}
+              <a class="dropdown-item" href="https://network.local/" target="_blank" rel="noopener">
+                {{template "icon-radar"}}
+                Network Browser
+              </a>
+              {{end}}
+              {{if .Capabilities.Has "console"}}
+              {{/* href filled in by JS from the current hostname (ttyd on :7681). */}}
+              <a class="dropdown-item" data-console-link href="#" target="_blank" rel="noopener">
+                {{template "icon-terminal"}}
+                Console
+              </a>
+              {{end}}
+              {{end}}
               <div class="dropdown-divider"></div>
               <form method="POST" action="/logout">
                 <input type="hidden" name="csrf" value="{{.CsrfToken}}">
diff --git a/src/webui/templates/layouts/sidebar.html b/src/webui/templates/layouts/sidebar.html
index eb3a812c..62adddf0 100644
--- a/src/webui/templates/layouts/sidebar.html
+++ b/src/webui/templates/layouts/sidebar.html
@@ -73,6 +73,26 @@
             Interfaces
           </a>
         </li>
+        <li>
+          <a href="/routing"
+             hx-get="/routing"
+             hx-target="#content"
+             hx-push-url="true"
+             class="nav-link {{if eq .ActivePage "routing"}}active{{end}}">
+            <span class="nav-icon" style="--icon: url('/assets/img/icons/routing.svg')"></span>
+            Routes
+          </a>
+        </li>
+        <li>
+          <a href="/firewall"
+             hx-get="/firewall"
+             hx-target="#content"
+             hx-push-url="true"
+             class="nav-link {{if eq .ActivePage "firewall"}}active{{end}}">
+            <span class="nav-icon" style="--icon: url('/assets/img/icons/firewall.svg')"></span>
+            Firewall
+          </a>
+        </li>
         <li>
           <a href="/dhcp"
              hx-get="/dhcp"
@@ -103,16 +123,6 @@
             mDNS
           </a>
         </li>
-        {{if .Capabilities.Has "netbrowse"}}
-        {{/* External link to the mDNS network browser at network.local
-             (new tab); not an htmx nav. */}}
-        <li>
-          <a href="https://network.local/" target="_blank" rel="noopener" class="nav-link">
-            <span class="nav-icon" style="--icon: url('/assets/img/icons/netbrowse.svg')"></span>
-            Network Browser
-          </a>
-        </li>
-        {{end}}
         <li>
           <a href="/ntp"
              hx-get="/ntp"
@@ -123,26 +133,6 @@
             NTP
           </a>
         </li>
-        <li>
-          <a href="/routing"
-             hx-get="/routing"
-             hx-target="#content"
-             hx-push-url="true"
-             class="nav-link {{if eq .ActivePage "routing"}}active{{end}}">
-            <span class="nav-icon" style="--icon: url('/assets/img/icons/routing.svg')"></span>
-            Routes
-          </a>
-        </li>
-        <li>
-          <a href="/firewall"
-             hx-get="/firewall"
-             hx-target="#content"
-             hx-push-url="true"
-             class="nav-link {{if eq .ActivePage "firewall"}}active{{end}}">
-            <span class="nav-icon" style="--icon: url('/assets/img/icons/firewall.svg')"></span>
-            Firewall
-          </a>
-        </li>
         {{if and .Capabilities (.Capabilities.Has "wifi")}}
         <li>
           <a href="/wifi"
@@ -334,16 +324,6 @@
             Diagnostics
           </a>
         </li>
-        {{if .Capabilities.Has "console"}}
-        {{/* External link to ttyd on :7681 (new tab); not an htmx nav.
-             href is filled in by JS from the current hostname. */}}
-        <li>
-          <a data-console-link href="#" target="_blank" rel="noopener" class="nav-link">
-            <span class="nav-icon" style="--icon: url('/assets/img/icons/console.svg')"></span>
-            Console
-          </a>
-        </li>
-        {{end}}
         <li>
           <a href="/maintenance/backup"
              hx-get="/maintenance/backup"