feat(ui): add board refresh and stale-state polling

apps/ui/src/hooks/queries/use-features.ts

@@ -10,11 +10,12 @@ import { useQuery } from '@tanstack/react-query';
 import { getElectronAPI } from '@/lib/electron';
 import { queryKeys } from '@/lib/query-keys';
 import { STALE_TIMES } from '@/lib/query-client';
-import { getGlobalEventsRecent } from '@/hooks/use-event-recency';
+import { createSmartPollingInterval, getGlobalEventsRecent } from '@/hooks/use-event-recency';
 import type { Feature } from '@/store/app-store';
 
 const FEATURES_REFETCH_ON_FOCUS = false;
 const FEATURES_REFETCH_ON_RECONNECT = false;
+const FEATURES_POLLING_INTERVAL = 30000;
 /** Default polling interval for agent output when WebSocket is inactive */
 const AGENT_OUTPUT_POLLING_INTERVAL = 5000;
 
@@ -43,6 +44,7 @@ export function useFeatures(projectPath: string | undefined) {
     },
     enabled: !!projectPath,
     staleTime: STALE_TIMES.FEATURES,
+    refetchInterval: createSmartPollingInterval(FEATURES_POLLING_INTERVAL),
     refetchOnWindowFocus: FEATURES_REFETCH_ON_FOCUS,
     refetchOnReconnect: FEATURES_REFETCH_ON_RECONNECT,
   });

apps/ui/src/hooks/queries/use-running-agents.ts

@@ -9,9 +9,11 @@ import { useQuery } from '@tanstack/react-query';
 import { getElectronAPI, type RunningAgent } from '@/lib/electron';
 import { queryKeys } from '@/lib/query-keys';
 import { STALE_TIMES } from '@/lib/query-client';
+import { createSmartPollingInterval } from '@/hooks/use-event-recency';
 
 const RUNNING_AGENTS_REFETCH_ON_FOCUS = false;
 const RUNNING_AGENTS_REFETCH_ON_RECONNECT = false;
+const RUNNING_AGENTS_POLLING_INTERVAL = 30000;
 
 interface RunningAgentsResult {
   agents: RunningAgent[];
@@ -47,8 +49,7 @@ export function useRunningAgents() {
       };
     },
     staleTime: STALE_TIMES.RUNNING_AGENTS,
-    // Note: Don't use refetchInterval here - rely on WebSocket invalidation
-    // for real-time updates instead of polling
+    refetchInterval: createSmartPollingInterval(RUNNING_AGENTS_POLLING_INTERVAL),
     refetchOnWindowFocus: RUNNING_AGENTS_REFETCH_ON_FOCUS,
     refetchOnReconnect: RUNNING_AGENTS_REFETCH_ON_RECONNECT,
   });

apps/ui/src/hooks/queries/use-worktrees.ts

@@ -8,9 +8,11 @@ import { useQuery } from '@tanstack/react-query';
 import { getElectronAPI } from '@/lib/electron';
 import { queryKeys } from '@/lib/query-keys';
 import { STALE_TIMES } from '@/lib/query-client';
+import { createSmartPollingInterval } from '@/hooks/use-event-recency';
 
 const WORKTREE_REFETCH_ON_FOCUS = false;
 const WORKTREE_REFETCH_ON_RECONNECT = false;
+const WORKTREES_POLLING_INTERVAL = 30000;
 
 interface WorktreeInfo {
   path: string;
@@ -65,6 +67,7 @@ export function useWorktrees(projectPath: string | undefined, includeDetails = t
     },
     enabled: !!projectPath,
     staleTime: STALE_TIMES.WORKTREES,
+    refetchInterval: createSmartPollingInterval(WORKTREES_POLLING_INTERVAL),
     refetchOnWindowFocus: WORKTREE_REFETCH_ON_FOCUS,
     refetchOnReconnect: WORKTREE_REFETCH_ON_RECONNECT,
   });

apps/ui/src/hooks/use-auto-mode.ts

