@openhands/agent-canvas 1.10.0 → 1.12.0

package/dist/contexts/conversation-websocket-context.js.map

@@ -1 +1 @@
-{"version":3,"file":"conversation-websocket-context.js","names":[],"sources":["../../src/contexts/conversation-websocket-context.tsx"],"sourcesContent":["import React, {\n  createContext,\n  useContext,\n  useEffect,\n  useLayoutEffect,\n  useState,\n  useCallback,\n  useMemo,\n  useRef,\n} from \"react\";\nimport { ConversationClient } from \"@openhands/typescript-client/clients\";\n\nimport { useQueryClient } from \"@tanstack/react-query\";\nimport { useWebSocket, WebSocketHookOptions } from \"#/hooks/use-websocket\";\nimport { SERVER_CONNECTION_ERROR_MESSAGE } from \"#/constants/server-connection-error\";\nimport { useEventStore } from \"#/stores/use-event-store\";\nimport { useErrorMessageStore } from \"#/stores/error-message-store\";\nimport { useOptimisticUserMessageStore } from \"#/stores/optimistic-user-message-store\";\nimport { useConversationStateStore } from \"#/stores/conversation-state-store\";\nimport { useCommandStore } from \"#/stores/command-store\";\nimport { useBrowserStore } from \"#/stores/browser-store\";\nimport { useGoalStore } from \"#/stores/goal-store\";\nimport {\n  isAgentServerEvent,\n  isAgentErrorEvent,\n  isUserMessageEvent,\n  isActionEvent,\n  isConversationStateUpdateEvent,\n  isFullStateConversationStateUpdateEvent,\n  isAgentStatusConversationStateUpdateEvent,\n  isStatsConversationStateUpdateEvent,\n  isGoalConversationStateUpdateEvent,\n  isExecuteBashActionEvent,\n  isExecuteBashObservationEvent,\n  isDisplayableErrorEvent,\n  isPlanningFileEditorObservationEvent,\n  isBrowserObservationEvent,\n  isBrowserNavigateActionEvent,\n  isSwitchLLMObservationEvent,\n  isCanvasUIActionEvent,\n} from \"#/types/agent-server/type-guards\";\nimport { handleCanvasUIAction } from \"#/services/canvas-ui\";\nimport { ConversationStateUpdateEventStats } from \"#/types/agent-server/core/events/conversation-state-event\";\nimport type {\n  ConversationErrorEvent,\n  ServerErrorEvent,\n} from \"#/types/agent-server/core/events/conversation-state-event\";\nimport { handleActionEventCacheInvalidation } from \"#/utils/cache-utils\";\nimport { buildWebSocketUrl } from \"#/utils/websocket-url\";\nimport type {\n  AppConversation,\n  SendMessageRequest,\n} from \"#/api/conversation-service/agent-server-conversation-service.types\";\nimport EventService from \"#/api/event-service/event-service.api\";\nimport { getAgentServerClientOptions } from \"#/api/agent-server-client-options\";\nimport { useConversationStore } from \"#/stores/conversation-store\";\nimport { trackError } from \"#/utils/error-handler\";\nimport { useReadConversationFile } from \"#/hooks/mutation/use-read-conversation-file\";\nimport useMetricsStore from \"#/stores/metrics-store\";\nimport { useConversationHistory } from \"#/hooks/query/use-conversation-history\";\nimport { setConversationState } from \"#/utils/conversation-local-storage\";\nimport {\n  recordModelSwitchMessage,\n  seedModelSwitchesFromHistory,\n} from \"#/hooks/chat/record-model-switch-message\";\nimport {\n  invalidateConversationQueries,\n  updateConversationLlmModelInCache,\n} from \"#/hooks/mutation/conversation-mutation-utils\";\nimport {\n  getStoredConversationMetadata,\n  setStoredConversationMetadata,\n} from \"#/api/conversation-metadata-store\";\n\nexport type WebSocketConnectionState =\n  | \"CONNECTING\"\n  | \"OPEN\"\n  | \"CLOSED\"\n  | \"CLOSING\";\n\ninterface SendMessageResult {\n  queued: boolean; // true if message was queued for later delivery, false if sent immediately\n}\n\ninterface ConversationWebSocketContextType {\n  connectionState: WebSocketConnectionState;\n  sendMessage: (message: SendMessageRequest) => Promise<SendMessageResult>;\n  isLoadingHistory: boolean;\n  reconnect: () => void;\n}\n\nconst ConversationWebSocketContext = createContext<\n  ConversationWebSocketContextType | undefined\n>(undefined);\n\n/**\n * Extract the text body of an echoed user `MessageEvent` for matching against\n * the optimistic pending-message queue. The server wraps the original\n * `args.content` string in one or more `TextContent` entries (alongside any\n * `ImageContent` entries for inline images), so concatenating the `text`\n * fields gives us back the exact prompt we sent.\n */\nfunction extractMessageEventText(\n  event: import(\"#/types/agent-server/core/events/message-event\").MessageEvent,\n): string {\n  return event.llm_message.content\n    .filter(\n      (part): part is { type: \"text\"; text: string } => part.type === \"text\",\n    )\n    .map((part) => part.text)\n    .join(\"\");\n}\n\nexport function ConversationWebSocketProvider({\n  children,\n  conversationId,\n  conversationUrl,\n  sessionApiKey,\n  subConversations,\n  subConversationIds,\n}: {\n  children: React.ReactNode;\n  conversationId?: string;\n  conversationUrl?: string | null;\n  sessionApiKey?: string | null;\n  subConversations?: AppConversation[];\n  subConversationIds?: string[];\n}) {\n  // Separate connection state tracking for each WebSocket\n  const [mainConnectionState, setMainConnectionState] =\n    useState<WebSocketConnectionState>(\"CONNECTING\");\n  const [planningConnectionState, setPlanningConnectionState] =\n    useState<WebSocketConnectionState>(\"CONNECTING\");\n\n  // Track if we've ever successfully connected for each connection\n  // Don't show errors until after first successful connection\n  const hasConnectedRefMain = React.useRef(false);\n  const hasConnectedRefPlanning = React.useRef(false);\n\n  const queryClient = useQueryClient();\n  const addEvent = useEventStore((state) => state.addEvent);\n  const addEvents = useEventStore((state) => state.addEvents);\n  const clearEventsForConversation = useEventStore(\n    (state) => state.clearEventsForConversation,\n  );\n  const { setErrorMessage, removeErrorMessage, clearConnectionError } =\n    useErrorMessageStore();\n  const consumeMatchingPendingMessage = useOptimisticUserMessageStore(\n    (state) => state.consumeMatchingPendingMessage,\n  );\n  const { setExecutionStatus } = useConversationStateStore();\n  const { appendInput, appendOutput } = useCommandStore();\n  const resetBrowserStore = useBrowserStore((state) => state.reset);\n\n  // History loading state.\n  // - Main conversation history is now loaded via REST (`useConversationHistory`),\n  //   so its loading state mirrors the REST query state (see below).\n  // - Planning sub-conversation history still streams over the WebSocket using\n  //   `resend_mode='all'`, so we keep the count-based detection for it.\n  const [isLoadingHistoryPlanning, setIsLoadingHistoryPlanning] =\n    useState(true);\n  const [expectedEventCountPlanning, setExpectedEventCountPlanning] = useState<\n    number | null\n  >(null);\n\n  const { setPlanContent } = useConversationStore();\n\n  // Hook for reading conversation file\n  const { mutate: readConversationFile } = useReadConversationFile();\n\n  // Track planning-agent received events (still WS-driven).\n  const receivedEventCountRefPlanning = useRef(0);\n\n  // Track the latest PlanningFileEditorObservation for Plan.md during history replay\n  const latestPlanningFileEventRef = useRef<{\n    path: string;\n    conversationId: string;\n  } | null>(null);\n\n  const isPlanFilePath = (path: string | null): boolean =>\n    path?.toUpperCase().endsWith(\"PLAN.MD\") ?? false;\n\n  const handleNonErrorEvent = useCallback(() => {\n    // A normal event means connectivity recovered: clear a transient connection\n    // error, but keep sticky conversation errors (e.g. a wrong API key).\n    clearConnectionError();\n  }, [clearConnectionError]);\n\n  // Helper function to update metrics from stats event\n  const updateMetricsFromStats = useCallback(\n    (event: ConversationStateUpdateEventStats) => {\n      if (event.value.usage_to_metrics?.agent) {\n        const agentMetrics = event.value.usage_to_metrics.agent;\n        const metrics = {\n          cost: agentMetrics.accumulated_cost,\n          max_budget_per_task: agentMetrics.max_budget_per_task ?? null,\n          usage: agentMetrics.accumulated_token_usage\n            ? {\n                prompt_tokens:\n                  agentMetrics.accumulated_token_usage.prompt_tokens,\n                completion_tokens:\n                  agentMetrics.accumulated_token_usage.completion_tokens,\n                cache_read_tokens:\n                  agentMetrics.accumulated_token_usage.cache_read_tokens,\n                cache_write_tokens:\n                  agentMetrics.accumulated_token_usage.cache_write_tokens,\n                context_window:\n                  agentMetrics.accumulated_token_usage.context_window,\n                per_turn_token:\n                  agentMetrics.accumulated_token_usage.per_turn_token,\n              }\n            : null,\n        };\n        useMetricsStore.getState().setMetrics(metrics);\n      }\n    },\n    [],\n  );\n\n  // Initial REST history load: fetch the most recent events and seed the\n  // store. Older events are paginated in via `useLoadOlderEvents` when the\n  // user scrolls to the top of the chat. The WebSocket connection waits for\n  // this query so it can subscribe with `resend_mode='since'` and avoid\n  // re-streaming everything REST already returned.\n  const {\n    data: preloadedHistory,\n    isPending: isPreloadingHistory,\n    isFetching: isFetchingHistory,\n    isError: isPreloadHistoryError,\n  } = useConversationHistory(conversationId);\n\n  // Skeleton only on the genuine first load (no cached data yet). On return the\n  // cached page is present, so `isPending` is false and we render the\n  // last-known discussion immediately while the tail refetch runs in the\n  // background — see the socket gate below, which waits on `isFetching`.\n  const isLoadingHistoryMain = !!conversationId && isPreloadingHistory;\n\n  // Clear the (global, not conversation-scoped) event store when the active\n  // conversation changes, BEFORE the preloaded-history effect below re-seeds\n  // it. This MUST live here rather than in the route component: a parent's\n  // passive effect runs *after* this child's layout effects, so clearing from\n  // the route would wipe the freshly seeded history. On a conversation switch\n  // the history page is already cached, so `preloadedHistory` is available\n  // synchronously — without ordering the clear first, the user's already-echoed\n  // message gets seeded then immediately wiped, leaving only the `since`\n  // WebSocket resend (the agent's reply). Re-entering the same conversation is\n  // a no-op, so the store survives navigating away to Settings and back.\n  useLayoutEffect(() => {\n    const nextId = conversationId ?? null;\n    if (useEventStore.getState().loadedConversationId === nextId) {\n      return;\n    }\n    // Single atomic action: clears the previous conversation's events and\n    // records the new loaded id in one `set`, so no subscriber can observe a\n    // half-applied state (events gone but the old id still reported).\n    clearEventsForConversation(nextId);\n    resetBrowserStore();\n  }, [conversationId, clearEventsForConversation, resetBrowserStore]);\n\n  useLayoutEffect(() => {\n    if (!preloadedHistory || preloadedHistory.events.length === 0) {\n      return;\n    }\n    addEvents(preloadedHistory.events);\n\n    // The first user message of a cloud start-task conversation is persisted\n    // server-side and reaches us via this REST preload, not over the WebSocket\n    // (which subscribes with resend_mode='since' after the latest preloaded\n    // timestamp). Consume any matching optimistic \"Sending…\" bubble here too —\n    // mirroring the WS handler — so it doesn't linger as a duplicate of the echo.\n    if (conversationId) {\n      // Rebuild inline \"Switched to\" messages from the REST-preloaded history.\n      // The live store writers (WS handler / user action) never see preloaded\n      // events, so without this past model switches wouldn't render on reload.\n      // Read the post-`addEvents` `uiEvents` (actions replaced by observations,\n      // Think/Finish observations dropped) — not the raw history — so anchors\n      // match the ids the renderer actually mounts.\n      seedModelSwitchesFromHistory(\n        conversationId,\n        useEventStore.getState().uiEvents,\n      );\n\n      for (const event of preloadedHistory.events) {\n        if (isUserMessageEvent(event)) {\n          consumeMatchingPendingMessage(\n            conversationId,\n            extractMessageEventText(event),\n          );\n        }\n      }\n    }\n  }, [\n    preloadedHistory,\n    addEvents,\n    conversationId,\n    consumeMatchingPendingMessage,\n  ]);\n\n  /**\n   * Timestamp of the latest event we already have from REST. Used as\n   * `after_timestamp` when opening the WebSocket so the server only resends\n   * events strictly after this point. `null` until the REST query settles\n   * (we hold the WS connection open until then to avoid an `all` resend).\n   */\n  const initialAfterTimestamp = useMemo<string | null>(() => {\n    // Wait for the history query to settle — including the refetch fired when\n    // returning to a conversation — so we anchor `since` to the freshest event\n    // we have rather than a stale cached tail.\n    if (isFetchingHistory) return null;\n    const events = preloadedHistory?.events ?? [];\n    const latest = events[events.length - 1];\n    if (!latest || !(\"timestamp\" in latest) || !latest.timestamp) return null;\n    return latest.timestamp;\n  }, [preloadedHistory, isFetchingHistory]);\n\n  // Build WebSocket URL from props.\n  //\n  // We deliberately wait for the history fetch to settle before opening the\n  // socket so the WS subscription can use `resend_mode='since'` with a\n  // meaningful `after_timestamp`. This gate is on `isFetching`, not just the\n  // first-load `isPending`, so the refetch fired when returning to a\n  // conversation also completes first: the socket bakes `after_timestamp` into\n  // its URL at connect time and will NOT re-subscribe when the value changes\n  // later (see use-websocket — options live in a ref, reconnect keys on the URL\n  // only). Connecting mid-fetch would therefore pin `since` to the stale cached\n  // tail and replay the entire backlog over the socket. Without any gate the WS\n  // would instead fall back to `resend_mode='all'`. If the REST query errored we\n  // fall through and connect with `resend_mode='all'` so the user still sees\n  // live events.\n  const wsUrl = useMemo(() => {\n    if (!conversationId || !conversationUrl) {\n      return null;\n    }\n    if (isFetchingHistory && !isPreloadHistoryError) {\n      return null;\n    }\n    return buildWebSocketUrl(conversationId, conversationUrl);\n  }, [\n    conversationId,\n    conversationUrl,\n    isFetchingHistory,\n    isPreloadHistoryError,\n  ]);\n\n  const planningAgentWsUrl = useMemo(() => {\n    if (!subConversations?.length) {\n      return null;\n    }\n\n    // Currently, there is only one sub-conversation and it uses the planning agent.\n    const planningAgentConversation = subConversations[0];\n\n    if (\n      !planningAgentConversation?.id ||\n      !planningAgentConversation.conversation_url\n    ) {\n      return null;\n    }\n\n    return buildWebSocketUrl(\n      planningAgentConversation.id,\n      planningAgentConversation.conversation_url,\n    );\n  }, [subConversations]);\n\n  // Merged connection state - reflects combined status of both connections\n  const connectionState = useMemo<WebSocketConnectionState>(() => {\n    // If planning agent connection doesn't exist, use main connection state\n    if (!planningAgentWsUrl) {\n      return mainConnectionState;\n    }\n\n    // If either is connecting, merged state is connecting\n    if (\n      mainConnectionState === \"CONNECTING\" ||\n      planningConnectionState === \"CONNECTING\"\n    ) {\n      return \"CONNECTING\";\n    }\n\n    // If both are open, merged state is open\n    if (mainConnectionState === \"OPEN\" && planningConnectionState === \"OPEN\") {\n      return \"OPEN\";\n    }\n\n    // If both are closed, merged state is closed\n    if (\n      mainConnectionState === \"CLOSED\" &&\n      planningConnectionState === \"CLOSED\"\n    ) {\n      return \"CLOSED\";\n    }\n\n    // If either is closing, merged state is closing\n    if (\n      mainConnectionState === \"CLOSING\" ||\n      planningConnectionState === \"CLOSING\"\n    ) {\n      return \"CLOSING\";\n    }\n\n    // Default to closed if states don't match expected patterns\n    return \"CLOSED\";\n  }, [mainConnectionState, planningConnectionState, planningAgentWsUrl]);\n\n  useEffect(() => {\n    if (\n      expectedEventCountPlanning !== null &&\n      receivedEventCountRefPlanning.current >= expectedEventCountPlanning &&\n      isLoadingHistoryPlanning\n    ) {\n      setIsLoadingHistoryPlanning(false);\n    }\n  }, [\n    expectedEventCountPlanning,\n    isLoadingHistoryPlanning,\n    receivedEventCountRefPlanning,\n  ]);\n\n  // Call API once after history loading completes if we tracked any PlanningFileEditorObservation events\n  useEffect(() => {\n    if (!isLoadingHistoryPlanning && latestPlanningFileEventRef.current) {\n      const { path, conversationId: currentPlanningConversationId } =\n        latestPlanningFileEventRef.current;\n\n      readConversationFile(\n        {\n          conversationId: currentPlanningConversationId,\n          filePath: path,\n        },\n        {\n          onSuccess: (fileContent) => {\n            setPlanContent(fileContent);\n          },\n          onError: (error) => {\n            console.warn(\"Failed to read conversation file:\", error);\n          },\n        },\n      );\n\n      // Clear the ref after calling the API\n      latestPlanningFileEventRef.current = null;\n    }\n  }, [isLoadingHistoryPlanning, readConversationFile, setPlanContent]);\n\n  useEffect(() => {\n    hasConnectedRefMain.current = false;\n    setIsLoadingHistoryPlanning(!!subConversationIds?.length);\n    setExpectedEventCountPlanning(null);\n    receivedEventCountRefPlanning.current = 0;\n    // Reset the tracked event ref when sub-conversations change\n    latestPlanningFileEventRef.current = null;\n  }, [subConversationIds]);\n\n  // Reset hasConnected flags when the conversation changes.\n  useEffect(() => {\n    hasConnectedRefMain.current = false;\n    hasConnectedRefPlanning.current = false;\n    // Reset the tracked event ref when conversation changes\n    latestPlanningFileEventRef.current = null;\n  }, [conversationId]);\n\n  // Merged loading history state - true if either connection is still loading\n  const isLoadingHistory = useMemo(\n    () => isLoadingHistoryMain || isLoadingHistoryPlanning,\n    [isLoadingHistoryMain, isLoadingHistoryPlanning],\n  );\n\n  // Separate message handlers for each connection\n  const handleMainMessage = useCallback(\n    (messageEvent: MessageEvent) => {\n      try {\n        const event = JSON.parse(messageEvent.data);\n\n        // History loading for the main conversation is REST-driven now;\n        // every WS message is a new event we add to the store.\n\n        // Use type guard to validate v1 event structure\n        if (isAgentServerEvent(event)) {\n          // A reconnect replays the backlog from a stale anchor. The store\n          // dedups by id, but the side-effects below aren't idempotent, so skip\n          // them for replayed events (#1656).\n          const isDuplicateEvent = useEventStore\n            .getState()\n            .eventIds.has(event.id);\n          const switchLLMObservation = isSwitchLLMObservationEvent(event)\n            ? event\n            : null;\n          addEvent(event);\n          if (isDuplicateEvent) {\n            return;\n          }\n\n          // Handle displayable error events - show error banner\n          // AgentErrorEvent errors are displayed inline in the chat, not as banners\n          if (isDisplayableErrorEvent(event)) {\n            const errorEvent = event as\n              | ConversationErrorEvent\n              | ServerErrorEvent;\n            trackError({\n              message: errorEvent.detail,\n              source: \"conversation\",\n              metadata: {\n                eventId: errorEvent.id,\n                errorCode: errorEvent.code,\n              },\n            });\n            setErrorMessage(errorEvent.detail, \"conversation\", errorEvent.code);\n          } else {\n            handleNonErrorEvent();\n          }\n\n          // LLM errors render inline in the chat (see ErrorEventMessage); track\n          // them for analytics but keep them out of the banner above the chat box.\n          if (isAgentErrorEvent(event)) {\n            trackError({\n              message: event.error,\n              source: \"agent\",\n              metadata: {\n                eventId: event.id,\n                toolName: event.tool_name,\n                toolCallId: event.tool_call_id,\n              },\n            });\n          }\n\n          // Clear optimistic user message when a user message is confirmed.\n          // We match by the echoed text content (with FIFO fallback inside the\n          // store), so an echo for \"second\" pops \"second\" — not whichever\n          // pending entry happens to be oldest — protecting against any\n          // out-of-order delivery between conversations or sub-agents.\n          if (isUserMessageEvent(event)) {\n            if (conversationId) {\n              consumeMatchingPendingMessage(\n                conversationId,\n                extractMessageEventText(event),\n              );\n              // Clear draft from localStorage - message was successfully delivered\n              setConversationState(conversationId, { draftMessage: null });\n            }\n          }\n\n          // Handle cache invalidation for ActionEvent\n          if (isActionEvent(event)) {\n            const currentConversationId =\n              conversationId || \"test-conversation-id\"; // TODO: Get from context\n            handleActionEventCacheInvalidation(\n              event,\n              currentConversationId,\n              queryClient,\n            );\n          }\n\n          // Handle conversation state updates\n          // TODO: Tests\n          if (isConversationStateUpdateEvent(event)) {\n            if (isFullStateConversationStateUpdateEvent(event)) {\n              setExecutionStatus(event.value.execution_status);\n            }\n            if (isAgentStatusConversationStateUpdateEvent(event)) {\n              setExecutionStatus(event.value);\n            }\n            if (isStatsConversationStateUpdateEvent(event)) {\n              updateMetricsFromStats(event);\n            }\n            // Mirror goal status into the store. Intentionally duplicated across\n            // the main and planning WebSocket handlers (like the execution_status\n            // and stats branches above), not a merge artifact.\n            if (isGoalConversationStateUpdateEvent(event) && conversationId) {\n              useGoalStore.getState().setStatus(conversationId, event.value);\n            }\n          }\n\n          // Handle ExecuteBashAction events - add command as input to terminal\n          if (isExecuteBashActionEvent(event)) {\n            appendInput(event.action.command);\n          }\n\n          // Handle ExecuteBashObservation events - add output to terminal\n          if (isExecuteBashObservationEvent(event)) {\n            // Extract text content from the observation content array\n            const textContent = event.observation.content\n              .filter((c) => c.type === \"text\")\n              .map((c) => c.text)\n              .join(\"\\n\");\n            appendOutput(textContent);\n          }\n\n          // Handle BrowserObservation events - update browser store with screenshot\n          if (isBrowserObservationEvent(event)) {\n            const { screenshot_data: screenshotData } = event.observation;\n            if (screenshotData) {\n              const screenshotSrc = screenshotData.startsWith(\"data:\")\n                ? screenshotData\n                : `data:image/png;base64,${screenshotData}`;\n              useBrowserStore.getState().setScreenshotSrc(screenshotSrc);\n            }\n          }\n\n          // Handle BrowserNavigateAction events - update browser store with URL\n          if (isBrowserNavigateActionEvent(event)) {\n            useBrowserStore.getState().setUrl(event.action.url);\n          }\n\n          if (\n            conversationId &&\n            switchLLMObservation &&\n            !switchLLMObservation.observation.is_error\n          ) {\n            recordModelSwitchMessage(\n              conversationId,\n              switchLLMObservation.observation.profile_name,\n            );\n\n            // Mirror the user-driven `/model` path: persist the profile so the\n            // chat-header switcher shows the right name after a reload, even\n            // when several profiles share a model (#1082).\n            const prevMetadata = getStoredConversationMetadata(conversationId);\n            setStoredConversationMetadata(conversationId, {\n              selected_repository: prevMetadata?.selected_repository ?? null,\n              selected_branch: prevMetadata?.selected_branch ?? null,\n              git_provider: prevMetadata?.git_provider ?? null,\n              selected_workspace: prevMetadata?.selected_workspace ?? null,\n              active_profile: switchLLMObservation.observation.profile_name,\n              // Full-object replace: carry the plugins snapshot forward so the\n              // in-conversation plugins view survives a profile switch.\n              plugins: prevMetadata?.plugins ?? null,\n            });\n\n            if (switchLLMObservation.observation.active_model) {\n              updateConversationLlmModelInCache(\n                queryClient,\n                conversationId,\n                switchLLMObservation.observation.active_model,\n              );\n            }\n\n            invalidateConversationQueries(queryClient, conversationId);\n          }\n\n          // Handle canvas_ui ActionEvents from both the legacy Python tool and\n          // the client-defined JSON tool. The server acknowledges immediately;\n          // the actual UI change happens here on the client.\n          if (isCanvasUIActionEvent(event)) {\n            handleCanvasUIAction(event.action, conversationId ?? null);\n          }\n        }\n      } catch (error) {\n        console.warn(\"Failed to parse WebSocket message as JSON:\", error);\n      }\n    },\n    [\n      addEvent,\n      setErrorMessage,\n      consumeMatchingPendingMessage,\n      queryClient,\n      conversationId,\n      setExecutionStatus,\n      appendInput,\n      appendOutput,\n      updateMetricsFromStats,\n      handleNonErrorEvent,\n    ],\n  );\n\n  const handlePlanningMessage = useCallback(\n    (messageEvent: MessageEvent) => {\n      try {\n        const event = JSON.parse(messageEvent.data);\n\n        // Track received events for history loading (count ALL events from WebSocket)\n        // Always count when loading, even if we don't have the expected count yet\n        if (isLoadingHistoryPlanning) {\n          receivedEventCountRefPlanning.current += 1;\n\n          if (\n            expectedEventCountPlanning !== null &&\n            receivedEventCountRefPlanning.current >= expectedEventCountPlanning\n          ) {\n            setIsLoadingHistoryPlanning(false);\n          }\n        }\n\n        // Use type guard to validate v1 event structure\n        if (isAgentServerEvent(event)) {\n          // Skip non-idempotent side-effects for replayed events, as in the\n          // main handler (#1656).\n          const isDuplicateEvent = useEventStore\n            .getState()\n            .eventIds.has(event.id);\n          // Mark this event as coming from the planning agent\n          const eventWithPlanningFlag = {\n            ...event,\n            isFromPlanningAgent: true,\n          };\n          addEvent(eventWithPlanningFlag);\n          if (isDuplicateEvent) {\n            return;\n          }\n\n          // Handle displayable error events - show error banner\n          // AgentErrorEvent errors are displayed inline in the chat, not as banners\n          if (isDisplayableErrorEvent(event)) {\n            const errorEvent = event as\n              | ConversationErrorEvent\n              | ServerErrorEvent;\n            trackError({\n              message: errorEvent.detail,\n              source: \"planning_conversation\",\n              metadata: {\n                eventId: errorEvent.id,\n                errorCode: errorEvent.code,\n              },\n            });\n            setErrorMessage(errorEvent.detail, \"conversation\", errorEvent.code);\n          } else {\n            handleNonErrorEvent();\n          }\n\n          // LLM errors render inline in the chat (see ErrorEventMessage); track\n          // them for analytics but keep them out of the banner above the chat box.\n          if (isAgentErrorEvent(event)) {\n            trackError({\n              message: event.error,\n              source: \"planning_agent\",\n              metadata: {\n                eventId: event.id,\n                toolName: event.tool_name,\n                toolCallId: event.tool_call_id,\n              },\n            });\n          }\n\n          // Clear optimistic user message when a user message is confirmed.\n          // Always scope to the main `conversationId` (where the user types)\n          // and match on the echoed content so the planning sub-agent's own\n          // events can never consume a main-conversation pending entry.\n          if (isUserMessageEvent(event)) {\n            if (conversationId) {\n              consumeMatchingPendingMessage(\n                conversationId,\n                extractMessageEventText(event),\n              );\n              setConversationState(conversationId, { draftMessage: null });\n            }\n          }\n\n          // Handle cache invalidation for ActionEvent\n          if (isActionEvent(event)) {\n            const planningAgentConversation = subConversations?.[0];\n            const currentConversationId =\n              planningAgentConversation?.id || \"test-conversation-id\"; // TODO: Get from context\n            handleActionEventCacheInvalidation(\n              event,\n              currentConversationId,\n              queryClient,\n            );\n          }\n\n          // Handle conversation state updates\n          // TODO: Tests\n          if (isConversationStateUpdateEvent(event)) {\n            if (isFullStateConversationStateUpdateEvent(event)) {\n              setExecutionStatus(event.value.execution_status);\n            }\n            if (isAgentStatusConversationStateUpdateEvent(event)) {\n              setExecutionStatus(event.value);\n            }\n            if (isStatsConversationStateUpdateEvent(event)) {\n              updateMetricsFromStats(event);\n            }\n            // Mirror goal status into the store. Intentionally duplicated across\n            // the main and planning WebSocket handlers (like the execution_status\n            // and stats branches above), not a merge artifact.\n            if (isGoalConversationStateUpdateEvent(event) && conversationId) {\n              useGoalStore.getState().setStatus(conversationId, event.value);\n            }\n          }\n\n          // Handle ExecuteBashAction events - add command as input to terminal\n          if (isExecuteBashActionEvent(event)) {\n            appendInput(event.action.command);\n          }\n\n          // Handle ExecuteBashObservation events - add output to terminal\n          if (isExecuteBashObservationEvent(event)) {\n            // Extract text content from the observation content array\n            const textContent = event.observation.content\n              .filter((c) => c.type === \"text\")\n              .map((c) => c.text)\n              .join(\"\\n\");\n            appendOutput(textContent);\n          }\n\n          // Handle PlanningFileEditorObservation - only update plan for Plan.md\n          if (isPlanningFileEditorObservationEvent(event)) {\n            const { path } = event.observation;\n            if (isPlanFilePath(path)) {\n              const planningAgentConversation = subConversations?.[0];\n              const planningConversationId = planningAgentConversation?.id;\n\n              if (planningConversationId && path) {\n                if (isLoadingHistoryPlanning) {\n                  latestPlanningFileEventRef.current = {\n                    path,\n                    conversationId: planningConversationId,\n                  };\n                } else {\n                  readConversationFile(\n                    {\n                      conversationId: planningConversationId,\n                      filePath: path,\n                    },\n                    {\n                      onSuccess: (fileContent) => {\n                        setPlanContent(fileContent);\n                      },\n                      onError: (error) => {\n                        console.warn(\n                          \"Failed to read conversation file:\",\n                          error,\n                        );\n                      },\n                    },\n                  );\n                }\n              }\n            }\n          }\n        }\n      } catch (error) {\n        console.warn(\"Failed to parse WebSocket message as JSON:\", error);\n      }\n    },\n    [\n      addEvent,\n      isLoadingHistoryPlanning,\n      expectedEventCountPlanning,\n      setErrorMessage,\n      consumeMatchingPendingMessage,\n      queryClient,\n      subConversations,\n      conversationId,\n      setExecutionStatus,\n      appendInput,\n      appendOutput,\n      readConversationFile,\n      setPlanContent,\n      updateMetricsFromStats,\n      handleNonErrorEvent,\n    ],\n  );\n\n  // Separate WebSocket options for main connection\n  const mainWebsocketOptions: WebSocketHookOptions = useMemo(() => {\n    // History was already loaded over REST (`useConversationHistory`).\n    // Subscribe with `resend_mode='since'` so the server only resends events\n    // strictly after the latest one we already have. If REST returned no\n    // events at all (brand-new conversation), fall back to `'all'` so any\n    // events that may have been written between the REST call and the WS\n    // handshake still show up. Dedup in the event store handles overlap.\n    const queryParams: Record<string, string | boolean> = initialAfterTimestamp\n      ? { resend_mode: \"since\", after_timestamp: initialAfterTimestamp }\n      : { resend_mode: \"all\" };\n\n    return {\n      queryParams,\n      sessionApiKey,\n      reconnect: { enabled: true },\n      onOpen: () => {\n        setMainConnectionState(\"OPEN\");\n        hasConnectedRefMain.current = true; // Mark that we've successfully connected\n        clearConnectionError(); // Clear a previous connection error; keep sticky conversation errors\n      },\n      onClose: () => {\n        setMainConnectionState(\"CLOSED\");\n      },\n      onError: () => {\n        setMainConnectionState(\"CLOSED\");\n        // Only show error message if we've previously connected successfully\n        if (hasConnectedRefMain.current) {\n          setErrorMessage(SERVER_CONNECTION_ERROR_MESSAGE, \"connection\");\n        }\n      },\n      onMessage: handleMainMessage,\n    };\n  }, [\n    handleMainMessage,\n    setErrorMessage,\n    clearConnectionError,\n    sessionApiKey,\n    initialAfterTimestamp,\n  ]);\n\n  // Separate WebSocket options for planning agent connection\n  const planningWebsocketOptions: WebSocketHookOptions = useMemo(() => {\n    const queryParams: Record<string, string | boolean> = {\n      resend_all: true,\n    };\n\n    const planningAgentConversation = subConversations?.[0];\n    const planningApiKey =\n      planningAgentConversation?.session_api_key ?? sessionApiKey;\n\n    return {\n      queryParams,\n      sessionApiKey: planningApiKey,\n      reconnect: { enabled: true },\n      onOpen: async () => {\n        setPlanningConnectionState(\"OPEN\");\n        hasConnectedRefPlanning.current = true; // Mark that we've successfully connected\n        clearConnectionError(); // Clear a previous connection error; keep sticky conversation errors\n\n        // Fetch expected event count for history loading detection\n        if (\n          planningAgentConversation?.id &&\n          planningAgentConversation.conversation_url\n        ) {\n          try {\n            const count = await EventService.getEventCount(\n              planningAgentConversation.id,\n              planningAgentConversation.conversation_url,\n              planningAgentConversation.session_api_key,\n            );\n            setExpectedEventCountPlanning(count);\n\n            // If no events expected, mark as loaded immediately\n            if (count === 0) {\n              setIsLoadingHistoryPlanning(false);\n            }\n          } catch (error) {\n            // Fall back to marking as loaded to avoid infinite loading state\n            setIsLoadingHistoryPlanning(false);\n          }\n        }\n      },\n      onClose: () => {\n        setPlanningConnectionState(\"CLOSED\");\n      },\n      onError: () => {\n        setPlanningConnectionState(\"CLOSED\");\n        // Only show error message if we've previously connected successfully\n        if (hasConnectedRefPlanning.current) {\n          setErrorMessage(SERVER_CONNECTION_ERROR_MESSAGE, \"connection\");\n        }\n      },\n      onMessage: handlePlanningMessage,\n    };\n  }, [\n    handlePlanningMessage,\n    setErrorMessage,\n    clearConnectionError,\n    sessionApiKey,\n    subConversations,\n  ]);\n\n  // Only attempt WebSocket connection when we have a valid URL\n  // This prevents connection attempts during task polling phase\n  const websocketUrl = wsUrl;\n  const { socket: mainSocket, reconnect: reconnectMain } = useWebSocket(\n    websocketUrl || \"\",\n    mainWebsocketOptions,\n  );\n\n  const { socket: planningAgentSocket, reconnect: reconnectPlanning } =\n    useWebSocket(planningAgentWsUrl || \"\", planningWebsocketOptions);\n\n  const reconnect = useCallback(() => {\n    removeErrorMessage();\n    const currentMode = useConversationStore.getState().conversationMode;\n    if (currentMode === \"plan\" && planningAgentWsUrl) {\n      reconnectPlanning();\n      return;\n    }\n    reconnectMain();\n  }, [\n    planningAgentWsUrl,\n    reconnectMain,\n    reconnectPlanning,\n    removeErrorMessage,\n  ]);\n\n  // V1 send message function via WebSocket\n  // Falls back to REST API queue when WebSocket is not connected\n  const sendMessage = useCallback(\n    async (message: SendMessageRequest): Promise<SendMessageResult> => {\n      const currentMode = useConversationStore.getState().conversationMode;\n      const currentSocket =\n        currentMode === \"plan\" ? planningAgentSocket : mainSocket;\n\n      if (currentSocket?.readyState !== WebSocket.OPEN) {\n        // WebSocket not connected - queue message via REST API\n        // Message will be delivered automatically when conversation becomes ready\n        if (!conversationId) {\n          const error = new Error(\"No conversation ID available\");\n          setErrorMessage(error.message);\n          throw error;\n        }\n\n        try {\n          await new ConversationClient(getAgentServerClientOptions()).sendEvent(\n            conversationId,\n            {\n              role: \"user\",\n              content: message.content,\n            },\n            { run: true },\n          );\n          // Message queued successfully - it will be delivered when ready\n          // Return queued: true so caller knows not to show optimistic UI\n          return { queued: true };\n        } catch (error) {\n          const errorMessage =\n            error instanceof Error\n              ? error.message\n              : \"Failed to queue message for delivery\";\n          setErrorMessage(errorMessage);\n          throw error;\n        }\n      }\n\n      try {\n        // Send message through WebSocket as JSON with run: true so the\n        // agent loop starts automatically in async mode.\n        currentSocket.send(JSON.stringify({ ...message, run: true }));\n        return { queued: false };\n      } catch (error) {\n        const errorMessage =\n          error instanceof Error ? error.message : \"Failed to send message\";\n        setErrorMessage(errorMessage);\n        throw error;\n      }\n    },\n    [mainSocket, planningAgentSocket, setErrorMessage, conversationId],\n  );\n\n  // Track main socket state changes\n  useEffect(() => {\n    // Only process socket updates if we have a valid URL and socket\n    if (mainSocket && wsUrl) {\n      // Update state based on socket readyState\n      const updateState = () => {\n        switch (mainSocket.readyState) {\n          case WebSocket.CONNECTING:\n            setMainConnectionState(\"CONNECTING\");\n            break;\n          case WebSocket.OPEN:\n            setMainConnectionState(\"OPEN\");\n            break;\n          case WebSocket.CLOSING:\n            setMainConnectionState(\"CLOSING\");\n            break;\n          case WebSocket.CLOSED:\n            setMainConnectionState(\"CLOSED\");\n            break;\n          default:\n            setMainConnectionState(\"CLOSED\");\n            break;\n        }\n      };\n\n      updateState();\n    }\n  }, [mainSocket, wsUrl]);\n\n  // Track planning agent socket state changes\n  useEffect(() => {\n    // Only process socket updates if we have a valid URL and socket\n    if (planningAgentSocket && planningAgentWsUrl) {\n      // Update state based on socket readyState\n      const updateState = () => {\n        switch (planningAgentSocket.readyState) {\n          case WebSocket.CONNECTING:\n            setPlanningConnectionState(\"CONNECTING\");\n            break;\n          case WebSocket.OPEN:\n            setPlanningConnectionState(\"OPEN\");\n            break;\n          case WebSocket.CLOSING:\n            setPlanningConnectionState(\"CLOSING\");\n            break;\n          case WebSocket.CLOSED:\n            setPlanningConnectionState(\"CLOSED\");\n            break;\n          default:\n            setPlanningConnectionState(\"CLOSED\");\n            break;\n        }\n      };\n\n      updateState();\n    }\n  }, [planningAgentSocket, planningAgentWsUrl]);\n\n  const contextValue = useMemo(\n    () => ({ connectionState, sendMessage, isLoadingHistory, reconnect }),\n    [connectionState, sendMessage, isLoadingHistory, reconnect],\n  );\n\n  return (\n    <ConversationWebSocketContext.Provider value={contextValue}>\n      {children}\n    </ConversationWebSocketContext.Provider>\n  );\n}\n\nexport const useConversationWebSocket =\n  (): ConversationWebSocketContextType | null => {\n    const context = useContext(ConversationWebSocketContext);\n    // Return null instead of throwing when not in provider\n    // This allows the hook to be called conditionally based on conversation version\n    return context || null;\n  };\n"],"mappings":"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"}
+{"version":3,"file":"conversation-websocket-context.js","names":[],"sources":["../../src/contexts/conversation-websocket-context.tsx"],"sourcesContent":["import React, {\n  createContext,\n  useContext,\n  useEffect,\n  useLayoutEffect,\n  useState,\n  useCallback,\n  useMemo,\n  useRef,\n} from \"react\";\nimport { ConversationClient } from \"@openhands/typescript-client/clients\";\n\nimport { useQueryClient } from \"@tanstack/react-query\";\nimport { useWebSocket, WebSocketHookOptions } from \"#/hooks/use-websocket\";\nimport { SERVER_CONNECTION_ERROR_MESSAGE } from \"#/constants/server-connection-error\";\nimport { useEventStore } from \"#/stores/use-event-store\";\nimport { useErrorMessageStore } from \"#/stores/error-message-store\";\nimport { useOptimisticUserMessageStore } from \"#/stores/optimistic-user-message-store\";\nimport { useConversationStateStore } from \"#/stores/conversation-state-store\";\nimport { useCommandStore } from \"#/stores/command-store\";\nimport { useBrowserStore } from \"#/stores/browser-store\";\nimport { useGoalStore } from \"#/stores/goal-store\";\nimport {\n  isAgentServerEvent,\n  isAgentErrorEvent,\n  isUserMessageEvent,\n  isActionEvent,\n  isConversationStateUpdateEvent,\n  isFullStateConversationStateUpdateEvent,\n  isAgentStatusConversationStateUpdateEvent,\n  isStatsConversationStateUpdateEvent,\n  isGoalConversationStateUpdateEvent,\n  isExecuteBashActionEvent,\n  isExecuteBashObservationEvent,\n  isDisplayableErrorEvent,\n  isPlanningFileEditorObservationEvent,\n  isBrowserObservationEvent,\n  isBrowserNavigateActionEvent,\n  isSwitchLLMObservationEvent,\n  isCanvasUIActionEvent,\n  isLaunchChildConversationActionEvent,\n} from \"#/types/agent-server/type-guards\";\nimport { handleCanvasUIAction } from \"#/services/canvas-ui\";\nimport { handleLaunchChildConversationAction } from \"#/services/child-conversation-launch\";\nimport { ConversationStateUpdateEventStats } from \"#/types/agent-server/core/events/conversation-state-event\";\nimport type {\n  ConversationErrorEvent,\n  ServerErrorEvent,\n} from \"#/types/agent-server/core/events/conversation-state-event\";\nimport { handleActionEventCacheInvalidation } from \"#/utils/cache-utils\";\nimport { buildWebSocketUrl } from \"#/utils/websocket-url\";\nimport type {\n  AppConversation,\n  SendMessageRequest,\n} from \"#/api/conversation-service/agent-server-conversation-service.types\";\nimport EventService from \"#/api/event-service/event-service.api\";\nimport { getAgentServerClientOptions } from \"#/api/agent-server-client-options\";\nimport { useConversationStore } from \"#/stores/conversation-store\";\nimport { trackError } from \"#/utils/error-handler\";\nimport { useReadConversationFile } from \"#/hooks/mutation/use-read-conversation-file\";\nimport useMetricsStore from \"#/stores/metrics-store\";\nimport { useConversationHistory } from \"#/hooks/query/use-conversation-history\";\nimport { setConversationState } from \"#/utils/conversation-local-storage\";\nimport {\n  recordModelSwitchMessage,\n  seedModelSwitchesFromHistory,\n} from \"#/hooks/chat/record-model-switch-message\";\nimport {\n  invalidateConversationQueries,\n  updateConversationLlmModelInCache,\n} from \"#/hooks/mutation/conversation-mutation-utils\";\nimport {\n  getStoredConversationMetadata,\n  setStoredConversationMetadata,\n} from \"#/api/conversation-metadata-store\";\n\nexport type WebSocketConnectionState =\n  | \"CONNECTING\"\n  | \"OPEN\"\n  | \"CLOSED\"\n  | \"CLOSING\";\n\ninterface SendMessageResult {\n  queued: boolean; // true if message was queued for later delivery, false if sent immediately\n}\n\ninterface ConversationWebSocketContextType {\n  connectionState: WebSocketConnectionState;\n  sendMessage: (message: SendMessageRequest) => Promise<SendMessageResult>;\n  isLoadingHistory: boolean;\n  reconnect: () => void;\n}\n\nconst ConversationWebSocketContext = createContext<\n  ConversationWebSocketContextType | undefined\n>(undefined);\n\n/**\n * Extract the text body of an echoed user `MessageEvent` for matching against\n * the optimistic pending-message queue. The server wraps the original\n * `args.content` string in one or more `TextContent` entries (alongside any\n * `ImageContent` entries for inline images), so concatenating the `text`\n * fields gives us back the exact prompt we sent.\n */\nfunction extractMessageEventText(\n  event: import(\"#/types/agent-server/core/events/message-event\").MessageEvent,\n): string {\n  return event.llm_message.content\n    .filter(\n      (part): part is { type: \"text\"; text: string } => part.type === \"text\",\n    )\n    .map((part) => part.text)\n    .join(\"\");\n}\n\nexport function ConversationWebSocketProvider({\n  children,\n  conversationId,\n  conversationUrl,\n  sessionApiKey,\n  subConversations,\n  subConversationIds,\n}: {\n  children: React.ReactNode;\n  conversationId?: string;\n  conversationUrl?: string | null;\n  sessionApiKey?: string | null;\n  subConversations?: AppConversation[];\n  subConversationIds?: string[];\n}) {\n  // Separate connection state tracking for each WebSocket\n  const [mainConnectionState, setMainConnectionState] =\n    useState<WebSocketConnectionState>(\"CONNECTING\");\n  const [planningConnectionState, setPlanningConnectionState] =\n    useState<WebSocketConnectionState>(\"CONNECTING\");\n\n  // Track if we've ever successfully connected for each connection\n  // Don't show errors until after first successful connection\n  const hasConnectedRefMain = React.useRef(false);\n  const hasConnectedRefPlanning = React.useRef(false);\n\n  const queryClient = useQueryClient();\n  const addEvent = useEventStore((state) => state.addEvent);\n  const addEvents = useEventStore((state) => state.addEvents);\n  const clearEventsForConversation = useEventStore(\n    (state) => state.clearEventsForConversation,\n  );\n  const { setErrorMessage, removeErrorMessage, clearConnectionError } =\n    useErrorMessageStore();\n  const consumeMatchingPendingMessage = useOptimisticUserMessageStore(\n    (state) => state.consumeMatchingPendingMessage,\n  );\n  const { setExecutionStatus } = useConversationStateStore();\n  const { appendInput, appendOutput } = useCommandStore();\n  const resetBrowserStore = useBrowserStore((state) => state.reset);\n\n  // History loading state.\n  // - Main conversation history is now loaded via REST (`useConversationHistory`),\n  //   so its loading state mirrors the REST query state (see below).\n  // - Planning sub-conversation history still streams over the WebSocket using\n  //   `resend_mode='all'`, so we keep the count-based detection for it.\n  const [isLoadingHistoryPlanning, setIsLoadingHistoryPlanning] =\n    useState(true);\n  const [expectedEventCountPlanning, setExpectedEventCountPlanning] = useState<\n    number | null\n  >(null);\n\n  const { setPlanContent } = useConversationStore();\n\n  // Hook for reading conversation file\n  const { mutate: readConversationFile } = useReadConversationFile();\n\n  // Track planning-agent received events (still WS-driven).\n  const receivedEventCountRefPlanning = useRef(0);\n\n  // Track the latest PlanningFileEditorObservation for Plan.md during history replay\n  const latestPlanningFileEventRef = useRef<{\n    path: string;\n    conversationId: string;\n  } | null>(null);\n\n  const isPlanFilePath = (path: string | null): boolean =>\n    path?.toUpperCase().endsWith(\"PLAN.MD\") ?? false;\n\n  const handleNonErrorEvent = useCallback(() => {\n    // A normal event means connectivity recovered: clear a transient connection\n    // error, but keep sticky conversation errors (e.g. a wrong API key).\n    clearConnectionError();\n  }, [clearConnectionError]);\n\n  // Helper function to update metrics from stats event\n  const updateMetricsFromStats = useCallback(\n    (event: ConversationStateUpdateEventStats) => {\n      if (event.value.usage_to_metrics?.agent) {\n        const agentMetrics = event.value.usage_to_metrics.agent;\n        const metrics = {\n          cost: agentMetrics.accumulated_cost,\n          max_budget_per_task: agentMetrics.max_budget_per_task ?? null,\n          usage: agentMetrics.accumulated_token_usage\n            ? {\n                prompt_tokens:\n                  agentMetrics.accumulated_token_usage.prompt_tokens,\n                completion_tokens:\n                  agentMetrics.accumulated_token_usage.completion_tokens,\n                cache_read_tokens:\n                  agentMetrics.accumulated_token_usage.cache_read_tokens,\n                cache_write_tokens:\n                  agentMetrics.accumulated_token_usage.cache_write_tokens,\n                context_window:\n                  agentMetrics.accumulated_token_usage.context_window,\n                per_turn_token:\n                  agentMetrics.accumulated_token_usage.per_turn_token,\n              }\n            : null,\n        };\n        useMetricsStore.getState().setMetrics(metrics);\n      }\n    },\n    [],\n  );\n\n  // Initial REST history load: fetch the most recent events and seed the\n  // store. Older events are paginated in via `useLoadOlderEvents` when the\n  // user scrolls to the top of the chat. The WebSocket connection waits for\n  // this query so it can subscribe with `resend_mode='since'` and avoid\n  // re-streaming everything REST already returned.\n  const {\n    data: preloadedHistory,\n    isPending: isPreloadingHistory,\n    isFetching: isFetchingHistory,\n    isError: isPreloadHistoryError,\n  } = useConversationHistory(conversationId);\n\n  // Skeleton only on the genuine first load (no cached data yet). On return the\n  // cached page is present, so `isPending` is false and we render the\n  // last-known discussion immediately while the tail refetch runs in the\n  // background — see the socket gate below, which waits on `isFetching`.\n  const isLoadingHistoryMain = !!conversationId && isPreloadingHistory;\n\n  // Clear the (global, not conversation-scoped) event store when the active\n  // conversation changes, BEFORE the preloaded-history effect below re-seeds\n  // it. This MUST live here rather than in the route component: a parent's\n  // passive effect runs *after* this child's layout effects, so clearing from\n  // the route would wipe the freshly seeded history. On a conversation switch\n  // the history page is already cached, so `preloadedHistory` is available\n  // synchronously — without ordering the clear first, the user's already-echoed\n  // message gets seeded then immediately wiped, leaving only the `since`\n  // WebSocket resend (the agent's reply). Re-entering the same conversation is\n  // a no-op, so the store survives navigating away to Settings and back.\n  useLayoutEffect(() => {\n    const nextId = conversationId ?? null;\n    if (useEventStore.getState().loadedConversationId === nextId) {\n      return;\n    }\n    // Single atomic action: clears the previous conversation's events and\n    // records the new loaded id in one `set`, so no subscriber can observe a\n    // half-applied state (events gone but the old id still reported).\n    clearEventsForConversation(nextId);\n    resetBrowserStore();\n  }, [conversationId, clearEventsForConversation, resetBrowserStore]);\n\n  useLayoutEffect(() => {\n    if (!preloadedHistory || preloadedHistory.events.length === 0) {\n      return;\n    }\n    addEvents(preloadedHistory.events);\n\n    // The first user message of a cloud start-task conversation is persisted\n    // server-side and reaches us via this REST preload, not over the WebSocket\n    // (which subscribes with resend_mode='since' after the latest preloaded\n    // timestamp). Consume any matching optimistic \"Sending…\" bubble here too —\n    // mirroring the WS handler — so it doesn't linger as a duplicate of the echo.\n    if (conversationId) {\n      // Rebuild inline \"Switched to\" messages from the REST-preloaded history.\n      // The live store writers (WS handler / user action) never see preloaded\n      // events, so without this past model switches wouldn't render on reload.\n      // Read the post-`addEvents` `uiEvents` (actions replaced by observations,\n      // Think/Finish observations dropped) — not the raw history — so anchors\n      // match the ids the renderer actually mounts.\n      seedModelSwitchesFromHistory(\n        conversationId,\n        useEventStore.getState().uiEvents,\n      );\n\n      for (const event of preloadedHistory.events) {\n        if (isUserMessageEvent(event)) {\n          consumeMatchingPendingMessage(\n            conversationId,\n            extractMessageEventText(event),\n          );\n        }\n      }\n    }\n  }, [\n    preloadedHistory,\n    addEvents,\n    conversationId,\n    consumeMatchingPendingMessage,\n  ]);\n\n  /**\n   * Timestamp of the latest event we already have from REST. Used as\n   * `after_timestamp` when opening the WebSocket so the server only resends\n   * events strictly after this point. `null` until the REST query settles\n   * (we hold the WS connection open until then to avoid an `all` resend).\n   */\n  const initialAfterTimestamp = useMemo<string | null>(() => {\n    // Wait for the history query to settle — including the refetch fired when\n    // returning to a conversation — so we anchor `since` to the freshest event\n    // we have rather than a stale cached tail.\n    if (isFetchingHistory) return null;\n    const events = preloadedHistory?.events ?? [];\n    const latest = events[events.length - 1];\n    if (!latest || !(\"timestamp\" in latest) || !latest.timestamp) return null;\n    return latest.timestamp;\n  }, [preloadedHistory, isFetchingHistory]);\n\n  // Build WebSocket URL from props.\n  //\n  // We deliberately wait for the history fetch to settle before opening the\n  // socket so the WS subscription can use `resend_mode='since'` with a\n  // meaningful `after_timestamp`. This gate is on `isFetching`, not just the\n  // first-load `isPending`, so the refetch fired when returning to a\n  // conversation also completes first: the socket bakes `after_timestamp` into\n  // its URL at connect time and will NOT re-subscribe when the value changes\n  // later (see use-websocket — options live in a ref, reconnect keys on the URL\n  // only). Connecting mid-fetch would therefore pin `since` to the stale cached\n  // tail and replay the entire backlog over the socket. Without any gate the WS\n  // would instead fall back to `resend_mode='all'`. If the REST query errored we\n  // fall through and connect with `resend_mode='all'` so the user still sees\n  // live events.\n  const wsUrl = useMemo(() => {\n    if (!conversationId || !conversationUrl) {\n      return null;\n    }\n    if (isFetchingHistory && !isPreloadHistoryError) {\n      return null;\n    }\n    return buildWebSocketUrl(conversationId, conversationUrl);\n  }, [\n    conversationId,\n    conversationUrl,\n    isFetchingHistory,\n    isPreloadHistoryError,\n  ]);\n\n  const planningAgentWsUrl = useMemo(() => {\n    if (!subConversations?.length) {\n      return null;\n    }\n\n    // Currently, there is only one sub-conversation and it uses the planning agent.\n    const planningAgentConversation = subConversations[0];\n\n    if (\n      !planningAgentConversation?.id ||\n      !planningAgentConversation.conversation_url\n    ) {\n      return null;\n    }\n\n    return buildWebSocketUrl(\n      planningAgentConversation.id,\n      planningAgentConversation.conversation_url,\n    );\n  }, [subConversations]);\n\n  // Merged connection state - reflects combined status of both connections\n  const connectionState = useMemo<WebSocketConnectionState>(() => {\n    // If planning agent connection doesn't exist, use main connection state\n    if (!planningAgentWsUrl) {\n      return mainConnectionState;\n    }\n\n    // If either is connecting, merged state is connecting\n    if (\n      mainConnectionState === \"CONNECTING\" ||\n      planningConnectionState === \"CONNECTING\"\n    ) {\n      return \"CONNECTING\";\n    }\n\n    // If both are open, merged state is open\n    if (mainConnectionState === \"OPEN\" && planningConnectionState === \"OPEN\") {\n      return \"OPEN\";\n    }\n\n    // If both are closed, merged state is closed\n    if (\n      mainConnectionState === \"CLOSED\" &&\n      planningConnectionState === \"CLOSED\"\n    ) {\n      return \"CLOSED\";\n    }\n\n    // If either is closing, merged state is closing\n    if (\n      mainConnectionState === \"CLOSING\" ||\n      planningConnectionState === \"CLOSING\"\n    ) {\n      return \"CLOSING\";\n    }\n\n    // Default to closed if states don't match expected patterns\n    return \"CLOSED\";\n  }, [mainConnectionState, planningConnectionState, planningAgentWsUrl]);\n\n  useEffect(() => {\n    if (\n      expectedEventCountPlanning !== null &&\n      receivedEventCountRefPlanning.current >= expectedEventCountPlanning &&\n      isLoadingHistoryPlanning\n    ) {\n      setIsLoadingHistoryPlanning(false);\n    }\n  }, [\n    expectedEventCountPlanning,\n    isLoadingHistoryPlanning,\n    receivedEventCountRefPlanning,\n  ]);\n\n  // Call API once after history loading completes if we tracked any PlanningFileEditorObservation events\n  useEffect(() => {\n    if (!isLoadingHistoryPlanning && latestPlanningFileEventRef.current) {\n      const { path, conversationId: currentPlanningConversationId } =\n        latestPlanningFileEventRef.current;\n\n      readConversationFile(\n        {\n          conversationId: currentPlanningConversationId,\n          filePath: path,\n        },\n        {\n          onSuccess: (fileContent) => {\n            setPlanContent(fileContent);\n          },\n          onError: (error) => {\n            console.warn(\"Failed to read conversation file:\", error);\n          },\n        },\n      );\n\n      // Clear the ref after calling the API\n      latestPlanningFileEventRef.current = null;\n    }\n  }, [isLoadingHistoryPlanning, readConversationFile, setPlanContent]);\n\n  useEffect(() => {\n    hasConnectedRefMain.current = false;\n    setIsLoadingHistoryPlanning(!!subConversationIds?.length);\n    setExpectedEventCountPlanning(null);\n    receivedEventCountRefPlanning.current = 0;\n    // Reset the tracked event ref when sub-conversations change\n    latestPlanningFileEventRef.current = null;\n  }, [subConversationIds]);\n\n  // Reset hasConnected flags when the conversation changes.\n  useEffect(() => {\n    hasConnectedRefMain.current = false;\n    hasConnectedRefPlanning.current = false;\n    // Reset the tracked event ref when conversation changes\n    latestPlanningFileEventRef.current = null;\n  }, [conversationId]);\n\n  // Merged loading history state - true if either connection is still loading\n  const isLoadingHistory = useMemo(\n    () => isLoadingHistoryMain || isLoadingHistoryPlanning,\n    [isLoadingHistoryMain, isLoadingHistoryPlanning],\n  );\n\n  // Separate message handlers for each connection\n  const handleMainMessage = useCallback(\n    (messageEvent: MessageEvent) => {\n      try {\n        const event = JSON.parse(messageEvent.data);\n\n        // History loading for the main conversation is REST-driven now;\n        // every WS message is a new event we add to the store.\n\n        // Use type guard to validate v1 event structure\n        if (isAgentServerEvent(event)) {\n          // A reconnect replays the backlog from a stale anchor. The store\n          // dedups by id, but the side-effects below aren't idempotent, so skip\n          // them for replayed events (#1656).\n          const isDuplicateEvent = useEventStore\n            .getState()\n            .eventIds.has(event.id);\n          const switchLLMObservation = isSwitchLLMObservationEvent(event)\n            ? event\n            : null;\n          addEvent(event);\n          if (isDuplicateEvent) {\n            return;\n          }\n\n          // Handle displayable error events - show error banner\n          // AgentErrorEvent errors are displayed inline in the chat, not as banners\n          if (isDisplayableErrorEvent(event)) {\n            const errorEvent = event as\n              | ConversationErrorEvent\n              | ServerErrorEvent;\n            trackError({\n              message: errorEvent.detail,\n              source: \"conversation\",\n              metadata: {\n                eventId: errorEvent.id,\n                errorCode: errorEvent.code,\n              },\n            });\n            setErrorMessage(errorEvent.detail, \"conversation\", errorEvent.code);\n          } else {\n            handleNonErrorEvent();\n          }\n\n          // LLM errors render inline in the chat (see ErrorEventMessage); track\n          // them for analytics but keep them out of the banner above the chat box.\n          if (isAgentErrorEvent(event)) {\n            trackError({\n              message: event.error,\n              source: \"agent\",\n              metadata: {\n                eventId: event.id,\n                toolName: event.tool_name,\n                toolCallId: event.tool_call_id,\n              },\n            });\n          }\n\n          // Clear optimistic user message when a user message is confirmed.\n          // We match by the echoed text content (with FIFO fallback inside the\n          // store), so an echo for \"second\" pops \"second\" — not whichever\n          // pending entry happens to be oldest — protecting against any\n          // out-of-order delivery between conversations or sub-agents.\n          if (isUserMessageEvent(event)) {\n            if (conversationId) {\n              consumeMatchingPendingMessage(\n                conversationId,\n                extractMessageEventText(event),\n              );\n              // Clear draft from localStorage - message was successfully delivered\n              setConversationState(conversationId, { draftMessage: null });\n            }\n          }\n\n          // Handle cache invalidation for ActionEvent\n          if (isActionEvent(event)) {\n            const currentConversationId =\n              conversationId || \"test-conversation-id\"; // TODO: Get from context\n            handleActionEventCacheInvalidation(\n              event,\n              currentConversationId,\n              queryClient,\n            );\n          }\n\n          // Handle conversation state updates\n          // TODO: Tests\n          if (isConversationStateUpdateEvent(event)) {\n            if (isFullStateConversationStateUpdateEvent(event)) {\n              setExecutionStatus(event.value.execution_status);\n            }\n            if (isAgentStatusConversationStateUpdateEvent(event)) {\n              setExecutionStatus(event.value);\n            }\n            if (isStatsConversationStateUpdateEvent(event)) {\n              updateMetricsFromStats(event);\n            }\n            // Mirror goal status into the store. Intentionally duplicated across\n            // the main and planning WebSocket handlers (like the execution_status\n            // and stats branches above), not a merge artifact.\n            if (isGoalConversationStateUpdateEvent(event) && conversationId) {\n              useGoalStore.getState().setStatus(conversationId, event.value);\n            }\n          }\n\n          // Handle ExecuteBashAction events - add command as input to terminal\n          if (isExecuteBashActionEvent(event)) {\n            appendInput(event.action.command);\n          }\n\n          // Handle ExecuteBashObservation events - add output to terminal\n          if (isExecuteBashObservationEvent(event)) {\n            // Extract text content from the observation content array\n            const textContent = event.observation.content\n              .filter((c) => c.type === \"text\")\n              .map((c) => c.text)\n              .join(\"\\n\");\n            appendOutput(textContent);\n          }\n\n          // Handle BrowserObservation events - update browser store with screenshot\n          if (isBrowserObservationEvent(event)) {\n            const { screenshot_data: screenshotData } = event.observation;\n            if (screenshotData) {\n              const screenshotSrc = screenshotData.startsWith(\"data:\")\n                ? screenshotData\n                : `data:image/png;base64,${screenshotData}`;\n              useBrowserStore.getState().setScreenshotSrc(screenshotSrc);\n            }\n          }\n\n          // Handle BrowserNavigateAction events - update browser store with URL\n          if (isBrowserNavigateActionEvent(event)) {\n            useBrowserStore.getState().setUrl(event.action.url);\n          }\n\n          if (\n            conversationId &&\n            switchLLMObservation &&\n            !switchLLMObservation.observation.is_error\n          ) {\n            recordModelSwitchMessage(\n              conversationId,\n              switchLLMObservation.observation.profile_name,\n            );\n\n            // Mirror the user-driven `/model` path: persist the profile so the\n            // chat-header switcher shows the right name after a reload, even\n            // when several profiles share a model (#1082).\n            const prevMetadata = getStoredConversationMetadata(conversationId);\n            setStoredConversationMetadata(conversationId, {\n              selected_repository: prevMetadata?.selected_repository ?? null,\n              selected_branch: prevMetadata?.selected_branch ?? null,\n              git_provider: prevMetadata?.git_provider ?? null,\n              selected_workspace: prevMetadata?.selected_workspace ?? null,\n              active_profile: switchLLMObservation.observation.profile_name,\n              // Full-object replace: carry the plugins snapshot forward so the\n              // in-conversation plugins view survives a profile switch.\n              plugins: prevMetadata?.plugins ?? null,\n            });\n\n            if (switchLLMObservation.observation.active_model) {\n              updateConversationLlmModelInCache(\n                queryClient,\n                conversationId,\n                switchLLMObservation.observation.active_model,\n              );\n            }\n\n            invalidateConversationQueries(queryClient, conversationId);\n          }\n\n          // Handle canvas_ui ActionEvents from both the legacy Python tool and\n          // the client-defined JSON tool. The server acknowledges immediately;\n          // the actual UI change happens here on the client.\n          if (isCanvasUIActionEvent(event)) {\n            handleCanvasUIAction(event.action, conversationId ?? null);\n          }\n\n          // Same client-tool pattern, but the work is a network call: launch\n          // the requested child conversation and post the outcome back so the\n          // agent learns the id the server-side acknowledgement can't carry.\n          if (conversationId && isLaunchChildConversationActionEvent(event)) {\n            void handleLaunchChildConversationAction(\n              event.action,\n              conversationId,\n              event.tool_call_id,\n            );\n          }\n        }\n      } catch (error) {\n        console.warn(\"Failed to parse WebSocket message as JSON:\", error);\n      }\n    },\n    [\n      addEvent,\n      setErrorMessage,\n      consumeMatchingPendingMessage,\n      queryClient,\n      conversationId,\n      setExecutionStatus,\n      appendInput,\n      appendOutput,\n      updateMetricsFromStats,\n      handleNonErrorEvent,\n    ],\n  );\n\n  const handlePlanningMessage = useCallback(\n    (messageEvent: MessageEvent) => {\n      try {\n        const event = JSON.parse(messageEvent.data);\n\n        // Track received events for history loading (count ALL events from WebSocket)\n        // Always count when loading, even if we don't have the expected count yet\n        if (isLoadingHistoryPlanning) {\n          receivedEventCountRefPlanning.current += 1;\n\n          if (\n            expectedEventCountPlanning !== null &&\n            receivedEventCountRefPlanning.current >= expectedEventCountPlanning\n          ) {\n            setIsLoadingHistoryPlanning(false);\n          }\n        }\n\n        // Use type guard to validate v1 event structure\n        if (isAgentServerEvent(event)) {\n          // Skip non-idempotent side-effects for replayed events, as in the\n          // main handler (#1656).\n          const isDuplicateEvent = useEventStore\n            .getState()\n            .eventIds.has(event.id);\n          // Mark this event as coming from the planning agent\n          const eventWithPlanningFlag = {\n            ...event,\n            isFromPlanningAgent: true,\n          };\n          addEvent(eventWithPlanningFlag);\n          if (isDuplicateEvent) {\n            return;\n          }\n\n          // Handle displayable error events - show error banner\n          // AgentErrorEvent errors are displayed inline in the chat, not as banners\n          if (isDisplayableErrorEvent(event)) {\n            const errorEvent = event as\n              | ConversationErrorEvent\n              | ServerErrorEvent;\n            trackError({\n              message: errorEvent.detail,\n              source: \"planning_conversation\",\n              metadata: {\n                eventId: errorEvent.id,\n                errorCode: errorEvent.code,\n              },\n            });\n            setErrorMessage(errorEvent.detail, \"conversation\", errorEvent.code);\n          } else {\n            handleNonErrorEvent();\n          }\n\n          // LLM errors render inline in the chat (see ErrorEventMessage); track\n          // them for analytics but keep them out of the banner above the chat box.\n          if (isAgentErrorEvent(event)) {\n            trackError({\n              message: event.error,\n              source: \"planning_agent\",\n              metadata: {\n                eventId: event.id,\n                toolName: event.tool_name,\n                toolCallId: event.tool_call_id,\n              },\n            });\n          }\n\n          // Clear optimistic user message when a user message is confirmed.\n          // Always scope to the main `conversationId` (where the user types)\n          // and match on the echoed content so the planning sub-agent's own\n          // events can never consume a main-conversation pending entry.\n          if (isUserMessageEvent(event)) {\n            if (conversationId) {\n              consumeMatchingPendingMessage(\n                conversationId,\n                extractMessageEventText(event),\n              );\n              setConversationState(conversationId, { draftMessage: null });\n            }\n          }\n\n          // Handle cache invalidation for ActionEvent\n          if (isActionEvent(event)) {\n            const planningAgentConversation = subConversations?.[0];\n            const currentConversationId =\n              planningAgentConversation?.id || \"test-conversation-id\"; // TODO: Get from context\n            handleActionEventCacheInvalidation(\n              event,\n              currentConversationId,\n              queryClient,\n            );\n          }\n\n          // Handle conversation state updates\n          // TODO: Tests\n          if (isConversationStateUpdateEvent(event)) {\n            if (isFullStateConversationStateUpdateEvent(event)) {\n              setExecutionStatus(event.value.execution_status);\n            }\n            if (isAgentStatusConversationStateUpdateEvent(event)) {\n              setExecutionStatus(event.value);\n            }\n            if (isStatsConversationStateUpdateEvent(event)) {\n              updateMetricsFromStats(event);\n            }\n            // Mirror goal status into the store. Intentionally duplicated across\n            // the main and planning WebSocket handlers (like the execution_status\n            // and stats branches above), not a merge artifact.\n            if (isGoalConversationStateUpdateEvent(event) && conversationId) {\n              useGoalStore.getState().setStatus(conversationId, event.value);\n            }\n          }\n\n          // Handle ExecuteBashAction events - add command as input to terminal\n          if (isExecuteBashActionEvent(event)) {\n            appendInput(event.action.command);\n          }\n\n          // Handle ExecuteBashObservation events - add output to terminal\n          if (isExecuteBashObservationEvent(event)) {\n            // Extract text content from the observation content array\n            const textContent = event.observation.content\n              .filter((c) => c.type === \"text\")\n              .map((c) => c.text)\n              .join(\"\\n\");\n            appendOutput(textContent);\n          }\n\n          // Handle PlanningFileEditorObservation - only update plan for Plan.md\n          if (isPlanningFileEditorObservationEvent(event)) {\n            const { path } = event.observation;\n            if (isPlanFilePath(path)) {\n              const planningAgentConversation = subConversations?.[0];\n              const planningConversationId = planningAgentConversation?.id;\n\n              if (planningConversationId && path) {\n                if (isLoadingHistoryPlanning) {\n                  latestPlanningFileEventRef.current = {\n                    path,\n                    conversationId: planningConversationId,\n                  };\n                } else {\n                  readConversationFile(\n                    {\n                      conversationId: planningConversationId,\n                      filePath: path,\n                    },\n                    {\n                      onSuccess: (fileContent) => {\n                        setPlanContent(fileContent);\n                      },\n                      onError: (error) => {\n                        console.warn(\n                          \"Failed to read conversation file:\",\n                          error,\n                        );\n                      },\n                    },\n                  );\n                }\n              }\n            }\n          }\n        }\n      } catch (error) {\n        console.warn(\"Failed to parse WebSocket message as JSON:\", error);\n      }\n    },\n    [\n      addEvent,\n      isLoadingHistoryPlanning,\n      expectedEventCountPlanning,\n      setErrorMessage,\n      consumeMatchingPendingMessage,\n      queryClient,\n      subConversations,\n      conversationId,\n      setExecutionStatus,\n      appendInput,\n      appendOutput,\n      readConversationFile,\n      setPlanContent,\n      updateMetricsFromStats,\n      handleNonErrorEvent,\n    ],\n  );\n\n  // Separate WebSocket options for main connection\n  const mainWebsocketOptions: WebSocketHookOptions = useMemo(() => {\n    // History was already loaded over REST (`useConversationHistory`).\n    // Subscribe with `resend_mode='since'` so the server only resends events\n    // strictly after the latest one we already have. If REST returned no\n    // events at all (brand-new conversation), fall back to `'all'` so any\n    // events that may have been written between the REST call and the WS\n    // handshake still show up. Dedup in the event store handles overlap.\n    const queryParams: Record<string, string | boolean> = initialAfterTimestamp\n      ? { resend_mode: \"since\", after_timestamp: initialAfterTimestamp }\n      : { resend_mode: \"all\" };\n\n    return {\n      queryParams,\n      sessionApiKey,\n      reconnect: { enabled: true },\n      onOpen: () => {\n        setMainConnectionState(\"OPEN\");\n        hasConnectedRefMain.current = true; // Mark that we've successfully connected\n        clearConnectionError(); // Clear a previous connection error; keep sticky conversation errors\n      },\n      onClose: () => {\n        setMainConnectionState(\"CLOSED\");\n      },\n      onError: () => {\n        setMainConnectionState(\"CLOSED\");\n        // Only show error message if we've previously connected successfully\n        if (hasConnectedRefMain.current) {\n          setErrorMessage(SERVER_CONNECTION_ERROR_MESSAGE, \"connection\");\n        }\n      },\n      onMessage: handleMainMessage,\n    };\n  }, [\n    handleMainMessage,\n    setErrorMessage,\n    clearConnectionError,\n    sessionApiKey,\n    initialAfterTimestamp,\n  ]);\n\n  // Separate WebSocket options for planning agent connection\n  const planningWebsocketOptions: WebSocketHookOptions = useMemo(() => {\n    const queryParams: Record<string, string | boolean> = {\n      resend_all: true,\n    };\n\n    const planningAgentConversation = subConversations?.[0];\n    const planningApiKey =\n      planningAgentConversation?.session_api_key ?? sessionApiKey;\n\n    return {\n      queryParams,\n      sessionApiKey: planningApiKey,\n      reconnect: { enabled: true },\n      onOpen: async () => {\n        setPlanningConnectionState(\"OPEN\");\n        hasConnectedRefPlanning.current = true; // Mark that we've successfully connected\n        clearConnectionError(); // Clear a previous connection error; keep sticky conversation errors\n\n        // Fetch expected event count for history loading detection\n        if (\n          planningAgentConversation?.id &&\n          planningAgentConversation.conversation_url\n        ) {\n          try {\n            const count = await EventService.getEventCount(\n              planningAgentConversation.id,\n              planningAgentConversation.conversation_url,\n              planningAgentConversation.session_api_key,\n            );\n            setExpectedEventCountPlanning(count);\n\n            // If no events expected, mark as loaded immediately\n            if (count === 0) {\n              setIsLoadingHistoryPlanning(false);\n            }\n          } catch (error) {\n            // Fall back to marking as loaded to avoid infinite loading state\n            setIsLoadingHistoryPlanning(false);\n          }\n        }\n      },\n      onClose: () => {\n        setPlanningConnectionState(\"CLOSED\");\n      },\n      onError: () => {\n        setPlanningConnectionState(\"CLOSED\");\n        // Only show error message if we've previously connected successfully\n        if (hasConnectedRefPlanning.current) {\n          setErrorMessage(SERVER_CONNECTION_ERROR_MESSAGE, \"connection\");\n        }\n      },\n      onMessage: handlePlanningMessage,\n    };\n  }, [\n    handlePlanningMessage,\n    setErrorMessage,\n    clearConnectionError,\n    sessionApiKey,\n    subConversations,\n  ]);\n\n  // Only attempt WebSocket connection when we have a valid URL\n  // This prevents connection attempts during task polling phase\n  const websocketUrl = wsUrl;\n  const { socket: mainSocket, reconnect: reconnectMain } = useWebSocket(\n    websocketUrl || \"\",\n    mainWebsocketOptions,\n  );\n\n  const { socket: planningAgentSocket, reconnect: reconnectPlanning } =\n    useWebSocket(planningAgentWsUrl || \"\", planningWebsocketOptions);\n\n  const reconnect = useCallback(() => {\n    removeErrorMessage();\n    const currentMode = useConversationStore.getState().conversationMode;\n    if (currentMode === \"plan\" && planningAgentWsUrl) {\n      reconnectPlanning();\n      return;\n    }\n    reconnectMain();\n  }, [\n    planningAgentWsUrl,\n    reconnectMain,\n    reconnectPlanning,\n    removeErrorMessage,\n  ]);\n\n  // V1 send message function via WebSocket\n  // Falls back to REST API queue when WebSocket is not connected\n  const sendMessage = useCallback(\n    async (message: SendMessageRequest): Promise<SendMessageResult> => {\n      const currentMode = useConversationStore.getState().conversationMode;\n      const currentSocket =\n        currentMode === \"plan\" ? planningAgentSocket : mainSocket;\n\n      if (currentSocket?.readyState !== WebSocket.OPEN) {\n        // WebSocket not connected - queue message via REST API\n        // Message will be delivered automatically when conversation becomes ready\n        if (!conversationId) {\n          const error = new Error(\"No conversation ID available\");\n          setErrorMessage(error.message);\n          throw error;\n        }\n\n        try {\n          await new ConversationClient(getAgentServerClientOptions()).sendEvent(\n            conversationId,\n            {\n              role: \"user\",\n              content: message.content,\n            },\n            { run: true },\n          );\n          // Message queued successfully - it will be delivered when ready\n          // Return queued: true so caller knows not to show optimistic UI\n          return { queued: true };\n        } catch (error) {\n          const errorMessage =\n            error instanceof Error\n              ? error.message\n              : \"Failed to queue message for delivery\";\n          setErrorMessage(errorMessage);\n          throw error;\n        }\n      }\n\n      try {\n        // Send message through WebSocket as JSON with run: true so the\n        // agent loop starts automatically in async mode.\n        currentSocket.send(JSON.stringify({ ...message, run: true }));\n        return { queued: false };\n      } catch (error) {\n        const errorMessage =\n          error instanceof Error ? error.message : \"Failed to send message\";\n        setErrorMessage(errorMessage);\n        throw error;\n      }\n    },\n    [mainSocket, planningAgentSocket, setErrorMessage, conversationId],\n  );\n\n  // Track main socket state changes\n  useEffect(() => {\n    // Only process socket updates if we have a valid URL and socket\n    if (mainSocket && wsUrl) {\n      // Update state based on socket readyState\n      const updateState = () => {\n        switch (mainSocket.readyState) {\n          case WebSocket.CONNECTING:\n            setMainConnectionState(\"CONNECTING\");\n            break;\n          case WebSocket.OPEN:\n            setMainConnectionState(\"OPEN\");\n            break;\n          case WebSocket.CLOSING:\n            setMainConnectionState(\"CLOSING\");\n            break;\n          case WebSocket.CLOSED:\n            setMainConnectionState(\"CLOSED\");\n            break;\n          default:\n            setMainConnectionState(\"CLOSED\");\n            break;\n        }\n      };\n\n      updateState();\n    }\n  }, [mainSocket, wsUrl]);\n\n  // Track planning agent socket state changes\n  useEffect(() => {\n    // Only process socket updates if we have a valid URL and socket\n    if (planningAgentSocket && planningAgentWsUrl) {\n      // Update state based on socket readyState\n      const updateState = () => {\n        switch (planningAgentSocket.readyState) {\n          case WebSocket.CONNECTING:\n            setPlanningConnectionState(\"CONNECTING\");\n            break;\n          case WebSocket.OPEN:\n            setPlanningConnectionState(\"OPEN\");\n            break;\n          case WebSocket.CLOSING:\n            setPlanningConnectionState(\"CLOSING\");\n            break;\n          case WebSocket.CLOSED:\n            setPlanningConnectionState(\"CLOSED\");\n            break;\n          default:\n            setPlanningConnectionState(\"CLOSED\");\n            break;\n        }\n      };\n\n      updateState();\n    }\n  }, [planningAgentSocket, planningAgentWsUrl]);\n\n  const contextValue = useMemo(\n    () => ({ connectionState, sendMessage, isLoadingHistory, reconnect }),\n    [connectionState, sendMessage, isLoadingHistory, reconnect],\n  );\n\n  return (\n    <ConversationWebSocketContext.Provider value={contextValue}>\n      {children}\n    </ConversationWebSocketContext.Provider>\n  );\n}\n\nexport const useConversationWebSocket =\n  (): ConversationWebSocketContextType | null => {\n    const context = useContext(ConversationWebSocketContext);\n    // Return null instead of throwing when not in provider\n    // This allows the hook to be called conditionally based on conversation version\n    return context || null;\n  };\n"],"mappings":"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"}

