feat(app): add question tool UI for web

packages/app/src/components/prompt-input.tsx

@@ -1270,6 +1270,12 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
     clearInput()
     addOptimisticMessage()
 
+    // Reject any pending questions for this session
+    const pendingQuestions = sync.data.question?.[session.id] ?? []
+    for (const q of pendingQuestions) {
+      sdk.client.question.reject({ requestID: q.id }).catch(() => {})
+    }
+
     client.session
       .prompt({
         sessionID: session.id,

packages/app/src/context/global-sync.tsx

@@ -16,6 +16,7 @@ import {
   type LspStatus,
   type VcsInfo,
   type PermissionRequest,
+  type QuestionRequest,
   createOpencodeClient,
 } from "@opencode-ai/sdk/v2/client"
 import { createStore, produce, reconcile } from "solid-js/store"
@@ -48,6 +49,9 @@ type State = {
   permission: {
     [sessionID: string]: PermissionRequest[]
   }
+  question: {
+    [sessionID: string]: QuestionRequest[]
+  }
   mcp: {
     [name: string]: McpStatus
   }
@@ -96,6 +100,7 @@ function createGlobalSync() {
         session_diff: {},
         todo: {},
         permission: {},
+        question: {},
         mcp: {},
         lsp: [],
         vcs: undefined,
@@ -205,6 +210,38 @@ function createGlobalSync() {
               }
             })
           }),
+          sdk.question.list().then((x) => {
+            const grouped: Record<string, QuestionRequest[]> = {}
+            for (const question of x.data ?? []) {
+              if (!question?.id || !question.sessionID) continue
+              const existing = grouped[question.sessionID]
+              if (existing) {
+                existing.push(question)
+                continue
+              }
+              grouped[question.sessionID] = [question]
+            }
+
+            batch(() => {
+              for (const sessionID of Object.keys(store.question)) {
+                if (grouped[sessionID]) continue
+                setStore("question", sessionID, [])
+              }
+              for (const [sessionID, questions] of Object.entries(grouped)) {
+                setStore(
+                  "question",
+                  sessionID,
+                  reconcile(
+                    questions
+                      .filter((q) => !!q?.id)
+                      .slice()
+                      .sort((a, b) => a.id.localeCompare(b.id)),
+                    { key: "id" },
+                  ),
+                )
+              }
+            })
+          }),
         ]).then(() => {
           setStore("status", "complete")
         })
@@ -393,6 +430,44 @@ function createGlobalSync() {
         )
         break
       }
+      case "question.asked": {
+        const sessionID = event.properties.sessionID
+        const questions = store.question[sessionID]
+        if (!questions) {
+          setStore("question", sessionID, [event.properties])
+          break
+        }
+
+        const result = Binary.search(questions, event.properties.id, (q) => q.id)
+        if (result.found) {
+          setStore("question", sessionID, result.index, reconcile(event.properties))
+          break
+        }
+
+        setStore(
+          "question",
+          sessionID,
+          produce((draft) => {
+            draft.splice(result.index, 0, event.properties)
+          }),
+        )
+        break
+      }
+      case "question.replied":
+      case "question.rejected": {
+        const questions = store.question[event.properties.sessionID]
+        if (!questions) break
+        const result = Binary.search(questions, event.properties.requestID, (q) => q.id)
+        if (!result.found) break
+        setStore(
+          "question",
+          event.properties.sessionID,
+          produce((draft) => {
+            draft.splice(result.index, 1)
+          }),
+        )
+        break
+      }
       case "lsp.updated": {
         const sdk = createOpencodeClient({
           baseUrl: globalSDK.url,

packages/app/src/pages/directory-layout.tsx

@@ -7,6 +7,7 @@ import { LocalProvider } from "@/context/local"
 import { base64Decode } from "@opencode-ai/util/encode"
 import { DataProvider } from "@opencode-ai/ui/context"
 import { iife } from "@opencode-ai/util/iife"
+import type { QuestionAnswer } from "@opencode-ai/sdk/v2"
 
 export default function Layout(props: ParentProps) {
   const params = useParams()
@@ -21,12 +22,23 @@ export default function Layout(props: ParentProps) {
           {iife(() => {
             const sync = useSync()
             const sdk = useSDK()
-            const respond = (input: {
+            const respondPermission = (input: {
               sessionID: string
               permissionID: string
               response: "once" | "always" | "reject"
             }) => sdk.client.permission.respond(input)
 
+            const respondQuestion = (input: { sessionID: string; questionID: string; answers: QuestionAnswer[] }) =>
+              sdk.client.question.reply({
+                requestID: input.questionID,
+                answers: input.answers,
+              })
+
+            const rejectQuestion = (input: { sessionID: string; questionID: string }) =>
+              sdk.client.question.reject({
+                requestID: input.questionID,
+              })
+
             const navigateToSession = (sessionID: string) => {
               navigate(`/${params.dir}/session/${sessionID}`)
             }
@@ -35,7 +47,9 @@ export default function Layout(props: ParentProps) {
               <DataProvider
                 data={sync.data}
                 directory={directory()}
-                onPermissionRespond={respond}
+                onPermissionRespond={respondPermission}
+                onQuestionRespond={respondQuestion}
+                onQuestionReject={rejectQuestion}
                 onNavigateToSession={navigateToSession}
               >
                 <LocalProvider>{props.children}</LocalProvider>