@vibe-forge/client 2.0.0 → 3.0.0-alpha.0

package/src/hooks/chat/use-chat-session-actions.ts

@@ -1,22 +1,45 @@
 import { App } from 'antd'
+import { useAtomValue, useSetAtom } from 'jotai'
 import { useCallback, useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { useLocation, useNavigate } from 'react-router-dom'
 import { useSWRConfig } from 'swr'
 
+import type { ChatMessageContent, Session, SessionQueuedMessageMode } from '@vibe-forge/core'
+
 import {
   branchSessionFromMessage,
   createQueuedMessage,
   createSession,
   deleteQueuedMessage,
+  deleteSession,
   getApiErrorMessage,
+  getSessionMessages,
   moveQueuedMessage,
   reorderQueuedMessages,
   updateQueuedMessage
 } from '#~/api.js'
 import { connectionManager } from '#~/connectionManager.js'
-import type { ChatMessageContent, Session, SessionQueuedMessageMode } from '@vibe-forge/core'
+import { useSenderHeaderQueryState } from '#~/hooks/use-sender-header-query-state.js'
+
+import { getChatSessionTargetPrompt } from './chat-session-target'
+import type { ChatSessionTargetDraft } from './chat-session-target'
 import type { ChatSessionWorkspaceDraft } from './chat-session-workspace-draft'
+import {
+  clearOptimisticSessionDiscarded,
+  createOptimisticSessionCreation,
+  createOptimisticSessionId,
+  isOptimisticSessionDiscarded,
+  markOptimisticSessionCreationCreating,
+  markOptimisticSessionCreationFailed,
+  optimisticSessionCreationsAtom,
+  removeSessionFromList
+} from './optimistic-session-creation'
+import type {
+  OptimisticSessionCreation,
+  OptimisticSessionCreationOptions,
+  OptimisticSessionCreationRequest
+} from './optimistic-session-creation'
 import type { ChatEffort } from './use-chat-effort'
 import type { PermissionMode } from './use-chat-permission-mode'
 
@@ -27,6 +50,8 @@ export function useChatSessionActions({
   effort,
   permissionMode,
   adapter,
+  account,
+  sessionTargetDraft,
   workspaceDraft,
   onClearMessages
 }: {
@@ -36,6 +61,8 @@ export function useChatSessionActions({
   effort: ChatEffort
   permissionMode: PermissionMode
   adapter?: string
+  account?: string
+  sessionTargetDraft?: ChatSessionTargetDraft
   workspaceDraft?: ChatSessionWorkspaceDraft
   onClearMessages: () => void
 }) {
@@ -44,16 +71,41 @@ export function useChatSessionActions({
   const navigate = useNavigate()
   const location = useLocation()
   const { mutate } = useSWRConfig()
+  const { setHeaderCollapsed } = useSenderHeaderQueryState()
+  const optimisticCreations = useAtomValue(optimisticSessionCreationsAtom)
+  const setOptimisticCreations = useSetAtom(optimisticSessionCreationsAtom)
   const [isCreating, setIsCreating] = useState(false)
   const isThinking = isCreating || session?.status === 'running'
+  const optimisticCreation = session?.id == null || session.id === ''
+    ? undefined
+    : optimisticCreations[session.id]
+
+  const navigateWithSearchPatch = useCallback((
+    pathname: string,
+    patch?: Record<string, string>
+  ) => {
+    const nextParams = new URLSearchParams(location.search)
+
+    if (patch != null) {
+      for (const [key, value] of Object.entries(patch)) {
+        if (value === '') {
+          nextParams.delete(key)
+        } else {
+          nextParams.set(key, value)
+        }
+      }
+    }
 
-  const navigateWithCurrentSearch = useCallback((pathname: string) => {
     void navigate({
       pathname,
-      search: location.search
+      search: nextParams.toString() === '' ? '' : `?${nextParams.toString()}`
     })
   }, [location.search, navigate])
 
+  const navigateWithCurrentSearch = useCallback((pathname: string) => {
+    navigateWithSearchPatch(pathname)
+  }, [navigateWithSearchPatch])
+
   const insertSessionIntoCache = useCallback(async (newSession: Session) => {
     await mutate('/api/sessions', (prev: { sessions: Session[] } | undefined) => {
       if (!prev?.sessions) {
@@ -68,43 +120,202 @@ export function useChatSessionActions({
     }, false)
   }, [mutate])
 
+  const removeSessionFromCache = useCallback(async (id: string) => {
+    await mutate('/api/sessions', (prev: { sessions: Session[] } | undefined) => {
+      if (prev?.sessions == null) return prev
+      return {
+        ...prev,
+        sessions: removeSessionFromList(prev.sessions, id)
+      }
+    }, false)
+    await mutate('/api/sessions/archived', (prev: { sessions: Session[] } | undefined) => {
+      if (prev?.sessions == null) return prev
+      return {
+        ...prev,
+        sessions: removeSessionFromList(prev.sessions, id)
+      }
+    }, false)
+  }, [mutate])
+
+  const removeOptimisticCreation = useCallback((id: string) => {
+    setOptimisticCreations((prev) => {
+      if (prev[id] == null) return prev
+      const next = { ...prev }
+      delete next[id]
+      return next
+    })
+  }, [setOptimisticCreations])
+
+  const updateOptimisticCreation = useCallback((
+    id: string,
+    updater: (creation: OptimisticSessionCreation) => OptimisticSessionCreation
+  ) => {
+    setOptimisticCreations((prev) => {
+      const current = prev[id]
+      if (current == null) return prev
+      return {
+        ...prev,
+        [id]: updater(current)
+      }
+    })
+  }, [setOptimisticCreations])
+
+  const resolveCreatedSession = useCallback(async (id: string) => {
+    try {
+      const res = await getSessionMessages(id)
+      return res.session
+    } catch (err) {
+      console.warn('Failed to verify optimistic session creation state:', err)
+      return undefined
+    }
+  }, [])
+
+  const handleResolvedSessionCreation = useCallback(async (newSession: Session) => {
+    if (isOptimisticSessionDiscarded(newSession.id)) {
+      removeOptimisticCreation(newSession.id)
+      await removeSessionFromCache(newSession.id)
+      try {
+        await deleteSession(newSession.id, { force: true })
+      } catch (err) {
+        console.warn('Failed to delete discarded optimistic session:', err)
+      } finally {
+        clearOptimisticSessionDiscarded(newSession.id)
+      }
+      return false
+    }
+
+    await insertSessionIntoCache(newSession)
+    removeOptimisticCreation(newSession.id)
+    clearOptimisticSessionDiscarded(newSession.id)
+    setHeaderCollapsed(true)
+    return true
+  }, [
+    insertSessionIntoCache,
+    removeOptimisticCreation,
+    removeSessionFromCache,
+    setHeaderCollapsed
+  ])
+
+  const buildCreateSessionOptions = useCallback((id: string): OptimisticSessionCreationOptions => {
+    const targetPrompt = getChatSessionTargetPrompt(sessionTargetDraft)
+    return {
+      id,
+      ...targetPrompt,
+      effort: effort === 'default' ? undefined : effort,
+      permissionMode,
+      adapter,
+      account,
+      workspace: workspaceDraft == null
+        ? undefined
+        : {
+          createWorktree: workspaceDraft.createWorktree,
+          worktreeEnvironment: workspaceDraft.worktreeEnvironment,
+          branch: workspaceDraft.branch
+        }
+    }
+  }, [
+    account,
+    adapter,
+    effort,
+    permissionMode,
+    sessionTargetDraft,
+    workspaceDraft
+  ])
+
+  const runSessionCreationRequest = useCallback(async (
+    request: OptimisticSessionCreationRequest
+  ) => {
+    try {
+      const { session: newSession } = await createSession(
+        request.title,
+        request.initialMessage,
+        request.initialContent,
+        request.model,
+        request.options
+      )
+
+      return await handleResolvedSessionCreation(newSession)
+    } catch (err) {
+      console.error(err)
+      const recoveredSession = await resolveCreatedSession(request.id)
+      if (recoveredSession != null) {
+        return await handleResolvedSessionCreation(recoveredSession)
+      }
+      if (isOptimisticSessionDiscarded(request.id)) {
+        removeOptimisticCreation(request.id)
+        await removeSessionFromCache(request.id)
+        clearOptimisticSessionDiscarded(request.id)
+        return false
+      }
+      const errorMessage = getApiErrorMessage(err, t('chat.sessionCreateFailedMessage'))
+      updateOptimisticCreation(request.id, creation => markOptimisticSessionCreationFailed(creation, errorMessage))
+      return false
+    }
+  }, [
+    handleResolvedSessionCreation,
+    removeOptimisticCreation,
+    removeSessionFromCache,
+    resolveCreatedSession,
+    t,
+    updateOptimisticCreation
+  ])
+
+  const startOptimisticSessionCreation = useCallback((
+    request: OptimisticSessionCreationRequest
+  ) => {
+    const creation = createOptimisticSessionCreation(request)
+    clearOptimisticSessionDiscarded(creation.session.id)
+    setIsCreating(true)
+    setOptimisticCreations(prev => ({
+      ...prev,
+      [creation.session.id]: creation
+    }))
+    void insertSessionIntoCache(creation.session)
+    navigateWithSearchPatch(`/session/${creation.session.id}`, {
+      senderHeader: 'collapsed'
+    })
+    void runSessionCreationRequest(request)
+  }, [insertSessionIntoCache, navigateWithSearchPatch, runSessionCreationRequest, setOptimisticCreations])
+
+  const retrySessionCreation = useCallback(async () => {
+    if (optimisticCreation == null) {
+      return false
+    }
+
+    updateOptimisticCreation(optimisticCreation.session.id, markOptimisticSessionCreationCreating)
+    void insertSessionIntoCache({
+      ...optimisticCreation.session,
+      status: 'running'
+    })
+
+    return await runSessionCreationRequest(optimisticCreation.request)
+  }, [insertSessionIntoCache, optimisticCreation, runSessionCreationRequest, updateOptimisticCreation])
+
   useEffect(() => {
     if (!isCreating || session?.id == null || session.id === '') return
     setIsCreating(false)
   }, [isCreating, session?.id])
 
-  const send = useCallback(async (text: string, _mode?: SessionQueuedMessageMode) => {
+  const send = useCallback((text: string, _mode?: SessionQueuedMessageMode) => {
     if (text.trim() === '' || isThinking) return false
     if (!hasAvailableModels) {
       void message.warning(t('chat.modelConfigRequired'))
       return false
     }
+    if (optimisticCreation != null) {
+      void message.warning(t('chat.retrySessionCreationRequired'))
+      return false
+    }
 
     if (!session?.id) {
-      setIsCreating(true)
-      try {
-        const { session: newSession } = await createSession(undefined, text.trim(), undefined, modelForQuery, {
-          effort: effort === 'default' ? undefined : effort,
-          permissionMode,
-          adapter,
-          workspace: workspaceDraft == null
-            ? undefined
-            : {
-              createWorktree: workspaceDraft.createWorktree,
-              branch: workspaceDraft.branch
-            }
-        })
-
-        await insertSessionIntoCache(newSession)
-
-        navigateWithCurrentSearch(`/session/${newSession.id}`)
-        return true
-      } catch (err) {
-        console.error(err)
-        setIsCreating(false)
-        void message.error(getApiErrorMessage(err, 'Failed to create session'))
-        return false
-      }
+      const id = createOptimisticSessionId()
+      startOptimisticSessionCreation({
+        id,
+        initialMessage: text.trim(),
+        model: modelForQuery,
+        options: buildCreateSessionOptions(id)
+      })
+      return true
     }
 
     connectionManager.send(session.id, {
@@ -113,52 +324,37 @@ export function useChatSessionActions({
     })
     return true
   }, [
-    adapter,
+    buildCreateSessionOptions,
     hasAvailableModels,
     isThinking,
-    insertSessionIntoCache,
     message,
-    navigateWithCurrentSearch,
-    effort,
-    permissionMode,
-    workspaceDraft,
     modelForQuery,
+    optimisticCreation,
     session?.id,
+    startOptimisticSessionCreation,
     t
   ])
 
-  const sendContent = useCallback(async (content: ChatMessageContent[], _mode?: SessionQueuedMessageMode) => {
+  const sendContent = useCallback((content: ChatMessageContent[], _mode?: SessionQueuedMessageMode) => {
     if (content.length === 0 || isThinking) return false
     if (!hasAvailableModels) {
       void message.warning(t('chat.modelConfigRequired'))
       return false
     }
+    if (optimisticCreation != null) {
+      void message.warning(t('chat.retrySessionCreationRequired'))
+      return false
+    }
 
     if (!session?.id) {
-      setIsCreating(true)
-      try {
-        const { session: newSession } = await createSession(undefined, undefined, content, modelForQuery, {
-          effort: effort === 'default' ? undefined : effort,
-          permissionMode,
-          adapter,
-          workspace: workspaceDraft == null
-            ? undefined
-            : {
-              createWorktree: workspaceDraft.createWorktree,
-              branch: workspaceDraft.branch
-            }
-        })
-
-        await insertSessionIntoCache(newSession)
-
-        navigateWithCurrentSearch(`/session/${newSession.id}`)
-        return true
-      } catch (err) {
-        console.error(err)
-        setIsCreating(false)
-        void message.error(getApiErrorMessage(err, 'Failed to create session'))
-        return false
-      }
+      const id = createOptimisticSessionId()
+      startOptimisticSessionCreation({
+        id,
+        initialContent: content,
+        model: modelForQuery,
+        options: buildCreateSessionOptions(id)
+      })
+      return true
     }
 
     connectionManager.send(session.id, {
@@ -167,17 +363,14 @@ export function useChatSessionActions({
     })
     return true
   }, [
-    adapter,
+    buildCreateSessionOptions,
     hasAvailableModels,
-    insertSessionIntoCache,
     isThinking,
-    navigateWithCurrentSearch,
     message,
-    effort,
-    permissionMode,
-    workspaceDraft,
     modelForQuery,
+    optimisticCreation,
     session?.id,
+    startOptimisticSessionCreation,
     t
   ])
 
@@ -312,6 +505,7 @@ export function useChatSessionActions({
     isThinking,
     send,
     sendContent,
+    retrySessionCreation,
     enqueueContent,
     updateQueuedContent,
     removeQueuedContent,

package/src/hooks/chat/use-chat-session-messages.ts

@@ -16,6 +16,7 @@ import {
   getFatalSessionError,
   restoreInteractionStateFromHistory
 } from './interaction-state'
+import type { OptimisticSessionCreation } from './optimistic-session-creation'
 import {
   deleteChatSessionViewSnapshot,
   restoreChatSessionViewSnapshot,
@@ -60,6 +61,8 @@ export function useChatSessionMessages({
   effort,
   permissionMode,
   adapter,
+  account,
+  optimisticCreation,
   setInteractionRequest
 }: {
   session?: Session
@@ -67,6 +70,8 @@ export function useChatSessionMessages({
   effort: ChatEffort
   permissionMode: PermissionMode
   adapter?: string
+  account?: string
+  optimisticCreation?: OptimisticSessionCreation
   setInteractionRequest: (value: { id: string; payload: AskUserQuestionParams } | null) => void
 }) {
   const { t } = useTranslation()
@@ -82,6 +87,7 @@ export function useChatSessionMessages({
   const lastConnectedEffortRef = useRef<string | undefined>(undefined)
   const lastConnectedPermissionModeRef = useRef<string | undefined>(undefined)
   const lastConnectedAdapterRef = useRef<string | undefined>(undefined)
+  const lastConnectedAccountRef = useRef<string | undefined>(undefined)
   const lastObservedSessionStatusRef = useRef<Session['status'] | undefined>(session?.status)
   const expectedCloseRef = useRef(false)
   const interactionRequestRef = useRef<InteractionRequestState | null>(null)
@@ -255,10 +261,43 @@ export function useChatSessionMessages({
       lastConnectedEffortRef.current = undefined
       lastConnectedPermissionModeRef.current = undefined
       lastConnectedAdapterRef.current = undefined
+      lastConnectedAccountRef.current = undefined
       clearScheduledReconciles()
       return
     }
 
+    if (optimisticCreation != null) {
+      clearScheduledReconciles()
+      historyRequestSeqRef.current += 1
+      const nextMessages = [optimisticCreation.message]
+      const nextErrorState = optimisticCreation.status === 'failed'
+        ? {
+          action: 'retry-session-creation',
+          code: 'session_create_failed',
+          kind: 'session',
+          message: optimisticCreation.errorMessage ?? t('chat.sessionCreateFailedMessage')
+        } satisfies ChatErrorState
+        : null
+
+      interactionRequestRef.current = null
+      setInteractionRequest(null)
+      setMessagesState(nextMessages)
+      setSessionInfo(null)
+      setQueuedMessages(EMPTY_QUEUED_MESSAGES)
+      setErrorState(nextErrorState)
+      setIsReady(true)
+      isInitialLoadRef.current = false
+      updateSessionViewCache(session.id, {
+        messages: nextMessages,
+        sessionInfo: null,
+        queuedMessages: EMPTY_QUEUED_MESSAGES,
+        errorState: nextErrorState,
+        interactionRequest: null,
+        isHydrated: true
+      })
+      return
+    }
+
     const restoredState = restoreChatSessionViewSnapshot(sessionViewCacheRef.current.get(session.id))
 
     setMessagesState(restoredState.messages)
@@ -276,13 +315,25 @@ export function useChatSessionMessages({
     return () => {
       clearScheduledReconciles()
     }
-  }, [clearScheduledReconciles, refreshHistory, session?.id, setInteractionRequest])
+  }, [
+    clearScheduledReconciles,
+    optimisticCreation,
+    refreshHistory,
+    session?.id,
+    setInteractionRequest,
+    t,
+    updateSessionViewCache
+  ])
 
   useEffect(() => {
     if (session?.id == null || session.id === '') {
       lastObservedSessionStatusRef.current = undefined
       return
     }
+    if (optimisticCreation != null) {
+      lastObservedSessionStatusRef.current = session.status
+      return
+    }
 
     const previousStatus = lastObservedSessionStatusRef.current
     lastObservedSessionStatusRef.current = session.status
@@ -292,12 +343,17 @@ export function useChatSessionMessages({
     }
 
     void refreshHistory({ updateReadiness: false })
-  }, [refreshHistory, session?.id, session?.status])
+  }, [optimisticCreation, refreshHistory, session?.id, session?.status])
 
   useEffect(() => {
     if (session?.id == null || session.id === '') {
       return
     }
+    if (optimisticCreation != null) {
+      expectedCloseRef.current = true
+      connectionManager.close(session.id)
+      return
+    }
 
     let isDisposed = false
     let cleanup: (() => void) | undefined
@@ -320,7 +376,12 @@ export function useChatSessionMessages({
       lastConnectedAdapterRef.current != null &&
       normalizedAdapter !== lastConnectedAdapterRef.current &&
       session?.status !== 'running'
-    if (modelChanged || effortChanged || permissionModeChanged || adapterChanged) {
+    const normalizedAccount = account ?? ''
+    const accountChanged = account != null &&
+      lastConnectedAccountRef.current != null &&
+      normalizedAccount !== lastConnectedAccountRef.current &&
+      session?.status !== 'running'
+    if (modelChanged || effortChanged || permissionModeChanged || adapterChanged || accountChanged) {
       expectedCloseRef.current = true
       setErrorState(null)
       connectionManager.send(session.id, { type: 'terminate_session' })
@@ -330,6 +391,7 @@ export function useChatSessionMessages({
     lastConnectedEffortRef.current = normalizedEffort
     lastConnectedPermissionModeRef.current = normalizedPermissionMode
     lastConnectedAdapterRef.current = normalizedAdapter
+    lastConnectedAccountRef.current = normalizedAccount
 
     const timer = setTimeout(() => {
       if (isDisposed) return
@@ -347,6 +409,9 @@ export function useChatSessionMessages({
       if (adapter) {
         connectionParams.adapter = adapter
       }
+      if (account) {
+        connectionParams.account = account
+      }
 
       cleanup = connectionManager.connect(session.id, {
         onOpen() {
@@ -502,7 +567,7 @@ export function useChatSessionMessages({
           })
         }
       }, Object.keys(connectionParams).length > 0 ? connectionParams : undefined)
-    }, (modelChanged || effortChanged || permissionModeChanged || adapterChanged) ? 200 : 100)
+    }, (modelChanged || effortChanged || permissionModeChanged || adapterChanged || accountChanged) ? 200 : 100)
 
     return () => {
       isDisposed = true
@@ -511,10 +576,12 @@ export function useChatSessionMessages({
     }
   }, [
     adapter,
+    account,
     clearScheduledReconciles,
     effort,
     modelForQuery,
     mutate,
+    optimisticCreation,
     permissionMode,
     reconcileAfterInteraction,
     retryCount,

package/src/hooks/chat/use-chat-session.ts

@@ -1,7 +1,11 @@
+import { useAtomValue } from 'jotai'
 import { useCallback, useEffect, useRef } from 'react'
 import { useTranslation } from 'react-i18next'
 
 import type { Session } from '@vibe-forge/core'
+
+import { optimisticSessionCreationsAtom } from './optimistic-session-creation'
+import { useChatAdapterAccountSelection } from './use-chat-adapter-account-selection'
 import { useChatEffort } from './use-chat-effort'
 import { useChatInteraction } from './use-chat-interaction'
 import { useChatModelAdapterSelection } from './use-chat-model-adapter-selection'
@@ -15,6 +19,10 @@ export function useChatSession({
   session?: Session
 }) {
   const { t } = useTranslation()
+  const optimisticCreations = useAtomValue(optimisticSessionCreationsAtom)
+  const optimisticCreation = session?.id == null || session.id === ''
+    ? undefined
+    : optimisticCreations[session.id]
   const {
     adapterOptions,
     applySessionSelection,
@@ -33,6 +41,16 @@ export function useChatSession({
   } = useChatModelAdapterSelection({
     adapterLocked: session?.id != null
   })
+  const {
+    accountOptions,
+    selectedAccount,
+    setSelectedAccount,
+    applySessionSelection: applySessionAccountSelection,
+    showAccountSelector
+  } = useChatAdapterAccountSelection({
+    adapter: selectedAdapter,
+    model: selectedModelWithService
+  })
   const { permissionMode, setPermissionMode, permissionModeOptions } = useChatPermissionMode()
   const { effort, setEffort, effortOptions } = useChatEffort()
   const { activeView, isTerminalOpen, setActiveView, setIsTerminalOpen } = useChatView()
@@ -55,13 +73,17 @@ export function useChatSession({
     effort,
     permissionMode,
     adapter: selectedAdapter,
+    account: selectedAccount,
+    optimisticCreation,
     setInteractionRequest
   })
   const handleInteractionResponse = useCallback((id: string, data: string | string[]) => {
     reconcileAfterInteraction()
     submitInteractionResponse(id, data)
   }, [reconcileAfterInteraction, submitInteractionResponse])
-  const lastObservedSessionRef = useRef<Pick<Session, 'id' | 'model' | 'permissionMode' | 'adapter' | 'effort'> | null>(
+  const lastObservedSessionRef = useRef<
+    Pick<Session, 'id' | 'model' | 'permissionMode' | 'adapter' | 'account' | 'effort'> | null
+  >(
     null
   )
   const isThinking = session?.status === 'running'
@@ -82,6 +104,12 @@ export function useChatSession({
       })
     }
 
+    if (sessionChanged || previous?.account !== session.account) {
+      applySessionAccountSelection({
+        account: session.account
+      })
+    }
+
     if (sessionChanged || previous?.permissionMode !== session.permissionMode) {
       setPermissionMode(session.permissionMode)
     }
@@ -95,10 +123,13 @@ export function useChatSession({
       model: session.model,
       permissionMode: session.permissionMode,
       adapter: session.adapter,
+      account: session.account,
       effort: session.effort
     }
   }, [
+    applySessionAccountSelection,
     session?.adapter,
+    session?.account,
     session?.effort,
     session?.id,
     session?.model,
@@ -141,6 +172,10 @@ export function useChatSession({
     permissionModeOptions,
     selectedAdapter,
     setSelectedAdapter,
+    selectedAccount,
+    setSelectedAccount,
+    accountOptions,
+    showAccountSelector,
     adapterOptions,
     hasAvailableModels,
     modelUnavailable: !hasAvailableModels