package/dist/hooks/chat/use-model-interceptor.cjs

@@ -1,2 +1,2 @@
-require("../../_virtual/_rolldown/runtime.cjs");const e=require("../../node_modules/react-i18next/dist/es/useTranslation.cjs"),t=require("../../i18n/declaration.cjs"),n=require("../../utils/constants.cjs"),r=require("../query/query-keys.cjs"),i=require("../../node_modules/@tanstack/react-query/build/modern/QueryClientProvider.cjs"),a=require("../../utils/custom-toast-handlers.cjs"),o=require("../../contexts/active-backend-context.cjs"),s=require("../../stores/model-store.cjs"),c=require("../../api/profiles-service/profiles-service.api.cjs"),l=require("./model-command-event-anchor.cjs"),u=require("../mutation/use-switch-llm-profile-and-log.cjs");let d=require("react");var f=`${n.MODEL_COMMAND} `,p=(p,m)=>{let h=s.useModelStore(e=>e.show),g=i.useQueryClient(),{switchAndLog:_}=u.useSwitchLlmProfileAndLog(),{backend:v,orgId:y}=o.useActiveBackend(),{t:b}=e.useTranslation();return(0,d.useCallback)(e=>{let i=e.trim();if(!(i===`/model`||i.startsWith(f))){m(e);return}let o=i.slice(n.MODEL_COMMAND.length).trim();if(o){_(p??null,o);return}if(!p)return;let s=l.getLastRenderableEventId();g.fetchQuery({queryKey:[...r.LLM_PROFILES_QUERY_KEYS.all,v.id,y],queryFn:c.default.listProfiles,staleTime:0}).then(({profiles:e})=>h(p,s,e)).catch(e=>{let n=b(t.I18nKey.MODEL$LIST_FAILED);a.displayErrorToast(e instanceof Error&&e.message?e.message:n)})},[p,m,h,g,_,v.id,y,b])};exports.useModelInterceptor=p;
+require("../../_virtual/_rolldown/runtime.cjs");const e=require("../../node_modules/react-i18next/dist/es/useTranslation.cjs"),t=require("../../i18n/declaration.cjs"),n=require("../../utils/constants.cjs"),r=require("../query/query-keys.cjs"),i=require("../../node_modules/@tanstack/react-query/build/modern/QueryClientProvider.cjs"),a=require("../../utils/custom-toast-handlers.cjs"),o=require("../../contexts/active-backend-context.cjs"),s=require("../../api/profiles-service/profiles-service.api.cjs"),c=require("../../stores/model-store.cjs"),l=require("./model-command-event-anchor.cjs"),u=require("../mutation/use-switch-llm-profile-and-log.cjs");let d=require("react");var f=`${n.MODEL_COMMAND} `,p=(p,m)=>{let h=c.useModelStore(e=>e.show),g=i.useQueryClient(),{switchAndLog:_}=u.useSwitchLlmProfileAndLog(),{backend:v,orgId:y}=o.useActiveBackend(),{t:b}=e.useTranslation();return(0,d.useCallback)(e=>{let i=e.trim();if(!(i===`/model`||i.startsWith(f))){m(e);return}let o=i.slice(n.MODEL_COMMAND.length).trim();if(o){_(p??null,o);return}if(!p)return;let c=l.getLastRenderableEventId();g.fetchQuery({queryKey:[...r.LLM_PROFILES_QUERY_KEYS.all,v.id,y],queryFn:s.default.listProfiles,staleTime:0}).then(({profiles:e})=>h(p,c,e)).catch(e=>{let n=b(t.I18nKey.MODEL$LIST_FAILED);a.displayErrorToast(e instanceof Error&&e.message?e.message:n)})},[p,m,h,g,_,v.id,y,b])};exports.useModelInterceptor=p;
 //# sourceMappingURL=use-model-interceptor.cjs.map

