Function ChatLog

components/chat/ChatLog.tsx:1000–3055

({ projectId, onSessionStatusChange, onProjectStatusUpdate, onSseFallbackActive, startRequest, completeRequest, onAddUserMessage }: ChatLogProps)

}

export default function ChatLog({ projectId, onSessionStatusChange, onProjectStatusUpdate, onSseFallbackActive, startRequest, completeRequest, onAddUserMessage }: ChatLogProps) {
  const [messages, setMessages] = useState<ChatMessage[]>([]);
  const [logs, setLogs] = useState<LogEntry[]>([]);
  const [selectedLog, setSelectedLog] = useState<LogEntry | null>(null);
  const [isLoading, setIsLoading] = useState(true);
  const [hasLoadedOnce, setHasLoadedOnce] = useState(false);
  const [hasError, setHasError] = useState(false);
  const [errorMessage, setErrorMessage] = useState<string | null>(null);
  const [activeSession, setActiveSession] = useState<ActiveSession | null>(null);
  const [isWaitingForResponse, setIsWaitingForResponse] = useState(false);
  const [needsHistoryRefresh, setNeedsHistoryRefresh] = useState(false);
  const logsEndRef = useRef<HTMLDivElement>(null);
  const pollIntervalRef = useRef<NodeJS.Timeout | null>(null);
  const hasLoadedInitialDataRef = useRef(false);
  const sseFallbackTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
  const hasLoggedSseFallbackRef = useRef(false);
  const [enableSseFallback, setEnableSseFallback] = useState(false);
  const [isSseConnected, setIsSseConnected] = useState(false);
  const [failedImageUrls, setFailedImageUrls] = useState<Set<string>>(new Set());
  const [expandedToolMessages, setExpandedToolMessages] = useState<Record<string, ToolExpansionState>>({});
  const fallbackMessageIdRef = useRef<Map<string, string>>(new Map());
  const visibleToolMessageIdsRef = useRef<Set<string>>(new Set());

  const ensureStableMessageId = useCallback((message: ChatMessage): string => {
    if (message.id) {
      return message.id;
    }

    const parts: string[] = [];
    const addPart = (label: string, value: unknown) => {
      const candidate = pickFirstString(value);
      if (candidate) {
        parts.push(`${label}:${candidate}`);
      }
    };

    addPart('request', message.requestId);
    addPart('parent', message.parentMessageId);
    addPart('session', message.sessionId);
    addPart('type', message.messageType);
    addPart('role', message.role);
    addPart('cli', message.cliSource);
    addPart('created', message.createdAt);

    const metadata =
      message.metadata && typeof message.metadata === 'object'
        ? (message.metadata as Record<string, unknown>)
        : null;
    if (metadata) {
      const toolCallId = extractToolCallId(metadata);
      if (toolCallId) {
        addPart('tool_call', toolCallId);
      }
    }

    const fingerprint =
      parts.length > 0
        ? parts.join('|')