fix: add periodic health polling to prevent stale sidebar status dots

[Nakshathra-2808]

Problem

Fixes #144

The checkConnectionHealth function in App.tsx was defined as a useCallback but had no caller after the initial init() function completed. This meant health status dots in the sidebar were only ever checked once — at page load — and became permanently stale. If a database went down after load, the UI would still show it as healthy with no way to detect the change short of a full page refresh.

Root Cause

checkConnectionHealth was defined but never wired to any recurring trigger — no setInterval, no polling useEffect. It was essentially dead code after init() finished.

Fix

Added a useEffect that runs a setInterval every 30 seconds to re-ping /api/health?dbId=... for each configured connection and update isAlive on the connections state, which flows directly into the sidebar health dots.

useEffect(() => {
  if (isDockerMode || connections.length === 0) return;

  const intervalId = setInterval(async () => {
    const updated = await Promise.all(
      connections.map(async (conn) => {
        try {
          const res = await fetch(`/api/health?dbId=${conn.id}`);
          return { ...conn, isAlive: res.ok };
        } catch {
          return { ...conn, isAlive: false };
        }
      }),
    );
    setConnections(updated);
  }, 30_000);

  return () => clearInterval(intervalId);
}, [connections, isDockerMode]);

Key Design Decisions

• Dependency array is [connections, isDockerMode], not [] — the interval callback closes over connections. Using [] would cause a stale closure where the interval always polls with the empty array from the first render (before init() finishes). With connections in the deps, React recreates the interval each time the list updates, so it always has current data.
• Skips Docker mode — /api/health is a database-mode endpoint; no-op in Docker mode.
• Skips if connections.length === 0 — avoids firing before init() has populated the connection list.
• Cleanup via clearInterval — the effect returns a cleanup function so the interval is properly torn down on unmount, no memory leaks.

Files Changed

• frontend/src/App.tsx — added 25 lines (one useEffect block)

Testing

1. Start dbportal with a PostgreSQL DATABASE_URL
2. Confirm green health dot in sidebar
3. Stop PostgreSQL
4. Wait ~30 seconds — dot should turn red without any page refresh
5. Restart PostgreSQL — dot should recover to green within the next 30s cycle

[Nakshathra-2808]

"Hi @Mananwebdev160408, just checking in on PR #148 when you get a chance. Happy to make any changes if needed!"

[Nakshathra-2808]

in the lables why gssoc approved it not showing i need it for my point please check it