From 3d1c910daab3feee188c7c75d52134e8c6546a23 Mon Sep 17 00:00:00 2001
From: rcourtman <courtmanr@gmail.com>
Date: Wed, 5 Nov 2025 23:10:20 +0000
Subject: [PATCH] Hide Settings tab when authentication is not configured

Related to #636

When authentication is not configured (hasAuth() returns false), the
Settings tab is now automatically hidden from the web interface. This
provides a cleaner monitoring-only view for unauthenticated deployments
where users only need to check the health of their environment.

The Settings icon beside the Alerts tab will only appear when
authentication is properly configured via PULSE_AUTH_USER/PASS,
API tokens, proxy auth, or OIDC.

Changes:
- Modified utilityTabs in App.tsx to conditionally include Settings
  based on hasAuth() signal
- Updated CONFIGURATION.md to document this UI behavior
---
 docs/CONFIGURATION.md       |  1 +
 frontend-modern/src/App.tsx | 14 ++++++++++----
 2 files changed, 11 insertions(+), 4 deletions(-)

diff --git a/docs/CONFIGURATION.md b/docs/CONFIGURATION.md
index a2db6b7..c072a12 100644
--- a/docs/CONFIGURATION.md
+++ b/docs/CONFIGURATION.md
@@ -63,6 +63,7 @@ PROXY_AUTH_LOGOUT_URL=/logout        # URL for SSO logout
 - **DO NOT** put port configuration here - use system.json or systemd overrides
 - Copy `.env.example` from the repository for a ready-to-edit template
 - Locked out? Create `<data-path>/.auth_recovery`, restart Pulse, and sign in from localhost to reset credentials. Remove the file afterwards.
+- **UI Behavior:** When authentication is not configured, the Settings tab is automatically hidden from the web interface, providing a cleaner monitoring-only view for unauthenticated deployments.
 
 ---
 
diff --git a/frontend-modern/src/App.tsx b/frontend-modern/src/App.tsx
index 459d8aa..567ff60 100644
--- a/frontend-modern/src/App.tsx
+++ b/frontend-modern/src/App.tsx
@@ -897,7 +897,7 @@ function AppLayout(props: {
       { warning: 0, critical: 0 },
     );
     const activeAlertCount = breakdown.warning + breakdown.critical;
-    return [
+    const tabs = [
       {
         id: 'alerts' as const,
         label: 'Alerts',
@@ -908,7 +908,11 @@ function AppLayout(props: {
         breakdown,
         icon: <BellIcon class="w-4 h-4 shrink-0" />,
       },
-      {
+    ];
+
+    // Only show Settings tab when authentication is configured
+    if (hasAuth()) {
+      tabs.push({
         id: 'settings' as const,
         label: 'Settings',
         route: '/settings',
@@ -917,8 +921,10 @@ function AppLayout(props: {
         count: undefined,
         breakdown: undefined,
         icon: <SettingsIcon class="w-4 h-4 shrink-0" />,
-      },
-    ];
+      });
+    }
+
+    return tabs;
   });
 
   const handlePlatformClick = (platform: ReturnType<typeof platformTabs>[number]) => {