@@ -6,10 +6,12 @@ import { useAppStore } from '@/store/app-store';
 import { getElectronAPI } from '@/lib/electron';
 import type { AutoModeEvent } from '@/types/electron';
 import type { WorktreeInfo } from '@/components/views/board-view/worktree-panel/types';
+import { getGlobalEventsRecent } from '@/hooks/use-event-recency';
 
 const logger = createLogger('AutoMode');
 
 const AUTO_MODE_SESSION_KEY = 'automaker:autoModeRunningByWorktreeKey';
+const AUTO_MODE_POLLING_INTERVAL = 30000;
 
 /**
  * Generate a worktree key for session storage
@@ -140,42 +142,54 @@ export function useAutoMode(worktree?: WorktreeInfo) {
   // Check if we can start a new task based on concurrency limit
   const canStartNewTask = runningAutoTasks.length < maxConcurrency;
 
+  const refreshStatus = useCallback(async () => {
+    if (!currentProject) return;
+
+    try {
+      const api = getElectronAPI();
+      if (!api?.autoMode?.status) return;
+
+      const result = await api.autoMode.status(currentProject.path, branchName);
+      if (result.success && result.isAutoLoopRunning !== undefined) {
+        const backendIsRunning = result.isAutoLoopRunning;
+
+        if (backendIsRunning !== isAutoModeRunning) {
+          const worktreeDesc = branchName ? `worktree ${branchName}` : 'main worktree';
+          logger.info(
+            `[AutoMode] Syncing UI state with backend for ${worktreeDesc} in ${currentProject.path}: ${backendIsRunning ? 'ON' : 'OFF'}`
+          );
+          setAutoModeRunning(
+            currentProject.id,
+            branchName,
+            backendIsRunning,
+            result.maxConcurrency,
+            result.runningFeatures
+          );
+          setAutoModeSessionForWorktree(currentProject.path, branchName, backendIsRunning);
+        }
+      }
+    } catch (error) {
+      logger.error('Error syncing auto mode state with backend:', error);
+    }
+  }, [branchName, currentProject, isAutoModeRunning, setAutoModeRunning]);
+
   // On mount, query backend for current auto loop status and sync UI state.
   // This handles cases where the backend is still running after a page refresh.
+  useEffect(() => {
+    void refreshStatus();
+  }, [refreshStatus]);
+
+  // Periodic polling fallback when WebSocket events are stale.
   useEffect(() => {
     if (!currentProject) return;
 
-    const syncWithBackend = async () => {
-      try {
-        const api = getElectronAPI();
-        if (!api?.autoMode?.status) return;
+    const interval = setInterval(() => {
+      if (getGlobalEventsRecent()) return;
+      void refreshStatus();
+    }, AUTO_MODE_POLLING_INTERVAL);
 
-        const result = await api.autoMode.status(currentProject.path, branchName);
-        if (result.success && result.isAutoLoopRunning !== undefined) {
-          const backendIsRunning = result.isAutoLoopRunning;
-
-          if (backendIsRunning !== isAutoModeRunning) {
-            const worktreeDesc = branchName ? `worktree ${branchName}` : 'main worktree';
-            logger.info(
-              `[AutoMode] Syncing UI state with backend for ${worktreeDesc} in ${currentProject.path}: ${backendIsRunning ? 'ON' : 'OFF'}`
-            );
-            setAutoModeRunning(
-              currentProject.id,
-              branchName,
-              backendIsRunning,
-              result.maxConcurrency,
-              result.runningFeatures
-            );
-            setAutoModeSessionForWorktree(currentProject.path, branchName, backendIsRunning);
-          }
-        }
-      } catch (error) {
-        logger.error('Error syncing auto mode state with backend:', error);
-      }
-    };
-
-    syncWithBackend();
-  }, [currentProject, branchName, setAutoModeRunning]);
+    return () => clearInterval(interval);
+  }, [currentProject, refreshStatus]);
 
   // Handle auto mode events - listen globally for all projects/worktrees
   useEffect(() => {
@@ -672,5 +686,6 @@ export function useAutoMode(worktree?: WorktreeInfo) {
     start,
     stop,
     stopFeature,
+    refreshStatus,
   };
 }