pragma-so 0.1.0

package/ui/src/hooks/useConversation.js

@@ -0,0 +1,252 @@
+import { useState, useRef, useEffect, useMemo } from 'react'
+import {
+  fetchConversationThread,
+  fetchPlanProposal,
+  openConversationThreadStream,
+} from '../api'
+import {
+  ORCHESTRATOR_AGENT_ID,
+  appendAssistantDelta,
+  appendToolEntryStreaming,
+  buildEntriesFromThreadData,
+  hasRunningTurn,
+  isTaskActivelyRunning,
+  nextEntryId,
+  resolveConversationHeaderAgent,
+  summarizeToolEvent,
+} from '../lib/conversationUtils'
+import { iconForAgent } from '../lib/agentIcon'
+
+const INITIAL_CONVERSATION = {
+  open: false,
+  mode: 'chat',
+  threadId: '',
+  taskId: '',
+  taskStatus: '',
+  taskTitle: '',
+  harness: '',
+  modelLabel: '',
+  reasoningEffort: 'medium',
+  recipientAgentId: '',
+  entries: [],
+  loading: false,
+  error: '',
+  planReady: false,
+  planProposal: null,
+}
+
+export { INITIAL_CONVERSATION }
+
+export function useConversation({ agentById, tasks }) {
+  const [conversation, setConversation] = useState(INITIAL_CONVERSATION)
+
+  const streamAbortRef = useRef(null)
+  const threadIdRef = useRef(conversation.threadId)
+  const conversationSyncInFlightRef = useRef(false)
+  const conversationSyncPendingRef = useRef(false)
+  const conversationSyncRetryTimerRef = useRef(null)
+  const viewingChatIdRef = useRef('')
+  const prevThinkingChatIdsRef = useRef(new Set())
+
+  const conversationHeaderAgent = useMemo(() => {
+    return resolveConversationHeaderAgent({ conversation, tasks, agentById })
+  }, [conversation, tasks, agentById])
+
+  const activePlanThreadId =
+    conversation.open && conversation.mode === 'plan' ? conversation.threadId : ''
+
+  useEffect(() => {
+    threadIdRef.current = conversation.threadId
+  }, [conversation.threadId])
+
+  // SSE conversation thread stream
+  useEffect(() => {
+    if (
+      !conversation.open ||
+      conversation.mode !== 'chat' ||
+      !conversation.taskId ||
+      !conversation.threadId
+    ) {
+      return
+    }
+
+    let cancelled = false
+    let throttledSyncTimer = null
+    const scheduleConversationRetry = (delayMs = 150) => {
+      if (cancelled || conversationSyncRetryTimerRef.current) {
+        return
+      }
+      conversationSyncRetryTimerRef.current = setTimeout(() => {
+        conversationSyncRetryTimerRef.current = null
+        void syncOpenConversation()
+      }, delayMs)
+    }
+
+    const syncOpenConversation = async () => {
+      if (cancelled) return
+      if (conversationSyncInFlightRef.current) {
+        conversationSyncPendingRef.current = true
+        return
+      }
+      conversationSyncInFlightRef.current = true
+      try {
+        conversationSyncPendingRef.current = false
+        const currentThreadId = threadIdRef.current
+        if (!currentThreadId || cancelled) return
+        const data = await fetchConversationThread(currentThreadId)
+        if (!data?.thread || cancelled) return
+
+        const nextEntries = buildEntriesFromThreadData(data, agentById)
+        const turnsRunning = hasRunningTurn(data.turns)
+
+        let proposal = null
+        if (data.thread.mode === 'plan') {
+          try { proposal = await fetchPlanProposal(currentThreadId) } catch {}
+        }
+
+        setConversation((prev) => {
+          if (!prev.open || prev.threadId !== threadIdRef.current || cancelled) return prev
+          const nextLoading = prev.taskId ? isTaskActivelyRunning(prev.taskStatus) : turnsRunning
+          return {
+            ...prev,
+            harness: data.thread.harness,
+            modelLabel: data.thread.model_label,
+            loading: nextLoading,
+            entries: nextEntries,
+            ...(data.thread.mode === 'plan' && proposal ? { planProposal: proposal, planReady: true } : {}),
+          }
+        })
+      } catch {} finally {
+        conversationSyncInFlightRef.current = false
+        if (conversationSyncPendingRef.current) {
+          conversationSyncPendingRef.current = false
+          scheduleConversationRetry(150)
+        }
+      }
+    }
+
+    const throttledSync = () => {
+      if (cancelled || throttledSyncTimer) return
+      throttledSyncTimer = setTimeout(() => {
+        throttledSyncTimer = null
+        void syncOpenConversation()
+      }, 2000)
+    }
+
+    const resolveAgentIdentity = (workerAgentId) => {
+      const resolvedId = (typeof workerAgentId === 'string' && workerAgentId) || ORCHESTRATOR_AGENT_ID
+      const agent = agentById && typeof agentById === 'object' ? agentById[resolvedId] : null
+      return {
+        agentId: resolvedId,
+        agentName: (agent?.name) || (resolvedId === ORCHESTRATOR_AGENT_ID ? 'Orchestrator' : '') || resolvedId,
+        agentEmoji: (agent?.emoji) || iconForAgent(resolvedId),
+      }
+    }
+
+    const closeStream = openConversationThreadStream(conversation.threadId, {
+      onReady: () => { void syncOpenConversation() },
+      onThreadUpdated: () => { throttledSync() },
+      onEvent: ({ event, data }) => {
+        setConversation((prev) => {
+          if (!prev.open || prev.threadId !== threadIdRef.current || cancelled) return prev
+
+          if (event === 'worker_text' || event === 'assistant_text') {
+            const delta = typeof data?.delta === 'string' ? data.delta : ''
+            if (!delta) return prev
+            const workerAgentId = typeof data?.worker_agent_id === 'string' ? data.worker_agent_id : ''
+            const identity = resolveAgentIdentity(workerAgentId)
+            return { ...prev, entries: appendAssistantDelta(prev.entries, delta, identity) }
+          }
+
+          if (event === 'worker_tool_event' || event === 'tool_event') {
+            const summary = summarizeToolEvent(data?.name, data?.payload)
+            if (!summary) return prev
+            return {
+              ...prev,
+              entries: appendToolEntryStreaming(prev.entries, {
+                id: nextEntryId('tool'), type: 'tool',
+                label: summary.label, summary: summary.summary,
+              }),
+            }
+          }
+
+          if (event === 'error') {
+            return { ...prev, error: typeof data?.message === 'string' ? data.message : 'Task error' }
+          }
+
+          return prev
+        })
+      },
+      onError: () => {},
+    })
+
+    void syncOpenConversation()
+
+    return () => {
+      cancelled = true
+      if (conversationSyncRetryTimerRef.current) {
+        clearTimeout(conversationSyncRetryTimerRef.current)
+        conversationSyncRetryTimerRef.current = null
+      }
+      if (throttledSyncTimer) {
+        clearTimeout(throttledSyncTimer)
+        throttledSyncTimer = null
+      }
+      conversationSyncPendingRef.current = false
+      closeStream()
+    }
+  }, [conversation.open, conversation.mode, conversation.taskId, conversation.threadId, agentById])
+
+  // Sync conversation task status from tasks list
+  useEffect(() => {
+    if (!conversation.taskId) return
+    const currentTaskId = conversation.taskId
+    const match = tasks.find((task) => task.id === currentTaskId)
+    const nextStatus = typeof match?.status === 'string' ? match.status : ''
+    const nextThreadId = typeof match?.thread_id === 'string' ? match.thread_id : ''
+    if ((!nextStatus || nextStatus === conversation.taskStatus) && (!nextThreadId || conversation.threadId)) return
+
+    setConversation((prev) => {
+      if (prev.taskId !== currentTaskId) return prev
+      const updates = {}
+      if (nextStatus && prev.taskStatus !== nextStatus) {
+        updates.taskStatus = nextStatus
+        updates.loading = isTaskActivelyRunning(nextStatus)
+      }
+      if (!prev.threadId && nextThreadId) {
+        updates.threadId = nextThreadId
+      }
+      if (Object.keys(updates).length === 0) return prev
+      return { ...prev, ...updates }
+    })
+  }, [tasks, conversation.taskId, conversation.taskStatus, conversation.threadId])
+
+  // Cleanup on unmount
+  useEffect(() => {
+    return () => {
+      streamAbortRef.current?.abort()
+      if (conversationSyncRetryTimerRef.current) {
+        clearTimeout(conversationSyncRetryTimerRef.current)
+        conversationSyncRetryTimerRef.current = null
+      }
+      conversationSyncPendingRef.current = false
+    }
+  }, [])
+
+  function closeConversationDrawer() {
+    viewingChatIdRef.current = ''
+    streamAbortRef.current?.abort()
+    streamAbortRef.current = null
+    setConversation(INITIAL_CONVERSATION)
+  }
+
+  return {
+    conversation, setConversation,
+    conversationHeaderAgent,
+    activePlanThreadId,
+    streamAbortRef, threadIdRef,
+    viewingChatIdRef,
+    prevThinkingChatIdsRef,
+    closeConversationDrawer,
+  }
+}

