fix: preserve pending permission requests across WebSocket reconnections (#462)

* fix: preserve pending permission requests across WebSocket reconnections

- Store WebSocketWriter reference in active sessions for reconnection
- Add reconnectSessionWriter() to swap writer when client reconnects
- Add getPendingApprovalsForSession() to query pending permissions by session
- Add get-pending-permissions WebSocket message handler on server
- Add pending-permissions-response handler on frontend
- Query pending permissions on WebSocket reconnect and session change
- Reconnect SDK output writer when client resumes an active session

* fix: address CodeRabbit review feedback for websocket-permission PR

- Use consistent session matching in pending-permissions-response handler,
  checking both currentSessionId and selectedSession.id (matching the
  session-status handler pattern)
- Guard get-pending-permissions with isClaudeSDKSessionActive check to
  prevent returning permissions for inactive sessions

src/components/app/AppContent.tsx

@@ -1,4 +1,4 @@
-import { useEffect } from 'react';
+import { useEffect, useRef } from 'react';
 import { useNavigate, useParams } from 'react-router-dom';
 import { useTranslation } from 'react-i18next';
 
@@ -16,7 +16,8 @@ export default function AppContent() {
   const { sessionId } = useParams<{ sessionId?: string }>();
   const { t } = useTranslation('common');
   const { isMobile } = useDeviceSettings({ trackPWA: false });
-  const { ws, sendMessage, latestMessage } = useWebSocket();
+  const { ws, sendMessage, latestMessage, isConnected } = useWebSocket();
+  const wasConnectedRef = useRef(false);
 
   const {
     activeSessions,
@@ -71,6 +72,24 @@ export default function AppContent() {
     };
   }, [openSettings]);
 
+  // Permission recovery: query pending permissions on WebSocket reconnect or session change
+  useEffect(() => {
+    const isReconnect = isConnected && !wasConnectedRef.current;
+
+    if (isReconnect) {
+      wasConnectedRef.current = true;
+    } else if (!isConnected) {
+      wasConnectedRef.current = false;
+    }
+
+    if (isConnected && selectedSession?.id) {
+      sendMessage({
+        type: 'get-pending-permissions',
+        sessionId: selectedSession.id
+      });
+    }
+  }, [isConnected, selectedSession?.id, sendMessage]);
+
   return (
     <div className="fixed inset-0 flex bg-background">
       {!isMobile ? (

src/components/chat/hooks/useChatRealtimeHandlers.ts

@@ -1080,6 +1080,19 @@ export function useChatRealtimeHandlers({
         break;
       }
 
+      case 'pending-permissions-response': {
+        // Server returned pending permissions for this session
+        const permSessionId = latestMessage.sessionId;
+        const isCurrentPermSession =
+          permSessionId === currentSessionId || (selectedSession && permSessionId === selectedSession.id);
+        if (permSessionId && !isCurrentPermSession) {
+          break;
+        }
+        const serverRequests = latestMessage.data || [];
+        setPendingPermissionRequests(serverRequests);
+        break;
+      }
+
       default:
         break;
     }