Function useCodexPanel

frontend/src/hooks/useCodexPanel.ts:57–343

(panelId: string, isActive: boolean)

}

export function useCodexPanel(panelId: string, isActive: boolean): CodexPanelHook {
  const [isProcessing, setIsProcessing] = useState(false);
  const [isInitialized, setIsInitialized] = useState(false);
  const initializingRef = useRef(false);
  const conversationHistoryRef = useRef<ConversationMessage[]>([]);

  // Get session from panel
  const panel = usePanelStore(state => {
    // state.panels is an object keyed by sessionId, we need to flatten it
    if (!state.panels) return undefined;
    const allPanels = Object.values(state.panels).flat();
    const found = allPanels.find(p => p && p.id === panelId);
    return found;
  });
  const sessionId = panel?.sessionId;
  
  // Get session data
  const activeSession = useSessionStore(state => {
    const session = state.sessions.find(s => s.id === sessionId) || null;
    return session;
  });

  // Initialize Codex panel when it becomes active and has a session
  useEffect(() => {
    if (isActive && sessionId && !isInitialized && !initializingRef.current) {
      initializeCodexPanel();
    }
  }, [isActive, sessionId, isInitialized]);

  // Listen for Codex events
  useEffect(() => {
    const handleOutput = (data: CodexPanelEventData) => {
      if (data.panelId === panelId) {

        const isCancellationMessage =
          data.type === 'json' &&
          data.data && 
          typeof data.data === 'object' && 
          'type' in data.data && 
          (data.data as { type?: string; data?: { status?: string } }).type === 'session' &&
          'data' in data.data &&
          (data.data as { type?: string; data?: { status?: string } }).data?.status === 'cancelled';

        if (isCancellationMessage) {
          setIsProcessing(false);
        }

        if (data.type === 'json' && data.data && !isCancellationMessage) {
          const dataObj = data.data as Record<string, unknown>;
          conversationHistoryRef.current.push({
            type: String(dataObj.type || 'unknown'),
            content: data.data,
            timestamp: String(data.timestamp || new Date().toISOString())
          });
        }

        if (data.type === 'json' && data.data && typeof data.data === 'object' && 'msg' in data.data) {
          const codexMessage = data.data as CodexMessage;