package/ui/src/hooks/useTasks.js

@@ -0,0 +1,161 @@
+import { useState, useRef, useEffect, useMemo } from 'react'
+import { ApiError, fetchTasks, fetchPlans, fetchChats } from '../api'
+import { errorText, getPendingCount, loadHiddenChatsByWorkspace, saveHiddenChatsByWorkspace } from '../lib/conversationUtils'
+
+export function useTasks({ activeWorkspaceName, setWorkspaceError }) {
+  const [tasks, setTasks] = useState([])
+  const [tasksLoading, setTasksLoading] = useState(false)
+  const [tasksError, setTasksError] = useState('')
+  const [taskFailureNotice, setTaskFailureNotice] = useState(null)
+  const [followupForTaskId, setFollowupForTaskId] = useState('')
+
+  const [sidebarPlans, setSidebarPlans] = useState([])
+  const [sidebarPlansLoading, setSidebarPlansLoading] = useState(false)
+  const [sidebarChats, setSidebarChats] = useState([])
+  const [sidebarChatsLoading, setSidebarChatsLoading] = useState(false)
+  const [hiddenChatsByWorkspace, setHiddenChatsByWorkspace] = useState(loadHiddenChatsByWorkspace)
+  const [unreadChatIds, setUnreadChatIds] = useState(() => new Set())
+
+  const tasksRefreshTimerRef = useRef(null)
+  const tasksRefreshInFlightRef = useRef(false)
+  const tasksRefreshQueuedRef = useRef(false)
+  const tasksInitialLoadDoneRef = useRef(false)
+  const chatsPollTimerRef = useRef(null)
+  const tasksRef = useRef(tasks)
+
+  const pendingCount = useMemo(() => getPendingCount(tasks), [tasks])
+
+  useEffect(() => { tasksRef.current = tasks }, [tasks])
+  useEffect(() => { setTaskFailureNotice(null) }, [activeWorkspaceName])
+  useEffect(() => { saveHiddenChatsByWorkspace(hiddenChatsByWorkspace) }, [hiddenChatsByWorkspace])
+
+  async function loadTasks() {
+    if (!tasksInitialLoadDoneRef.current) {
+      setTasksLoading(true)
+    }
+    setTasksError('')
+    try {
+      setTasks(await fetchTasks(300))
+      tasksInitialLoadDoneRef.current = true
+    } catch (error) {
+      if (error instanceof ApiError && error.code === 'NO_ACTIVE_WORKSPACE') {
+        setTasks([])
+        setTasksError('No active workspace.')
+        return
+      }
+      setTasksError(errorText(error))
+    } finally {
+      setTasksLoading(false)
+    }
+  }
+
+  async function loadPlans() {
+    setSidebarPlansLoading(true)
+    try {
+      setSidebarPlans(await fetchPlans(20))
+    } catch (error) {
+      if (error instanceof ApiError && error.code === 'NO_ACTIVE_WORKSPACE') {
+        setSidebarPlans([])
+        return
+      }
+      if (error instanceof ApiError && error.code === 'REQUEST_TIMEOUT') {
+        return
+      }
+      setWorkspaceError((prev) => prev || errorText(error))
+    } finally {
+      setSidebarPlansLoading(false)
+    }
+  }
+
+  async function loadChats({ silent = false } = {}) {
+    if (!silent) {
+      setSidebarChatsLoading(true)
+    }
+    try {
+      setSidebarChats(await fetchChats(20))
+    } catch (error) {
+      if (error instanceof ApiError && error.code === 'NO_ACTIVE_WORKSPACE') {
+        setSidebarChats([])
+        return
+      }
+      if (error instanceof ApiError && error.code === 'REQUEST_TIMEOUT') {
+        return
+      }
+      setWorkspaceError((prev) => prev || errorText(error))
+    } finally {
+      if (!silent) {
+        setSidebarChatsLoading(false)
+      }
+    }
+  }
+
+  async function flushTasksRefresh() {
+    if (tasksRefreshInFlightRef.current) {
+      tasksRefreshQueuedRef.current = true
+      return
+    }
+    tasksRefreshInFlightRef.current = true
+    try {
+      do {
+        tasksRefreshQueuedRef.current = false
+        await loadTasks()
+      } while (tasksRefreshQueuedRef.current)
+    } finally {
+      tasksRefreshInFlightRef.current = false
+    }
+  }
+
+  function scheduleTasksRefresh(delayMs = 250) {
+    if (tasksRefreshTimerRef.current) {
+      clearTimeout(tasksRefreshTimerRef.current)
+    }
+    tasksRefreshTimerRef.current = setTimeout(() => {
+      tasksRefreshTimerRef.current = null
+      void flushTasksRefresh()
+    }, delayMs)
+  }
+
+  function clearTasksData() {
+    setTasks([])
+    tasksInitialLoadDoneRef.current = false
+    setTasksError('')
+    setSidebarPlans([])
+    setSidebarPlansLoading(false)
+    setSidebarChats([])
+    setSidebarChatsLoading(false)
+    if (chatsPollTimerRef.current) {
+      clearInterval(chatsPollTimerRef.current)
+      chatsPollTimerRef.current = null
+    }
+  }
+
+  // Cleanup on unmount
+  useEffect(() => {
+    return () => {
+      if (tasksRefreshTimerRef.current) {
+        clearTimeout(tasksRefreshTimerRef.current)
+        tasksRefreshTimerRef.current = null
+      }
+      if (chatsPollTimerRef.current) {
+        clearInterval(chatsPollTimerRef.current)
+        chatsPollTimerRef.current = null
+      }
+      tasksRefreshQueuedRef.current = false
+    }
+  }, [])
+
+  return {
+    tasks, setTasks,
+    tasksLoading, tasksError, setTasksError,
+    taskFailureNotice, setTaskFailureNotice,
+    followupForTaskId, setFollowupForTaskId,
+    pendingCount,
+    sidebarPlans, setSidebarPlans, sidebarPlansLoading,
+    sidebarChats, sidebarChatsLoading,
+    hiddenChatsByWorkspace, setHiddenChatsByWorkspace,
+    unreadChatIds, setUnreadChatIds,
+    tasksRef, chatsPollTimerRef,
+    loadTasks, loadPlans, loadChats,
+    scheduleTasksRefresh, clearTasksData,
+  }
+}

