Show server tunnel address on dashboard and settings pages

Co-authored-by: factory-droid[bot] <138933559+factory-droid[bot]@users.noreply.github.com>

app/main.py

@@ -104,7 +104,12 @@ def dashboard(request: Request, db: Session = Depends(get_db)):
     return templates.TemplateResponse(
         request,
         "dashboard.html",
-        {"status": status, "peers": peers, "settings": settings},
+        {
+            "status": status,
+            "peers": peers,
+            "settings": settings,
+            "server_address": wireguard.server_address(),
+        },
     )
 
 
@@ -240,7 +245,13 @@ def peer_qr(peer_id: int, db: Session = Depends(get_db)):
 def settings_page(request: Request):
     _, server_public = wireguard.ensure_server_keys()
     return templates.TemplateResponse(
-        request, "settings.html", {"settings": settings, "server_public": server_public}
+        request,
+        "settings.html",
+        {
+            "settings": settings,
+            "server_public": server_public,
+            "server_address": wireguard.server_address(),
+        },
     )
 
 

app/templates/dashboard.html

@@ -15,7 +15,9 @@
       <span class="rounded-full bg-red-100 px-2 py-0.5 text-xs font-medium text-red-700">down</span>
       {% endif %}
     </p>
-    <p class="mt-1 text-sm text-slate-500">Port {{ status.listen_port or settings.wg_port }}</p>
+    <p class="mt-1 text-sm text-slate-500">
+      <span class="font-mono">{{ server_address }}</span> · Port {{ status.listen_port or settings.wg_port }}
+    </p>
   </div>
   <div class="rounded-xl bg-white p-5 shadow-sm">
     <h3 class="mb-2 text-xs font-semibold uppercase tracking-wide text-slate-400">Peers</h3>

app/templates/settings.html

@@ -9,6 +9,10 @@
       <dt class="text-slate-500">Interface</dt>
       <dd class="font-medium">{{ settings.wg_interface }}</dd>
     </div>
+    <div class="flex justify-between gap-4 py-3">
+      <dt class="text-slate-500">Server address</dt>
+      <dd class="font-mono text-xs">{{ server_address }}</dd>
+    </div>
     <div class="flex justify-between gap-4 py-3">
       <dt class="shrink-0 text-slate-500">Server public key</dt>
       <dd class="break-all text-right font-mono text-xs">{{ server_public }}</dd>