Revert "fix: preserve session selection on reconnect (#261)"

This reverts commit fdeffea.

Author: chriswritescode-dev

frontend/src/components/message/PromptInput.tsx

@@ -10,7 +10,7 @@ import { useSessionAgent } from '@/hooks/useSessionAgent'
 import { useSTT } from '@/hooks/useSTT'
 
 import { useUserBash } from '@/stores/userBashStore'
-import { useModelStore, formatModelKey } from '@/stores/modelStore'
+import { useModelStore } from '@/stores/modelStore'
 import { useSessionAgentStore } from '@/stores/sessionAgentStore'
 import { useUIState } from '@/stores/uiStateStore'
 import { useMobile } from '@/hooks/useMobile'
@@ -436,9 +436,6 @@ export const PromptInput = memo(forwardRef<PromptInputHandle, PromptInputProps>(
     setStoredAgent(sessionID, agentName)
     const agent = agents.find(a => a.name === agentName)
     if (agent?.model) {
-      if (sessionModelSyncKey) {
-        userModelOverrideRef.current[sessionModelSyncKey] = true
-      }
       setStoredModel({ providerID: agent.model.providerID, modelID: agent.model.modelID })
     }
   }
@@ -994,7 +991,7 @@ if (isIOS && isSecureContext && navigator.clipboard && navigator.clipboard.read)
   const sessionAgent = useSessionAgent(opcodeUrl, sessionID, directory)
   const currentMode = localMode ?? sessionAgent.agent
   const setStoredAgent = useSessionAgentStore((s) => s.setAgent)
-  const userModelOverrideRef = useRef<Record<string, boolean>>({})
+  const syncedSessionModelRef = useRef<string | undefined>(undefined)
 
   const client = useOpenCodeClient(opcodeUrl, directory)
   const { data: providersData } = useQuery({
@@ -1012,28 +1009,19 @@ if (isIOS && isSecureContext && navigator.clipboard && navigator.clipboard.read)
 
   useEffect(() => {
     if (!sessionModelSyncKey) return
+    if (syncedSessionModelRef.current === sessionModelSyncKey) return
     if (!sessionAgent.model) return
 
-    const sessionModelKey = formatModelKey(sessionAgent.model)
-    const activeModelKey = model ? formatModelKey(model) : undefined
-    const hasUserOverride = userModelOverrideRef.current[sessionModelSyncKey]
-
-    if (hasUserOverride && activeModelKey !== sessionModelKey) return
+    restoreSessionModel(sessionAgent.model)
 
-    if (hasUserOverride) {
-      delete userModelOverrideRef.current[sessionModelSyncKey]
-    }
-
-    if (activeModelKey !== sessionModelKey) {
-      restoreSessionModel(sessionAgent.model)
-    }
+    syncedSessionModelRef.current = sessionModelSyncKey
 
     if (sessionAgent.variant) {
       setStoreVariant(sessionAgent.model, sessionAgent.variant)
     } else {
       clearStoreVariant(sessionAgent.model)
     }
-  }, [clearStoreVariant, model, sessionAgent.model, sessionAgent.variant, sessionModelSyncKey, restoreSessionModel, setStoreVariant])
+  }, [clearStoreVariant, sessionAgent.model, sessionAgent.variant, sessionModelSyncKey, restoreSessionModel, setStoreVariant])
 
   const currentModel = modelString || ''
   const displayModelName = useMemo(() => {
@@ -1270,11 +1258,6 @@ return (
                   <ModelQuickSelect
                     opcodeUrl={opcodeUrl}
                     directory={directory}
-                    onModelChange={() => {
-                      if (sessionModelSyncKey) {
-                        userModelOverrideRef.current[sessionModelSyncKey] = true
-                      }
-                    }}
                   >
 <button
                       className="px-2.5 py-0.5 md:px-3 min-h-[36px] min-w-0 rounded-lg text-xs md:text-sm font-medium border bg-muted border-border text-muted-foreground hover:bg-muted-foreground/10 hover:border-foreground/30 transition-colors cursor-pointer flex-1 md:flex-initial md:w-auto max-w-[110px] md:max-w-[220px] dark:border-white/30 flex flex-col items-start justify-center overflow-hidden"

frontend/src/components/model/ModelQuickSelect.tsx

@@ -1,7 +1,6 @@
 import { useCallback, useDeferredValue, useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react'
 import { Check, ChevronLeft, ChevronRight, Clock, MoreVertical, Search, Star, Trash2, X } from 'lucide-react'
 import { useModelSelection } from '@/hooks/useModelSelection'
-import { formatModelKey } from '@/stores/modelStore'
 import { useVariants } from '@/hooks/useVariants'
 import { formatModelName, formatProviderName, getProviders } from '@/api/providers'
 import { useQuery } from '@tanstack/react-query'
@@ -21,7 +20,6 @@ interface ModelQuickSelectProps {
   opcodeUrl: string | null | undefined
   directory?: string
   disabled?: boolean
-  onModelChange?: () => void
   children: React.ReactNode
 }
 
@@ -77,7 +75,7 @@ function createModelListItem(provider: Provider, modelID: string, model: Model):
   return {
     providerID: provider.id,
     modelID,
-    key: formatModelKey({ providerID: provider.id, modelID }),
+    key: `${provider.id}/${modelID}`,
     displayName,
     providerName,
     searchText: createSearchText(displayName, modelID, providerName, provider.id),
@@ -89,13 +87,17 @@ function createFallbackModelListItem(providerID: string, modelID: string): Model
   return {
     providerID,
     modelID,
-    key: formatModelKey({ providerID, modelID }),
+    key: `${providerID}/${modelID}`,
     displayName: modelID,
     providerName: providerID,
     searchText: createSearchText(modelID, providerID),
   }
 }
 
+function getSelectionKey(selection: { providerID: string, modelID: string }) {
+  return `${selection.providerID}/${selection.modelID}`
+}
+
 function VirtualizedList<T>({
   items,
   itemHeight,
@@ -183,7 +185,6 @@ export function ModelQuickSelect({
   opcodeUrl,
   directory,
   disabled,
-  onModelChange,
   children,
 }: ModelQuickSelectProps) {
   const [isOpen, setIsOpen] = useState(false)
@@ -205,11 +206,11 @@ export function ModelQuickSelect({
   const providers = providersData?.providers ?? EMPTY_PROVIDERS
 
   const favoriteKeySet = useMemo(() => {
-    return new Set(favoriteModels.map(formatModelKey))
+    return new Set(favoriteModels.map(getSelectionKey))
   }, [favoriteModels])
 
   const recentKeySet = useMemo(() => {
-    return new Set(recentModels.map(formatModelKey))
+    return new Set(recentModels.map(getSelectionKey))
   }, [recentModels])
 
   const { providerById, providerItems } = useMemo(() => {
@@ -305,15 +306,15 @@ export function ModelQuickSelect({
 
   const favoriteModelsWithNames = useMemo(() => {
     return favoriteModels
-      .filter(favorite => formatModelKey(favorite) !== modelString)
+      .filter(favorite => `${favorite.providerID}/${favorite.modelID}` !== modelString)
       .slice(0, 5)
       .map(toModelListItem)
   }, [favoriteModels, modelString, toModelListItem])
 
   const recentModelsWithNames = useMemo(() => {
     return recentModels
       .filter(recent => {
-        const key = formatModelKey(recent)
+        const key = getSelectionKey(recent)
         return key !== modelString && !favoriteKeySet.has(key)
       })
       .slice(0, 5)
@@ -413,7 +414,6 @@ export function ModelQuickSelect({
 
   const handleModelSelect = (providerID: string, modelID: string) => {
     setModel({ providerID, modelID })
-    onModelChange?.()
     setShowAllModels(false)
     setSearchQuery('')
     setSelectedProviderId(null)

frontend/src/hooks/useSessionAgent.test.tsx

@@ -175,7 +175,7 @@ describe('useSessionAgent', () => {
     })
   })
 
-  it('keeps cached message-derived configuration while refetching', async () => {
+  it('does not restore model from cached messages while refetching', async () => {
     vi.mocked(useMessages).mockReturnValue({
       data: [
         {
@@ -194,38 +194,7 @@ describe('useSessionAgent', () => {
       data: { default_agent: 'code' },
     } as ReturnType<typeof useConfig>)
     vi.mocked(useAgents).mockReturnValue({
-      data: [
-        { name: 'code', mode: 'primary' },
-        { name: 'assistant', mode: 'primary' },
-      ],
-      isSuccess: true,
-    } as ReturnType<typeof useAgents>)
-
-    const { result } = renderHook(() =>
-      useSessionAgent('http://localhost:5551', 'session-1', '/assistant')
-    )
-
-    await waitFor(() => {
-      expect(result.current.agent).toBe('assistant')
-      expect(result.current.model).toEqual({ providerID: 'provider', modelID: 'stale-model' })
-      expect(result.current.variant).toBe('stale-variant')
-    })
-  })
-
-  it('uses stored session agent while initial messages are loading', async () => {
-    useSessionAgentStore.setState({ agents: { 'session-1': 'assistant' } })
-    vi.mocked(useMessages).mockReturnValue({
-      data: undefined,
-      isLoading: true,
-    } as ReturnType<typeof useMessages>)
-    vi.mocked(useConfig).mockReturnValue({
-      data: { default_agent: 'code' },
-    } as ReturnType<typeof useConfig>)
-    vi.mocked(useAgents).mockReturnValue({
-      data: [
-        { name: 'code', mode: 'primary' },
-        { name: 'assistant', mode: 'primary' },
-      ],
+      data: [{ name: 'code', mode: 'primary' }],
       isSuccess: true,
     } as ReturnType<typeof useAgents>)
 
@@ -234,7 +203,7 @@ describe('useSessionAgent', () => {
     )
 
     await waitFor(() => {
-      expect(result.current.agent).toBe('assistant')
+      expect(result.current.agent).toBe('code')
       expect(result.current.model).toBeUndefined()
       expect(result.current.variant).toBeUndefined()
     })

frontend/src/hooks/useSessionAgent.ts

@@ -62,7 +62,7 @@ export function useSessionAgent(
   sessionID: string | undefined,
   directory?: string
 ) {
-  const { data: messages, isLoading: messagesLoading } = useMessages(opcodeUrl, sessionID, directory)
+  const { data: messages, isLoading: messagesLoading, isFetching: messagesFetching } = useMessages(opcodeUrl, sessionID, directory)
   const { data: config } = useConfig(opcodeUrl, directory)
   const { data: agents, isSuccess: agentsLoaded } = useAgents(opcodeUrl, directory)
   const storedAgent = useSessionAgentStore((s) => s.agents[sessionID ?? ''] ?? null)
@@ -75,28 +75,12 @@ export function useSessionAgent(
   )
 
   const result = useMemo(() => {
-    const resolveFallback = (): SessionAgentResult => {
-      const resolvedStoredAgent = resolveAvailableAgentName(storedAgent, agents, agentsLoaded)
-      if (resolvedStoredAgent) {
-        const prev = prevRef.current
-        if (prev.agent === resolvedStoredAgent && !prev.model && !prev.variant) {
-          return { ...prev, fromMessage: false }
-        }
-
-        const next: SessionAgentResult = { agent: resolvedStoredAgent, model: undefined, variant: undefined, fromMessage: false }
-        prevRef.current = next
-        return next
-      }
-
+    if (messagesLoading || messagesFetching) {
       return { agent: defaultAgent, model: undefined, variant: undefined, fromMessage: false }
     }
 
-    if (messagesLoading && (!messages || messages.length === 0)) {
-      return resolveFallback()
-    }
-
     if (!messages || messages.length === 0) {
-      return resolveFallback()
+      return { agent: defaultAgent, model: undefined, variant: undefined, fromMessage: false }
     }
 
     let latestAgent: string | undefined
@@ -156,7 +140,7 @@ export function useSessionAgent(
     }
 
     return { agent: defaultAgent, model: undefined, variant: undefined, fromMessage: false }
-  }, [messages, messagesLoading, storedAgent, defaultAgent, agents, agentsLoaded])
+  }, [messages, messagesLoading, messagesFetching, storedAgent, defaultAgent, agents, agentsLoaded])
 
   useEffect(() => {
     if (result.agent && sessionID && result.fromMessage) {
@@ -166,3 +150,20 @@ export function useSessionAgent(
 
   return { agent: result.agent, model: result.model, variant: result.variant }
 }
+
+export function getSessionAgentFromMessages(
+  messages: Array<{ role: string; agent?: string }> | undefined
+): string | undefined {
+  if (!messages || messages.length === 0) {
+    return undefined
+  }
+
+  for (let i = messages.length - 1; i >= 0; i--) {
+    const msg = messages[i]
+    if (msg.role === 'user' && 'agent' in msg && msg.agent) {
+      return msg.agent
+    }
+  }
+
+  return undefined
+}

frontend/src/stores/modelStore.ts

@@ -26,10 +26,6 @@ interface ModelStore {
   clearVariant: (model: ModelSelection) => void
 }
 
-export function formatModelKey(model: ModelSelection): string {
-  return `${model.providerID}/${model.modelID}`
-}
-
 export function modelExists(model: ModelSelection | null, providers: Provider[]): boolean {
   if (!model) return false
   return providers.some(