package/ui/src/hooks/useWorkspace.js

@@ -0,0 +1,259 @@
+import { useState, useRef, useEffect } from 'react'
+import {
+  ApiError,
+  fetchWorkspaces,
+  fetchContextFiles,
+  fetchCodeFolders,
+  fetchRuntimeServices,
+  openRuntimeServiceStream,
+} from '../api'
+import { errorText } from '../lib/conversationUtils'
+
+export function useWorkspace() {
+  const [workspaces, setWorkspaces] = useState([])
+  const [activeWorkspaceName, setActiveWorkspaceName] = useState('')
+  const [workspacesLoading, setWorkspacesLoading] = useState(false)
+  const [workspaceError, setWorkspaceError] = useState('')
+
+  const [isOnboardingOpen, setIsOnboardingOpen] = useState(false)
+  const [onboardingError, setOnboardingError] = useState('')
+  const [onboardingLoading, setOnboardingLoading] = useState(false)
+  const [deleteWorkspaceLoading, setDeleteWorkspaceLoading] = useState(false)
+  const [deleteWorkspaceError, setDeleteWorkspaceError] = useState('')
+  const [openOrchestratorConfigRequest, setOpenOrchestratorConfigRequest] = useState(0)
+
+  const [contextData, setContextData] = useState({ folders: [], files: [] })
+  const [contextLoading, setContextLoading] = useState(false)
+  const [contextError, setContextError] = useState('')
+  const [codeFolders, setCodeFolders] = useState([])
+  const [codeLoading, setCodeLoading] = useState(false)
+  const [codeError, setCodeError] = useState('')
+
+  const [runtimeServices, setRuntimeServices] = useState([])
+  const [selectedServiceId, setSelectedServiceId] = useState('')
+  const [runtimeServiceLogsById, setRuntimeServiceLogsById] = useState(() => ({}))
+  const [runtimeServiceStreamError, setRuntimeServiceStreamError] = useState('')
+
+  const runtimeServicesPollTimerRef = useRef(null)
+  const runtimeServiceStreamCloseRef = useRef(null)
+
+  const hasAnyWorkspace = workspaces.length > 0
+
+  async function refreshWorkspaces() {
+    const next = await fetchWorkspaces()
+    setWorkspaces(next)
+    const active = next.find((ws) => ws.active)?.name || ''
+    setActiveWorkspaceName(active)
+    return { next, active }
+  }
+
+  async function loadContext() {
+    setContextLoading(true)
+    setContextError('')
+    try {
+      setContextData(await fetchContextFiles())
+    } catch (error) {
+      if (error instanceof ApiError && error.code === 'NO_ACTIVE_WORKSPACE') {
+        setContextData({ folders: [], files: [] })
+        setContextError('No active workspace.')
+        return
+      }
+      setContextError(errorText(error))
+    } finally {
+      setContextLoading(false)
+    }
+  }
+
+  async function loadCode() {
+    setCodeLoading(true)
+    setCodeError('')
+    try {
+      setCodeFolders(await fetchCodeFolders())
+    } catch (error) {
+      if (error instanceof ApiError && error.code === 'NO_ACTIVE_WORKSPACE') {
+        setCodeFolders([])
+        setCodeError('No active workspace.')
+        return
+      }
+      setCodeError(errorText(error))
+    } finally {
+      setCodeLoading(false)
+    }
+  }
+
+  async function loadRuntimeServices() {
+    try {
+      const next = await fetchRuntimeServices()
+      setRuntimeServices(next)
+      if (selectedServiceId && !next.some((service) => service.id === selectedServiceId)) {
+        setSelectedServiceId('')
+        setRuntimeServiceStreamError('')
+      }
+    } catch (error) {
+      if (error instanceof ApiError && error.code === 'NO_ACTIVE_WORKSPACE') {
+        setRuntimeServices([])
+        setSelectedServiceId('')
+        return
+      }
+      if (error instanceof ApiError && error.code === 'REQUEST_TIMEOUT') {
+        return
+      }
+    }
+  }
+
+  function upsertRuntimeService(nextService) {
+    if (!nextService || typeof nextService !== 'object' || !nextService.id) {
+      return
+    }
+    setRuntimeServices((prev) => {
+      const index = prev.findIndex((service) => service.id === nextService.id)
+      if (index === -1) {
+        return [nextService, ...prev]
+      }
+      const next = [...prev]
+      next[index] = { ...next[index], ...nextService }
+      return next
+    })
+  }
+
+  function clearWorkspaceData() {
+    setContextData({ folders: [], files: [] })
+    setCodeFolders([])
+    setCodeLoading(false)
+    setContextError('')
+    setCodeError('')
+    setRuntimeServices([])
+    setSelectedServiceId('')
+    setRuntimeServiceLogsById({})
+    setRuntimeServiceStreamError('')
+    runtimeServiceStreamCloseRef.current?.()
+    runtimeServiceStreamCloseRef.current = null
+    if (runtimeServicesPollTimerRef.current) {
+      clearInterval(runtimeServicesPollTimerRef.current)
+      runtimeServicesPollTimerRef.current = null
+    }
+  }
+
+  // Runtime services polling
+  useEffect(() => {
+    if (!activeWorkspaceName) {
+      setRuntimeServices([])
+      setSelectedServiceId('')
+      setRuntimeServiceLogsById({})
+      setRuntimeServiceStreamError('')
+      return
+    }
+
+    void loadRuntimeServices()
+
+    if (runtimeServicesPollTimerRef.current) {
+      clearInterval(runtimeServicesPollTimerRef.current)
+    }
+    runtimeServicesPollTimerRef.current = setInterval(() => {
+      void loadRuntimeServices()
+    }, 3000)
+
+    return () => {
+      if (runtimeServicesPollTimerRef.current) {
+        clearInterval(runtimeServicesPollTimerRef.current)
+        runtimeServicesPollTimerRef.current = null
+      }
+    }
+  }, [activeWorkspaceName])
+
+  // Runtime service stream
+  useEffect(() => {
+    runtimeServiceStreamCloseRef.current?.()
+    runtimeServiceStreamCloseRef.current = null
+    setRuntimeServiceStreamError('')
+
+    if (!selectedServiceId) {
+      return
+    }
+
+    const close = openRuntimeServiceStream(selectedServiceId, {
+      onReady: (payload) => {
+        if (!payload || typeof payload !== 'object') {
+          return
+        }
+        if (payload.service && typeof payload.service === 'object') {
+          upsertRuntimeService(payload.service)
+        }
+        if (Array.isArray(payload.logs)) {
+          setRuntimeServiceLogsById((prev) => ({
+            ...prev,
+            [selectedServiceId]: payload.logs,
+          }))
+        }
+      },
+      onLog: (payload) => {
+        const entry = payload?.entry
+        if (!entry || typeof entry !== 'object') {
+          return
+        }
+        setRuntimeServiceLogsById((prev) => {
+          const existing = Array.isArray(prev[selectedServiceId]) ? prev[selectedServiceId] : []
+          const nextLogs = [...existing, entry]
+          if (nextLogs.length > 2000) {
+            nextLogs.splice(0, nextLogs.length - 2000)
+          }
+          return {
+            ...prev,
+            [selectedServiceId]: nextLogs,
+          }
+        })
+      },
+      onStatus: (payload) => {
+        const nextService = payload?.service
+        if (!nextService || typeof nextService !== 'object') {
+          return
+        }
+        upsertRuntimeService(nextService)
+      },
+      onError: () => {
+        setRuntimeServiceStreamError('Service log stream disconnected.')
+      },
+    })
+
+    runtimeServiceStreamCloseRef.current = close
+    return () => {
+      close()
+      if (runtimeServiceStreamCloseRef.current === close) {
+        runtimeServiceStreamCloseRef.current = null
+      }
+    }
+  }, [selectedServiceId])
+
+  // Cleanup on unmount
+  useEffect(() => {
+    return () => {
+      if (runtimeServicesPollTimerRef.current) {
+        clearInterval(runtimeServicesPollTimerRef.current)
+        runtimeServicesPollTimerRef.current = null
+      }
+      runtimeServiceStreamCloseRef.current?.()
+      runtimeServiceStreamCloseRef.current = null
+    }
+  }, [])
+
+  return {
+    workspaces, setWorkspaces,
+    activeWorkspaceName, setActiveWorkspaceName,
+    workspacesLoading, setWorkspacesLoading,
+    workspaceError, setWorkspaceError,
+    hasAnyWorkspace,
+    isOnboardingOpen, setIsOnboardingOpen,
+    onboardingError, setOnboardingError,
+    onboardingLoading, setOnboardingLoading,
+    deleteWorkspaceLoading, setDeleteWorkspaceLoading,
+    deleteWorkspaceError, setDeleteWorkspaceError,
+    openOrchestratorConfigRequest, setOpenOrchestratorConfigRequest,
+    contextData, setContextData, contextLoading, contextError, setContextError,
+    codeFolders, setCodeFolders, codeLoading, setCodeLoading, codeError, setCodeError,
+    runtimeServices, selectedServiceId, setSelectedServiceId,
+    runtimeServiceLogsById, runtimeServiceStreamError, setRuntimeServiceStreamError,
+    refreshWorkspaces, loadContext, loadCode, loadRuntimeServices,
+    upsertRuntimeService, clearWorkspaceData,
+    runtimeServicesPollTimerRef,
+  }
+}

package/ui/src/lib/agentIcon.js

@@ -0,0 +1,10 @@
+const AGENT_ICONS = ['🔎', '✏️', '📊', '🧠', '🛠', '🧪', '🛰️', '🧩']
+
+export function iconForAgent(id) {
+  const text = String(id ?? '')
+  let hash = 0
+  for (let i = 0; i < text.length; i += 1) {
+    hash = (hash * 31 + text.charCodeAt(i)) >>> 0
+  }
+  return AGENT_ICONS[hash % AGENT_ICONS.length]
+}