From 831cb18b665e07b8db610c7cec211b5fc0971dc8 Mon Sep 17 00:00:00 2001
From: Gigi <dergigi@pm.me>
Date: Thu, 9 Oct 2025 12:49:37 +0100
Subject: [PATCH] feat: improve relay status responsiveness for flight mode

- Reduce relay connection window from 20 minutes to 10 seconds
- Change 'Recently Seen' section to 'Offline' with red styling
- Use red circle icon for offline relays instead of gray
- Poll relay status every 2 seconds in settings (faster feedback)
- Poll relay status every 2 seconds in status indicator
- Now when entering flight mode:
  - Local relay stays connected (green checkmark with plane icon)
  - All remote relays move to red 'Offline' section within 10 seconds
  - Status is highly responsive and clear
---
 src/components/RelayStatusIndicator.tsx   | 3 ++-
 src/components/Settings.tsx               | 3 ++-
 src/components/Settings/RelaySettings.tsx | 6 +++---
 src/services/relayStatusService.ts        | 3 ++-
 4 files changed, 9 insertions(+), 6 deletions(-)

diff --git a/src/components/RelayStatusIndicator.tsx b/src/components/RelayStatusIndicator.tsx
index 80f271ff..57520066 100644
--- a/src/components/RelayStatusIndicator.tsx
+++ b/src/components/RelayStatusIndicator.tsx
@@ -10,7 +10,8 @@ interface RelayStatusIndicatorProps {
 }
 
 export const RelayStatusIndicator: React.FC<RelayStatusIndicatorProps> = ({ relayPool }) => {
-  const relayStatuses = useRelayStatus({ relayPool, pollingInterval: 3000 })
+  // Poll frequently for responsive local-only detection
+  const relayStatuses = useRelayStatus({ relayPool, pollingInterval: 2000 })
   
   if (!relayPool) return null
   
diff --git a/src/components/Settings.tsx b/src/components/Settings.tsx
index 48edcbbb..6bb5c818 100644
--- a/src/components/Settings.tsx
+++ b/src/components/Settings.tsx
@@ -57,7 +57,8 @@ const Settings: React.FC<SettingsProps> = ({ settings, onSave, onClose, relayPoo
   const saveTimeoutRef = useRef<number | null>(null)
   const isLocallyUpdating = useRef(false)
   
-  const relayStatuses = useRelayStatus({ relayPool })
+  // Poll more frequently in settings for responsive status updates
+  const relayStatuses = useRelayStatus({ relayPool, pollingInterval: 2000 })
 
   useEffect(() => {
     // Don't update from external settings if we're currently making local changes
diff --git a/src/components/Settings/RelaySettings.tsx b/src/components/Settings/RelaySettings.tsx
index 1a8ac906..f71f1597 100644
--- a/src/components/Settings/RelaySettings.tsx
+++ b/src/components/Settings/RelaySettings.tsx
@@ -103,12 +103,12 @@ const RelaySettings: React.FC<RelaySettingsProps> = ({ relayStatuses, onClose })
           <h4 style={{ 
             fontSize: '0.85rem', 
             fontWeight: 600, 
-            color: 'var(--text-secondary)',
+            color: '#ef4444',
             marginBottom: '0.75rem',
             textTransform: 'uppercase',
             letterSpacing: '0.05em'
           }}>
-            Recently Seen
+            Offline
           </h4>
           <div className="relay-list">
             {recentRelays.map((relay) => (
@@ -129,7 +129,7 @@ const RelaySettings: React.FC<RelaySettingsProps> = ({ relayStatuses, onClose })
                 <FontAwesomeIcon 
                   icon={faCircle} 
                   style={{ 
-                    color: 'var(--text-tertiary, #6b7280)',
+                    color: '#ef4444',
                     fontSize: '0.7rem'
                   }} 
                 />
diff --git a/src/services/relayStatusService.ts b/src/services/relayStatusService.ts
index c2c1daaa..f41a5323 100644
--- a/src/services/relayStatusService.ts
+++ b/src/services/relayStatusService.ts
@@ -6,7 +6,8 @@ export interface RelayStatus {
   lastSeen: number // timestamp
 }
 
-const RECENT_CONNECTION_WINDOW = 20 * 60 * 1000 // 20 minutes
+// How long to show disconnected relays as "recently seen" before hiding them
+const RECENT_CONNECTION_WINDOW = 10 * 1000 // 10 seconds
 
 // In-memory tracking of relay last seen times
 const relayLastSeen = new Map<string, number>()