package/dist/hooks/chat/use-model-interceptor.js

@@ -5,14 +5,14 @@ import { LLM_PROFILES_QUERY_KEYS as r } from "../query/query-keys.js";
 import { useQueryClient as i } from "../../node_modules/@tanstack/react-query/build/modern/QueryClientProvider.js";
 import { displayErrorToast as a } from "../../utils/custom-toast-handlers.js";
 import { useActiveBackend as o } from "../../contexts/active-backend-context.js";
-import { useModelStore as s } from "../../stores/model-store.js";
-import c from "../../api/profiles-service/profiles-service.api.js";
+import s from "../../api/profiles-service/profiles-service.api.js";
+import { useModelStore as c } from "../../stores/model-store.js";
 import { getLastRenderableEventId as l } from "./model-command-event-anchor.js";
 import { useSwitchLlmProfileAndLog as u } from "../mutation/use-switch-llm-profile-and-log.js";
 import { useCallback as d } from "react";
 //#region src/hooks/chat/use-model-interceptor.ts
 var f = `${n} `, p = (p, m) => {
-	let h = s((e) => e.show), g = i(), { switchAndLog: _ } = u(), { backend: v, orgId: y } = o(), { t: b } = e();
+	let h = c((e) => e.show), g = i(), { switchAndLog: _ } = u(), { backend: v, orgId: y } = o(), { t: b } = e();
 	return d((e) => {
 		let i = e.trim();
 		if (!(i === "/model" || i.startsWith(f))) {
@@ -25,16 +25,16 @@ var f = `${n} `, p = (p, m) => {
 			return;
 		}
 		if (!p) return;
-		let s = l();
+		let c = l();
 		g.fetchQuery({
 			queryKey: [
 				...r.all,
 				v.id,
 				y
 			],
-			queryFn: c.listProfiles,
+			queryFn: s.listProfiles,
 			staleTime: 0
-		}).then(({ profiles: e }) => h(p, s, e)).catch((e) => {
+		}).then(({ profiles: e }) => h(p, c, e)).catch((e) => {
 			let n = b(t.MODEL$LIST_FAILED);
 			a(e instanceof Error && e.message ? e.message : n);
 		});

package/dist/hooks/chat/use-slash-command.cjs

@@ -1,2 +1,2 @@
-require("../../_virtual/_rolldown/runtime.cjs");const e=require("../../utils/constants.cjs"),t=require("../../contexts/active-backend-context.cjs"),n=require("../query/use-conversation-skills.cjs"),r=require("../query/use-llm-profiles.cjs");let i=require("react");function a(e){let t=window.getSelection();if(!t||t.rangeCount===0)return-1;let n=t.getRangeAt(0),r=n.cloneRange();return r.selectNodeContents(e),r.setEnd(n.startContainer,n.startOffset),r.toString().length}var o=o=>{let{data:s,isLoading:c}=n.useConversationSkills(),l=t.useActiveBackend().backend.kind===`cloud`,{data:u,isLoading:d}=r.useLlmProfiles(),[f,p]=(0,i.useState)(!1),[m,h]=(0,i.useState)(``),[g,_]=(0,i.useState)(`command`),[v,y]=(0,i.useState)(0),b=(0,i.useMemo)(()=>{let t=e.BUILT_IN_COMMANDS.filter(e=>e.command===`/new`?l:!0);return c||!s||s.forEach(e=>{let n=(e.triggers||[]).filter(e=>e.startsWith(`/`));n.length>0?n.forEach(n=>{t.push({skill:e,command:n})}):e.type===`agentskills`&&t.push({skill:e,command:`/${e.name}`})}),t},[s,c,l]),x=(0,i.useMemo)(()=>(u?.profiles??[]).map(t=>{let n=`${e.MODEL_COMMAND} ${t.name}`;return{command:n,skill:{name:t.name,type:`agentskills`,content:t.model?`Switch to ${t.model}`:`Switch to this LLM profile`,triggers:[n]}}}),[u?.profiles]),S=(0,i.useMemo)(()=>{let e=g===`model-profile`?x:b;if(!m)return e;let t=m.toLowerCase();return e.filter(e=>e.command.toLowerCase().includes(t)||e.skill.name.toLowerCase().includes(t)||e.skill.content?.toLowerCase().includes(t))},[g,x,b,m]),C=(0,i.useRef)(f);C.current=f;let w=(0,i.useRef)(S);w.current=S;let T=(0,i.useRef)(v);T.current=v,(0,i.useEffect)(()=>{y(0)},[m]);let E=(0,i.useRef)(null),D=(0,i.useCallback)(()=>{let e=o.current;if(!e)return null;let t=(e.innerText||``).replace(/[\n\r]+$/,``),n=a(e);if(n<0)return null;let r=t.slice(0,n),i=r.match(/(^|\s)(\/model(?:\s+\S*)?)$/);if(i){let e=i[2],a=r.length-e.length,o=t.slice(n).match(/^\S*/),s=n+(o?o[0].length:0);return{kind:`model-profile`,text:e.replace(/^\/model(?:\s+)?/,``),start:a,end:s}}let s=r.match(/(^|\s)(\/\S*)$/);if(!s)return null;let c=s[2],l=r.length-c.length,u=t.slice(n).match(/^\S*/),d=n+(u?u[0].length:0);return{kind:`command`,text:c.slice(1),start:l,end:d}},[o]),O=(0,i.useCallback)(()=>{let e=D(),t=e?.kind===`model-profile`?x.length>0||d:b.length>0;e!==null&&t?(_(e.kind),h(e.text),E.current={start:e.start,end:e.end},p(!0)):(p(!1),h(``),_(`command`),E.current=null)},[D,d,x.length,b.length]),k=(0,i.useCallback)(e=>{let t=o.current;if(!t)return;let n=E.current,r=(t.innerText||``).replace(/[\n\r]+$/,``),i=`${e.command} `;if(n){t.textContent=r.slice(0,n.start)+i+r.slice(n.end);let e=n.start+i.length,a=t.firstChild;if(a){let t=document.createRange(),n=window.getSelection(),r=Math.min(e,a.textContent.length);t.setStart(a,r),t.collapse(!0),n?.removeAllRanges(),n?.addRange(t)}}else{t.textContent=i;let e=document.createRange(),n=window.getSelection();e.selectNodeContents(t),e.collapse(!1),n?.removeAllRanges(),n?.addRange(e)}p(!1),h(``),_(`command`),y(0),E.current=null,t.dispatchEvent(new InputEvent(`input`,{bubbles:!0})),t.focus()},[o]);return{isMenuOpen:f,filteredItems:S,selectedIndex:v,updateSlashMenu:O,selectItem:k,handleSlashKeyDown:(0,i.useCallback)(e=>{let t=w.current;if(!C.current||t.length===0)return!1;switch(e.key){case`ArrowDown`:return e.preventDefault(),y(e=>e<t.length-1?e+1:0),!0;case`ArrowUp`:return e.preventDefault(),y(e=>e>0?e-1:t.length-1),!0;case`Enter`:case`Tab`:{let n=t[T.current];return n?(e.preventDefault(),k(n),!0):!1}case`Escape`:return e.preventDefault(),p(!1),!0;case`ArrowLeft`:case`ArrowRight`:case`Home`:case`End`:return p(!1),!1;default:return!1}},[k]),closeMenu:(0,i.useCallback)(()=>p(!1),[])}};exports.useSlashCommand=o;
+require("../../_virtual/_rolldown/runtime.cjs");const e=require("../../utils/constants.cjs"),t=require("../../contexts/active-backend-context.cjs"),n=require("../../utils/format-model-name.cjs"),r=require("../query/use-conversation-skills.cjs"),i=require("../query/use-llm-profiles.cjs");let a=require("react");function o(e){let t=window.getSelection();if(!t||t.rangeCount===0)return-1;let n=t.getRangeAt(0),r=n.cloneRange();return r.selectNodeContents(e),r.setEnd(n.startContainer,n.startOffset),r.toString().length}var s=s=>{let{data:c,isLoading:l}=r.useConversationSkills(),u=t.useActiveBackend().backend.kind===`cloud`,{data:d,isLoading:f}=i.useLlmProfiles(),[p,m]=(0,a.useState)(!1),[h,g]=(0,a.useState)(``),[_,v]=(0,a.useState)(`command`),[y,b]=(0,a.useState)(0),x=(0,a.useMemo)(()=>{let t=e.BUILT_IN_COMMANDS.filter(e=>e.command===`/new`?u:!0);return l||!c||c.forEach(e=>{let n=(e.triggers||[]).filter(e=>e.startsWith(`/`));n.length>0?n.forEach(n=>{t.push({skill:e,command:n})}):e.type===`agentskills`&&t.push({skill:e,command:`/${e.name}`})}),t},[c,l,u]),S=(0,a.useMemo)(()=>(d?.profiles??[]).map(t=>{let r=`${e.MODEL_COMMAND} ${t.name}`;return{command:r,skill:{name:t.name,type:`agentskills`,content:t.model?`Switch to ${n.formatModelNameForDisplay(t.model)}`:`Switch to this LLM profile`,triggers:[r]}}}),[d?.profiles]),C=(0,a.useMemo)(()=>{let e=_===`model-profile`?S:x;if(!h)return e;let t=h.toLowerCase();return e.filter(e=>e.command.toLowerCase().includes(t)||e.skill.name.toLowerCase().includes(t)||e.skill.content?.toLowerCase().includes(t))},[_,S,x,h]),w=(0,a.useRef)(p);w.current=p;let T=(0,a.useRef)(C);T.current=C;let E=(0,a.useRef)(y);E.current=y,(0,a.useEffect)(()=>{b(0)},[h]);let D=(0,a.useRef)(null),O=(0,a.useCallback)(()=>{let e=s.current;if(!e)return null;let t=(e.innerText||``).replace(/[\n\r]+$/,``),n=o(e);if(n<0)return null;let r=t.slice(0,n),i=r.match(/(^|\s)(\/model(?:\s+\S*)?)$/);if(i){let e=i[2],a=r.length-e.length,o=t.slice(n).match(/^\S*/),s=n+(o?o[0].length:0);return{kind:`model-profile`,text:e.replace(/^\/model(?:\s+)?/,``),start:a,end:s}}let a=r.match(/(^|\s)(\/\S*)$/);if(!a)return null;let c=a[2],l=r.length-c.length,u=t.slice(n).match(/^\S*/),d=n+(u?u[0].length:0);return{kind:`command`,text:c.slice(1),start:l,end:d}},[s]),k=(0,a.useCallback)(()=>{let e=O(),t=e?.kind===`model-profile`?S.length>0||f:x.length>0;e!==null&&t?(v(e.kind),g(e.text),D.current={start:e.start,end:e.end},m(!0)):(m(!1),g(``),v(`command`),D.current=null)},[O,f,S.length,x.length]),A=(0,a.useCallback)(e=>{let t=s.current;if(!t)return;let n=D.current,r=(t.innerText||``).replace(/[\n\r]+$/,``),i=`${e.command} `;if(n){t.textContent=r.slice(0,n.start)+i+r.slice(n.end);let e=n.start+i.length,a=t.firstChild;if(a){let t=document.createRange(),n=window.getSelection(),r=Math.min(e,a.textContent.length);t.setStart(a,r),t.collapse(!0),n?.removeAllRanges(),n?.addRange(t)}}else{t.textContent=i;let e=document.createRange(),n=window.getSelection();e.selectNodeContents(t),e.collapse(!1),n?.removeAllRanges(),n?.addRange(e)}m(!1),g(``),v(`command`),b(0),D.current=null,t.dispatchEvent(new InputEvent(`input`,{bubbles:!0})),t.focus()},[s]);return{isMenuOpen:p,filteredItems:C,selectedIndex:y,updateSlashMenu:k,selectItem:A,handleSlashKeyDown:(0,a.useCallback)(e=>{let t=T.current;if(!w.current||t.length===0)return!1;switch(e.key){case`ArrowDown`:return e.preventDefault(),b(e=>e<t.length-1?e+1:0),!0;case`ArrowUp`:return e.preventDefault(),b(e=>e>0?e-1:t.length-1),!0;case`Enter`:case`Tab`:{let n=t[E.current];return n?(e.preventDefault(),A(n),!0):!1}case`Escape`:return e.preventDefault(),m(!1),!0;case`ArrowLeft`:case`ArrowRight`:case`Home`:case`End`:return m(!1),!1;default:return!1}},[A]),closeMenu:(0,a.useCallback)(()=>m(!1),[])}};exports.useSlashCommand=s;
 //# sourceMappingURL=use-slash-command.cjs.map

package/dist/hooks/chat/use-slash-command.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"use-slash-command.cjs","names":[],"sources":["../../../src/hooks/chat/use-slash-command.ts"],"sourcesContent":["import { useState, useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { useConversationSkills } from \"#/hooks/query/use-conversation-skills\";\nimport { SkillInfo } from \"#/types/settings\";\nimport { Microagent } from \"#/api/open-hands.types\";\nimport { BUILT_IN_COMMANDS, MODEL_COMMAND } from \"#/utils/constants\";\nimport { useActiveBackend } from \"#/contexts/active-backend-context\";\nimport { useLlmProfiles } from \"#/hooks/query/use-llm-profiles\";\n\nexport type SlashCommandSkill = SkillInfo | Microagent;\n\nexport interface SlashCommandItem {\n  skill: SlashCommandSkill;\n  /** The slash command string, e.g. \"/random-number\" */\n  command: string;\n}\n\ntype SlashCompletionKind = \"command\" | \"model-profile\";\n\n/** Get the cursor's character offset within a contentEditable element. */\nfunction getCursorOffset(element: HTMLElement): number {\n  const selection = window.getSelection();\n  if (!selection || selection.rangeCount === 0) return -1;\n  const range = selection.getRangeAt(0);\n  const preRange = range.cloneRange();\n  preRange.selectNodeContents(element);\n  preRange.setEnd(range.startContainer, range.startOffset);\n  return preRange.toString().length;\n}\n\n/**\n * Hook for managing slash command autocomplete in the chat input.\n * Detects when user types \"/\" and provides filtered skill suggestions.\n * Only skills with explicit \"/\" triggers (TaskTrigger) appear in the menu.\n */\nexport const useSlashCommand = (\n  chatInputRef: React.RefObject<HTMLDivElement | null>,\n) => {\n  // Scope the skill catalog to this conversation's attached workspace so the\n  // slash menu lists the same project skills that were loaded into it.\n  const { data: skills, isLoading: isSkillsLoading } = useConversationSkills();\n  const isCloud = useActiveBackend().backend.kind === \"cloud\";\n  const { data: profilesData, isLoading: isProfilesLoading } = useLlmProfiles();\n  const [isMenuOpen, setIsMenuOpen] = useState(false);\n  const [filterText, setFilterText] = useState(\"\");\n  const [completionKind, setCompletionKind] =\n    useState<SlashCompletionKind>(\"command\");\n  const [selectedIndex, setSelectedIndex] = useState(0);\n\n  // Build slash command items from built-in commands + skills:\n  // - Built-in commands (like /new) are included for V1 conversations\n  // - /new is cloud-only — local backends don't surface it\n  // - /model lists/switches LLM profiles; both local and cloud support them\n  // - Skills with explicit \"/\" triggers use those triggers\n  // - AgentSkills without \"/\" triggers get a derived \"/<name>\" command\n  const slashItems = useMemo(() => {\n    const items: SlashCommandItem[] = BUILT_IN_COMMANDS.filter((cmd) => {\n      if (cmd.command === \"/new\") return isCloud;\n      return true;\n    });\n\n    // Wait for skills to finish initial load so all commands appear together\n    if (isSkillsLoading) return items;\n\n    if (!skills) return items;\n    skills.forEach((skill) => {\n      const triggers = skill.triggers || [];\n      const slashTriggers = triggers.filter((t) => t.startsWith(\"/\"));\n\n      if (slashTriggers.length > 0) {\n        // Skill has explicit slash triggers\n        slashTriggers.forEach((trigger) => {\n          items.push({ skill, command: trigger });\n        });\n      } else if (skill.type === \"agentskills\") {\n        // AgentSkills without slash triggers get a derived command\n        items.push({ skill, command: `/${skill.name}` });\n      }\n    });\n    return items;\n  }, [skills, isSkillsLoading, isCloud]);\n\n  const modelProfileItems = useMemo<SlashCommandItem[]>(() => {\n    return (profilesData?.profiles ?? []).map((profile) => {\n      const command = `${MODEL_COMMAND} ${profile.name}`;\n      return {\n        command,\n        skill: {\n          name: profile.name,\n          type: \"agentskills\",\n          content: profile.model\n            ? `Switch to ${profile.model}`\n            : \"Switch to this LLM profile\",\n          triggers: [command],\n        },\n      };\n    });\n  }, [profilesData?.profiles]);\n\n  // Filter items based on user input after \"/\"\n  const filteredItems = useMemo(() => {\n    const sourceItems =\n      completionKind === \"model-profile\" ? modelProfileItems : slashItems;\n    if (!filterText) return sourceItems;\n    const lower = filterText.toLowerCase();\n    return sourceItems.filter(\n      (item) =>\n        item.command.toLowerCase().includes(lower) ||\n        item.skill.name.toLowerCase().includes(lower) ||\n        item.skill.content?.toLowerCase().includes(lower),\n    );\n  }, [completionKind, modelProfileItems, slashItems, filterText]);\n\n  // Keep refs in sync so handleSlashKeyDown always reads the latest values,\n  // avoiding stale closures from React's batched state updates.\n  const isMenuOpenRef = useRef(isMenuOpen);\n  isMenuOpenRef.current = isMenuOpen;\n  const filteredItemsRef = useRef(filteredItems);\n  filteredItemsRef.current = filteredItems;\n  const selectedIndexRef = useRef(selectedIndex);\n  selectedIndexRef.current = selectedIndex;\n\n  // Reset selected index when the filter text changes\n  useEffect(() => {\n    setSelectedIndex(0);\n  }, [filterText]);\n\n  // Track the character range of the current slash word so selectItem can\n  // replace only that portion instead of wiping the entire input.\n  const slashRangeRef = useRef<{ start: number; end: number } | null>(null);\n\n  // Detect a slash word at the cursor position.\n  // Returns the filter text (characters after \"/\") and the range of the\n  // slash word within the full input text, or null if no slash word found.\n  const getSlashText = useCallback((): {\n    kind: SlashCompletionKind;\n    text: string;\n    start: number;\n    end: number;\n  } | null => {\n    const element = chatInputRef.current;\n    if (!element) return null;\n\n    // Strip trailing newlines that contentEditable can produce, but preserve\n    // spaces so \"/command \" (after selection) won't re-trigger the menu.\n    const text = (element.innerText || \"\").replace(/[\\n\\r]+$/, \"\");\n    const cursor = getCursorOffset(element);\n    if (cursor < 0) return null;\n\n    const textBeforeCursor = text.slice(0, cursor);\n\n    const modelMatch = textBeforeCursor.match(/(^|\\s)(\\/model(?:\\s+\\S*)?)$/);\n    if (modelMatch) {\n      const modelCommand = modelMatch[2];\n      const start = textBeforeCursor.length - modelCommand.length;\n      const afterCursor = text.slice(cursor);\n      const trailing = afterCursor.match(/^\\S*/);\n      const end = cursor + (trailing ? trailing[0].length : 0);\n\n      return {\n        kind: \"model-profile\",\n        text: modelCommand.replace(/^\\/model(?:\\s+)?/, \"\"),\n        start,\n        end,\n      };\n    }\n\n    // Match a \"/\" preceded by whitespace or at position 0, followed by\n    // non-whitespace characters, ending right at the cursor.\n    const match = textBeforeCursor.match(/(^|\\s)(\\/\\S*)$/);\n    if (!match) return null;\n\n    const slashWord = match[2]; // e.g. \"/hel\"\n    const start = textBeforeCursor.length - slashWord.length;\n    // The end of the slash word extends past the cursor to include any\n    // contiguous non-whitespace characters (covers the case where the\n    // cursor sits in the middle of a word).\n    const afterCursor = text.slice(cursor);\n    const trailing = afterCursor.match(/^\\S*/);\n    const end = cursor + (trailing ? trailing[0].length : 0);\n\n    return { kind: \"command\", text: slashWord.slice(1), start, end }; // strip leading \"/\"\n  }, [chatInputRef]);\n\n  // Update the menu state based on current input\n  const updateSlashMenu = useCallback(() => {\n    const result = getSlashText();\n    const hasItems =\n      result?.kind === \"model-profile\"\n        ? modelProfileItems.length > 0 || isProfilesLoading\n        : slashItems.length > 0;\n\n    if (result !== null && hasItems) {\n      setCompletionKind(result.kind);\n      setFilterText(result.text);\n      slashRangeRef.current = { start: result.start, end: result.end };\n      setIsMenuOpen(true);\n    } else {\n      setIsMenuOpen(false);\n      setFilterText(\"\");\n      setCompletionKind(\"command\");\n      slashRangeRef.current = null;\n    }\n  }, [\n    getSlashText,\n    isProfilesLoading,\n    modelProfileItems.length,\n    slashItems.length,\n  ]);\n\n  // Select an item and replace only the slash word with the command\n  const selectItem = useCallback(\n    (item: SlashCommandItem) => {\n      const element = chatInputRef.current;\n      if (!element) return;\n\n      const slashRange = slashRangeRef.current;\n      const currentText = (element.innerText || \"\").replace(/[\\n\\r]+$/, \"\");\n      const replacement = `${item.command} `;\n\n      if (slashRange) {\n        // Splice the command into the text, replacing only the slash word\n        element.textContent =\n          currentText.slice(0, slashRange.start) +\n          replacement +\n          currentText.slice(slashRange.end);\n\n        // Position cursor right after the inserted command + space\n        const cursorPos = slashRange.start + replacement.length;\n        const textNode = element.firstChild;\n        if (textNode) {\n          const range = document.createRange();\n          const sel = window.getSelection();\n          const offset = Math.min(cursorPos, textNode.textContent!.length);\n          range.setStart(textNode, offset);\n          range.collapse(true);\n          sel?.removeAllRanges();\n          sel?.addRange(range);\n        }\n      } else {\n        // Fallback: replace everything (e.g. if range tracking failed)\n        element.textContent = replacement;\n        const range = document.createRange();\n        const sel = window.getSelection();\n        range.selectNodeContents(element);\n        range.collapse(false);\n        sel?.removeAllRanges();\n        sel?.addRange(range);\n      }\n\n      setIsMenuOpen(false);\n      setFilterText(\"\");\n      setCompletionKind(\"command\");\n      setSelectedIndex(0);\n      slashRangeRef.current = null;\n\n      // Trigger a native InputEvent so React's onInput fires (for smartResize etc.)\n      element.dispatchEvent(new InputEvent(\"input\", { bubbles: true }));\n\n      // Restore focus so keyboard events (Enter to submit) work after selection\n      element.focus();\n    },\n    [chatInputRef],\n  );\n\n  // Handle keyboard navigation in the menu.\n  // Uses refs to always read the latest state, avoiding stale closures.\n  const handleSlashKeyDown = useCallback(\n    (e: React.KeyboardEvent): boolean => {\n      const items = filteredItemsRef.current;\n      if (!isMenuOpenRef.current || items.length === 0) return false;\n\n      switch (e.key) {\n        case \"ArrowDown\":\n          e.preventDefault();\n          setSelectedIndex((prev) => (prev < items.length - 1 ? prev + 1 : 0));\n          return true;\n        case \"ArrowUp\":\n          e.preventDefault();\n          setSelectedIndex((prev) => (prev > 0 ? prev - 1 : items.length - 1));\n          return true;\n        case \"Enter\":\n        case \"Tab\": {\n          const item = items[selectedIndexRef.current];\n          if (!item) return false;\n          e.preventDefault();\n          selectItem(item);\n          return true;\n        }\n        case \"Escape\":\n          e.preventDefault();\n          setIsMenuOpen(false);\n          return true;\n        // Cursor-movement keys: close the menu to avoid acting on a stale\n        // slash-word range, but don't consume the event so the cursor moves.\n        case \"ArrowLeft\":\n        case \"ArrowRight\":\n        case \"Home\":\n        case \"End\":\n          setIsMenuOpen(false);\n          return false;\n        default:\n          return false;\n      }\n    },\n    [selectItem],\n  );\n\n  const closeMenu = useCallback(() => setIsMenuOpen(false), []);\n\n  return {\n    isMenuOpen,\n    filteredItems,\n    selectedIndex,\n    updateSlashMenu,\n    selectItem,\n    handleSlashKeyDown,\n    closeMenu,\n  };\n};\n"],"mappings":"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"}
+{"version":3,"file":"use-slash-command.cjs","names":[],"sources":["../../../src/hooks/chat/use-slash-command.ts"],"sourcesContent":["import { useState, useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { useConversationSkills } from \"#/hooks/query/use-conversation-skills\";\nimport { SkillInfo } from \"#/types/settings\";\nimport { Microagent } from \"#/api/open-hands.types\";\nimport { BUILT_IN_COMMANDS, MODEL_COMMAND } from \"#/utils/constants\";\nimport { useActiveBackend } from \"#/contexts/active-backend-context\";\nimport { useLlmProfiles } from \"#/hooks/query/use-llm-profiles\";\nimport { formatModelNameForDisplay } from \"#/utils/format-model-name\";\n\nexport type SlashCommandSkill = SkillInfo | Microagent;\n\nexport interface SlashCommandItem {\n  skill: SlashCommandSkill;\n  /** The slash command string, e.g. \"/random-number\" */\n  command: string;\n}\n\ntype SlashCompletionKind = \"command\" | \"model-profile\";\n\n/** Get the cursor's character offset within a contentEditable element. */\nfunction getCursorOffset(element: HTMLElement): number {\n  const selection = window.getSelection();\n  if (!selection || selection.rangeCount === 0) return -1;\n  const range = selection.getRangeAt(0);\n  const preRange = range.cloneRange();\n  preRange.selectNodeContents(element);\n  preRange.setEnd(range.startContainer, range.startOffset);\n  return preRange.toString().length;\n}\n\n/**\n * Hook for managing slash command autocomplete in the chat input.\n * Detects when user types \"/\" and provides filtered skill suggestions.\n * Only skills with explicit \"/\" triggers (TaskTrigger) appear in the menu.\n */\nexport const useSlashCommand = (\n  chatInputRef: React.RefObject<HTMLDivElement | null>,\n) => {\n  // Scope the skill catalog to this conversation's attached workspace so the\n  // slash menu lists the same project skills that were loaded into it.\n  const { data: skills, isLoading: isSkillsLoading } = useConversationSkills();\n  const isCloud = useActiveBackend().backend.kind === \"cloud\";\n  const { data: profilesData, isLoading: isProfilesLoading } = useLlmProfiles();\n  const [isMenuOpen, setIsMenuOpen] = useState(false);\n  const [filterText, setFilterText] = useState(\"\");\n  const [completionKind, setCompletionKind] =\n    useState<SlashCompletionKind>(\"command\");\n  const [selectedIndex, setSelectedIndex] = useState(0);\n\n  // Build slash command items from built-in commands + skills:\n  // - Built-in commands (like /new) are included for V1 conversations\n  // - /new is cloud-only — local backends don't surface it\n  // - /model lists/switches LLM profiles; both local and cloud support them\n  // - Skills with explicit \"/\" triggers use those triggers\n  // - AgentSkills without \"/\" triggers get a derived \"/<name>\" command\n  const slashItems = useMemo(() => {\n    const items: SlashCommandItem[] = BUILT_IN_COMMANDS.filter((cmd) => {\n      if (cmd.command === \"/new\") return isCloud;\n      return true;\n    });\n\n    // Wait for skills to finish initial load so all commands appear together\n    if (isSkillsLoading) return items;\n\n    if (!skills) return items;\n    skills.forEach((skill) => {\n      const triggers = skill.triggers || [];\n      const slashTriggers = triggers.filter((t) => t.startsWith(\"/\"));\n\n      if (slashTriggers.length > 0) {\n        // Skill has explicit slash triggers\n        slashTriggers.forEach((trigger) => {\n          items.push({ skill, command: trigger });\n        });\n      } else if (skill.type === \"agentskills\") {\n        // AgentSkills without slash triggers get a derived command\n        items.push({ skill, command: `/${skill.name}` });\n      }\n    });\n    return items;\n  }, [skills, isSkillsLoading, isCloud]);\n\n  const modelProfileItems = useMemo<SlashCommandItem[]>(() => {\n    return (profilesData?.profiles ?? []).map((profile) => {\n      const command = `${MODEL_COMMAND} ${profile.name}`;\n      return {\n        command,\n        skill: {\n          name: profile.name,\n          type: \"agentskills\",\n          content: profile.model\n            ? `Switch to ${formatModelNameForDisplay(profile.model)}`\n            : \"Switch to this LLM profile\",\n          triggers: [command],\n        },\n      };\n    });\n  }, [profilesData?.profiles]);\n\n  // Filter items based on user input after \"/\"\n  const filteredItems = useMemo(() => {\n    const sourceItems =\n      completionKind === \"model-profile\" ? modelProfileItems : slashItems;\n    if (!filterText) return sourceItems;\n    const lower = filterText.toLowerCase();\n    return sourceItems.filter(\n      (item) =>\n        item.command.toLowerCase().includes(lower) ||\n        item.skill.name.toLowerCase().includes(lower) ||\n        item.skill.content?.toLowerCase().includes(lower),\n    );\n  }, [completionKind, modelProfileItems, slashItems, filterText]);\n\n  // Keep refs in sync so handleSlashKeyDown always reads the latest values,\n  // avoiding stale closures from React's batched state updates.\n  const isMenuOpenRef = useRef(isMenuOpen);\n  isMenuOpenRef.current = isMenuOpen;\n  const filteredItemsRef = useRef(filteredItems);\n  filteredItemsRef.current = filteredItems;\n  const selectedIndexRef = useRef(selectedIndex);\n  selectedIndexRef.current = selectedIndex;\n\n  // Reset selected index when the filter text changes\n  useEffect(() => {\n    setSelectedIndex(0);\n  }, [filterText]);\n\n  // Track the character range of the current slash word so selectItem can\n  // replace only that portion instead of wiping the entire input.\n  const slashRangeRef = useRef<{ start: number; end: number } | null>(null);\n\n  // Detect a slash word at the cursor position.\n  // Returns the filter text (characters after \"/\") and the range of the\n  // slash word within the full input text, or null if no slash word found.\n  const getSlashText = useCallback((): {\n    kind: SlashCompletionKind;\n    text: string;\n    start: number;\n    end: number;\n  } | null => {\n    const element = chatInputRef.current;\n    if (!element) return null;\n\n    // Strip trailing newlines that contentEditable can produce, but preserve\n    // spaces so \"/command \" (after selection) won't re-trigger the menu.\n    const text = (element.innerText || \"\").replace(/[\\n\\r]+$/, \"\");\n    const cursor = getCursorOffset(element);\n    if (cursor < 0) return null;\n\n    const textBeforeCursor = text.slice(0, cursor);\n\n    const modelMatch = textBeforeCursor.match(/(^|\\s)(\\/model(?:\\s+\\S*)?)$/);\n    if (modelMatch) {\n      const modelCommand = modelMatch[2];\n      const start = textBeforeCursor.length - modelCommand.length;\n      const afterCursor = text.slice(cursor);\n      const trailing = afterCursor.match(/^\\S*/);\n      const end = cursor + (trailing ? trailing[0].length : 0);\n\n      return {\n        kind: \"model-profile\",\n        text: modelCommand.replace(/^\\/model(?:\\s+)?/, \"\"),\n        start,\n        end,\n      };\n    }\n\n    // Match a \"/\" preceded by whitespace or at position 0, followed by\n    // non-whitespace characters, ending right at the cursor.\n    const match = textBeforeCursor.match(/(^|\\s)(\\/\\S*)$/);\n    if (!match) return null;\n\n    const slashWord = match[2]; // e.g. \"/hel\"\n    const start = textBeforeCursor.length - slashWord.length;\n    // The end of the slash word extends past the cursor to include any\n    // contiguous non-whitespace characters (covers the case where the\n    // cursor sits in the middle of a word).\n    const afterCursor = text.slice(cursor);\n    const trailing = afterCursor.match(/^\\S*/);\n    const end = cursor + (trailing ? trailing[0].length : 0);\n\n    return { kind: \"command\", text: slashWord.slice(1), start, end }; // strip leading \"/\"\n  }, [chatInputRef]);\n\n  // Update the menu state based on current input\n  const updateSlashMenu = useCallback(() => {\n    const result = getSlashText();\n    const hasItems =\n      result?.kind === \"model-profile\"\n        ? modelProfileItems.length > 0 || isProfilesLoading\n        : slashItems.length > 0;\n\n    if (result !== null && hasItems) {\n      setCompletionKind(result.kind);\n      setFilterText(result.text);\n      slashRangeRef.current = { start: result.start, end: result.end };\n      setIsMenuOpen(true);\n    } else {\n      setIsMenuOpen(false);\n      setFilterText(\"\");\n      setCompletionKind(\"command\");\n      slashRangeRef.current = null;\n    }\n  }, [\n    getSlashText,\n    isProfilesLoading,\n    modelProfileItems.length,\n    slashItems.length,\n  ]);\n\n  // Select an item and replace only the slash word with the command\n  const selectItem = useCallback(\n    (item: SlashCommandItem) => {\n      const element = chatInputRef.current;\n      if (!element) return;\n\n      const slashRange = slashRangeRef.current;\n      const currentText = (element.innerText || \"\").replace(/[\\n\\r]+$/, \"\");\n      const replacement = `${item.command} `;\n\n      if (slashRange) {\n        // Splice the command into the text, replacing only the slash word\n        element.textContent =\n          currentText.slice(0, slashRange.start) +\n          replacement +\n          currentText.slice(slashRange.end);\n\n        // Position cursor right after the inserted command + space\n        const cursorPos = slashRange.start + replacement.length;\n        const textNode = element.firstChild;\n        if (textNode) {\n          const range = document.createRange();\n          const sel = window.getSelection();\n          const offset = Math.min(cursorPos, textNode.textContent!.length);\n          range.setStart(textNode, offset);\n          range.collapse(true);\n          sel?.removeAllRanges();\n          sel?.addRange(range);\n        }\n      } else {\n        // Fallback: replace everything (e.g. if range tracking failed)\n        element.textContent = replacement;\n        const range = document.createRange();\n        const sel = window.getSelection();\n        range.selectNodeContents(element);\n        range.collapse(false);\n        sel?.removeAllRanges();\n        sel?.addRange(range);\n      }\n\n      setIsMenuOpen(false);\n      setFilterText(\"\");\n      setCompletionKind(\"command\");\n      setSelectedIndex(0);\n      slashRangeRef.current = null;\n\n      // Trigger a native InputEvent so React's onInput fires (for smartResize etc.)\n      element.dispatchEvent(new InputEvent(\"input\", { bubbles: true }));\n\n      // Restore focus so keyboard events (Enter to submit) work after selection\n      element.focus();\n    },\n    [chatInputRef],\n  );\n\n  // Handle keyboard navigation in the menu.\n  // Uses refs to always read the latest state, avoiding stale closures.\n  const handleSlashKeyDown = useCallback(\n    (e: React.KeyboardEvent): boolean => {\n      const items = filteredItemsRef.current;\n      if (!isMenuOpenRef.current || items.length === 0) return false;\n\n      switch (e.key) {\n        case \"ArrowDown\":\n          e.preventDefault();\n          setSelectedIndex((prev) => (prev < items.length - 1 ? prev + 1 : 0));\n          return true;\n        case \"ArrowUp\":\n          e.preventDefault();\n          setSelectedIndex((prev) => (prev > 0 ? prev - 1 : items.length - 1));\n          return true;\n        case \"Enter\":\n        case \"Tab\": {\n          const item = items[selectedIndexRef.current];\n          if (!item) return false;\n          e.preventDefault();\n          selectItem(item);\n          return true;\n        }\n        case \"Escape\":\n          e.preventDefault();\n          setIsMenuOpen(false);\n          return true;\n        // Cursor-movement keys: close the menu to avoid acting on a stale\n        // slash-word range, but don't consume the event so the cursor moves.\n        case \"ArrowLeft\":\n        case \"ArrowRight\":\n        case \"Home\":\n        case \"End\":\n          setIsMenuOpen(false);\n          return false;\n        default:\n          return false;\n      }\n    },\n    [selectItem],\n  );\n\n  const closeMenu = useCallback(() => setIsMenuOpen(false), []);\n\n  return {\n    isMenuOpen,\n    filteredItems,\n    selectedIndex,\n    updateSlashMenu,\n    selectItem,\n    handleSlashKeyDown,\n    closeMenu,\n  };\n};\n"],"mappings":"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"}

package/dist/hooks/chat/use-slash-command.js

@@ -1,19 +1,20 @@
 import { BUILT_IN_COMMANDS as e, MODEL_COMMAND as t } from "../../utils/constants.js";
 import { useActiveBackend as n } from "../../contexts/active-backend-context.js";
-import { useConversationSkills as r } from "../query/use-conversation-skills.js";
-import { useLlmProfiles as i } from "../query/use-llm-profiles.js";
-import { useCallback as a, useEffect as o, useMemo as s, useRef as c, useState as l } from "react";
+import { formatModelNameForDisplay as r } from "../../utils/format-model-name.js";
+import { useConversationSkills as i } from "../query/use-conversation-skills.js";
+import { useLlmProfiles as a } from "../query/use-llm-profiles.js";
+import { useCallback as o, useEffect as s, useMemo as c, useRef as l, useState as u } from "react";
 //#region src/hooks/chat/use-slash-command.ts
-function u(e) {
+function d(e) {
 	let t = window.getSelection();
 	if (!t || t.rangeCount === 0) return -1;
 	let n = t.getRangeAt(0), r = n.cloneRange();
 	return r.selectNodeContents(e), r.setEnd(n.startContainer, n.startOffset), r.toString().length;
 }
-var d = (d) => {
-	let { data: f, isLoading: p } = r(), m = n().backend.kind === "cloud", { data: h, isLoading: g } = i(), [_, v] = l(!1), [y, b] = l(""), [x, S] = l("command"), [C, w] = l(0), T = s(() => {
-		let t = e.filter((e) => e.command === "/new" ? m : !0);
-		return p || !f || f.forEach((e) => {
+var f = (f) => {
+	let { data: p, isLoading: m } = i(), h = n().backend.kind === "cloud", { data: g, isLoading: _ } = a(), [v, y] = u(!1), [b, x] = u(""), [S, C] = u("command"), [w, T] = u(0), E = c(() => {
+		let t = e.filter((e) => e.command === "/new" ? h : !0);
+		return m || !p || p.forEach((e) => {
 			let n = (e.triggers || []).filter((e) => e.startsWith("/"));
 			n.length > 0 ? n.forEach((n) => {
 				t.push({
@@ -26,42 +27,42 @@ var d = (d) => {
 			});
 		}), t;
 	}, [
-		f,
 		p,
-		m
-	]), E = s(() => (h?.profiles ?? []).map((e) => {
+		m,
+		h
+	]), D = c(() => (g?.profiles ?? []).map((e) => {
 		let n = `${t} ${e.name}`;
 		return {
 			command: n,
 			skill: {
 				name: e.name,
 				type: "agentskills",
-				content: e.model ? `Switch to ${e.model}` : "Switch to this LLM profile",
+				content: e.model ? `Switch to ${r(e.model)}` : "Switch to this LLM profile",
 				triggers: [n]
 			}
 		};
-	}), [h?.profiles]), D = s(() => {
-		let e = x === "model-profile" ? E : T;
-		if (!y) return e;
-		let t = y.toLowerCase();
+	}), [g?.profiles]), O = c(() => {
+		let e = S === "model-profile" ? D : E;
+		if (!b) return e;
+		let t = b.toLowerCase();
 		return e.filter((e) => e.command.toLowerCase().includes(t) || e.skill.name.toLowerCase().includes(t) || e.skill.content?.toLowerCase().includes(t));
 	}, [
-		x,
+		S,
+		D,
 		E,
-		T,
-		y
-	]), O = c(_);
-	O.current = _;
-	let k = c(D);
-	k.current = D;
-	let A = c(C);
-	A.current = C, o(() => {
-		w(0);
-	}, [y]);
-	let j = c(null), M = a(() => {
-		let e = d.current;
+		b
+	]), k = l(v);
+	k.current = v;
+	let A = l(O);
+	A.current = O;
+	let j = l(w);
+	j.current = w, s(() => {
+		T(0);
+	}, [b]);
+	let M = l(null), N = o(() => {
+		let e = f.current;
 		if (!e) return null;
-		let t = (e.innerText || "").replace(/[\n\r]+$/, ""), n = u(e);
+		let t = (e.innerText || "").replace(/[\n\r]+$/, ""), n = d(e);
 		if (n < 0) return null;
 		let r = t.slice(0, n), i = r.match(/(^|\s)(\/model(?:\s+\S*)?)$/);
 		if (i) {
@@ -82,21 +83,21 @@ var d = (d) => {
 			start: s,
 			end: l
 		};
-	}, [d]), N = a(() => {
-		let e = M(), t = e?.kind === "model-profile" ? E.length > 0 || g : T.length > 0;
-		e !== null && t ? (S(e.kind), b(e.text), j.current = {
+	}, [f]), P = o(() => {
+		let e = N(), t = e?.kind === "model-profile" ? D.length > 0 || _ : E.length > 0;
+		e !== null && t ? (C(e.kind), x(e.text), M.current = {
 			start: e.start,
 			end: e.end
-		}, v(!0)) : (v(!1), b(""), S("command"), j.current = null);
+		}, y(!0)) : (y(!1), x(""), C("command"), M.current = null);
 	}, [
-		M,
-		g,
-		E.length,
-		T.length
-	]), P = a((e) => {
-		let t = d.current;
+		N,
+		_,
+		D.length,
+		E.length
+	]), F = o((e) => {
+		let t = f.current;
 		if (!t) return;
-		let n = j.current, r = (t.innerText || "").replace(/[\n\r]+$/, ""), i = `${e.command} `;
+		let n = M.current, r = (t.innerText || "").replace(/[\n\r]+$/, ""), i = `${e.command} `;
 		if (n) {
 			t.textContent = r.slice(0, n.start) + i + r.slice(n.end);
 			let e = n.start + i.length, a = t.firstChild;
@@ -109,37 +110,37 @@ var d = (d) => {
 			let e = document.createRange(), n = window.getSelection();
 			e.selectNodeContents(t), e.collapse(!1), n?.removeAllRanges(), n?.addRange(e);
 		}
-		v(!1), b(""), S("command"), w(0), j.current = null, t.dispatchEvent(new InputEvent("input", { bubbles: !0 })), t.focus();
-	}, [d]);
+		y(!1), x(""), C("command"), T(0), M.current = null, t.dispatchEvent(new InputEvent("input", { bubbles: !0 })), t.focus();
+	}, [f]);
 	return {
-		isMenuOpen: _,
-		filteredItems: D,
-		selectedIndex: C,
-		updateSlashMenu: N,
-		selectItem: P,
-		handleSlashKeyDown: a((e) => {
-			let t = k.current;
-			if (!O.current || t.length === 0) return !1;
+		isMenuOpen: v,
+		filteredItems: O,
+		selectedIndex: w,
+		updateSlashMenu: P,
+		selectItem: F,
+		handleSlashKeyDown: o((e) => {
+			let t = A.current;
+			if (!k.current || t.length === 0) return !1;
 			switch (e.key) {
-				case "ArrowDown": return e.preventDefault(), w((e) => e < t.length - 1 ? e + 1 : 0), !0;
-				case "ArrowUp": return e.preventDefault(), w((e) => e > 0 ? e - 1 : t.length - 1), !0;
+				case "ArrowDown": return e.preventDefault(), T((e) => e < t.length - 1 ? e + 1 : 0), !0;
+				case "ArrowUp": return e.preventDefault(), T((e) => e > 0 ? e - 1 : t.length - 1), !0;
 				case "Enter":
 				case "Tab": {
-					let n = t[A.current];
-					return n ? (e.preventDefault(), P(n), !0) : !1;
+					let n = t[j.current];
+					return n ? (e.preventDefault(), F(n), !0) : !1;
 				}
-				case "Escape": return e.preventDefault(), v(!1), !0;
+				case "Escape": return e.preventDefault(), y(!1), !0;
 				case "ArrowLeft":
 				case "ArrowRight":
 				case "Home":
-				case "End": return v(!1), !1;
+				case "End": return y(!1), !1;
 				default: return !1;
 			}
-		}, [P]),
-		closeMenu: a(() => v(!1), [])
+		}, [F]),
+		closeMenu: o(() => y(!1), [])
 	};
 };
 //#endregion
-export { d as useSlashCommand };
+export { f as useSlashCommand };
 
 //# sourceMappingURL=use-slash-command.js.map