/app/chrome-extension/entrypoints/sidepanel/composables/useAgentChat.ts

/**
 * Composable for managing Agent Chat state and messages.
 * Handles message sending, receiving, and cancellation.
 */
import { ref, computed } from 'vue';
import type {
  AgentMessage,
  AgentActRequest,
  AgentActRequestClientMeta,
  AgentAttachment,
  RealtimeEvent,
  AgentStatusEvent,
  AgentCliPreference,
  AgentUsageStats,
} from 'chrome-mcp-shared';

/**
 * Request lifecycle state.
 * - 'idle': No active request
 * - 'starting': Request accepted, waiting for engine initialization
 * - 'ready': Engine initialized, preparing to run
 * - 'running': Engine actively processing (may emit tool_use/tool_result)
 * - 'completed': Request finished successfully
 * - 'cancelled': Request was cancelled by user
 * - 'error': Request failed with error
 */
export type RequestState = 'idle' | AgentStatusEvent['status'];

export interface UseAgentChatOptions {
  getServerPort: () => number | null;
  getSessionId: () => string;
  ensureServer: () => Promise<boolean>;
  openEventSource: () => void;
}

export function useAgentChat(options: UseAgentChatOptions) {
  // State
  const messages = ref<AgentMessage[]>([]);
  const input = ref('');
  const sending = ref(false);
  /**
   * Message-level streaming state.
   * True when receiving delta updates for assistant/tool messages.
   * Note: This is separate from requestState - a request can be 'running'
   * even when isStreaming is false (e.g., during tool execution).
   */
  const isStreaming = ref(false);
  /**
   * Request lifecycle state driven by status events.
   * Use this (via isRequestActive) for UI elements like stop button,
   * loading indicators, and running badges.
   */
  const requestState = ref<RequestState>('idle');
  const errorMessage = ref<string | null>(null);
  const currentRequestId = ref<string | null>(null);
  const cancelling = ref(false);
  const attachments = ref<AgentAttachment[]>([]);
  const lastUsage = ref<AgentUsageStats | null>(null);

  // Computed
  const canSend = computed(() => {
    return input.value.trim().length > 0 && !sending.value;
  });

  /**
   * Whether there is an active request in progress.
   * Use this for UI elements like stop button, loading indicators, and running badges.
   */
  const isRequestActive = computed(() => {
    return (
      requestState.value === 'starting' ||
      requestState.value === 'ready' ||
      requestState.value === 'running'
    );
  });

  /**
   * Check if an incoming event belongs to a different active request.
   * Used to filter out stale events from previous requests.
   */
  function isDifferentActiveRequest(incomingRequestId?: string): boolean {
    const incoming = incomingRequestId?.trim();
    const current = currentRequestId.value?.trim();
    // No incoming ID or no current ID means we can't determine - don't filter
    if (!incoming || !current) return false;
    // Same request ID - don't filter
    if (incoming === current) return false;
    // Different request ID while we have an active request - filter it out
    return isRequestActive.value;
  }

  /**
   * Handle incoming realtime events.
   * Events are filtered by sessionId to prevent cross-session state pollution
   * when user switches sessions while SSE connection is still active.
   */
  function handleRealtimeEvent(event: RealtimeEvent): void {
    const currentSessionId = options.getSessionId();

    switch (event.type) {
      case 'message':
        // Guard: only handle messages for the current session
        if (event.data.sessionId !== currentSessionId) {
          return;
        }
        handleMessageEvent(event.data);
        break;
      case 'status':
        // Guard: only handle status for the current session
        if (event.data.sessionId !== currentSessionId) {
          return;
        }
        handleStatusEvent(event.data);
        break;
      case 'error':
        // Error events may not have sessionId, but if they do, filter
        if (event.data?.sessionId && event.data.sessionId !== currentSessionId) {
          return;
        }
        // Filter out errors from different active requests
        if (isDifferentActiveRequest(event.data?.requestId)) {
          return;
        }
        errorMessage.value = event.error;
        isStreaming.value = false;
        requestState.value = 'error';
        // Clear requestId if it matches the error event's requestId (or unconditionally if no requestId in error)
        if (!event.data?.requestId || event.data.requestId === currentRequestId.value) {
          currentRequestId.value = null;
        }
        break;
      case 'connected':
        console.log('[AgentChat] Connected to session:', event.data.sessionId);
        break;
      case 'heartbeat':
        // Heartbeat received, connection is alive
        break;
      case 'usage':
        // Guard: only accept usage for the current session
        if (event.data?.sessionId && event.data.sessionId !== currentSessionId) {
          return;
        }
        lastUsage.value = event.data;
        break;
    }
  }

  // Handle message events
  function handleMessageEvent(msg: AgentMessage): void {
    // For user messages from server, replace local optimistic message
    // Server echoes user message with real id/metadata, but we want to keep our display text
    // (which doesn't include injected context like web editor selection)
    if (msg.role === 'user' && msg.requestId) {
      const optimisticIndex = messages.value.findIndex(
        (m) => m.role === 'user' && m.requestId === msg.requestId && m.id.startsWith('temp-'),
      );
      if (optimisticIndex >= 0) {
        // Replace optimistic message: keep display content, update id and metadata
        const optimistic = messages.value[optimisticIndex];
        messages.value[optimisticIndex] = {
          ...msg,
          // Preserve the display content (user's raw input without injected context)
          content: optimistic.content,
          // Prefer server metadata, fallback to optimistic metadata (for chip rendering)
          metadata: msg.metadata ?? optimistic.metadata,
        };
        return;
      }
    }

    // Check if this message belongs to a different active request
    // Note: We still save the message to messages array (for auditing/replay),
    // but skip state updates if it's from a stale request
    const msgRequestId = msg.requestId?.trim() || undefined;
    const isStaleForState = isDifferentActiveRequest(msgRequestId);

    const existingIndex = messages.value.findIndex((m) => m.id === msg.id);

    if (existingIndex >= 0) {
      // Update existing message (streaming update)
      messages.value[existingIndex] = msg;
    } else {
      // Add new message - always save, even if stale for state
      messages.value.push(msg);
    }

    // Skip state updates for messages from different active requests
    if (isStaleForState) {
      return;
    }

    // Track requestId from messages (handles cases where status events were missed)
    if (msgRequestId && msgRequestId !== currentRequestId.value) {
      currentRequestId.value = msgRequestId;
    }

    // Update message-level streaming state (delta updates)
    // Note: This does NOT affect requestState - tool_use with isStreaming=false
    // should not stop the overall request, only indicate this message is complete
    if (msg.role === 'assistant' || msg.role === 'tool') {
      isStreaming.value = msg.isStreaming === true && !msg.isFinal;

      // If we're receiving model/tool output but requestState hasn't progressed to 'running',
      // update it. This handles:
      // 1. Edge case where status events were missed due to SSE timing
      // 2. User enters AgentChat mid-request (e.g., from Quick Panel/toolbar trigger)
      // 3. SSE reconnection after temporary disconnect
      if (
        requestState.value === 'idle' ||
        requestState.value === 'starting' ||
        requestState.value === 'ready'
      ) {
        requestState.value = 'running';
      }
    }
  }

  // Handle status events
  function handleStatusEvent(status: AgentStatusEvent): void {
    const statusRequestId = status.requestId?.trim() || undefined;

    // Filter out status events from different active requests
    if (isDifferentActiveRequest(statusRequestId)) {
      return;
    }

    // Track requestId from status events
    if (statusRequestId && statusRequestId !== currentRequestId.value) {
      currentRequestId.value = statusRequestId;
    }

    // Update request lifecycle state (driven by status events only)
    requestState.value = status.status;

    switch (status.status) {
      case 'starting':
      case 'ready':
      case 'running':
        // Request is active - no additional state changes needed
        break;
      case 'completed':
      case 'error':
      case 'cancelled':
        // Request finished - clear message streaming and requestId
        isStreaming.value = false;
        // Reset cancelling state (in case we were waiting for SSE confirmation)
        cancelling.value = false;
        if (!statusRequestId || statusRequestId === currentRequestId.value) {
          currentRequestId.value = null;
        }
        break;
    }
  }

  // Send message
  async function send(
    chatOptions: {
      cliPreference?: string;
      model?: string;
      projectId?: string;
      projectRoot?: string;
      dbSessionId?: string;
      /**
       * Optional instruction to send instead of input.value.
       * When provided, this is used as the actual instruction sent to the server,
       * while input.value is still used for UI display in the optimistic message.
       * This is useful for injecting context (e.g., web editor selection) into the prompt
       * without showing it in the chat UI.
       */
      instruction?: string;
      /**
       * Optional compact display text stored in the user message metadata.
       * When provided, the UI can render a special header (e.g., a chip) instead
       * of the raw prompt content.
       */
      displayText?: string;
      /**
       * Optional client metadata to persist with the user message.
       * Used for special UI rendering (e.g., web editor apply/selection chips).
       */
      clientMeta?: AgentActRequestClientMeta;
    } = {},
  ): Promise<void> {
    // User-visible content is always the user's raw input
    const userText = input.value.trim();
    // Actual instruction sent to server can be overridden (e.g., with context prepended)
    const instructionText = chatOptions.instruction?.trim() || userText;

    if (!userText) return;

    const ready = await options.ensureServer();
    const serverPort = options.getServerPort();
    const sessionId = options.getSessionId();

    if (!ready || !serverPort) {
      errorMessage.value = 'Agent server is not available.';
      return;
    }

    // Ensure SSE is connected before sending
    options.openEventSource();

    // Generate requestId on client side for optimistic message matching
    // Server will use this requestId when echoing user message via SSE
    const requestId = crypto.randomUUID();

    // Create optimistic user message for immediate feedback
    // Note: Use userText for UI, not instructionText (which may contain injected context)
    const tempMessageId = `temp-${Date.now()}`;
    const optimisticMessage: AgentMessage = {
      id: tempMessageId,
      sessionId: sessionId,
      role: 'user',
      content: userText,
      messageType: 'chat',
      requestId, // Include requestId so we can match with server-echoed message
      createdAt: new Date().toISOString(),
      // Include metadata for immediate chip rendering (before server echo)
      metadata:
        chatOptions.displayText || chatOptions.clientMeta
          ? {
              displayText: chatOptions.displayText?.trim(),
              clientMeta: chatOptions.clientMeta,
            }
          : undefined,
    };

    // Add user message immediately
    messages.value.push(optimisticMessage);

    const payload: AgentActRequest = {
      // Use instructionText which may include injected context (e.g., web editor selection)
      instruction: instructionText,
      requestId, // Send requestId to server so it can be used in SSE events
      // Optional metadata for special UI rendering (stored with the user message)
      displayText: chatOptions.displayText?.trim() || undefined,
      clientMeta: chatOptions.clientMeta,
      cliPreference: chatOptions.cliPreference
        ? (chatOptions.cliPreference as AgentCliPreference)
        : undefined,
      model: chatOptions.model?.trim() || undefined,
      projectId: chatOptions.projectId || undefined,
      projectRoot: chatOptions.projectRoot?.trim() || undefined,
      dbSessionId: chatOptions.dbSessionId || undefined,
      attachments: attachments.value.length > 0 ? attachments.value : undefined,
    };

    sending.value = true;
    // Initialize request lifecycle state - request begins once we dispatch /act
    requestState.value = 'starting';
    currentRequestId.value = requestId;
    // Reset message-level streaming; it will be driven by message.isStreaming deltas
    isStreaming.value = false;
    errorMessage.value = null;

    // Clear input immediately for better UX
    const savedInput = input.value;
    input.value = '';
    const savedAttachments = [...attachments.value];
    attachments.value = [];

    try {
      const url = `http://127.0.0.1:${serverPort}/agent/chat/${encodeURIComponent(sessionId)}/act`;

      const response = await fetch(url, {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify(payload),
      });

      if (!response.ok) {
        const text = await response.text().catch(() => '');
        throw new Error(text || `HTTP ${response.status}`);
      }

      const result = await response.json().catch(() => ({}));

      // Guard: only update state if we're still on the same session
      // This prevents cross-session state pollution when user switches during request
      const currentSessionId = options.getSessionId();
      if (currentSessionId !== sessionId) {
        // Session changed during request - discard result silently
        // The optimistic message will be cleared when messages are reloaded
        isStreaming.value = false;
        requestState.value = 'idle';
        currentRequestId.value = null;
        return;
      }

      // Update currentRequestId from response (should match our client-generated one)
      // This is used for cancel functionality
      if (result.requestId) {
        currentRequestId.value = result.requestId;
      } else {
        // Fallback: use our client-generated requestId
        currentRequestId.value = requestId;
      }
    } catch (error: unknown) {
      // Guard: only handle error if still on same session
      const currentSessionId = options.getSessionId();
      if (currentSessionId !== sessionId) {
        isStreaming.value = false;
        requestState.value = 'idle';
        currentRequestId.value = null;
        return;
      }

      console.error('Failed to send agent act request:', error);
      errorMessage.value =
        error instanceof Error ? error.message : 'Failed to send request to agent server.';
      // Restore input on error
      input.value = savedInput;
      attachments.value = savedAttachments;
      // Remove optimistic message on error
      const msgIndex = messages.value.findIndex((m) => m.id === tempMessageId);
      if (msgIndex >= 0) {
        messages.value.splice(msgIndex, 1);
      }
      isStreaming.value = false;
      requestState.value = 'idle';
      currentRequestId.value = null;
    } finally {
      sending.value = false;
    }
  }

  // Cancel current request
  async function cancelCurrentRequest(): Promise<void> {
    if (!currentRequestId.value) return;

    const serverPort = options.getServerPort();
    const sessionId = options.getSessionId();

    if (!serverPort) return;

    cancelling.value = true;
    try {
      const url = `http://127.0.0.1:${serverPort}/agent/chat/${encodeURIComponent(sessionId)}/cancel/${encodeURIComponent(currentRequestId.value)}`;

      const response = await fetch(url, { method: 'DELETE' });
      const data = await response.json().catch(() => null);

      // Check if cancel was successful
      // Backend returns { success: boolean, message?: string }
      const isSuccess = response.ok && data?.success !== false;

      if (!isSuccess) {
        // Cancel failed - show error but keep request state intact
        // so user can try again or wait for natural completion
        const errorMsg = data?.message || `Failed to cancel request (HTTP ${response.status})`;
        console.error('Cancel request failed:', errorMsg);
        errorMessage.value = errorMsg;
        return;
      }

      // Cancel request sent successfully
      // Note: We intentionally do NOT clear currentRequestId/requestState here
      // The actual state cleanup will happen when we receive the 'cancelled' status event via SSE
      // This ensures UI stays consistent with backend state and avoids race conditions
      // Keep cancelling=true so UI shows "Stopping..." until SSE confirms
      // cancelling will be reset when handleStatusEvent receives 'cancelled' status
    } catch (error) {
      console.error('Failed to cancel request:', error);
      errorMessage.value = error instanceof Error ? error.message : 'Failed to cancel request';
      // Only reset cancelling on error, not on success
      cancelling.value = false;
    }
  }

  // Clear messages
  function clearMessages(): void {
    messages.value = [];
  }

  // Set messages (for loading history)
  function setMessages(newMessages: AgentMessage[]): void {
    messages.value = newMessages;
  }

  return {
    // State
    messages,
    input,
    sending,
    isStreaming,
    requestState,
    errorMessage,
    currentRequestId,
    cancelling,
    attachments,
    lastUsage,

    // Computed
    canSend,
    isRequestActive,

    // Methods
    handleRealtimeEvent,
    send,
    cancelCurrentRequest,
    clearMessages,
    setMessages,
  };
}