ci: use bun 1.4.0 instead of canary for publish builds

Co-authored-by: Aiden Cline <63023139+rekram1-node@users.noreply.github.com>
Co-authored-by: opencode-agent[bot] <219766164+opencode-agent[bot]@users.noreply.github.com>

.github/workflows/deploy-www.yml

@@ -27,7 +27,6 @@ jobs:
         working-directory: packages/www
         run: bun run build
         env:
-          BLUME_ENV: ${{ github.ref_name == 'v2' && 'production' || 'dev' }}
           CLOUDFLARE_ENV: ${{ github.ref_name == 'v2' && 'production' || 'dev' }}
 
       - name: Deploy

.github/workflows/publish.yml

@@ -91,7 +91,7 @@ jobs:
 
       - uses: ./.github/actions/setup-bun
         with:
-          bun-version: canary # Bun 1.4 until its stable release is published
+          bun-version: 1.4.0
 
       - name: Setup git committer
         id: committer
@@ -113,7 +113,7 @@ jobs:
         id: build
         run: ./packages/cli/script/build.ts ${{ (github.ref_name == 'beta' && '--sourcemaps') || '' }}
         env:
-          BUN_COMPILE_RELEASE: canary
+          BUN_COMPILE_RELEASE: bun-v1.4.0
           OPENCODE_VERSION: ${{ needs.version.outputs.version }}
           OPENCODE_RELEASE: ${{ needs.version.outputs.release }}
           GH_REPO: ${{ needs.version.outputs.repo }}

nix/hashes.json

@@ -1,8 +1,8 @@
 {
   "nodeModules": {
-    "x86_64-linux": "sha256-PatsUdaitHvSUpS5gkC5J2rsUNB5vwJKqHdlOFaKk70=",
-    "aarch64-linux": "sha256-gTRQMAADH/SpQ8yh+YS2IcnmQxnJcU4FUah2YfrKeP8=",
-    "aarch64-darwin": "sha256-QTqlwmugYh+iu5Sh/Hxv01NXH/OhzcQ8ObVUbA9A8AM=",
-    "x86_64-darwin": "sha256-0DPAbNCVw2nUMWkIGEhB6saMdxRRwAJi7wAoWCQc7xQ="
+    "x86_64-linux": "sha256-tvhHO7NdDnBWtyaOj+kVX0Tzcv3O0uISbHC4V71kA0M=",
+    "aarch64-linux": "sha256-x3F43TL7BisEuXlJw7QS/DJoSzZWuNxbgn7hFCsTdXU=",
+    "aarch64-darwin": "sha256-y2r5Qy/XNgnvuzpnGMtwV5ZmhksUN2AUPLjbb40HYIE=",
+    "x86_64-darwin": "sha256-TS68JE40IaEa7ny0ATPUnEj8EV1CKtnGTPpyvZFwO7A="
   }
 }

package.json

@@ -52,7 +52,7 @@
       "@opentui/core": "0.5.6",
       "@opentui/keymap": "0.5.6",
       "@opentui/solid": "0.5.6",
-      "@tanstack/solid-virtual": "3.13.32",
+      "@tanstack/solid-virtual": "3.13.37",
       "@shikijs/stream": "4.2.0",
       "@standard-schema/spec": "1.1.0",
       "ulid": "3.0.1",
@@ -174,7 +174,7 @@
     "@ai-sdk/google@3.0.73": "patches/@ai-sdk%2Fgoogle@3.0.73.patch",
     "@pierre/trees@1.0.0-beta.4": "patches/@pierre%2Ftrees@1.0.0-beta.4.patch",
     "@modelcontextprotocol/sdk@1.29.0": "patches/@modelcontextprotocol%2Fsdk@1.29.0.patch",
-    "@tanstack/virtual-core@3.17.3": "patches/@tanstack%2Fvirtual-core@3.17.3.patch",
+    "@tanstack/virtual-core@3.17.8": "patches/@tanstack%2Fvirtual-core@3.17.8.patch",
     "@ff-labs/fff-bun@0.10.5": "patches/@ff-labs%2Ffff-bun@0.10.5.patch"
   }
 }

packages/ai/src/protocols/gemini.ts

@@ -212,7 +212,6 @@ type GeminiEvent = Schema.Schema.Type<typeof GeminiEvent>
 interface ParserState {
   readonly finishReason?: string
   readonly hasToolCalls: boolean
-  readonly nextToolCallId: number
   readonly promptFeedback?: GeminiPromptFeedback
   readonly usage?: Usage
   readonly lifecycle: Lifecycle.State
@@ -580,7 +579,6 @@ const step = (state: ParserState, event: GeminiEvent) => {
   const events: LLMEvent[] = []
   let hasToolCalls = nextState.hasToolCalls
   let lifecycle = nextState.lifecycle
-  let nextToolCallId = nextState.nextToolCallId
   let reasoningSignature = nextState.reasoningSignature
   let textSignature = nextState.textSignature
 
@@ -620,7 +618,9 @@ const step = (state: ParserState, event: GeminiEvent) => {
 
     if ("functionCall" in part) {
       const input = part.functionCall.args === undefined ? {} : part.functionCall.args
-      const id = `tool_${nextToolCallId++}`
+      // Gemini 2.0+ and Vertex supply a unique function call ID on the part; when omitted (e.g. Gemini 1.5),
+      // generate a globally unique ID rather than a per-request counter to prevent cross-request collisions in downstream registries.
+      const id = part.functionCall.id ?? `tool_${crypto.randomUUID().replaceAll("-", "")}`
       const metadata = {
         ...(part.functionCall.id === undefined ? {} : { functionCallId: part.functionCall.id }),
         ...(part.thoughtSignature === undefined ? {} : { thoughtSignature: part.thoughtSignature }),
@@ -649,7 +649,6 @@ const step = (state: ParserState, event: GeminiEvent) => {
       ...nextState,
       hasToolCalls,
       lifecycle,
-      nextToolCallId,
       reasoningSignature,
       textSignature,
       finishReason: candidate.finishReason ?? nextState.finishReason,
@@ -673,7 +672,7 @@ export const protocol = Protocol.make({
   },
   stream: {
     event: Protocol.jsonEvent(GeminiEvent),
-    initial: () => ({ hasToolCalls: false, nextToolCallId: 0, lifecycle: Lifecycle.initial() }),
+    initial: () => ({ hasToolCalls: false, lifecycle: Lifecycle.initial() }),
     step,
     onHalt: finish,
   },

packages/ai/src/protocols/index.ts

@@ -8,3 +8,4 @@ export * as OpenAICompatibleResponses from "./openai-compatible-responses.js"
 export * as OpenAIResponses from "./openai-responses.js"
 export * as OpenResponses from "./open-responses.js"
 export * as OpenResponsesChannel from "./open-responses-channel.js"
+export * as XAIResponses from "./xai-responses.js"

packages/ai/src/protocols/open-responses-channel.ts

@@ -10,6 +10,7 @@ import {
 } from "../route/transport/index.js"
 import * as ProviderShared from "./shared.js"
 import { OpenResponses } from "./open-responses.js"
+import { OpenResponsesContinuation } from "./open-responses-continuation.js"
 
 const WebSocketResponseCreate = Schema.StructWithRest(Schema.Struct({ type: Schema.tag("response.create") }), [
   Schema.Record(Schema.String, Schema.Unknown),
@@ -25,11 +26,6 @@ export interface Options {
   readonly enabled?: (url: string) => boolean
   readonly url?: (url: string) => string
   readonly headers?: (headers: Headers.Headers) => Headers.Headers
-  readonly driver?: (input: {
-    readonly request: Readonly<Record<string, unknown>>
-    readonly message: string
-    readonly base: WebSocketChannelDriver
-  }) => WebSocketChannelDriver
 }
 
 export interface Prepared {
@@ -158,7 +154,13 @@ export const transport = <Body>(options: Options): Transport<Body, Prepared, str
                   url: yield* WebSocketTransport.toWebSocketUrl(options.url?.(parts.url) ?? parts.url),
                   headers,
                   rotateAfterMs: options.rotateAfterMs,
-                  driver: options.driver?.({ request: create.request, message: create.message, base }) ?? base,
+                  driver: OpenResponsesContinuation.driver({
+                    id: options.id,
+                    name: options.name,
+                    request: create.request,
+                    message: create.message,
+                    base,
+                  }),
                 }
               })
             : undefined

packages/ai/src/protocols/open-responses-continuation.ts

@@ -4,7 +4,7 @@ import { Effect, Option, Schema } from "effect"
 import * as ProviderShared from "./shared.js"
 import { OpenResponses } from "./open-responses.js"
 
-const PROTOCOL = "openai-responses.websocket.v1"
+const PROTOCOL = "open-responses.websocket.v1"
 const VERSION = 1
 const decodeEvent = Schema.decodeUnknownEffect(OpenResponses.protocol.stream.event)
 
@@ -161,4 +161,4 @@ export const driver = (input: DriverInput): WebSocketChannelDriver => {
   }
 }
 
-export const OpenAIResponsesChannel = { driver } as const
+export const OpenResponsesContinuation = { driver } as const

packages/ai/src/protocols/open-responses.ts

@@ -42,8 +42,12 @@ const OpenResponsesInputImage = Schema.Struct({
 const OpenResponsesInputFile = Schema.Struct({
   type: Schema.tag("input_file"),
   filename: Schema.String,
-  file_data: Schema.String,
-  mime_type: Schema.optional(Schema.String),
+  file_data: Schema.optional(Schema.String),
+  file_url: Schema.optional(Schema.String),
+})
+const OpenResponsesInputVideo = Schema.Struct({
+  type: Schema.tag("input_video"),
+  video_url: Schema.String,
 })
 const MediaInput = Schema.Union([OpenResponsesInputImage, OpenResponsesInputFile])
 export type MediaInput = Schema.Schema.Type<typeof MediaInput>
@@ -54,7 +58,7 @@ const OpenResponsesOutputText = Schema.Struct({
   text: Schema.String,
 })
 
-export const MessagePhase = Schema.Literals(["commentary", "final_answer"])
+export const MessagePhase = Schema.NullOr(Schema.Literals(["commentary", "final_answer"]))
 type MessagePhase = Schema.Schema.Type<typeof MessagePhase>
 
 const OpenResponsesReasoningSummaryText = Schema.Struct({
@@ -81,6 +85,7 @@ const OpenResponsesFunctionCallOutputContent = Schema.Union([
   OpenResponsesInputText,
   OpenResponsesInputImage,
   OpenResponsesInputFile,
+  OpenResponsesInputVideo,
 ])
 
 const OpenResponsesFunctionCallOutput = Schema.Union([
@@ -323,7 +328,6 @@ export interface Extension {
     readonly media: ProviderShared.NormalizedMedia
     readonly request: LLMRequest
   }) => MediaInput | undefined
-  readonly messagePhase?: (value: unknown) => MessagePhase | null | undefined
 }
 
 const BASE: Extension = { id: ADAPTER, name: NAME }
@@ -422,18 +426,25 @@ const lowerMedia = Effect.fn("OpenResponses.lowerMedia")(function* (
   part: MediaPart,
   request: LLMRequest,
   extension: Extension,
+  target: "message" | "tool-result",
 ) {
   const media = ProviderShared.normalizeMedia(part)
   const extended = extension.lowerMedia?.({ part, media, request })
   if (extended) return extended
+  const url =
+    typeof part.data === "string" && (part.data.startsWith("https://") || part.data.startsWith("http://"))
+      ? part.data
+      : undefined
   if (!media.mime.startsWith("image/")) {
+    if (target === "tool-result" && media.mime.startsWith("video/"))
+      return { type: "input_video" as const, video_url: url ?? media.dataUrl }
     return {
       type: "input_file" as const,
       filename: part.filename ?? (media.mime === "application/pdf" ? "document.pdf" : "file"),
-      file_data: media.dataUrl,
+      ...(url ? { file_url: url } : { file_data: media.base64 }),
     }
   }
-  return { type: "input_image" as const, image_url: media.dataUrl }
+  return { type: "input_image" as const, image_url: url ?? media.dataUrl }
 })
 
 const lowerUserContent = Effect.fnUntraced(function* (
@@ -442,10 +453,17 @@ const lowerUserContent = Effect.fnUntraced(function* (
   extension: Extension,
 ) {
   if (part.type === "text") return { type: "input_text" as const, text: part.text }
-  if (part.type === "media") return yield* lowerMedia(part, request, extension)
+  if (part.type === "media") return yield* lowerMessageMedia(part, request, extension)
   return yield* ProviderShared.unsupportedContent(extension.name, "user", ["text", "media"])
 })
 
+const lowerMessageMedia = Effect.fnUntraced(function* (part: MediaPart, request: LLMRequest, extension: Extension) {
+  const lowered = yield* lowerMedia(part, request, extension, "message")
+  if (lowered.type === "input_video")
+    return yield* ProviderShared.invalidRequest(`${extension.name} user messages do not support input_video`)
+  return lowered
+})
+
 // Tool results may carry structured text, images, and files. Keep media as provider-native
 // content instead of JSON-stringifying base64 into a prompt string.
 const lowerToolResultContentItem = Effect.fnUntraced(function* (
@@ -458,6 +476,20 @@ const lowerToolResultContentItem = Effect.fnUntraced(function* (
     { type: "media", mediaType: item.mime, data: item.uri, filename: item.name },
     request,
     extension,
+    "tool-result",
+  )
+})
+
+const lowerHostedToolResultContentItem = Effect.fnUntraced(function* (
+  item: Content,
+  request: LLMRequest,
+  extension: Extension,
+) {
+  if (item.type === "text") return { type: "input_text" as const, text: item.text }
+  return yield* lowerMessageMedia(
+    { type: "media", mediaType: item.mime, data: item.uri, filename: item.name },
+    request,
+    extension,
   )
 })
 
@@ -510,7 +542,7 @@ const lowerMessages = Effect.fn("OpenResponses.lowerMessages")(function* (reques
         >((groups, part) => {
           const metadata = part.providerMetadata?.[providerMetadataKey]
           const id = itemID(part.providerMetadata, providerMetadataKey)
-          const phase = ProviderShared.isRecord(metadata) ? messagePhase(metadata.phase, extension) : undefined
+          const phase = ProviderShared.isRecord(metadata) ? messagePhase(metadata.phase) : undefined
           const group = groups.at(-1)
           if (group && group.id === id && group.phase === phase) group.parts.push(part)
           else groups.push({ id, phase, parts: [part] })
@@ -567,7 +599,9 @@ const lowerMessages = Effect.fn("OpenResponses.lowerMessages")(function* (reques
             const content: ReadonlyArray<Content> = part.result.value
             input.push({
               role: "user",
-              content: yield* Effect.forEach(content, (item) => lowerToolResultContentItem(item, request, extension)),
+              content: yield* Effect.forEach(content, (item) =>
+                lowerHostedToolResultContentItem(item, request, extension),
+              ),
             })
           }
           if (itemID) hostedToolReferences.add(itemID)
@@ -1159,15 +1193,15 @@ export const initial = (request: LLMRequest, extension: Extension = BASE): Parse
   tools: ToolStream.empty<string>(),
   lifecycle: Lifecycle.initial(),
   messageItems: new Set<string>(),
-  messagePhase: (value) => messagePhase(value, extension),
+  messagePhase,
   messagePhases: {},
   reasoningItems: {},
   store: OpenResponsesOptions.resolve(request).store,
 })
 
-const messagePhase = (value: unknown, extension: Extension): MessagePhase | null | undefined => {
-  if (value === "commentary" || value === "final_answer") return value
-  return extension.messagePhase?.(value)
+const messagePhase = (value: unknown): MessagePhase | undefined => {
+  if (value === null || value === "commentary" || value === "final_answer") return value
+  return undefined
 }
 
 export const protocol = Protocol.make({

packages/ai/src/protocols/openai-responses.ts

@@ -5,14 +5,13 @@ import { Auth } from "../route/auth.js"
 import { Endpoint } from "../route/endpoint.js"
 import { Protocol } from "../route/protocol.js"
 import { HttpTransport } from "../route/transport/index.js"
-import { LLMEvent, LLMRequest, type JsonSchema, type ToolDefinition } from "../schema/index.js"
+import { LLMRequest, type JsonSchema, type ToolDefinition } from "../schema/index.js"
 import { OpenResponses } from "./open-responses.js"
 import { optionalArray, ProviderShared } from "./shared.js"
-import { Lifecycle } from "./utils/lifecycle.js"
 import { OpenAIImage } from "./utils/openai-image.js"
+import { ResponsesHostedTools } from "./utils/responses-hosted-tools.js"
 import { ToolSchemaProjection } from "./utils/tool-schema.js"
-import { OpenResponsesChannel, type Options } from "./open-responses-channel.js"
-import { OpenAIResponsesChannel } from "./openai-responses-channel.js"
+import { OpenResponsesChannel } from "./open-responses-channel.js"
 
 const ADAPTER = "openai-responses"
 const NAME = "OpenAI Responses"
@@ -40,20 +39,8 @@ const OpenAIResponsesToolChoice = Schema.Union([
   Schema.Struct({ type: Schema.tag("image_generation") }),
 ])
 
-const OpenAIResponsesInputItem = Schema.Union([
-  Schema.Struct({
-    type: Schema.tag("message"),
-    id: Schema.optionalKey(Schema.String),
-    role: Schema.tag("assistant"),
-    content: Schema.Array(Schema.Struct({ type: Schema.tag("output_text"), text: Schema.String })),
-    phase: Schema.optionalKey(Schema.NullOr(OpenResponses.MessagePhase)),
-  }),
-  OpenResponses.InputItem,
-])
-
 const OpenAIResponsesCoreFields = {
   ...OpenResponses.coreFields,
-  input: Schema.Array(OpenAIResponsesInputItem),
   tools: optionalArray(OpenAIResponsesTools),
   tool_choice: Schema.optional(OpenAIResponsesToolChoice),
 }
@@ -67,16 +54,6 @@ export type OpenAIResponsesBody = Schema.Schema.Type<typeof OpenAIResponsesBody>
 const extension = {
   id: ADAPTER,
   name: NAME,
-  messagePhase: (value: unknown) => (value === null ? null : undefined),
-  lowerMedia: ({ part, media, request }) => {
-    if (request.model.provider !== "xai" || media.mime !== "application/pdf") return undefined
-    return {
-      type: "input_file",
-      filename: part.filename ?? "document.pdf",
-      file_data: media.base64,
-      mime_type: media.mime,
-    }
-  },
 } satisfies OpenResponses.Extension
 
 const nativeImageToolInput = (tool: ToolDefinition) => {
@@ -128,46 +105,7 @@ const fromRequest = Effect.fn("OpenAIResponses.fromRequest")(function* (request:
   } satisfies OpenAIResponsesBody
 })
 
-type HostedToolData = OpenResponses.StreamItem & {
-  readonly id: string
-  readonly status?: string
-  readonly action?: unknown
-  readonly queries?: unknown
-  readonly results?: unknown
-  readonly code?: string
-  readonly container_id?: string
-  readonly outputs?: unknown
-  readonly server_label?: string
-  readonly output?: unknown
-  readonly result?: string
-  readonly output_format?: "png" | "jpeg" | "webp"
-  readonly error?: unknown
-}
-
-const HOSTED_TOOLS = {
-  web_search_call: { name: "web_search", input: (item) => item.action ?? {} },
-  web_search_preview_call: { name: "web_search_preview", input: (item) => item.action ?? {} },
-  file_search_call: { name: "file_search", input: (item) => ({ queries: item.queries ?? [] }) },
-  code_interpreter_call: {
-    name: "code_interpreter",
-    input: (item) => ({ code: item.code, container_id: item.container_id }),
-  },
-  computer_use_call: { name: "computer_use", input: (item) => item.action ?? {} },
-  image_generation_call: { name: "image_generation", input: () => ({}) },
-  mcp_call: {
-    name: "mcp",
-    input: (item) => ({ server_label: item.server_label, name: item.name, arguments: item.arguments }),
-  },
-  local_shell_call: { name: "local_shell", input: (item) => item.action ?? {} },
-} as const satisfies Record<string, { readonly name: string; readonly input: (item: HostedToolData) => unknown }>
-
-type HostedToolType = keyof typeof HOSTED_TOOLS
-type HostedToolItem = HostedToolData & { readonly type: HostedToolType }
-
-const isHostedToolItem = (item: OpenResponses.StreamItem): item is HostedToolItem =>
-  item.type in HOSTED_TOOLS && typeof item.id === "string" && item.id.length > 0
-
-const hostedToolResult = Effect.fn("OpenAIResponses.hostedToolResult")(function* (item: HostedToolItem) {
+const hostedToolResult = Effect.fn("OpenAIResponses.hostedToolResult")(function* (item: ResponsesHostedTools.Item) {
   const isError = item.error !== undefined && item.error !== null
   if (item.type === "image_generation_call" && item.result) {
     yield* Effect.fromResult(Encoding.decodeBase64(item.result)).pipe(
@@ -188,32 +126,22 @@ const hostedToolResult = Effect.fn("OpenAIResponses.hostedToolResult")(function*
   return isError ? { type: "error" as const, value: item.error } : { type: "json" as const, value: item }
 })
 
-const onHostedToolDone = Effect.fn("OpenAIResponses.onHostedToolDone")(function* (
-  state: OpenResponses.ParserState,
-  item: HostedToolItem,
-) {
-  const tool = HOSTED_TOOLS[item.type]
-  const providerMetadata = OpenResponses.providerMetadata(state, { itemId: item.id })
-  const events: LLMEvent[] = []
-  const lifecycle = Lifecycle.stepStart(state.lifecycle, events)
-  events.push(
-    LLMEvent.toolCall({
-      id: item.id,
-      name: tool.name,
-      input: tool.input(item),
-      providerExecuted: true,
-      providerMetadata,
-    }),
-    LLMEvent.toolResult({
-      id: item.id,
-      name: tool.name,
-      result: yield* hostedToolResult(item),
-      providerExecuted: true,
-      providerMetadata,
-    }),
-  )
-  return [{ ...state, lifecycle }, events] satisfies OpenResponses.StepResult
-})
+const HOSTED_TOOLS = {
+  web_search_call: { name: "web_search", input: (item) => item.action ?? {} },
+  web_search_preview_call: { name: "web_search_preview", input: (item) => item.action ?? {} },
+  file_search_call: { name: "file_search", input: (item) => ({ queries: item.queries ?? [] }) },
+  code_interpreter_call: {
+    name: "code_interpreter",
+    input: (item) => ({ code: item.code, container_id: item.container_id }),
+  },
+  computer_use_call: { name: "computer_use", input: (item) => item.action ?? {} },
+  image_generation_call: { name: "image_generation", input: () => ({}), result: hostedToolResult },
+  mcp_call: {
+    name: "mcp",
+    input: (item) => ({ server_label: item.server_label, name: item.name, arguments: item.arguments }),
+  },
+  local_shell_call: { name: "local_shell", input: (item) => item.action ?? {} },
+} as const satisfies ResponsesHostedTools.Definitions
 
 const step = (state: OpenResponses.ParserState, event: OpenResponses.Event) => {
   if (event.type === "response.reasoning_text.delta" || event.type === "response.reasoning_summary.delta")
@@ -224,8 +152,8 @@ const step = (state: OpenResponses.ParserState, event: OpenResponses.Event) => {
     return event.item_id
       ? Effect.succeed(OpenResponses.onReasoningDone(state, event))
       : ProviderShared.eventError(ADAPTER, `${event.type} is missing item_id`)
-  if (event.type === "response.output_item.done" && event.item && isHostedToolItem(event.item))
-    return onHostedToolDone(state, event.item)
+  if (event.type === "response.output_item.done" && event.item && ResponsesHostedTools.isItem(event.item, HOSTED_TOOLS))
+    return ResponsesHostedTools.onDone(state, event.item, HOSTED_TOOLS)
   return OpenResponses.step(state, event)
 }
 
@@ -247,11 +175,7 @@ const endpoint = Endpoint.path<OpenAIResponsesBody>(PATH, { baseURL: DEFAULT_BAS
 const auth = Auth.none
 
 export const httpTransport = HttpTransport.sseJson.with<OpenAIResponsesBody>()
-export const channelTransport = (options: Omit<Options, "driver">) =>
-  OpenResponsesChannel.transport<OpenAIResponsesBody>({
-    ...options,
-    driver: (input) => OpenAIResponsesChannel.driver({ id: options.id, name: options.name, ...input }),
-  })
+export const channelTransport = OpenResponsesChannel.transport<OpenAIResponsesBody>
 export const transport = channelTransport({
   id: ADAPTER,
   name: NAME,

packages/ai/src/protocols/utils/responses-hosted-tools.ts

@@ -0,0 +1,70 @@
+import { Effect } from "effect"
+import { LLMEvent, type AIError, type ToolResultPart } from "../../schema/index.js"
+import { OpenResponses } from "../open-responses.js"
+import { Lifecycle } from "./lifecycle.js"
+
+export type Item = OpenResponses.StreamItem & {
+  readonly id: string
+  readonly status?: string
+  readonly action?: unknown
+  readonly queries?: unknown
+  readonly results?: unknown
+  readonly code?: string
+  readonly container_id?: string
+  readonly outputs?: unknown
+  readonly server_label?: string
+  readonly output?: unknown
+  readonly result?: string
+  readonly output_format?: "png" | "jpeg" | "webp"
+  readonly error?: unknown
+}
+
+export interface Definition {
+  readonly name: string
+  readonly input: (item: Item) => unknown
+  readonly result?: (item: Item) => Effect.Effect<ToolResultPart["result"], AIError>
+}
+
+export type Definitions = Readonly<Record<string, Definition>>
+
+export const isItem = <Tools extends Definitions>(item: OpenResponses.StreamItem, tools: Tools): item is Item =>
+  item.type in tools && typeof item.id === "string" && item.id.length > 0
+
+export const onDone: (
+  state: OpenResponses.ParserState,
+  item: Item,
+  tools: Definitions,
+) => Effect.Effect<OpenResponses.StepResult, AIError> = Effect.fn("ResponsesHostedTools.onDone")(function* (
+  state,
+  item,
+  tools,
+) {
+  const tool = tools[item.type]
+  if (!tool) return [state, []] satisfies OpenResponses.StepResult
+  const providerMetadata = OpenResponses.providerMetadata(state, { itemId: item.id })
+  const events: LLMEvent[] = []
+  const lifecycle = Lifecycle.stepStart(state.lifecycle, events)
+  events.push(
+    LLMEvent.toolCall({
+      id: item.id,
+      name: tool.name,
+      input: tool.input(item),
+      providerExecuted: true,
+      providerMetadata,
+    }),
+    LLMEvent.toolResult({
+      id: item.id,
+      name: tool.name,
+      result: tool.result
+        ? yield* tool.result(item)
+        : item.error !== undefined && item.error !== null
+          ? { type: "error", value: item.error }
+          : { type: "json", value: item },
+      providerExecuted: true,
+      providerMetadata,
+    }),
+  )
+  return [{ ...state, lifecycle }, events] satisfies OpenResponses.StepResult
+})
+
+export * as ResponsesHostedTools from "./responses-hosted-tools.js"

packages/ai/src/protocols/xai-responses.ts

@@ -0,0 +1,55 @@
+import { Effect } from "effect"
+import { Protocol } from "../route/protocol.js"
+import { OpenResponses } from "./open-responses.js"
+import { ProviderShared } from "./shared.js"
+import { ResponsesHostedTools } from "./utils/responses-hosted-tools.js"
+
+const ADAPTER = "xai-responses"
+const NAME = "xAI Responses"
+
+const extension = {
+  id: ADAPTER,
+  name: NAME,
+} satisfies OpenResponses.Extension
+
+const HOSTED_TOOLS = {
+  web_search_call: { name: "web_search", input: (item) => item.action ?? {} },
+  x_search_call: { name: "x_search", input: (item) => item.action ?? {} },
+  file_search_call: { name: "file_search", input: (item) => ({ queries: item.queries ?? [] }) },
+  code_interpreter_call: {
+    name: "code_interpreter",
+    input: (item) => ({ code: item.code, container_id: item.container_id }),
+  },
+  image_generation_call: { name: "image_generation", input: () => ({}) },
+  mcp_call: {
+    name: "mcp",
+    input: (item) => ({ server_label: item.server_label, name: item.name, arguments: item.arguments }),
+  },
+} as const satisfies ResponsesHostedTools.Definitions
+
+const step = (state: OpenResponses.ParserState, event: OpenResponses.Event) => {
+  if (event.type === "response.reasoning_text.delta" || event.type === "response.reasoning_summary.delta")
+    return event.item_id
+      ? Effect.succeed(OpenResponses.onReasoningDelta(state, event, event.item_id))
+      : ProviderShared.eventError(ADAPTER, `${event.type} is missing item_id`)
+  if (event.type === "response.reasoning_text.done" || event.type === "response.reasoning_summary.done")
+    return event.item_id
+      ? Effect.succeed(OpenResponses.onReasoningDone(state, event))
+      : ProviderShared.eventError(ADAPTER, `${event.type} is missing item_id`)
+  if (event.type === "response.output_item.done" && event.item && ResponsesHostedTools.isItem(event.item, HOSTED_TOOLS))
+    return ResponsesHostedTools.onDone(state, event.item, HOSTED_TOOLS)
+  return OpenResponses.step(state, event)
+}
+
+export const protocol = Protocol.make({
+  id: ADAPTER,
+  body: OpenResponses.protocol.body,
+  stream: {
+    event: OpenResponses.protocol.stream.event,
+    initial: (request) => OpenResponses.initial(request, extension),
+    step,
+    terminal: OpenResponses.terminal,
+  },
+})
+
+export * as XAIResponses from "./xai-responses.js"

packages/ai/src/providers/xai.ts

@@ -5,7 +5,8 @@ import { HttpOptions, ProviderID, type ModelID } from "../schema/index.js"
 import * as OpenAICompatibleProfiles from "./openai-compatible-profile.js"
 import * as OpenAICompatibleChat from "../protocols/openai-compatible-chat.js"
 import * as OpenAIChat from "../protocols/openai-chat.js"
-import * as OpenAIResponses from "../protocols/openai-responses.js"
+import { OpenResponsesChannel } from "../protocols/open-responses-channel.js"
+import { XAIResponses } from "../protocols/xai-responses.js"
 import { XAIImages } from "../protocols/xai-images.js"
 import type { OpenAIOptionsInput } from "./openai-options.js"
 import type { ProviderPackage } from "../provider-package.js"
@@ -34,9 +35,9 @@ const responsesRoute = Route.make({
   id: "openai-responses",
   provider: id,
   providerMetadataKey: "xai",
-  protocol: OpenAIResponses.protocol,
+  protocol: XAIResponses.protocol,
   endpoint: Endpoint.path("/responses", { baseURL: OpenAICompatibleProfiles.profiles.xai.baseURL }),
-  transport: OpenAIResponses.channelTransport({
+  transport: OpenResponsesChannel.transport({
     id: "openai-responses",
     name: "xAI Responses",
     rotateAfterMs: RESPONSES_WEBSOCKET_ROTATE_AFTER_MS,

packages/ai/test/fixtures/recordings/pdf/openai-tool-result.json

@@ -1,7 +1,14 @@
 {
   "version": 1,
   "metadata": {
-    "tags": ["prefix:pdf", "pdf", "provider:openai", "protocol:openai-responses", "tool", "tool-result"],
+    "tags": [
+      "prefix:pdf",
+      "pdf",
+      "provider:openai",
+      "protocol:openai-responses",
+      "tool",
+      "tool-result"
+    ],
     "name": "pdf/openai-tool-result",
     "recordedAt": "2026-07-22T18:15:36.438Z"
   },
@@ -14,7 +21,7 @@
         "headers": {
           "content-type": "application/json"
         },
-        "body": "{\"model\":\"gpt-4o-mini\",\"input\":[{\"role\":\"system\",\"content\":\"Read the PDF returned by the tool and follow the user's response format exactly.\"},{\"role\":\"user\",\"content\":[{\"type\":\"input_text\",\"text\":\"Return only the verification code from the PDF.\"}]},{\"type\":\"function_call\",\"call_id\":\"call_pdf_1\",\"name\":\"read_pdf\",\"arguments\":\"{}\"},{\"type\":\"function_call_output\",\"call_id\":\"call_pdf_1\",\"output\":[{\"type\":\"input_text\",\"text\":\"PDF read successfully\"},{\"type\":\"input_file\",\"filename\":\"verification.pdf\",\"file_data\":\"data:application/pdf;base64,JVBERi0xLjQKMSAwIG9iago8PCAvVHlwZSAvQ2F0YWxvZyAvUGFnZXMgMiAwIFIgPj4KZW5kb2JqCjIgMCBvYmoKPDwgL1R5cGUgL1BhZ2VzIC9LaWRzIFszIDAgUl0gL0NvdW50IDEgPj4KZW5kb2JqCjMgMCBvYmoKPDwgL1R5cGUgL1BhZ2UgL1BhcmVudCAyIDAgUiAvTWVkaWFCb3ggWzAgMCA2MTIgNzkyXSAvUmVzb3VyY2VzIDw8IC9Gb250IDw8IC9GMSA1IDAgUiA+PiA+PiAvQ29udGVudHMgNCAwIFIgPj4KZW5kb2JqCjQgMCBvYmoKPDwgL0xlbmd0aCA3NSA+PgpzdHJlYW0KQlQKL0YxIDE4IFRmCjcyIDcyMCBUZAooUERGIGNhc3NldHRlIHZlcmlmaWNhdGlvbiBjb2RlOiBPUkNISUQtNzM5MSkgVGoKRVQKZW5kc3RyZWFtCmVuZG9iago1IDAgb2JqCjw8IC9UeXBlIC9Gb250IC9TdWJ0eXBlIC9UeXBlMSAvQmFzZUZvbnQgL0hlbHZldGljYSA+PgplbmRvYmoKeHJlZgowIDYKMDAwMDAwMDAwMCA2NTUzNSBmIAowMDAwMDAwMDA5IDAwMDAwIG4gCjAwMDAwMDAwNTggMDAwMDAgbiAKMDAwMDAwMDExNSAwMDAwMCBuIAowMDAwMDAwMjQxIDAwMDAwIG4gCjAwMDAwMDAzNjUgMDAwMDAgbiAKdHJhaWxlcgo8PCAvU2l6ZSA2IC9Sb290IDEgMCBSID4+CnN0YXJ0eHJlZgo0MzUKJSVFT0YK\"}]}],\"tools\":[{\"type\":\"function\",\"name\":\"read_pdf\",\"description\":\"Read the attached PDF.\",\"parameters\":{\"type\":\"object\",\"properties\":{},\"additionalProperties\":false},\"strict\":false}],\"store\":false,\"max_output_tokens\":40,\"temperature\":0,\"stream\":true}"
+        "body": "{\"model\":\"gpt-4o-mini\",\"input\":[{\"role\":\"system\",\"content\":\"Read the PDF returned by the tool and follow the user's response format exactly.\"},{\"role\":\"user\",\"content\":[{\"type\":\"input_text\",\"text\":\"Return only the verification code from the PDF.\"}]},{\"type\":\"function_call\",\"call_id\":\"call_pdf_1\",\"name\":\"read_pdf\",\"arguments\":\"{}\"},{\"type\":\"function_call_output\",\"call_id\":\"call_pdf_1\",\"output\":[{\"type\":\"input_text\",\"text\":\"PDF read successfully\"},{\"type\":\"input_file\",\"filename\":\"verification.pdf\",\"file_data\":\"JVBERi0xLjQKMSAwIG9iago8PCAvVHlwZSAvQ2F0YWxvZyAvUGFnZXMgMiAwIFIgPj4KZW5kb2JqCjIgMCBvYmoKPDwgL1R5cGUgL1BhZ2VzIC9LaWRzIFszIDAgUl0gL0NvdW50IDEgPj4KZW5kb2JqCjMgMCBvYmoKPDwgL1R5cGUgL1BhZ2UgL1BhcmVudCAyIDAgUiAvTWVkaWFCb3ggWzAgMCA2MTIgNzkyXSAvUmVzb3VyY2VzIDw8IC9Gb250IDw8IC9GMSA1IDAgUiA+PiA+PiAvQ29udGVudHMgNCAwIFIgPj4KZW5kb2JqCjQgMCBvYmoKPDwgL0xlbmd0aCA3NSA+PgpzdHJlYW0KQlQKL0YxIDE4IFRmCjcyIDcyMCBUZAooUERGIGNhc3NldHRlIHZlcmlmaWNhdGlvbiBjb2RlOiBPUkNISUQtNzM5MSkgVGoKRVQKZW5kc3RyZWFtCmVuZG9iago1IDAgb2JqCjw8IC9UeXBlIC9Gb250IC9TdWJ0eXBlIC9UeXBlMSAvQmFzZUZvbnQgL0hlbHZldGljYSA+PgplbmRvYmoKeHJlZgowIDYKMDAwMDAwMDAwMCA2NTUzNSBmIAowMDAwMDAwMDA5IDAwMDAwIG4gCjAwMDAwMDAwNTggMDAwMDAgbiAKMDAwMDAwMDExNSAwMDAwMCBuIAowMDAwMDAwMjQxIDAwMDAwIG4gCjAwMDAwMDAzNjUgMDAwMDAgbiAKdHJhaWxlcgo8PCAvU2l6ZSA2IC9Sb290IDEgMCBSID4+CnN0YXJ0eHJlZgo0MzUKJSVFT0YK\"}]}],\"tools\":[{\"type\":\"function\",\"name\":\"read_pdf\",\"description\":\"Read the attached PDF.\",\"parameters\":{\"type\":\"object\",\"properties\":{},\"additionalProperties\":false},\"strict\":false}],\"store\":false,\"max_output_tokens\":40,\"temperature\":0,\"stream\":true}"
       },
       "response": {
         "status": 200,

packages/ai/test/fixtures/recordings/pdf/openai-user-input.json

@@ -1,7 +1,13 @@
 {
   "version": 1,
   "metadata": {
-    "tags": ["prefix:pdf", "pdf", "provider:openai", "protocol:openai-responses", "user-input"],
+    "tags": [
+      "prefix:pdf",
+      "pdf",
+      "provider:openai",
+      "protocol:openai-responses",
+      "user-input"
+    ],
     "name": "pdf/openai-user-input",
     "recordedAt": "2026-07-22T18:15:34.867Z"
   },
@@ -14,7 +20,7 @@
         "headers": {
           "content-type": "application/json"
         },
-        "body": "{\"model\":\"gpt-4o-mini\",\"input\":[{\"role\":\"user\",\"content\":[{\"type\":\"input_file\",\"filename\":\"verification.pdf\",\"file_data\":\"data:application/pdf;base64,JVBERi0xLjQKMSAwIG9iago8PCAvVHlwZSAvQ2F0YWxvZyAvUGFnZXMgMiAwIFIgPj4KZW5kb2JqCjIgMCBvYmoKPDwgL1R5cGUgL1BhZ2VzIC9LaWRzIFszIDAgUl0gL0NvdW50IDEgPj4KZW5kb2JqCjMgMCBvYmoKPDwgL1R5cGUgL1BhZ2UgL1BhcmVudCAyIDAgUiAvTWVkaWFCb3ggWzAgMCA2MTIgNzkyXSAvUmVzb3VyY2VzIDw8IC9Gb250IDw8IC9GMSA1IDAgUiA+PiA+PiAvQ29udGVudHMgNCAwIFIgPj4KZW5kb2JqCjQgMCBvYmoKPDwgL0xlbmd0aCA3NSA+PgpzdHJlYW0KQlQKL0YxIDE4IFRmCjcyIDcyMCBUZAooUERGIGNhc3NldHRlIHZlcmlmaWNhdGlvbiBjb2RlOiBPUkNISUQtNzM5MSkgVGoKRVQKZW5kc3RyZWFtCmVuZG9iago1IDAgb2JqCjw8IC9UeXBlIC9Gb250IC9TdWJ0eXBlIC9UeXBlMSAvQmFzZUZvbnQgL0hlbHZldGljYSA+PgplbmRvYmoKeHJlZgowIDYKMDAwMDAwMDAwMCA2NTUzNSBmIAowMDAwMDAwMDA5IDAwMDAwIG4gCjAwMDAwMDAwNTggMDAwMDAgbiAKMDAwMDAwMDExNSAwMDAwMCBuIAowMDAwMDAwMjQxIDAwMDAwIG4gCjAwMDAwMDAzNjUgMDAwMDAgbiAKdHJhaWxlcgo8PCAvU2l6ZSA2IC9Sb290IDEgMCBSID4+CnN0YXJ0eHJlZgo0MzUKJSVFT0YK\"},{\"type\":\"input_text\",\"text\":\"Return only the verification code from the PDF.\"}]}],\"store\":false,\"max_output_tokens\":40,\"temperature\":0,\"stream\":true}"
+        "body": "{\"model\":\"gpt-4o-mini\",\"input\":[{\"role\":\"user\",\"content\":[{\"type\":\"input_file\",\"filename\":\"verification.pdf\",\"file_data\":\"JVBERi0xLjQKMSAwIG9iago8PCAvVHlwZSAvQ2F0YWxvZyAvUGFnZXMgMiAwIFIgPj4KZW5kb2JqCjIgMCBvYmoKPDwgL1R5cGUgL1BhZ2VzIC9LaWRzIFszIDAgUl0gL0NvdW50IDEgPj4KZW5kb2JqCjMgMCBvYmoKPDwgL1R5cGUgL1BhZ2UgL1BhcmVudCAyIDAgUiAvTWVkaWFCb3ggWzAgMCA2MTIgNzkyXSAvUmVzb3VyY2VzIDw8IC9Gb250IDw8IC9GMSA1IDAgUiA+PiA+PiAvQ29udGVudHMgNCAwIFIgPj4KZW5kb2JqCjQgMCBvYmoKPDwgL0xlbmd0aCA3NSA+PgpzdHJlYW0KQlQKL0YxIDE4IFRmCjcyIDcyMCBUZAooUERGIGNhc3NldHRlIHZlcmlmaWNhdGlvbiBjb2RlOiBPUkNISUQtNzM5MSkgVGoKRVQKZW5kc3RyZWFtCmVuZG9iago1IDAgb2JqCjw8IC9UeXBlIC9Gb250IC9TdWJ0eXBlIC9UeXBlMSAvQmFzZUZvbnQgL0hlbHZldGljYSA+PgplbmRvYmoKeHJlZgowIDYKMDAwMDAwMDAwMCA2NTUzNSBmIAowMDAwMDAwMDA5IDAwMDAwIG4gCjAwMDAwMDAwNTggMDAwMDAgbiAKMDAwMDAwMDExNSAwMDAwMCBuIAowMDAwMDAwMjQxIDAwMDAwIG4gCjAwMDAwMDAzNjUgMDAwMDAgbiAKdHJhaWxlcgo8PCAvU2l6ZSA2IC9Sb290IDEgMCBSID4+CnN0YXJ0eHJlZgo0MzUKJSVFT0YK\"},{\"type\":\"input_text\",\"text\":\"Return only the verification code from the PDF.\"}]}],\"store\":false,\"max_output_tokens\":40,\"temperature\":0,\"stream\":true}"
       },
       "response": {
         "status": 200,

packages/ai/test/fixtures/recordings/pdf/xai-tool-result.json

@@ -1,9 +1,17 @@
 {
   "version": 1,
   "metadata": {
-    "tags": ["prefix:pdf", "pdf", "provider:xai", "protocol:openai-responses", "tool", "tool-result"],
+    "tags": [
+      "prefix:pdf",
+      "pdf",
+      "provider:xai",
+      "protocol:xai-responses",
+      "tool",
+      "tool-result"
+    ],
     "name": "pdf/xai-tool-result",
-    "recordedAt": "2026-07-22T18:15:43.608Z"
+    "recordedAt": "2026-07-22T18:15:43.608Z",
+    "protocol": "xai-responses"
   },
   "interactions": [
     {
@@ -14,7 +22,7 @@
         "headers": {
           "content-type": "application/json"
         },
-        "body": "{\"model\":\"grok-4.5\",\"input\":[{\"role\":\"system\",\"content\":\"Read the PDF returned by the tool and follow the user's response format exactly.\"},{\"role\":\"user\",\"content\":[{\"type\":\"input_text\",\"text\":\"Return only the verification code from the PDF.\"}]},{\"type\":\"function_call\",\"call_id\":\"call_pdf_1\",\"name\":\"read_pdf\",\"arguments\":\"{}\"},{\"type\":\"function_call_output\",\"call_id\":\"call_pdf_1\",\"output\":[{\"type\":\"input_text\",\"text\":\"PDF read successfully\"},{\"type\":\"input_file\",\"filename\":\"verification.pdf\",\"file_data\":\"JVBERi0xLjQKMSAwIG9iago8PCAvVHlwZSAvQ2F0YWxvZyAvUGFnZXMgMiAwIFIgPj4KZW5kb2JqCjIgMCBvYmoKPDwgL1R5cGUgL1BhZ2VzIC9LaWRzIFszIDAgUl0gL0NvdW50IDEgPj4KZW5kb2JqCjMgMCBvYmoKPDwgL1R5cGUgL1BhZ2UgL1BhcmVudCAyIDAgUiAvTWVkaWFCb3ggWzAgMCA2MTIgNzkyXSAvUmVzb3VyY2VzIDw8IC9Gb250IDw8IC9GMSA1IDAgUiA+PiA+PiAvQ29udGVudHMgNCAwIFIgPj4KZW5kb2JqCjQgMCBvYmoKPDwgL0xlbmd0aCA3NSA+PgpzdHJlYW0KQlQKL0YxIDE4IFRmCjcyIDcyMCBUZAooUERGIGNhc3NldHRlIHZlcmlmaWNhdGlvbiBjb2RlOiBPUkNISUQtNzM5MSkgVGoKRVQKZW5kc3RyZWFtCmVuZG9iago1IDAgb2JqCjw8IC9UeXBlIC9Gb250IC9TdWJ0eXBlIC9UeXBlMSAvQmFzZUZvbnQgL0hlbHZldGljYSA+PgplbmRvYmoKeHJlZgowIDYKMDAwMDAwMDAwMCA2NTUzNSBmIAowMDAwMDAwMDA5IDAwMDAwIG4gCjAwMDAwMDAwNTggMDAwMDAgbiAKMDAwMDAwMDExNSAwMDAwMCBuIAowMDAwMDAwMjQxIDAwMDAwIG4gCjAwMDAwMDAzNjUgMDAwMDAgbiAKdHJhaWxlcgo8PCAvU2l6ZSA2IC9Sb290IDEgMCBSID4+CnN0YXJ0eHJlZgo0MzUKJSVFT0YK\",\"mime_type\":\"application/pdf\"}]}],\"tools\":[{\"type\":\"function\",\"name\":\"read_pdf\",\"description\":\"Read the attached PDF.\",\"parameters\":{\"type\":\"object\",\"properties\":{},\"additionalProperties\":false},\"strict\":false}],\"store\":false,\"max_output_tokens\":40,\"temperature\":0,\"stream\":true}"
+        "body": "{\"model\":\"grok-4.5\",\"input\":[{\"role\":\"system\",\"content\":\"Read the PDF returned by the tool and follow the user's response format exactly.\"},{\"role\":\"user\",\"content\":[{\"type\":\"input_text\",\"text\":\"Return only the verification code from the PDF.\"}]},{\"type\":\"function_call\",\"call_id\":\"call_pdf_1\",\"name\":\"read_pdf\",\"arguments\":\"{}\"},{\"type\":\"function_call_output\",\"call_id\":\"call_pdf_1\",\"output\":[{\"type\":\"input_text\",\"text\":\"PDF read successfully\"},{\"type\":\"input_file\",\"filename\":\"verification.pdf\",\"file_data\":\"JVBERi0xLjQKMSAwIG9iago8PCAvVHlwZSAvQ2F0YWxvZyAvUGFnZXMgMiAwIFIgPj4KZW5kb2JqCjIgMCBvYmoKPDwgL1R5cGUgL1BhZ2VzIC9LaWRzIFszIDAgUl0gL0NvdW50IDEgPj4KZW5kb2JqCjMgMCBvYmoKPDwgL1R5cGUgL1BhZ2UgL1BhcmVudCAyIDAgUiAvTWVkaWFCb3ggWzAgMCA2MTIgNzkyXSAvUmVzb3VyY2VzIDw8IC9Gb250IDw8IC9GMSA1IDAgUiA+PiA+PiAvQ29udGVudHMgNCAwIFIgPj4KZW5kb2JqCjQgMCBvYmoKPDwgL0xlbmd0aCA3NSA+PgpzdHJlYW0KQlQKL0YxIDE4IFRmCjcyIDcyMCBUZAooUERGIGNhc3NldHRlIHZlcmlmaWNhdGlvbiBjb2RlOiBPUkNISUQtNzM5MSkgVGoKRVQKZW5kc3RyZWFtCmVuZG9iago1IDAgb2JqCjw8IC9UeXBlIC9Gb250IC9TdWJ0eXBlIC9UeXBlMSAvQmFzZUZvbnQgL0hlbHZldGljYSA+PgplbmRvYmoKeHJlZgowIDYKMDAwMDAwMDAwMCA2NTUzNSBmIAowMDAwMDAwMDA5IDAwMDAwIG4gCjAwMDAwMDAwNTggMDAwMDAgbiAKMDAwMDAwMDExNSAwMDAwMCBuIAowMDAwMDAwMjQxIDAwMDAwIG4gCjAwMDAwMDAzNjUgMDAwMDAgbiAKdHJhaWxlcgo8PCAvU2l6ZSA2IC9Sb290IDEgMCBSID4+CnN0YXJ0eHJlZgo0MzUKJSVFT0YK\"}]}],\"tools\":[{\"type\":\"function\",\"name\":\"read_pdf\",\"description\":\"Read the attached PDF.\",\"parameters\":{\"type\":\"object\",\"properties\":{},\"additionalProperties\":false},\"strict\":false}],\"store\":false,\"max_output_tokens\":40,\"temperature\":0,\"stream\":true}"
       },
       "response": {
         "status": 200,

packages/ai/test/fixtures/recordings/pdf/xai-user-input.json

@@ -1,9 +1,16 @@
 {
   "version": 1,
   "metadata": {
-    "tags": ["prefix:pdf", "pdf", "provider:xai", "protocol:openai-responses", "user-input"],
+    "tags": [
+      "prefix:pdf",
+      "pdf",
+      "provider:xai",
+      "protocol:xai-responses",
+      "user-input"
+    ],
     "name": "pdf/xai-user-input",
-    "recordedAt": "2026-07-22T18:15:42.429Z"
+    "recordedAt": "2026-07-22T18:15:42.429Z",
+    "protocol": "xai-responses"
   },
   "interactions": [
     {
@@ -14,7 +21,7 @@
         "headers": {
           "content-type": "application/json"
         },
-        "body": "{\"model\":\"grok-4.5\",\"input\":[{\"role\":\"user\",\"content\":[{\"type\":\"input_file\",\"filename\":\"verification.pdf\",\"file_data\":\"JVBERi0xLjQKMSAwIG9iago8PCAvVHlwZSAvQ2F0YWxvZyAvUGFnZXMgMiAwIFIgPj4KZW5kb2JqCjIgMCBvYmoKPDwgL1R5cGUgL1BhZ2VzIC9LaWRzIFszIDAgUl0gL0NvdW50IDEgPj4KZW5kb2JqCjMgMCBvYmoKPDwgL1R5cGUgL1BhZ2UgL1BhcmVudCAyIDAgUiAvTWVkaWFCb3ggWzAgMCA2MTIgNzkyXSAvUmVzb3VyY2VzIDw8IC9Gb250IDw8IC9GMSA1IDAgUiA+PiA+PiAvQ29udGVudHMgNCAwIFIgPj4KZW5kb2JqCjQgMCBvYmoKPDwgL0xlbmd0aCA3NSA+PgpzdHJlYW0KQlQKL0YxIDE4IFRmCjcyIDcyMCBUZAooUERGIGNhc3NldHRlIHZlcmlmaWNhdGlvbiBjb2RlOiBPUkNISUQtNzM5MSkgVGoKRVQKZW5kc3RyZWFtCmVuZG9iago1IDAgb2JqCjw8IC9UeXBlIC9Gb250IC9TdWJ0eXBlIC9UeXBlMSAvQmFzZUZvbnQgL0hlbHZldGljYSA+PgplbmRvYmoKeHJlZgowIDYKMDAwMDAwMDAwMCA2NTUzNSBmIAowMDAwMDAwMDA5IDAwMDAwIG4gCjAwMDAwMDAwNTggMDAwMDAgbiAKMDAwMDAwMDExNSAwMDAwMCBuIAowMDAwMDAwMjQxIDAwMDAwIG4gCjAwMDAwMDAzNjUgMDAwMDAgbiAKdHJhaWxlcgo8PCAvU2l6ZSA2IC9Sb290IDEgMCBSID4+CnN0YXJ0eHJlZgo0MzUKJSVFT0YK\",\"mime_type\":\"application/pdf\"},{\"type\":\"input_text\",\"text\":\"Return only the verification code from the PDF.\"}]}],\"store\":false,\"max_output_tokens\":40,\"temperature\":0,\"stream\":true}"
+        "body": "{\"model\":\"grok-4.5\",\"input\":[{\"role\":\"user\",\"content\":[{\"type\":\"input_file\",\"filename\":\"verification.pdf\",\"file_data\":\"JVBERi0xLjQKMSAwIG9iago8PCAvVHlwZSAvQ2F0YWxvZyAvUGFnZXMgMiAwIFIgPj4KZW5kb2JqCjIgMCBvYmoKPDwgL1R5cGUgL1BhZ2VzIC9LaWRzIFszIDAgUl0gL0NvdW50IDEgPj4KZW5kb2JqCjMgMCBvYmoKPDwgL1R5cGUgL1BhZ2UgL1BhcmVudCAyIDAgUiAvTWVkaWFCb3ggWzAgMCA2MTIgNzkyXSAvUmVzb3VyY2VzIDw8IC9Gb250IDw8IC9GMSA1IDAgUiA+PiA+PiAvQ29udGVudHMgNCAwIFIgPj4KZW5kb2JqCjQgMCBvYmoKPDwgL0xlbmd0aCA3NSA+PgpzdHJlYW0KQlQKL0YxIDE4IFRmCjcyIDcyMCBUZAooUERGIGNhc3NldHRlIHZlcmlmaWNhdGlvbiBjb2RlOiBPUkNISUQtNzM5MSkgVGoKRVQKZW5kc3RyZWFtCmVuZG9iago1IDAgb2JqCjw8IC9UeXBlIC9Gb250IC9TdWJ0eXBlIC9UeXBlMSAvQmFzZUZvbnQgL0hlbHZldGljYSA+PgplbmRvYmoKeHJlZgowIDYKMDAwMDAwMDAwMCA2NTUzNSBmIAowMDAwMDAwMDA5IDAwMDAwIG4gCjAwMDAwMDAwNTggMDAwMDAgbiAKMDAwMDAwMDExNSAwMDAwMCBuIAowMDAwMDAwMjQxIDAwMDAwIG4gCjAwMDAwMDAzNjUgMDAwMDAgbiAKdHJhaWxlcgo8PCAvU2l6ZSA2IC9Sb290IDEgMCBSID4+CnN0YXJ0eHJlZgo0MzUKJSVFT0YK\"},{\"type\":\"input_text\",\"text\":\"Return only the verification code from the PDF.\"}]}],\"store\":false,\"max_output_tokens\":40,\"temperature\":0,\"stream\":true}"
       },
       "response": {
         "status": 200,

packages/ai/test/provider/gemini.test.ts

@@ -848,7 +848,7 @@ describe("Gemini route", () => {
         providerMetadata: { google: { thoughtSignature: "thought_sig" } },
       })
       expect(toolCall).toMatchObject({
-        id: "tool_0",
+        id: "provider_call",
         providerMetadata: { google: { functionCallId: "provider_call", thoughtSignature: "tool_sig" } },
       })
       expect(response.events.findIndex((event) => event.type === "reasoning-end")).toBeLessThan(
@@ -862,14 +862,14 @@ describe("Gemini route", () => {
             Message.assistant([
               { type: "reasoning", text: "thinking", providerMetadata: reasoningEnd?.providerMetadata },
               ToolCallPart.make({
-                id: "tool_0",
+                id: "provider_call",
                 name: "lookup",
                 input: { query: "weather" },
                 providerMetadata: toolCall?.providerMetadata,
               }),
             ]),
             Message.tool({
-              id: "tool_0",
+              id: "provider_call",
               name: "lookup",
               result: "done",
               resultType: "text",
@@ -1101,21 +1101,17 @@ describe("Gemini route", () => {
         providerMetadata: { google: { promptTokenCount: 5, candidatesTokenCount: 1 } },
       })
 
-      expect(response.toolCalls).toEqual([
-        {
-          type: "tool-call",
-          id: "tool_0",
-          name: "lookup",
-          input: { query: "weather" },
-          providerExecuted: undefined,
-          providerMetadata: undefined,
-        },
-      ])
+      expect(response.toolCalls[0].id).toMatch(/^tool_[0-9a-zA-Z]+$/)
+      expect(response.toolCalls[0]).toMatchObject({
+        type: "tool-call",
+        name: "lookup",
+        input: { query: "weather" },
+      })
       expect(response.events).toEqual([
         { type: "step-start", index: 0 },
         {
           type: "tool-call",
-          id: "tool_0",
+          id: response.toolCalls[0].id,
           name: "lookup",
           input: { query: "weather" },
           providerExecuted: undefined,
@@ -1158,7 +1154,8 @@ describe("Gemini route", () => {
         ),
       )
 
-      expect(response.toolCalls).toEqual([{ type: "tool-call", id: "tool_0", name: "ping", input: {} }])
+      expect(response.toolCalls[0].id).toMatch(/^tool_[0-9a-zA-Z]+$/)
+      expect(response.toolCalls).toMatchObject([{ type: "tool-call", name: "ping", input: {} }])
     }),
   )
 
@@ -1198,7 +1195,7 @@ describe("Gemini route", () => {
             content: {
               role: "model",
               parts: [
-                { functionCall: { id: "tool_0", name: "lookup", args: { query: "weather" } } },
+                { functionCall: { id: "call_0", name: "lookup", args: { query: "weather" } } },
                 { functionCall: { name: "lookup", args: { query: "news" } } },
               ],
             },
@@ -1212,16 +1209,20 @@ describe("Gemini route", () => {
         }),
       ).pipe(Effect.provide(fixedResponse(body)))
 
-      expect(response.toolCalls).toEqual([
-        {
-          type: "tool-call",
-          id: "tool_0",
-          name: "lookup",
-          input: { query: "weather" },
-          providerMetadata: { google: { functionCallId: "tool_0" } },
-        },
-        { type: "tool-call", id: "tool_1", name: "lookup", input: { query: "news" } },
-      ])
+      expect(response.toolCalls[0]).toMatchObject({
+        type: "tool-call",
+        id: "call_0",
+        name: "lookup",
+        input: { query: "weather" },
+        providerMetadata: { google: { functionCallId: "call_0" } },
+      })
+      expect(response.toolCalls[1]).toMatchObject({
+        type: "tool-call",
+        name: "lookup",
+        input: { query: "news" },
+      })
+      expect(response.toolCalls[1].id).toMatch(/^tool_[0-9a-zA-Z]+$/)
+      expect(response.toolCalls[0].id).not.toBe(response.toolCalls[1].id)
       expect(response.events.at(-1)).toMatchObject({
         type: "finish",
         reason: { normalized: "tool-calls", raw: "STOP" },
@@ -1229,6 +1230,31 @@ describe("Gemini route", () => {
     }),
   )
 
+  it.effect("assigns distinct unique fallback ids across separate requests", () =>
+    Effect.gen(function* () {
+      const body = sseEvents({
+        candidates: [
+          {
+            content: {
+              role: "model",
+              parts: [{ functionCall: { name: "lookup", args: { query: "weather" } } }],
+            },
+            finishReason: "STOP",
+          },
+        ],
+      })
+      const req = LLMRequest.update(request, {
+        tools: [ToolDefinition.make({ name: "lookup", description: "Lookup data", inputSchema: { type: "object" } })],
+      })
+      const first = yield* LLMClient.generate(req).pipe(Effect.provide(fixedResponse(body)))
+      const second = yield* LLMClient.generate(req).pipe(Effect.provide(fixedResponse(body)))
+
+      expect(first.toolCalls[0].id).toMatch(/^tool_[0-9a-zA-Z]+$/)
+      expect(second.toolCalls[0].id).toMatch(/^tool_[0-9a-zA-Z]+$/)
+      expect(first.toolCalls[0].id).not.toBe(second.toolCalls[0].id)
+    }),
+  )
+
   it.effect("maps length and content-filter finish reasons", () =>
     Effect.gen(function* () {
       const length = yield* LLMClient.generate(request).pipe(

packages/ai/test/provider/openai-compatible-responses.test.ts

@@ -93,7 +93,7 @@ describe("Open Responses-compatible route", () => {
     }),
   )
 
-  it.effect("omits OpenAI-only nullable phases from the Open Responses baseline", () =>
+  it.effect("preserves nullable phases in the forgiving Open Responses baseline", () =>
     Effect.gen(function* () {
       const model = configure({
         apiKey: "test-key",
@@ -113,7 +113,9 @@ describe("Open Responses-compatible route", () => {
       )
 
       expect(prepared.body).toMatchObject({
-        input: [{ type: "message", role: "assistant", content: [{ type: "output_text", text: "Unclassified." }] }],
+        input: [
+          { type: "message", role: "assistant", content: [{ type: "output_text", text: "Unclassified." }], phase: null },
+        ],
       })
     }),
   )

packages/ai/test/provider/openai-responses.test.ts

@@ -28,7 +28,7 @@ import * as Azure from "../../src/providers/azure.js"
 import * as OpenAI from "../../src/providers/openai.js"
 import * as XAI from "../../src/providers/xai.js"
 import * as OpenAIResponses from "../../src/protocols/openai-responses.js"
-import { OpenAIResponsesChannel } from "../../src/protocols/openai-responses-channel.js"
+import { OpenResponsesContinuation } from "../../src/protocols/open-responses-continuation.js"
 import * as ProviderShared from "../../src/protocols/shared.js"
 import { continuationRequest, nativeOpenAIResponsesContinuation } from "../continuation-scenarios.js"
 import { it } from "../lib/effect.js"
@@ -68,7 +68,7 @@ const baseChannelDriver = (message: string): WebSocketChannelDriver => ({
 
 const continuationDriver = (request: Readonly<Record<string, unknown>>) => {
   const message = ProviderShared.encodeJson(request)
-  return OpenAIResponsesChannel.driver({
+  return OpenResponsesContinuation.driver({
     id: "openai-responses",
     name: "OpenAI Responses",
     request,
@@ -1273,7 +1273,7 @@ describe("OpenAI Responses route", () => {
         {
           type: "input_file",
           filename: "report.pdf",
-          file_data: "data:application/pdf;base64,JVBERi0xLjQ=",
+          file_data: "JVBERi0xLjQ=",
         },
       ])
     }),
@@ -1300,12 +1300,12 @@ describe("OpenAI Responses route", () => {
       )
 
       expect(expectToolOutput(prepared.body).output).toEqual([
-        { type: "input_file", filename: "report.pdf", file_data: dataUrl },
+        { type: "input_file", filename: "report.pdf", file_data: base64 },
       ])
     }),
   )
 
-  it.effect("uses xAI inline file encoding for PDF tool results", () =>
+  it.effect("uses standard inline file encoding for xAI PDF tool results", () =>
     Effect.gen(function* () {
       const prepared = yield* compileRequest(
         LLM.request({
@@ -1334,7 +1334,6 @@ describe("OpenAI Responses route", () => {
           type: "input_file",
           filename: "report.pdf",
           file_data: "JVBERi0xLjQ=",
-          mime_type: "application/pdf",
         },
       ])
     }),
@@ -1359,7 +1358,61 @@ describe("OpenAI Responses route", () => {
       )
 
       expect(expectToolOutput(prepared.body).output).toEqual([
-        { type: "input_file", filename: "file", file_data: "data:audio/mpeg;base64,AAECAw==" },
+        { type: "input_file", filename: "file", file_data: "AAECAw==" },
+      ])
+    }),
+  )
+
+  it.effect("lowers remote tool-result media URLs without base64 wrapping", () =>
+    Effect.gen(function* () {
+      const prepared = yield* compileRequest(
+        LLM.request({
+          model,
+          messages: [
+            Message.assistant([ToolCallPart.make({ id: "call_1", name: "fetch", input: {} })]),
+            Message.tool({
+              id: "call_1",
+              name: "fetch",
+              resultType: "content",
+              result: [
+                { type: "file", uri: "https://example.com/image.png", mime: "image/png" },
+                { type: "file", uri: "https://example.com/report.pdf", mime: "application/pdf", name: "report.pdf" },
+              ],
+            }),
+          ],
+        }),
+      )
+
+      expect(expectToolOutput(prepared.body).output).toEqual([
+        { type: "input_image", image_url: "https://example.com/image.png" },
+        { type: "input_file", filename: "report.pdf", file_url: "https://example.com/report.pdf" },
+      ])
+    }),
+  )
+
+  it.effect("lowers tool-result videos as input_video", () =>
+    Effect.gen(function* () {
+      const prepared = yield* compileRequest(
+        LLM.request({
+          model,
+          messages: [
+            Message.assistant([ToolCallPart.make({ id: "call_1", name: "record", input: {} })]),
+            Message.tool({
+              id: "call_1",
+              name: "record",
+              resultType: "content",
+              result: [
+                { type: "file", uri: "data:video/mp4;base64,AAECAw==", mime: "video/mp4" },
+                { type: "file", uri: "https://example.com/demo.mp4", mime: "video/mp4" },
+              ],
+            }),
+          ],
+        }),
+      )
+
+      expect(expectToolOutput(prepared.body).output).toEqual([
+        { type: "input_video", video_url: "data:video/mp4;base64,AAECAw==" },
+        { type: "input_video", video_url: "https://example.com/demo.mp4" },
       ])
     }),
   )
@@ -2712,7 +2765,7 @@ describe("OpenAI Responses route", () => {
             {
               type: "input_file",
               filename: "report.pdf",
-              file_data: "data:application/pdf;base64,JVBERi0xLjQ=",
+              file_data: "JVBERi0xLjQ=",
             },
           ],
         },
@@ -2720,7 +2773,7 @@ describe("OpenAI Responses route", () => {
     }),
   )
 
-  it.effect("uses xAI inline file encoding for user PDFs", () =>
+  it.effect("uses standard inline file encoding for xAI user PDFs", () =>
     Effect.gen(function* () {
       const prepared = yield* compileRequest(
         LLM.request({
@@ -2744,7 +2797,6 @@ describe("OpenAI Responses route", () => {
               type: "input_file",
               filename: "report.pdf",
               file_data: "JVBERi0xLjQ=",
-              mime_type: "application/pdf",
             },
           ],
         },
@@ -2769,7 +2821,7 @@ describe("OpenAI Responses route", () => {
             {
               type: "input_file",
               filename: "file",
-              file_data: "data:application/x-tar;base64,AAECAw==",
+              file_data: "AAECAw==",
             },
           ],
         },
@@ -2777,6 +2829,37 @@ describe("OpenAI Responses route", () => {
     }),
   )
 
+  it.effect("lowers remote user media URLs without base64 wrapping", () =>
+    Effect.gen(function* () {
+      const prepared = yield* compileRequest(
+        LLM.request({
+          model,
+          messages: [
+            Message.user([
+              { type: "media", mediaType: "image/png", data: "https://example.com/image.png" },
+              {
+                type: "media",
+                mediaType: "application/pdf",
+                data: "https://example.com/report.pdf",
+                filename: "report.pdf",
+              },
+            ]),
+          ],
+        }),
+      )
+
+      expect(prepared.body.input).toEqual([
+        {
+          role: "user",
+          content: [
+            { type: "input_image", image_url: "https://example.com/image.png" },
+            { type: "input_file", filename: "report.pdf", file_url: "https://example.com/report.pdf" },
+          ],
+        },
+      ])
+    }),
+  )
+
   it.effect("fails with a typed rate limit for provider error frames", () =>
     Effect.gen(function* () {
       const error = yield* LLMClient.generate(request).pipe(

packages/ai/test/provider/pdf.recorded.test.ts

@@ -64,7 +64,7 @@ const targets: ReadonlyArray<{
     id: "xai",
     name: "xAI Grok 4.5",
     provider: "xai",
-    protocol: "openai-responses",
+    protocol: "xai-responses",
     requires: "XAI_API_KEY",
     filename: "verification.pdf",
     maxTokens: 40,

packages/ai/test/provider/xai-responses.test.ts

@@ -0,0 +1,77 @@
+import { describe, expect } from "bun:test"
+import { Effect } from "effect"
+import { LLM, LLMEvent } from "../../src/index.js"
+import { XAI } from "../../src/providers.js"
+import { OpenResponses } from "../../src/protocols/open-responses.js"
+import { OpenAIResponses } from "../../src/protocols/openai-responses.js"
+import { XAIResponses } from "../../src/protocols/xai-responses.js"
+import { LLMClient } from "../../src/route.js"
+import { compileRequest } from "../../src/route/client.js"
+import { it } from "../lib/effect.js"
+import { fixedResponse } from "../lib/http.js"
+import { sseEvents } from "../lib/sse.js"
+
+const model = XAI.configure({ apiKey: "test", baseURL: "https://api.x.ai/v1" }).responses("grok-4.6")
+
+describe("xAI Responses route", () => {
+  it.effect("extends the Open Responses baseline directly", () =>
+    Effect.gen(function* () {
+      expect(XAIResponses.protocol.body).toBe(OpenResponses.protocol.body)
+      expect(XAIResponses.protocol.body).not.toBe(OpenAIResponses.protocol.body)
+
+      const prepared = yield* compileRequest(LLM.request({ model, prompt: "Hello" }))
+      expect(prepared.protocol).toBe("xai-responses")
+    }),
+  )
+
+  it.effect("parses xAI reasoning text events", () =>
+    Effect.gen(function* () {
+      const response = yield* LLMClient.generate(LLM.request({ model, prompt: "Think" })).pipe(
+        Effect.provide(
+          fixedResponse(
+            sseEvents(
+              { type: "response.reasoning_text.delta", item_id: "reasoning_1", delta: "Considering." },
+              { type: "response.reasoning_text.done", item_id: "reasoning_1" },
+              {
+                type: "response.output_item.done",
+                item: { type: "reasoning", id: "reasoning_1", encrypted_content: "opaque" },
+              },
+              { type: "response.completed", response: { id: "response_1" } },
+            ),
+          ),
+        ),
+      )
+
+      expect(response.message.content.find((part) => part.type === "reasoning")).toMatchObject({
+        type: "reasoning",
+        text: "Considering.",
+        providerMetadata: { xai: { itemId: "reasoning_1", reasoningEncryptedContent: "opaque" } },
+      })
+    }),
+  )
+
+  it.effect("parses xAI hosted tool items", () =>
+    Effect.gen(function* () {
+      const response = yield* LLMClient.generate(LLM.request({ model, prompt: "Search X" })).pipe(
+        Effect.provide(
+          fixedResponse(
+            sseEvents(
+              {
+                type: "response.output_item.done",
+                item: { type: "x_search_call", id: "x_search_1", status: "completed", action: { query: "news" } },
+              },
+              { type: "response.completed", response: { id: "response_1" } },
+            ),
+          ),
+        ),
+      )
+
+      expect(response.events.find(LLMEvent.is.toolCall)).toMatchObject({
+        id: "x_search_1",
+        name: "x_search",
+        input: { query: "news" },
+        providerExecuted: true,
+      })
+    }),
+  )
+})

packages/app/e2e/performance/timeline-stability/fixture.ts

@@ -259,6 +259,18 @@ export function event(
   return makeEvent(type, data)
 }
 
+export function toolInputStarted(data: Extract<OpenCodeEvent, { type: "session.tool.input.started" }>["data"]) {
+  return makeEvent("session.tool.input.started", data)
+}
+
+export function toolInputEnded(data: Extract<OpenCodeEvent, { type: "session.tool.input.ended" }>["data"]) {
+  return makeEvent("session.tool.input.ended", data)
+}
+
+export function toolCalled(data: Extract<OpenCodeEvent, { type: "session.tool.called" }>["data"]) {
+  return makeEvent("session.tool.called", data)
+}
+
 export function validateTimelineEvent(input: unknown): OpenCodeEvent {
   if (!input || typeof input !== "object") throw new Error("Timeline event must be an object")
   if (!("type" in input) || typeof input.type !== "string") throw new Error("Timeline event requires a type")

packages/app/e2e/performance/timeline-stability/scroll-interaction.spec.ts

@@ -1,4 +1,5 @@
 import { expect, test } from "@playwright/test"
+import { createTwoFilesPatch } from "diff"
 import {
   defineVisualRegions,
   reportVisualStability,
@@ -13,10 +14,63 @@ import {
   setupTimeline,
   shell,
   textPart,
+  toolPart,
   userMessage,
   type TimelineMessage,
 } from "./fixture"
 
+test("follows an expanded patch that arrives as the user reaches the bottom", async ({ page }) => {
+  const toolID = "prt_bottom_follow_patch"
+  const input = { patchText: "Update src/edit.ts" }
+  const timeline = await setupTimeline(page, {
+    messages: [
+      ...history(20),
+      userMessage(),
+      assistantMessage([textPart("prt_bottom_follow_text", "Working")], { completed: false }),
+    ],
+    settings: { editToolPartsExpanded: true },
+    reducedMotion: true,
+  })
+  const scroller = page.locator(".scroll-view__viewport", { has: page.locator("[data-timeline-row]") })
+  await scroller.evaluate((element) => {
+    element.scrollTop = Math.max(0, element.scrollHeight - element.clientHeight - 300)
+    element.dispatchEvent(new WheelEvent("wheel", { bubbles: true, cancelable: true, deltaY: 300 }))
+    element.scrollTop = element.scrollHeight
+  })
+  await expect
+    .poll(() => scroller.evaluate((element) => element.scrollHeight - element.clientHeight - element.scrollTop))
+    .toBeLessThanOrEqual(1)
+
+  await timeline.send(partUpdated(toolPart(toolID, "patch", "running", input)))
+  await timeline.send(
+    partUpdated(
+      toolPart(toolID, "patch", "completed", input, {
+        metadata: {
+          files: [
+            {
+              file: "src/edit.ts",
+              status: "modified",
+              patch: createTwoFilesPatch(
+                "a/src/edit.ts",
+                "b/src/edit.ts",
+                Array.from({ length: 40 }, (_, index) => `export const value${index} = ${index}\n`).join(""),
+                Array.from({ length: 40 }, (_, index) => `export const value${index} = ${index + 1}\n`).join(""),
+              ),
+              additions: 40,
+              deletions: 40,
+            },
+          ],
+        },
+      }),
+    ),
+  )
+
+  await timeline.waitForPart(toolID)
+  await expect
+    .poll(() => scroller.evaluate((element) => element.scrollHeight - element.clientHeight - element.scrollTop))
+    .toBeLessThanOrEqual(1)
+})
+
 test("does not reverse visible rows when the user wheels during shell remeasurement", async ({ page }, testInfo) => {
   const shellID = "prt_wheel_01_shell"
   const followingID = "prt_wheel_02_following"

packages/app/e2e/regression/review-terminal-bottom.spec.ts

@@ -18,7 +18,7 @@ const branchDiffs = [
   ),
 ]
 
-test("keeps the review tree and terminal sized when both panels are open", async ({ page }) => {
+test("uses side placement by default and supports the terminal across the bottom", async ({ page }) => {
   test.setTimeout(120_000)
   await page.setViewportSize({ width: 1400, height: 900 })
   await mockOpenCodeServer(page, {
@@ -27,7 +27,7 @@ test("keeps the review tree and terminal sized when both panels are open", async
       id: projectID,
       worktree: directory,
       vcs: "git",
-      name: "review-terminal-stacked",
+      name: "review-terminal-bottom",
       time: { created: 1700000000000, updated: 1700000000000 },
       sandboxes: [],
     },
@@ -45,7 +45,7 @@ test("keeps the review tree and terminal sized when both panels are open", async
     sessions: [
       {
         id: sessionID,
-        slug: "review-terminal-stacked",
+        slug: "review-terminal-bottom",
         projectID,
         directory,
         title,
@@ -138,7 +138,22 @@ test("keeps the review tree and terminal sized when both panels are open", async
   await page.keyboard.press("Control+Backquote")
   await expect(page.locator("#terminal-panel")).toBeVisible()
   await expectTree(page, 2_773, "action.yml")
-  await expectStackGeometry(page)
+  await expectSideGeometry(page)
+
+  await page.evaluate(() => {
+    const settings = JSON.parse(localStorage.getItem("settings.v3") ?? "{}")
+    localStorage.setItem(
+      "settings.v3",
+      JSON.stringify({ ...settings, general: { ...settings.general, terminalPlacement: "bottom" } }),
+    )
+  })
+  await page.reload()
+  await expectSessionReady(page, { server, sessionID, title })
+  await expect(page.locator("#review-panel")).toBeVisible()
+  await page.keyboard.press("Control+Backquote")
+  await expect(page.locator("#terminal-panel")).toBeVisible()
+  await expectTree(page, 2_773, "action.yml")
+  await expectBottomGeometry(page)
 })
 
 async function expectTree(page: Page, total: number, file: string) {
@@ -163,23 +178,51 @@ async function expectMountedTree(page: Page, total: number) {
   expect(state.rows).toBeLessThanOrEqual(60)
 }
 
-async function expectStackGeometry(page: Page) {
+async function expectSideGeometry(page: Page) {
+  const geometry = await page.evaluate(() => {
+    const review = document.querySelector<HTMLElement>("#review-panel")!.getBoundingClientRect()
+    const terminal = document.querySelector<HTMLElement>("#terminal-panel")!.getBoundingClientRect()
+    return {
+      reviewLeft: review.left,
+      reviewRight: review.right,
+      terminalLeft: terminal.left,
+      terminalRight: terminal.right,
+      terminalTop: terminal.top,
+      reviewTop: review.top,
+    }
+  })
+  expect(Math.abs(geometry.terminalLeft - geometry.reviewLeft)).toBeLessThanOrEqual(1)
+  expect(Math.abs(geometry.terminalRight - geometry.reviewRight)).toBeLessThanOrEqual(1)
+  expect(geometry.terminalTop).toBeGreaterThan(geometry.reviewTop)
+}
+
+async function expectBottomGeometry(page: Page) {
   const geometry = await page.evaluate(() => {
     const review = document.querySelector<HTMLElement>("#review-panel")!
     const terminal = document.querySelector<HTMLElement>("#terminal-panel")!
+    const terminalRect = terminal.getBoundingClientRect()
     const reviewParent = review.parentElement!.getBoundingClientRect()
     const terminalParent = terminal.parentElement!.getBoundingClientRect()
     const sidebar = review.querySelector<HTMLElement>('[data-slot="session-review-v2-sidebar"]')!
     return {
       review: review.getBoundingClientRect().height,
+      reviewBottom: review.getBoundingClientRect().bottom,
       reviewParent: reviewParent.height,
-      terminal: terminal.getBoundingClientRect().height,
+      terminal: terminalRect.height,
+      terminalLeft: terminalRect.left,
+      terminalRight: terminalRect.right,
+      terminalTop: terminalRect.top,
       terminalParent: terminalParent.height,
       sidebar: sidebar.getBoundingClientRect().width,
+      viewport: window.innerWidth,
     }
   })
   expect(Math.abs(geometry.review - geometry.reviewParent)).toBeLessThanOrEqual(1)
   expect(Math.abs(geometry.terminal - geometry.terminalParent)).toBeLessThanOrEqual(1)
+  expect(geometry.terminalTop - geometry.reviewBottom).toBeGreaterThanOrEqual(7)
+  expect(geometry.terminalTop - geometry.reviewBottom).toBeLessThanOrEqual(9)
+  expect(geometry.terminalLeft).toBeLessThanOrEqual(9)
+  expect(geometry.terminalRight).toBeGreaterThanOrEqual(geometry.viewport - 9)
   expect(geometry.sidebar).toBeGreaterThanOrEqual(240)
 }
 

packages/app/e2e/regression/server-dialog-focus.spec.ts

@@ -0,0 +1,48 @@
+import { expect, test, type Route } from "@playwright/test"
+
+const server = "http://127.0.0.1:4097"
+
+test("nested server dialog keeps focus inside the top layer", async ({ page }) => {
+  await page.addInitScript((server) => {
+    localStorage.setItem("opencode.global.dat:server", JSON.stringify({ list: [server] }))
+  }, server)
+  await page.route("**/*", async (route) => {
+    const url = new URL(route.request().url())
+    if (url.origin !== server) return route.fallback()
+    if (url.pathname === "/api/event") {
+      return route.fulfill({
+        status: 200,
+        contentType: "text/event-stream",
+        body: 'data: {"id":"evt_connected","type":"server.connected","data":{}}\n\n',
+      })
+    }
+    if (url.pathname === "/api/global/health" || url.pathname === "/api/health") {
+      return json(route, { healthy: true, version: "2.0.0" })
+    }
+    return json(route, {})
+  })
+
+  await page.goto("/")
+  await page.keyboard.press("Control+,")
+  const settings = page.locator(".settings-dialog")
+  await expect(settings).toBeVisible()
+  await settings.getByRole("tab", { name: "Servers" }).click()
+  await settings.getByRole("button", { name: "Add server" }).click()
+
+  const editor = page.getByRole("dialog", { name: "Add server" })
+  await expect(editor.getByPlaceholder("http://localhost:4096")).toBeFocused()
+  const username = editor.getByPlaceholder("username")
+  const password = editor.getByPlaceholder("password")
+  await username.click()
+  await expect(username).toBeFocused()
+  await username.fill("kit")
+  await expect(username).toHaveValue("kit")
+  await page.keyboard.press("Tab")
+  await expect(password).toBeFocused()
+  await password.fill("secret")
+  await expect(password).toHaveValue("secret")
+})
+
+function json(route: Route, body: unknown, status = 200) {
+  return route.fulfill({ status, contentType: "application/json", body: JSON.stringify(body) })
+}

packages/app/e2e/regression/session-timeline-collapse-state.spec.ts

@@ -99,7 +99,7 @@ test.describe("regression: session timeline local row state", () => {
     await wrapper.evaluate((element) => {
       ;(element as HTMLElement).dataset.regressionMarker = "before-stream"
     })
-    await wrapper.locator('[data-slot="collapsible-trigger"]').first().click()
+    await wrapper.locator('[data-scope="apply-patch"] button').click()
     await expectExpanded(wrapper, false)
 
     events.push(...textEvents())
@@ -179,8 +179,8 @@ test.describe("regression: session timeline local row state", () => {
     await expectSessionTitle(page, title)
 
     const wrapper = page.locator(`[data-timeline-part-id="${editPartID}"]`).first()
-    const trigger = wrapper.locator('[data-slot="collapsible-trigger"]').first()
-    const diff = wrapper.locator('[data-component="edit-content"]').first()
+    const trigger = wrapper.locator('[data-component="sticky-accordion-header"]')
+    const diff = wrapper.locator('[data-component="apply-patch-file-diff"]').first()
     await expectAppVisible(diff)
     await expect.poll(() => wrapper.evaluate((element) => element.getBoundingClientRect().height)).toBeGreaterThan(500)
     const samples = await wrapper.evaluate(async (element) => {
@@ -190,8 +190,8 @@ test.describe("regression: session timeline local row state", () => {
       for (const offset of [0, 120, 240, 360, 480]) {
         root.scrollBy(0, offset - (result.at(-1)?.offset ?? 0))
         await new Promise(requestAnimationFrame)
-        const trigger = element.querySelector<HTMLElement>('[data-slot="collapsible-trigger"]')!
-        const diff = element.querySelector<HTMLElement>('[data-component="edit-content"]')!
+        const trigger = element.querySelector<HTMLElement>('[data-component="sticky-accordion-header"]')!
+        const diff = element.querySelector<HTMLElement>('[data-component="apply-patch-file-diff"]')!
         result.push({
           offset,
           trigger: trigger.getBoundingClientRect().y,
@@ -202,7 +202,7 @@ test.describe("regression: session timeline local row state", () => {
       return result
     })
 
-    expect(samples[0]!.trigger).toBeLessThan(samples[0]!.diff)
+    expect(samples[0]!.trigger).toBeGreaterThanOrEqual(samples[0]!.diff)
     expect(samples.every((sample) => Math.abs(sample.trigger - samples[0]!.trigger) <= 1)).toBe(true)
     expect(samples.every((sample) => sample.trigger < sample.bottom)).toBe(true)
   })
@@ -234,7 +234,9 @@ async function readToolState(page: Page) {
     .evaluate(
       (element, textPartID) => ({
         expanded: (() => {
-          const trigger = element.querySelector('[data-slot="collapsible-trigger"]')
+          const trigger =
+            element.querySelector('[data-scope="apply-patch"] button') ??
+            element.querySelector('[data-slot="collapsible-trigger"]')
           const aria = trigger?.getAttribute("aria-expanded")
           if (aria === "true") return true
           if (aria === "false") return false
@@ -409,7 +411,9 @@ function eventValue<Type extends OpenCodeEvent["type"]>(
 }
 
 function readExpanded(element: Element) {
-  const trigger = element.querySelector('[data-slot="collapsible-trigger"]')
+  const trigger =
+    element.querySelector('[data-scope="apply-patch"] button') ??
+    element.querySelector('[data-slot="collapsible-trigger"]')
   const aria = trigger?.getAttribute("aria-expanded")
   if (aria === "true") return true
   if (aria === "false") return false

packages/app/e2e/regression/session-timeline-file-projection.spec.ts

@@ -1,5 +1,12 @@
 import { expect, test } from "@playwright/test"
-import { assistantMessage, setupTimeline, toolPart, userMessage } from "../performance/timeline-stability/fixture"
+import { createTwoFilesPatch } from "diff"
+import {
+  assistantMessage,
+  setupTimeline,
+  textPart,
+  toolPart,
+  userMessage,
+} from "../performance/timeline-stability/fixture"
 
 test("renders completed write content", async ({ page }) => {
   const id = "prt_file_projection_write"
@@ -47,5 +54,103 @@ test("renders a completed single-file patch", async ({ page }) => {
     settings: { editToolPartsExpanded: true },
   })
 
-  await expect(page.locator(`[data-timeline-part-id="${id}"] [data-component="apply-patch-file-diff"]`)).toBeVisible()
+  const wrapper = page.locator(`[data-timeline-part-id="${id}"]`)
+  const file = wrapper.locator('[data-scope="apply-patch"]')
+  const scroller = page.locator(".scroll-view__viewport", { has: page.locator("[data-timeline-row]") })
+  await expect(file.getByRole("button")).toHaveAttribute("aria-expanded", "false")
+  await expect(wrapper.locator('[data-component="apply-patch-file-diff"]')).toHaveCount(0)
+  await file.getByRole("button").click()
+  await expect(wrapper.locator('[data-component="apply-patch-file-diff"]')).toBeVisible()
+  await expect
+    .poll(() => scroller.evaluate((element) => element.scrollHeight - element.clientHeight - element.scrollTop))
+    .toBeLessThanOrEqual(1)
+
+  await file.getByRole("button").click()
+  await expect(wrapper.locator('[data-component="apply-patch-file-diff"]')).toHaveCount(0)
+  await expect
+    .poll(() => scroller.evaluate((element) => element.scrollHeight - element.clientHeight - element.scrollTop))
+    .toBeLessThanOrEqual(1)
+
+  await file.getByRole("button").click()
+  await expect(wrapper.locator('[data-component="apply-patch-file-diff"]')).toBeVisible()
+  await expect
+    .poll(() => scroller.evaluate((element) => element.scrollHeight - element.clientHeight - element.scrollTop))
+    .toBeLessThanOrEqual(1)
+})
+
+test("keeps an expanded file diff header at the same viewport position", async ({ page }) => {
+  const id = "prt_file_projection_anchored_patch"
+  const before = Array.from({ length: 80 }, (_, index) => `export const value${index} = ${index}\n`).join("")
+  const after = before.replaceAll(" = ", " = compute(").replaceAll("\n", ")\n")
+  const timeline = await setupTimeline(page, {
+    messages: [
+      userMessage(),
+      assistantMessage([
+        toolPart(
+          id,
+          "patch",
+          "completed",
+          { patchText: "Update src/anchored.ts" },
+          {
+            metadata: {
+              files: [
+                {
+                  file: "src/anchored.ts",
+                  status: "modified",
+                  patch: createTwoFilesPatch("a/src/anchored.ts", "b/src/anchored.ts", before, after),
+                  additions: 80,
+                  deletions: 80,
+                },
+              ],
+            },
+          },
+        ),
+        textPart("prt_after_anchored_patch", "The diff is ready.\n\n".repeat(4)),
+      ]),
+    ],
+    viewport: { width: 1200, height: 600 },
+  })
+
+  const scroller = page.locator(".scroll-view__viewport", { has: page.locator("[data-timeline-row]") })
+  const wrapper = page.locator(`[data-timeline-part-id="${id}"]`)
+  const trigger = wrapper.getByRole("button")
+  await scroller.evaluate((element) => {
+    element.scrollTop = element.scrollHeight - element.clientHeight - 0.25
+  })
+  await expect(trigger).toBeInViewport()
+  await expect
+    .poll(() => scroller.evaluate((element) => element.scrollHeight - element.clientHeight - element.scrollTop))
+    .toBeLessThanOrEqual(0.5)
+  await trigger.dispatchEvent("wheel", { deltaY: -1, deltaMode: 0 })
+  await trigger.dispatchEvent("pointerdown")
+  const y = await trigger.evaluate((element) => element.getBoundingClientRect().y)
+  await trigger.dispatchEvent("click")
+  await expect(wrapper.locator('[data-component="apply-patch-file-diff"]')).toBeVisible()
+  await expect
+    .poll(() => trigger.evaluate((element, initialY) => Math.abs(element.getBoundingClientRect().y - initialY), y))
+    .toBeLessThanOrEqual(5)
+
+  const scrollTop = await scroller.evaluate((element) => element.scrollTop)
+  await scroller.hover()
+  await page.mouse.wheel(0, 200)
+  await timeline.settle(40)
+  const scrolled = await scroller.evaluate((element, initial) => element.scrollTop - initial, scrollTop)
+  expect(scrolled).toBeGreaterThan(50)
+  expect(scrolled).toBeLessThan(400)
+
+  const expandedY = await trigger.evaluate((element) => element.getBoundingClientRect().y)
+  await trigger.click()
+  await expect(wrapper.locator('[data-component="apply-patch-file-diff"]')).toHaveCount(0)
+  await expect
+    .poll(() =>
+      scroller.evaluate((element) => Math.abs(element.scrollHeight - element.clientHeight - element.scrollTop)),
+    )
+    .toBeLessThanOrEqual(1)
+  await expect.poll(() => trigger.evaluate((element) => element.getBoundingClientRect().y)).toBeGreaterThan(expandedY)
+
+  await trigger.click()
+  await expect(wrapper.locator('[data-component="apply-patch-file-diff"]')).toBeVisible()
+  await expect
+    .poll(() => scroller.evaluate((element) => element.scrollHeight - element.clientHeight - element.scrollTop))
+    .toBeLessThanOrEqual(1)
 })

packages/app/e2e/regression/session-timeline-file-state.spec.ts

@@ -2,7 +2,7 @@ import { expect, test } from "@playwright/test"
 import { assistantMessage, setupTimeline, toolPart, userMessage } from "../performance/timeline-stability/fixture"
 import { createTwoFilesPatch } from "diff"
 
-test("preserves nested patch file state through outer collapse and reopen", async ({ page }) => {
+test("keeps patch file disclosures independent", async ({ page }) => {
   const patchID = "prt_nested_patch"
   const files = [patchFile("src/a.ts", "modified"), patchFile("src/b.ts", "added"), patchFile("src/old.ts", "deleted")]
   await setupTimeline(page, {
@@ -21,15 +21,17 @@ test("preserves nested patch file state through outer collapse and reopen", asyn
     settings: { editToolPartsExpanded: true },
   })
   const wrapper = page.locator(`[data-timeline-part-id="${patchID}"]`)
-  const outer = wrapper.locator('[data-slot="collapsible-trigger"]').first()
+  const modified = wrapper.locator('[data-scope="apply-patch"] [data-type="update"]')
   const deleted = wrapper.locator('[data-scope="apply-patch"] [data-type="delete"]')
+  await expect(wrapper.locator('[data-scope="apply-patch"] [aria-expanded="false"]')).toHaveCount(3)
   await deleted.getByRole("button").click()
   await expect(deleted.getByRole("button")).toHaveAttribute("aria-expanded", "true")
-  await outer.click()
-  await expect(outer).toHaveAttribute("aria-expanded", "false")
-  await outer.click()
-  await expect(outer).toHaveAttribute("aria-expanded", "true")
-  await expect(deleted.getByRole("button")).toHaveAttribute("aria-expanded", "true")
+  await expect(modified.getByRole("button")).toHaveAttribute("aria-expanded", "false")
+  await modified.getByRole("button").click()
+  await expect(modified.getByRole("button")).toHaveAttribute("aria-expanded", "true")
+  await deleted.getByRole("button").click()
+  await expect(deleted.getByRole("button")).toHaveAttribute("aria-expanded", "false")
+  await expect(modified.getByRole("button")).toHaveAttribute("aria-expanded", "true")
 })
 
 function patchFile(file: string, status: "added" | "modified" | "deleted") {

packages/app/e2e/regression/session-timeline-lifecycle-state.spec.ts

@@ -1,5 +1,6 @@
 import { expect, test } from "@playwright/test"
 import {
+  assistantID,
   assistantMessage,
   completedAssistantInfo,
   messageUpdated,
@@ -8,9 +9,13 @@ import {
   renderedPartID,
   setupTimeline,
   shell,
+  sessionID,
   status,
   stepStarted,
   textPart,
+  toolCalled,
+  toolInputEnded,
+  toolInputStarted,
   userMessage,
 } from "../performance/timeline-stability/fixture"
 
@@ -34,7 +39,56 @@ for (const expanded of [false, true]) {
   })
 }
 
-test("shows and expands a running shell command without shimmering it", async ({ page }) => {
+test("transitions a streaming shell from writing through command execution", async ({ page }) => {
+  const id = "prt_shell_streaming_input"
+  const command = "printf ready"
+  const timeline = await setupTimeline(page, {
+    messages: [userMessage(), assistantMessage([], { completed: false })],
+  })
+  await timeline.send(toolInputStarted({ sessionID, assistantMessageID: assistantID, id, name: "shell" }))
+
+  const tool = page.locator(`[data-timeline-part-id="${id}"]`)
+  const title = tool.locator('[data-slot="basic-tool-tool-title"]')
+  const titleShimmer = title.locator('[data-component="text-shimmer"]')
+  const subtitle = tool.locator('[data-slot="basic-tool-tool-subtitle"]')
+  await expect(titleShimmer).toHaveAttribute("aria-label", "Shell")
+  await expect(titleShimmer).toHaveAttribute("data-active", "true")
+  await expect(subtitle).toHaveText("Writing command...")
+  await expect(subtitle.locator('[data-component="text-shimmer"]')).toHaveCount(0)
+  await expect(tool.locator('[data-component="shell-submessage"]')).toHaveCount(0)
+  await expect(tool.locator('[data-slot="collapsible-trigger"]')).toHaveCSS("height", "28px")
+  await expect(tool.locator('[data-component="tool-trigger"]')).toHaveCSS("gap", "6px")
+  await expect(title).toHaveCSS("font-size", "13px")
+  await expect(title).toHaveCSS("font-family", "Inter, sans-serif")
+  await expect(title).toHaveCSS("font-weight", "530")
+  await expect(title).toHaveCSS("line-height", "16px")
+  await expect(title).toHaveCSS("color", "rgb(22, 22, 22)")
+  await expect(subtitle).toHaveCSS("font-size", "13px")
+  await expect(subtitle).toHaveCSS("font-family", "Inter, sans-serif")
+  await expect(subtitle).toHaveCSS("font-weight", "440")
+  await expect(subtitle).toHaveCSS("line-height", "16px")
+  await expect(subtitle).toHaveCSS("color", "rgb(92, 92, 92)")
+
+  const input = JSON.stringify({ command })
+  await timeline.send(toolInputEnded({ sessionID, assistantMessageID: assistantID, id, text: input }))
+  await expect(titleShimmer).toHaveAttribute("data-active", "true")
+  await expect(subtitle).toHaveText(command)
+  await expect(tool).not.toContainText("Writing command...")
+
+  await timeline.send(
+    toolCalled({
+      sessionID,
+      assistantMessageID: assistantID,
+      id,
+      input: { command },
+      executed: true,
+    }),
+  )
+  await expect(titleShimmer).toHaveAttribute("data-active", "true")
+  await expect(subtitle).toHaveText(command)
+})
+
+test("shimmers and expands a running shell command", async ({ page }) => {
   const id = "prt_shell_running_command"
   const command = "sleep 10 && echo done"
   await setupTimeline(page, {
@@ -44,8 +98,10 @@ test("shows and expands a running shell command without shimmering it", async ({
 
   const tool = page.locator(`[data-timeline-part-id="${id}"]`)
   await expect(tool.locator('[data-component="text-shimmer"]')).toHaveAttribute("data-active", "true")
+  await expect(tool).not.toContainText("Writing command...")
   await expect(tool.locator('[data-component="shell-submessage"]')).toHaveText(command)
   await expect(tool.locator('[data-component="shell-submessage"] [data-component="text-shimmer"]')).toHaveCount(0)
+  await expect(tool.locator('[data-slot="collapsible-trigger"]')).toHaveCSS("height", "28px")
   await tool.locator('[data-slot="collapsible-trigger"]').click()
   await expect(tool.locator('[data-slot="collapsible-trigger"]')).toHaveAttribute("aria-expanded", "true")
   await expect(tool.locator('[data-slot="bash-pre"]')).toContainText("still running")

packages/app/e2e/regression/session-timeline-notices.spec.ts

@@ -1,6 +1,6 @@
 import { expect, test } from "@playwright/test"
 import type { SessionMessageAssistant, SessionMessageInfo } from "@opencode-ai/client/promise"
-import { event, session, sessionID, setupTimeline } from "../performance/timeline-stability/fixture"
+import { event, session, sessionID, setupTimeline, toolPart } from "../performance/timeline-stability/fixture"
 
 const user = { id: "msg_user", type: "user", text: "Run it", time: { created: 1 } } satisfies SessionMessageInfo
 
@@ -73,6 +73,81 @@ test("renders current protocol notices in CLI order", async ({ page }) => {
   expect(ownerWarnings).toEqual([])
 })
 
+test("shows a delegating row while subagent input streams", async ({ page }) => {
+  await setupTimeline(page, {
+    sessionMessages: [
+      user,
+      {
+        ...assistant(false),
+        content: [toolPart("call_subagent", "subagent", "streaming", {})],
+      },
+    ],
+  })
+
+  const delegating = page.locator('[data-component="task-tool-delegating"]')
+  await expect(delegating).toBeVisible()
+  await expect(delegating.locator('[data-component="text-shimmer"]')).toHaveAttribute(
+    "aria-label",
+    "Delegating agent...",
+  )
+  const icon = delegating.locator('[data-slot="icon-svg"]')
+  await expect(icon.locator('use[href="#opencode-v2-icon-subagent"]')).toBeVisible()
+  await expect(icon).toHaveCSS("color", "rgb(174, 174, 174)")
+  await expect(page.locator('[data-component="task-tool-card"]')).toHaveCount(0)
+  await expect(page.locator('[data-timeline-row="Thinking"]')).toHaveCount(0)
+})
+
+test("renders the moved location notice in its compact timeline style", async ({ page }) => {
+  const directory = `/Users/usrnk1/Developer/opencode/${"nested-directory/".repeat(24)}session`
+  await page.setViewportSize({ width: 480, height: 720 })
+  await setupTimeline(page, {
+    sessionMessages: [
+      user,
+      {
+        id: "msg_location",
+        type: "location-switched",
+        location: { directory },
+        time: { created: 2 },
+      },
+    ],
+  })
+
+  const notice = page.locator('[data-slot="session-timeline-notice"][data-type="location-switched"]')
+  const label = notice.locator('[data-slot="session-timeline-notice-label"]')
+  const value = notice.locator('[data-slot="session-timeline-notice-value"]')
+  const tooltipTrigger = notice.locator('[data-component="tooltip-v2-trigger"]')
+
+  await expect(label).toHaveText("Moved to")
+  await expect(value).toHaveText(directory)
+  await expect(notice).not.toContainText("·")
+  await expect(notice.locator("svg")).toHaveCount(0)
+  await expect(notice).toHaveCSS("height", "28px")
+  await expect(notice).toHaveCSS("gap", "8px")
+  await expect(notice).toHaveCSS("padding-top", "4px")
+  await expect(notice).toHaveCSS("padding-bottom", "4px")
+  await expect(label).toHaveCSS("font-size", "13px")
+  await expect(label).toHaveCSS("font-weight", "530")
+  await expect(label).toHaveCSS("line-height", "13px")
+  await expect(label).toHaveCSS("color", "rgb(128, 128, 128)")
+  await expect(value).toHaveCSS("font-size", "13px")
+  await expect(value).toHaveCSS("font-weight", "440")
+  await expect(value).toHaveCSS("line-height", "13px")
+  await expect(value).toHaveCSS("color", "rgb(128, 128, 128)")
+  await expect(value).toHaveCSS("text-overflow", "ellipsis")
+  await expect(value).toHaveCSS("white-space", "nowrap")
+  await expect(value).toHaveAttribute("dir", "ltr")
+  await expect.poll(() => value.evaluate((element) => element.scrollWidth > element.clientWidth)).toBe(true)
+
+  const tooltip = page.getByText("Session working directory changed", { exact: true })
+  await label.hover()
+  await expect(tooltip).toBeVisible()
+  await page.mouse.move(0, 0)
+  await expect(tooltip).toBeHidden()
+  await tooltipTrigger.focus()
+  await expect(tooltipTrigger).toBeFocused()
+  await expect(tooltip).toBeVisible()
+})
+
 test("moves blocking work to the background with Ctrl+B", async ({ page }) => {
   await setupTimeline(page, { sessionMessages: [user, assistant(false, true)] })
   const card = page.locator('[data-component="task-tool-card"]')
@@ -81,7 +156,24 @@ test("moves blocking work to the background with Ctrl+B", async ({ page }) => {
   await expect(card).not.toContainText("(background)")
   await expect(page.getByText("Called `subagent`", { exact: false })).toHaveCount(0)
   await expect(page.locator('[data-component="background-tool-control"]')).toHaveCount(0)
-  await expect(page.locator('[data-action="session-background-toggle"]')).toContainText("Move 1 subagent to background")
+  const hint = page.locator('[data-component="session-background-hint"]')
+  const hintPrefix = hint.locator('[data-slot="session-background-hint-prefix"]')
+  await expect(hint).toBeVisible()
+  await expect(page.locator('[data-timeline-row="Thinking"]')).toHaveCount(0)
+  await expect
+    .poll(async () => {
+      const [cardBox, hintBox, prefixBox] = await Promise.all([
+        card.boundingBox(),
+        hint.boundingBox(),
+        hintPrefix.boundingBox(),
+      ])
+      if (!cardBox || !hintBox || !prefixBox) return undefined
+      return {
+        aligned: Math.abs(cardBox.x - prefixBox.x) < 2,
+        ordered: cardBox.y < hintBox.y,
+      }
+    })
+    .toEqual({ aligned: true, ordered: true })
 
   const request = page.waitForRequest(
     (request) =>
@@ -104,10 +196,10 @@ test("navigates from a running subagent card and hides background controls in th
     sessionStatus: { [sessionID]: { type: "busy" }, [childID]: { type: "busy" } },
   })
 
-  await expect(page.locator('[data-action="session-background-toggle"]')).toContainText("Move 1 subagent to background")
+  await expect(page.getByText(/move running work to the background/i)).toBeVisible()
   await page.locator('[data-component="task-tool-card"]').click()
   await expect(page).toHaveURL(new RegExp(`/session/${childID}$`))
-  await expect(page.locator('[data-component="session-background-dock"]')).toHaveCount(0)
+  await expect(page.getByText(/move running work to the background/i)).toHaveCount(0)
 })
 
 test("shows a badge for active background work", async ({ page }) => {
@@ -118,7 +210,14 @@ test("shows a badge for active background work", async ({ page }) => {
     sessionStatus: { [childID]: { type: "busy" } },
   })
 
-  await expect(page.locator('[data-component="session-background-dock"]')).toContainText("1 subagent in background")
+  await page.getByRole("button", { name: "Session details" }).click()
+  const summary = page.getByRole("button", { name: "1 item running in background" })
+  await expect(summary).toContainText("1")
+  await expect(summary).toContainText("Running work in background")
+  await summary.click()
+  await expect(
+    page.locator('[data-component="session-background-list"]').getByText("Agent", { exact: true }),
+  ).toBeVisible()
 })
 
 test("separates blocking and already-backgrounded work into two rows", async ({ page }) => {
@@ -193,10 +292,15 @@ test("separates blocking and already-backgrounded work into two rows", async ({
     },
   })
 
-  const dock = page.locator('[data-component="session-background-dock"]')
   const backgroundCard = page.locator('[data-timeline-part-id="call_backgrounded"]')
-  await expect(dock).toContainText("Move 1 subagent to background")
-  await expect(dock.getByText("Running 1 shell and 1 subagent in background", { exact: true })).toBeVisible()
+  await expect(page.getByText(/move running work to the background/i)).toBeVisible()
+  await page.getByRole("button", { name: "Session details" }).click()
+  const summary = page.getByRole("button", { name: "2 items running in background" })
+  await expect(summary).toContainText("2")
+  await summary.click()
+  const list = page.locator('[data-component="session-background-list"]')
+  await expect(list).toContainText("Background task")
+  await expect(list).toContainText("sleep 120")
   await expect(backgroundCard).toContainText("Background task (background)")
   await expect(backgroundCard.locator('[data-component="session-progress-indicator-v2"]')).toBeVisible()
   await expect(

packages/app/e2e/regression/session-timeline-projection.spec.ts

@@ -1,6 +1,7 @@
 import { expect, test } from "@playwright/test"
 import {
   assistantMessage,
+  partUpdated,
   setupTimeline,
   status,
   toolPart,
@@ -69,9 +70,126 @@ test.describe("session timeline projection", () => {
     ]) {
       await expect(page.locator(`[data-timeline-part-id="${id}"]`).first(), id).toBeVisible()
     }
+    const patch = page.locator('[data-timeline-part-id="prt_patch"]')
+    await expect(patch.getByText("1 file", { exact: true })).toBeVisible()
+    await expect(patch.getByRole("button", { name: "Patch 1 file", exact: true })).toHaveCount(0)
+    await expect(patch.getByRole("button")).toHaveCount(1)
+    await expect(patch.locator('[data-scope="apply-patch"] button[aria-expanded="false"]')).toHaveCount(1)
+    await expect(patch.locator('[data-slot="message-part-title-filename"]')).toHaveCount(0)
+    await expect(patch.locator('[data-slot="message-part-actions"]')).toHaveCount(0)
+    const edit = page.locator('[data-timeline-part-id="prt_edit"]')
+    await expect(edit.locator('[data-component="apply-patch-tool"]')).toBeVisible()
+    await expect(edit.locator('[data-slot="basic-tool-tool-title"]')).toContainText("Edit")
     await expect(page.locator('[data-timeline-part-id="prt_todo"]')).toHaveCount(0)
   })
 
+  test("combines adjacent patch calls and repeated files into one group", async ({ page }) => {
+    const first = "prt_patch_first"
+    const second = "prt_patch_second"
+    const timeline = await setupTimeline(page, {
+      messages: [
+        userMessage(),
+        assistantMessage([
+          toolPart(
+            first,
+            "patch",
+            "completed",
+            { patchText: "Update src/first.ts" },
+            {
+              metadata: { files: [patchFile("src/first.ts", "modified")] },
+            },
+          ),
+        ]),
+      ],
+    })
+
+    const initial = page.locator(`[data-timeline-part-id="${first}"]`)
+    const initialFile = initial.locator('[data-scope="apply-patch"] [data-type="update"]')
+    await expect(initialFile).toBeVisible()
+    await initialFile.getByRole("button").click()
+    await expect(initialFile.getByRole("button")).toHaveAttribute("aria-expanded", "true")
+    await initial.evaluate((element) => {
+      const row = element.closest<HTMLElement>("[data-timeline-key]")
+      if (row) row.dataset.patchRow = "stable"
+    })
+
+    await timeline.send(
+      partUpdated(toolPart(second, "patch", "running", { patchText: "Update more files" }, { metadata: {} })),
+    )
+
+    const group = page.locator(`[data-timeline-part-ids="${first},${second}"]`)
+    await expect(group.locator("xpath=ancestor::*[@data-timeline-key]")).toHaveAttribute("data-patch-row", "stable")
+    await expect(group.locator('[data-slot="apply-patch-filename"]')).toHaveText(["first.ts"])
+    await expect(group.locator('[data-scope="apply-patch"] [data-type="update"] button')).toHaveAttribute(
+      "aria-expanded",
+      "true",
+    )
+
+    await timeline.send(
+      partUpdated(
+        toolPart(
+          second,
+          "patch",
+          "completed",
+          { patchText: "Update more files" },
+          {
+            metadata: {
+              files: [patchFile("src/first.ts", "modified"), patchFile("src/second.ts", "added")],
+            },
+          },
+        ),
+      ),
+    )
+
+    await expect(group.locator('[data-slot="apply-patch-filename"]')).toHaveText(["first.ts", "second.ts"])
+    await expect(group.locator('[data-scope="apply-patch"] [data-type="update"] button')).toHaveAttribute(
+      "aria-expanded",
+      "true",
+    )
+    await expect(group.locator('[data-scope="apply-patch"] [data-type="add"] button')).toHaveAttribute(
+      "aria-expanded",
+      "false",
+    )
+    await expect(page.locator(`[data-timeline-part-id="${first}"], [data-timeline-part-id="${second}"]`)).toHaveCount(0)
+  })
+
+  test("combines adjacent edit calls and repeated files into one group", async ({ page }) => {
+    const first = "prt_edit_first"
+    const second = "prt_edit_second"
+    await setupTimeline(page, {
+      messages: [
+        userMessage(),
+        assistantMessage([
+          toolPart(
+            first,
+            "edit",
+            "completed",
+            { path: "src/first.ts", oldString: "one", newString: "two" },
+            {
+              metadata: { files: [patchFile("src/first.ts", "modified")] },
+            },
+          ),
+          toolPart(
+            second,
+            "edit",
+            "completed",
+            { path: "src/first.ts", oldString: "two", newString: "three" },
+            {
+              metadata: { files: [patchFile("src/first.ts", "modified")] },
+            },
+          ),
+        ]),
+      ],
+      settings: { editToolPartsExpanded: true },
+    })
+
+    const group = page.locator(`[data-timeline-part-ids="${first},${second}"]`)
+    await expect(group.locator('[data-slot="basic-tool-tool-title"]')).toContainText("Edit")
+    await expect(group.getByText("1 file", { exact: true })).toBeVisible()
+    await expect(group.locator('[data-slot="apply-patch-filename"]')).toHaveText(["first.ts"])
+    await expect(group.locator('[data-scope="apply-patch"] button')).toHaveAttribute("aria-expanded", "true")
+  })
+
   test("projects gaps, dividers, assistant parts, and errors together", async ({ page }) => {
     const firstUser = userMessage(
       [
@@ -196,11 +314,7 @@ function patchPart(id: string) {
     { patchText: "Update the projected files" },
     {
       metadata: {
-        files: [
-          patchFile("src/a.ts", "modified"),
-          patchFile("src/b.ts", "added"),
-          patchFile("src/old.ts", "deleted"),
-        ],
+        files: [patchFile("src/a.ts", "modified")],
       },
     },
   )

packages/app/e2e/regression/session-timeline-tool-projection.spec.ts

@@ -127,19 +127,16 @@ test("labels skill tools from IDs and result metadata", async ({ page }) => {
     ],
   })
 
-  await expect(page.locator(`[data-timeline-part-id="${pending}"] [data-component="text-shimmer"]`)).toHaveAttribute(
-    "aria-label",
-    "sample-skill",
-  )
-  await expect(page.locator(`[data-timeline-part-id="${completed}"] [data-component="text-shimmer"]`)).toHaveAttribute(
-    "aria-label",
-    "OpenCode",
-  )
-  for (const id of [pending, completed]) {
+  for (const [id, name] of [
+    [pending, "sample-skill"],
+    [completed, "OpenCode"],
+  ] as const) {
     const skill = page.locator(`[data-timeline-part-id="${id}"]`)
-    await expect(skill.locator('[data-slot="skill-tool-label"]')).toHaveText("Skill")
-    await expect(skill.locator('[data-slot="skill-tool-separator"]')).toHaveText("·")
-    await expect(skill.locator('use[href="#opencode-v2-icon-post-skill"]')).toBeVisible()
+    const loaded = skill.locator('[data-component="tool-loaded-item"]')
+    await expect(loaded).toHaveAttribute("aria-label", `Loaded ${name} skill`)
+    await expect(loaded.locator('[data-slot="tool-loaded-label"]')).toHaveText("Loaded")
+    await expect(loaded.locator('[data-slot="tool-loaded-kind"]')).toHaveText("skill")
+    await expect(loaded.locator('[data-component="text-shimmer"]')).toHaveAttribute("aria-label", name)
   }
 })
 

packages/app/e2e/regression/terminal-composer-focus.spec.ts

@@ -9,10 +9,12 @@ const sessionID = "ses_terminal_composer_focus"
 const ptyID = "pty_terminal_composer_focus"
 const newPtyID = "pty_terminal_composer_focus_new"
 const server = `http://${process.env.PLAYWRIGHT_SERVER_HOST ?? "127.0.0.1"}:${process.env.PLAYWRIGHT_SERVER_PORT ?? "4096"}`
+const ptyInput: string[] = []
 
 test.use({ viewport: { width: 1440, height: 900 } })
 
 test.beforeEach(async ({ page }) => {
+  ptyInput.length = 0
   await mockOpenCodeServer(page, {
     directory,
     project: {
@@ -70,7 +72,22 @@ test.beforeEach(async ({ page }) => {
       body: JSON.stringify({ location: ptyLocation(), data: { ticket: "e2e-ticket", expires_in: 60 } }),
     }),
   )
-  await page.routeWebSocket(new RegExp(`/api/pty/${ptyID}/connect`), () => undefined)
+  await page.routeWebSocket(new RegExp(`/api/pty/${ptyID}/connect`), (ws) => {
+    ws.onMessage((message) => ptyInput.push(message.toString()))
+  })
+})
+
+test("clears the terminal line with Command+Delete", async ({ page }) => {
+  await page.goto(`/server/${base64Encode(server)}/session/${sessionID}`)
+  await expectSessionTitle(page, "Terminal composer focus")
+
+  const terminal = page.locator('[data-component="terminal"]')
+  await page.keyboard.press("Control+Backquote")
+  await expect(terminal.locator("textarea")).toHaveCount(1)
+
+  await page.keyboard.press("Meta+Backspace")
+
+  await expect.poll(() => ptyInput.join("")).toBe("\x15")
 })
 
 test("routes typing to the composer unless the open terminal is focused", async ({ page }) => {

packages/app/package.json

@@ -48,6 +48,7 @@
     "typescript": "catalog:",
     "vite": "8.2.1",
     "vite-plugin-icons-spritesheet": "3.0.1",
+    "vite-plugin-pwa": "1.3.0",
     "vite-plugin-solid": "2.11.14"
   },
   "dependencies": {

packages/app/public/_headers

@@ -15,3 +15,14 @@
 
 /*.css
   Content-Type: text/css
+
+/site.webmanifest
+  Content-Type: application/manifest+json
+
+/sw.js
+  Content-Type: application/javascript
+  Cache-Control: no-cache
+
+/registerSW.js
+  Content-Type: application/javascript
+  Cache-Control: no-cache

packages/app/src/entry.tsx

@@ -61,7 +61,9 @@ if (import.meta.env.VITE_SENTRY_DSN) {
   })
 }
 
-if (root instanceof HTMLElement) {
+if (root instanceof HTMLElement && root.dataset.opencodeMounted === undefined) {
+  // Lazy chunks can import the entry chunk back under a distinct URL, so claim the root before async startup.
+  root.dataset.opencodeMounted = ""
   void loadInitialLocale().then((locale) => {
     const auth = authFromToken(new URLSearchParams(location.search).get("auth_token"))
     clearAuthToken()

packages/app/src/home/model.ts

@@ -3,7 +3,7 @@ import { type HomeProjectSelection, useLayout } from "@/shell/state/layout"
 import { ServerConnection } from "@/runtime/server/registry"
 import { useTabs } from "@/shell/tabs/tabs"
 import { toggleHomeProjectSelection } from "@/shell/layout/helpers"
-import { createEffect, createMemo } from "solid-js"
+import { createEffect, createMemo, startTransition } from "solid-js"
 
 export function createHomeController() {
   const layout = useLayout()
@@ -50,7 +50,8 @@ export function createHomeController() {
     selection: {
       value: selection,
       set: setSelection,
-      focusServer: (conn: ServerConnection.Any) => setSelection({ server: ServerConnection.key(conn) }),
+      focusServer: (conn: ServerConnection.Any) =>
+        void startTransition(() => setSelection({ server: ServerConnection.key(conn) })),
     },
     server: {
       list: global.servers.list,

packages/app/src/new-session/composer-adapter.ts

@@ -1,5 +1,6 @@
 import { base64Encode } from "@opencode-ai/util/encode"
 import { getDirectory } from "@opencode-ai/util/path"
+import { startTransition } from "solid-js"
 import type { NewSessionComposerAdapter } from "@/composer/adapter"
 import { useComposerState } from "@/composer/persistence"
 import { createComposerControls, createComposerModelSelection } from "@/composer/selection"
@@ -71,21 +72,24 @@ export function createNewSessionComposerAdapter(props: {
       if (!created) return
 
       data.session.remember(created)
-      if (permission.isAutoAcceptingDirectory(projectDirectory)) {
-        permission.enableAutoAccept(created.id, sessionDirectory)
-      }
-      local.session.promote(sessionDirectory, created.id, {
-        agent: selection.agent,
-        model: selection.model,
-        variant: selection.variant ?? null,
+      await startTransition(() => {
+        tabs.updateDraft(props.draftID, { worktree: undefined })
+        if (permission.isAutoAcceptingDirectory(projectDirectory)) {
+          permission.enableAutoAccept(created.id, sessionDirectory)
+        }
+        local.session.promote(sessionDirectory, created.id, {
+          agent: selection.agent,
+          model: selection.model,
+          variant: selection.variant ?? null,
+        })
+        tabs.promoteDraft(props.draftID, { server: server.key, sessionId: created.id })
+        submission.retarget(
+          prompt.capture(
+            { dir: base64Encode(sessionDirectory), id: created.id },
+            { server: server.key, scope: serverSDK.scope },
+          ),
+        )
       })
-      await tabs.promoteDraft(props.draftID, { server: server.key, sessionId: created.id })
-      submission.retarget(
-        prompt.capture(
-          { dir: base64Encode(sessionDirectory), id: created.id },
-          { server: server.key, scope: serverSDK.scope },
-        ),
-      )
 
       return {
         id: created.id,

packages/app/src/new-session/screen.tsx

@@ -1,6 +1,5 @@
 import { createPromptProjectController } from "@/new-session/project/selector"
 import { useSettingsDialog } from "@/settings/command"
-import { useTitlebarRightMount } from "@/shell/titlebar/titlebar"
 import { useSettings } from "@/settings/model"
 import { useTabs, type DraftTab } from "@/shell/tabs/tabs"
 import { useSearchParams } from "@solidjs/router"
@@ -15,7 +14,6 @@ import { useNewSessionCommands } from "./commands"
 /** The draft-only Session page. Submitting promotes the draft into a real Session. */
 export default function NewSessionPage(props: { draftId: string }) {
   const settings = useSettings()
-  const rightMount = useTitlebarRightMount()
   const [search, setSearch] = useSearchParams<{ draftId?: string; prompt?: string }>()
   const tabs = useTabs()
   const openWorkspaces = useSettingsDialog("workspaces")
@@ -69,7 +67,7 @@ export default function NewSessionPage(props: { draftId: string }) {
   return (
     <div class="relative size-full overflow-hidden flex flex-col">
       {suspendUntilPromptReady()}
-      <NewSessionStatus mount={rightMount()} visible={settings.visibility.status()} />
+      <NewSessionStatus visible={settings.visibility.status()} />
       <div class="flex-1 min-h-0 flex flex-col gap-2 p-2">
         <NewSessionView composer={model} project={project} workspace={workspace} />
       </div>

packages/app/src/new-session/view.tsx

@@ -4,7 +4,6 @@ import { Icon } from "@opencode-ai/ui/icon"
 import { Wordmark } from "@opencode-ai/ui/wordmark"
 import { Show, createMemo, createSignal } from "solid-js"
 import { createStore } from "solid-js/store"
-import { Portal } from "solid-js/web"
 import createPresence from "solid-presence"
 import { Composer } from "@/composer/composer"
 import type { ComposerModel } from "@/composer/model"
@@ -15,6 +14,7 @@ import {
   type PromptProjectController,
 } from "@/new-session/project/selector"
 import { StatusPopover } from "@/shell/status/status-popover"
+import { TitlebarRight } from "@/shell/titlebar/right-slot"
 import { useLanguage } from "@/runtime/i18n/language"
 import { useWorkspaceLocation } from "@/workspaces/location"
 import { useProviders } from "@/providers/catalog/providers"
@@ -87,21 +87,16 @@ export function NewSessionView(props: {
   )
 }
 
-export function NewSessionStatus(props: { mount: HTMLElement | null; visible: boolean }) {
+export function NewSessionStatus(props: { visible: boolean }) {
   const language = useLanguage()
-
   return (
-    <Show when={props.mount} keyed>
-      {(mount) => (
-        <Portal mount={mount}>
-          <Show when={props.visible}>
-            <Tooltip appearance="standard" placement="bottom" value={language.t("status.popover.trigger")}>
-              <StatusPopover />
-            </Tooltip>
-          </Show>
-        </Portal>
-      )}
-    </Show>
+    <TitlebarRight>
+      <Show when={props.visible}>
+        <Tooltip appearance="standard" placement="bottom" value={language.t("status.popover.trigger")}>
+          <StatusPopover />
+        </Tooltip>
+      </Show>
+    </TitlebarRight>
   )
 }
 

packages/app/src/runtime/i18n/en.ts

@@ -30,6 +30,7 @@ export const dict = {
   "command.project.previous": "Previous project",
   "command.project.next": "Next project",
   "command.project.index": "Switch to project {{index}}",
+  "command.project.copyID": "Copy Project ID",
   "command.provider.connect": "Connect provider",
   "command.server.switch": "Switch server",
   "command.settings.open": "Open settings",
@@ -93,6 +94,7 @@ export const dict = {
   "command.session.fork.description": "Create a new session from a previous message",
   "command.session.export": "Export session",
   "command.session.export.description": "Export the full session transcript as JSON",
+  "command.session.copyID": "Copy Session ID",
 
   "palette.search.placeholder": "Search files, commands, and sessions",
   "palette.search.placeholder.home": "Search commands and sessions",
@@ -544,7 +546,6 @@ export const dict = {
   "toast.context.noLineSelection.title": "No line selection",
   "toast.context.noLineSelection.description": "Select a line range in a file tab first.",
 
-
   "toast.session.unshare.success.title": "Session unshared",
   "toast.session.unshare.success.description": "Session unshared successfully!",
   "toast.session.unshare.failed.title": "Failed to unshare session",
@@ -554,6 +555,10 @@ export const dict = {
   "toast.session.export.success.description": "Saved session to {{filename}}",
   "toast.session.export.failed.title": "Failed to export session",
   "toast.session.export.failed.description": "An error occurred while exporting the session",
+  "toast.session.copyID.failed.title": "Failed to copy session ID",
+  "toast.session.copyID.failed.description": "An error occurred while copying the session ID",
+  "toast.project.copyID.failed.title": "Failed to copy project ID",
+  "toast.project.copyID.failed.description": "An error occurred while copying the project ID",
 
   "toast.session.listFailed.title": "Failed to load sessions for {{project}}",
   "toast.project.reloadFailed.title": "Failed to reload {{project}}",
@@ -657,6 +662,10 @@ export const dict = {
     "{{server}} is running OpenCode {{version}}, which isn't compatible with this app. Upgrade the server to OpenCode V2 to continue.",
   "session.background.moveTasks": "Move {{tasks}} to background",
   "session.background.inBackground": "Running {{tasks}} in background",
+  "session.background.moveInline": "Press {{keybind}} to move running work to the background",
+  "session.background.running": "Running work in background",
+  "session.background.runningCount.one": "{{count}} item running in background",
+  "session.background.runningCount.other": "{{count}} items running in background",
   "session.background.combine": "{{first}} and {{second}}",
   "session.background.shell.one": "{{count}} shell",
   "session.background.shell.other": "{{count}} shells",
@@ -913,6 +922,10 @@ export const dict = {
   "settings.general.row.shell.description": "Shell used by the terminal and agent tools",
   "settings.general.row.shell.autoDefault": "Auto (Default)",
   "settings.general.row.shell.terminalOnly": "terminal only",
+  "settings.general.row.terminalPlacement.title": "Terminal placement",
+  "settings.general.row.terminalPlacement.description": "Choose where the terminal opens in sessions",
+  "settings.general.row.terminalPlacement.side": "Side",
+  "settings.general.row.terminalPlacement.bottom": "Bottom",
   "settings.general.row.appearance.title": "Appearance",
   "settings.general.row.appearance.description": "Customise how OpenCode looks on your device",
   "settings.general.row.colorScheme.title": "Color scheme",

packages/app/src/session/commands/use-session-commands.tsx

@@ -89,6 +89,7 @@ export const useSessionCommands = (actions: SessionCommandContext) => {
   const focusInput = actions.focusInput
 
   const sessionCommand = withCategory(language.t("command.category.session"))
+  const projectCommand = withCategory(language.t("command.category.project"))
   const fileCommand = withCategory(language.t("command.category.file"))
   const contextCommand = withCategory(language.t("command.category.context"))
   const viewCommand = withCategory(language.t("command.category.view"))
@@ -126,6 +127,46 @@ export const useSessionCommands = (actions: SessionCommandContext) => {
     }
   }
 
+  const copySessionID = async () => {
+    const sessionID = actions.session.identity.params.id
+    if (!sessionID) return
+    try {
+      await navigator.clipboard.writeText(sessionID)
+      showToast({
+        variant: "success",
+        icon: "circle-check",
+        title: language.t("common.copied"),
+        description: sessionID,
+      })
+    } catch (err) {
+      showToast({
+        variant: "error",
+        title: language.t("toast.session.copyID.failed.title"),
+        description: err instanceof Error ? err.message : language.t("toast.session.copyID.failed.description"),
+      })
+    }
+  }
+
+  const copyProjectID = async () => {
+    const projectID = actions.session.data.info()?.projectID
+    if (!projectID) return
+    try {
+      await navigator.clipboard.writeText(projectID)
+      showToast({
+        variant: "success",
+        icon: "circle-check",
+        title: language.t("common.copied"),
+        description: projectID,
+      })
+    } catch (err) {
+      showToast({
+        variant: "error",
+        title: language.t("toast.project.copyID.failed.title"),
+        description: err instanceof Error ? err.message : language.t("toast.project.copyID.failed.description"),
+      })
+    }
+  }
+
   const openFile = () => {
     void openDialog(
       () => import("@/shell/commands/dialog"),
@@ -271,6 +312,12 @@ export const useSessionCommands = (actions: SessionCommandContext) => {
       disabled: !actions.session.identity.params.id,
       onSelect: exportSession,
     }),
+    sessionCommand({
+      id: "session.copyID",
+      title: language.t("command.session.copyID"),
+      disabled: !actions.session.identity.params.id,
+      onSelect: copySessionID,
+    }),
   ]
 
   const fileCmds = () => {
@@ -294,6 +341,15 @@ export const useSessionCommands = (actions: SessionCommandContext) => {
     ].filter((v) => !!v)
   }
 
+  const projectCmds = () => [
+    projectCommand({
+      id: "project.copyID",
+      title: language.t("command.project.copyID"),
+      disabled: !actions.session.data.info()?.projectID,
+      onSelect: copyProjectID,
+    }),
+  ]
+
   const contextCmds = () => [
     contextCommand({
       id: "context.addSelection",
@@ -407,6 +463,7 @@ export const useSessionCommands = (actions: SessionCommandContext) => {
 
   command.register("session", () => [
     ...sessionCmds(),
+    ...projectCmds(),
     ...fileCmds(),
     ...contextCmds(),
     ...viewCmds(),

packages/app/src/session/composer/region.tsx

@@ -133,7 +133,7 @@ export function createActiveSessionRegion(input: {
       const scroller = input.timeline.scroller()
       if (!scroller || !isScrollKeyTarget(target ?? null, key)) return
       if (scrollKeyOwner(scroller, target ?? null, key) !== scroller) return
-      input.timeline.view.markGesture(scroller)
+      input.timeline.view.markUserScroll(scroller)
       return
     }
     if (event.key.length !== 1 || event.key === "Unidentified" || event.ctrlKey || event.metaKey) return

packages/app/src/session/composer/session-composer-region.tsx

@@ -2,15 +2,12 @@ import { Show, type JSX } from "solid-js"
 import { useLanguage } from "@/runtime/i18n/language"
 import { SessionPermissionDock } from "@/session/requests/session-permission-dock"
 import { SessionQuestionDock } from "@/session/requests/session-question-dock"
-import { SessionBackgroundDock } from "@/session/requests/session-background-dock"
 import type { SessionComposerRegionController } from "./session-composer-region-controller"
 
 type SessionComposerRegionState = Pick<
   SessionComposerRegionController["state"],
   "questionRequest" | "permissionRequest" | "permissionResponding" | "decide" | "blocked"
-> & {
-  background: Pick<SessionComposerRegionController["state"]["background"], "blocking" | "tasks" | "move">
-}
+>
 
 export type SessionComposerRegionViewController = Pick<
   SessionComposerRegionController,
@@ -32,9 +29,6 @@ export function SessionComposerRegion(props: {
 }) {
   const language = useLanguage()
   const controller = props.controller
-  const background = () =>
-    controller.state.background.blocking().length > 0 || controller.state.background.tasks().length > 0
-
   return (
     <div
       ref={controller.setDockRef}
@@ -81,22 +75,10 @@ export function SessionComposerRegion(props: {
               </>
             }
           >
-            <Show when={background()}>
-              <div>
-                <SessionBackgroundDock
-                  blocking={controller.state.background.blocking()}
-                  tasks={controller.state.background.tasks()}
-                  onBackground={() => void controller.state.background.move()}
-                />
-              </div>
-            </Show>
             <div
               classList={{
                 "relative z-[70]": true,
               }}
-              style={{
-                "margin-top": `${background() ? -36 : 0}px`,
-              }}
             >
               <Show
                 when={controller.child()}

packages/app/src/session/header/session-header.tsx

@@ -1,13 +1,12 @@
-import { createMemo, Show } from "solid-js"
+import { createMemo } from "solid-js"
 import { createMediaQuery } from "@solid-primitives/media"
-import { Portal } from "solid-js/web"
 import { useCommand } from "@/shell/commands/command"
 import { useLanguage } from "@/runtime/i18n/language"
 import { useSettings } from "@/settings/model"
 import { useSessionLayout } from "@/session/session-layout"
 import { reviewTooltipKeybind } from "@/shell/commands/tooltip-keybind"
 import { StatusPopover } from "@/shell/status/status-popover"
-import { useTitlebarRightMount } from "@/shell/titlebar/titlebar"
+import { TitlebarRight } from "@/shell/titlebar/right-slot"
 import { SessionHeaderActions, type SessionHeaderActionsState } from "./session-header-actions"
 
 export function SessionHeader() {
@@ -28,15 +27,9 @@ export function SessionHeader() {
     onReviewToggle: () => view().reviewPanel.toggle(),
   }))
 
-  const rightMount = useTitlebarRightMount()
-
   return (
-    <Show when={rightMount()} keyed>
-      {(mount) => (
-        <Portal mount={mount}>
-          <SessionHeaderActions state={actions()} />
-        </Portal>
-      )}
-    </Show>
+    <TitlebarRight>
+      <SessionHeaderActions state={actions()} />
+    </TitlebarRight>
   )
 }

packages/app/src/session/requests/model.ts

@@ -63,6 +63,7 @@ export function createSessionRequestModel() {
       return [
         {
           type: part.name as "shell" | "subagent",
+          partID: part.id,
           id: typeof value === "string" ? value : undefined,
           label: typeof label === "string" ? label : undefined,
         },
@@ -93,11 +94,13 @@ export function createSessionRequestModel() {
         const sessionID = part.state.metadata.sessionID
         if (typeof sessionID !== "string" || completed.has(sessionID)) return []
         const description = part.state.input.description
+        const agent = part.state.input.agent
         return [
           {
             id: sessionID,
             type: "subagent" as const,
             label: typeof description === "string" ? description : sessionID,
+            agent: typeof agent === "string" ? agent : undefined,
           },
         ]
       })

packages/app/src/session/requests/session-background-dock.tsx

@@ -1,83 +0,0 @@
-import { useLanguage } from "@/runtime/i18n/language"
-import { useCommand } from "@/shell/commands/command"
-import { Keybind } from "@opencode-ai/ui/keybind"
-import { For, createMemo } from "solid-js"
-import { createStore } from "solid-js/store"
-import { SessionBackgroundPullout } from "./session-background-pullout"
-
-export function SessionBackgroundDock(props: {
-  blocking: { type: "shell" | "subagent"; id?: string; label?: string }[]
-  tasks: { id: string; type: "shell" | "subagent"; label: string }[]
-  onBackground: () => void
-}) {
-  const language = useLanguage()
-  const command = useCommand()
-  const [store, setStore] = createStore({ collapsed: true })
-  const describe = (shells: number, subagents: number) => {
-    const shell = shells ? language.plural("session.background.shell", shells, { count: shells }) : undefined
-    const subagent = subagents
-      ? language.plural("session.background.subagent", subagents, { count: subagents })
-      : undefined
-    if (shell && subagent) return language.t("session.background.combine", { first: shell, second: subagent })
-    return shell ?? subagent ?? ""
-  }
-  const summary = createMemo(() => {
-    const shells = props.tasks.filter((task) => task.type === "shell").length
-    return describe(shells, props.tasks.length - shells)
-  })
-  const moving = createMemo(() => {
-    const shells = props.blocking.filter((task) => task.type === "shell").length
-    const subagents = props.blocking.length - shells
-    const tasks = describe(shells, subagents)
-    return tasks ? language.t("session.background.moveTasks", { tasks }) : ""
-  })
-  const background = createMemo(() =>
-    summary() ? language.t("session.background.inBackground", { tasks: summary() }) : "",
-  )
-  const blocking = () => props.blocking.length > 0
-  const toggle = () => {
-    if (blocking()) {
-      props.onBackground()
-      return
-    }
-    setStore("collapsed", (value) => !value)
-  }
-
-  return (
-    <SessionBackgroundPullout
-      label={
-        <span class="flex flex-col items-start">
-          {blocking() && (
-            <span>
-              <span class="text-v2-text-text-muted">{moving()}</span>
-              <span class="pl-2">
-                <Keybind keys={command.keybindParts("session.background")} variant="neutral" />
-              </span>
-            </span>
-          )}
-          {!!props.tasks.length && <span class="text-v2-text-text-faint">{background()}</span>}
-        </span>
-      }
-      ariaLabel={[moving(), background()].filter(Boolean).join(". ")}
-      multiline={blocking() && props.tasks.length > 0}
-      collapsed={blocking() || store.collapsed}
-      collapsible={!blocking()}
-      onToggle={toggle}
-      collapseLabel={language.t("session.todo.collapse")}
-      expandLabel={language.t("session.todo.expand")}
-    >
-      <div class="px-4 pb-11 flex flex-col gap-1.5">
-        <For each={props.tasks}>
-          {(task) => (
-            <div class="flex min-w-0 items-baseline gap-2 text-13-regular">
-              <span class="shrink-0 text-13-medium text-text-strong">
-                {language.t(task.type === "shell" ? "ui.tool.shell" : "ui.tool.agent.default")}
-              </span>
-              <span class="truncate text-text-weak">{task.label}</span>
-            </div>
-          )}
-        </For>
-      </div>
-    </SessionBackgroundPullout>
-  )
-}

packages/app/src/session/requests/session-background-pullout.tsx

@@ -1,114 +0,0 @@
-import { IconButton } from "@opencode-ai/ui/icon-button"
-import { Icon } from "@opencode-ai/ui/icon"
-import { useSpring } from "@opencode-ai/ui/motion-spring"
-import { createResizeObserver } from "@solid-primitives/resize-observer"
-import { createEffect, createMemo, type JSX } from "solid-js"
-import { createStore } from "solid-js/store"
-
-export function SessionBackgroundPullout(props: {
-  label: JSX.Element
-  ariaLabel: string
-  multiline?: boolean
-  collapsed: boolean
-  collapsible?: boolean
-  onToggle: () => void
-  collapseLabel: string
-  expandLabel: string
-  children: JSX.Element
-}) {
-  const [store, setStore] = createStore({ height: 78, header: 42 })
-  const collapse = useSpring(() => (props.collapsed ? 1 : 0), { visualDuration: 0.3, bounce: 0 })
-  const value = createMemo(() => Math.max(0, Math.min(1, collapse())))
-  const off = createMemo(() => value() > 0.98)
-  const base = createMemo(() => Math.max(78, store.header + 36))
-  const full = createMemo(() => Math.max(base(), store.height))
-  let contentRef: HTMLDivElement | undefined
-  let headerRef: HTMLDivElement | undefined
-
-  createEffect(() => {
-    const element = contentRef
-    const header = headerRef
-    if (!element || !header) return
-    const update = () => {
-      setStore("height", (height) => Math.max(height, element.scrollHeight))
-      setStore("header", header.getBoundingClientRect().height)
-    }
-    update()
-    createResizeObserver([element, header], update)
-  })
-
-  return (
-    <div
-      data-component="session-background-dock"
-      class="w-full overflow-hidden rounded-xl border-[0.5px] border-v2-border-border-base bg-v2-background-bg-layer-01"
-      style={{
-        "overflow-x": "visible",
-        "overflow-y": "hidden",
-        "max-height": `${Math.max(base(), full() - value() * (full() - base()))}px`,
-      }}
-    >
-      <div ref={contentRef}>
-        <div
-          ref={headerRef}
-          data-action="session-background-toggle"
-          class="flex items-center gap-2 overflow-visible pl-4 pr-2"
-          classList={{
-            "h-[42px]": !props.multiline,
-            "min-h-[42px] py-2": props.multiline,
-          }}
-          role="button"
-          tabIndex={0}
-          onClick={props.onToggle}
-          onKeyDown={(event) => {
-            if (event.key !== "Enter" && event.key !== " ") return
-            event.preventDefault()
-            props.onToggle()
-          }}
-        >
-          <span
-            class="cursor-default inline-flex items-baseline shrink-0 overflow-visible font-[440] text-[13px] leading-5 tracking-[-0.04px] text-v2-text-text-muted"
-            aria-label={props.ariaLabel}
-            style={{
-              "--tool-motion-odometer-ms": "600ms",
-              "--tool-motion-mask": "18%",
-              "--tool-motion-mask-height": "0px",
-              "--tool-motion-spring-ms": "560ms",
-              "white-space": "pre",
-            }}
-          >
-            {props.label}
-          </span>
-          {props.collapsible !== false && (
-            <div class="ml-auto">
-              <IconButton
-                data-action="session-background-toggle-button"
-                data-collapsed={props.collapsed ? "true" : "false"}
-                icon={<Icon name="chevron-down" />}
-                size="normal"
-                variant="ghost"
-                style={{ transform: `rotate(${value() * 180}deg)` }}
-                onMouseDown={(event) => {
-                  event.preventDefault()
-                  event.stopPropagation()
-                }}
-                onClick={(event) => {
-                  event.stopPropagation()
-                  props.onToggle()
-                }}
-                aria-label={props.collapsed ? props.expandLabel : props.collapseLabel}
-              />
-            </div>
-          )}
-        </div>
-        <div
-          data-slot="session-background-list"
-          aria-hidden={props.collapsed || off()}
-          classList={{ "pointer-events-none": value() > 0.1 }}
-          style={{ visibility: off() ? "hidden" : "visible", opacity: `${Math.max(0, 1 - value())}` }}
-        >
-          {props.children}
-        </div>
-      </div>
-    </div>
-  )
-}

packages/app/src/session/screen-layout.ts

@@ -15,6 +15,10 @@ export function createSessionScreenLayout(session: SessionModel, serverScope: st
   const reviewPanelOpen = createMemo(() => reviewOpen() && !!session.identity.params.id)
   const terminalOpen = createMemo(() => session.layout.view().terminal.opened())
   const desktopTerminalOpen = createMemo(() => session.isDesktop() && terminalOpen())
+  const sideTerminalOpen = createMemo(() => desktopTerminalOpen() && settings.general.terminalPlacement() === "side")
+  const bottomTerminalOpen = createMemo(
+    () => desktopTerminalOpen() && settings.general.terminalPlacement() === "bottom",
+  )
   const fileTreeOpen = createMemo(
     () =>
       session.isDesktop() &&
@@ -23,7 +27,7 @@ export function createSessionScreenLayout(session: SessionModel, serverScope: st
         opened: layout.fileTree.opened(),
       }),
   )
-  const resizable = createMemo(() => reviewPanelOpen() || desktopTerminalOpen())
+  const resizable = createMemo(() => reviewPanelOpen() || sideTerminalOpen())
   const sidePanelOpen = createMemo(() => resizable() || fileTreeOpen())
   const [rowWidth, setRowWidth] = createSignal<number>()
   let row: HTMLDivElement | undefined
@@ -57,7 +61,7 @@ export function createSessionScreenLayout(session: SessionModel, serverScope: st
   const panelLayout = createMemo(() =>
     sessionPanelLayout({
       review: reviewPanelOpen(),
-      terminal: desktopTerminalOpen(),
+      terminal: sideTerminalOpen(),
       files: fileTreeOpen(),
     }),
   )
@@ -97,11 +101,11 @@ export function createSessionScreenLayout(session: SessionModel, serverScope: st
       panelOpen: reviewPanelOpen,
       snap: reviewSnap,
     },
-    side: { layout: panelLayout, open: sidePanelOpen },
+    side: { layout: panelLayout },
     size,
     terminal: {
-      desktopOpen: desktopTerminalOpen,
-      inlineOnlyOpen: createMemo(() => desktopTerminalOpen() && !reviewPanelOpen()),
+      bottomOpen: bottomTerminalOpen,
+      inlineOnlyOpen: createMemo(() => sideTerminalOpen() && !reviewPanelOpen()),
       open: terminalOpen,
     },
   }

packages/app/src/session/screen.tsx

@@ -72,25 +72,24 @@ export function SessionScreen(props: { session: SessionModel }) {
               {(_id) => (
                 <MessageTimeline
                   session={session}
+                  background={composer.region.state.background}
                   actions={composer.actions.timeline}
                   scroll={timeline.scroll}
                   onResumeScroll={timeline.actions.resume}
                   setScrollRef={timeline.view.setScrollRef}
                   onScheduleScrollState={timeline.view.scheduleScrollState}
-                  onAutoScrollHandleScroll={timeline.autoScroll.handleScroll}
-                  onMarkScrollGesture={timeline.view.markGesture}
-                  hasScrollGesture={timeline.view.hasGesture()}
+                  onPin={timeline.view.pin}
+                  onUnpin={timeline.view.unpin}
                   onUserScroll={timeline.view.markUserScroll}
                   onHistoryScroll={timeline.view.onHistoryScroll}
-                  onAutoScrollInteraction={timeline.autoScroll.handleInteraction}
-                  shouldAnchorBottom={timeline.view.shouldAnchorBottom()}
+                  onSelectionInteraction={timeline.view.selectionInteraction}
+                  pinned={timeline.view.pinned()}
                   centered={screen.centered()}
                   setContentRef={timeline.view.setContentRef}
                   diffs={review.details.diffs}
                   onReview={review.open}
                   workspaceMoveEligible={composer.workspaceMoveEligible()}
                   onSummaryOpenChange={review.details.setOpen}
-                  setHistoryAnchor={timeline.view.setHistoryAnchor}
                   anchor={timeline.view.anchor}
                   setRevealMessage={timeline.view.setRevealMessage}
                   setScrollToEnd={timeline.view.setScrollToEnd}
@@ -120,51 +119,88 @@ export function SessionScreen(props: { session: SessionModel }) {
   return (
     <SessionRouteFrame>
       <SessionHeader />
-      <div ref={screen.panel.ref} class="flex-1 min-h-0 flex flex-col md:flex-row gap-2 p-2">
-        <div
-          classList={{
-            "@container relative shrink-0 flex flex-col min-h-0 h-full flex-1 md:flex-none transition-[width]": true,
-            "duration-[240ms] ease-[cubic-bezier(0.22,1,0.36,1)] will-change-[width] motion-reduce:transition-none":
-              !screen.size.active() && !screen.review.snap() && !screen.terminal.inlineOnlyOpen(),
-          }}
-          style={{
-            width: screen.panel.width(),
-          }}
-        >
-          <Show when={screen.panel.key()} keyed>
-            {(_) => (
-              <SessionPanelFrame raised={!!session.identity.params.id}>
-                <ErrorBoundary fallback={sessionErrorFallback}>{sessionPanelContent()}</ErrorBoundary>
-              </SessionPanelFrame>
-            )}
-          </Show>
+      <div class="flex-1 min-h-0 flex flex-col gap-2 p-2">
+        <div ref={screen.panel.ref} class="flex-1 min-h-0 flex flex-col md:flex-row gap-2">
+          <div
+            classList={{
+              "@container relative shrink-0 flex flex-col min-h-0 h-full flex-1 md:flex-none transition-[width]": true,
+              "duration-[240ms] ease-[cubic-bezier(0.22,1,0.36,1)] will-change-[width] motion-reduce:transition-none":
+                !screen.size.active() && !screen.review.snap() && !screen.terminal.inlineOnlyOpen(),
+            }}
+            style={{
+              width: screen.panel.width(),
+            }}
+          >
+            <Show when={screen.panel.key()} keyed>
+              {(_) => (
+                <SessionPanelFrame raised={!!session.identity.params.id}>
+                  <ErrorBoundary fallback={sessionErrorFallback}>{sessionPanelContent()}</ErrorBoundary>
+                </SessionPanelFrame>
+              )}
+            </Show>
 
-          <Show when={screen.panel.resizable()}>
-            <div onPointerDown={() => screen.size.start()}>
-              <ResizeHandle
-                class="-end-1"
-                direction="horizontal"
-                size={screen.panel.resizedWidth()}
-                min={SESSION_PANEL_WIDTH_MIN}
-                max={screen.panel.max()}
-                onResize={(width) => {
-                  screen.size.touch()
-                  layout.session.resize(width)
-                }}
-              />
+            <Show when={screen.panel.resizable()}>
+              <div onPointerDown={() => screen.size.start()}>
+                <ResizeHandle
+                  class="-end-1"
+                  direction="horizontal"
+                  size={screen.panel.resizedWidth()}
+                  min={SESSION_PANEL_WIDTH_MIN}
+                  max={screen.panel.max()}
+                  onResize={(width) => {
+                    screen.size.touch()
+                    layout.session.resize(width)
+                  }}
+                />
+              </div>
+            </Show>
+          </div>
+
+          <Show when={isDesktop() && screen.side.layout().visible}>
+            <div class="min-w-0 h-full flex flex-1 flex-col">
+              <Show when={screen.review.panelOpen() || screen.files.open()}>
+                <div class="min-h-0 flex-1">
+                  <SessionDesktopReview review={review} />
+                </div>
+              </Show>
+              <Show when={screen.side.layout().stacked}>
+                <div class="relative h-2 shrink-0" onPointerDown={() => screen.size.start()}>
+                  <ResizeHandle
+                    class="!relative !inset-auto !h-full !w-full !transform-none"
+                    direction="vertical"
+                    size={layout.terminal.height()}
+                    min={100}
+                    max={typeof window === "undefined" ? 600 : window.innerHeight * 0.6}
+                    collapseThreshold={50}
+                    onResize={(height) => {
+                      screen.size.touch()
+                      layout.terminal.resize(height)
+                    }}
+                    onCollapse={() => session.layout.view().terminal.close()}
+                  />
+                </div>
+              </Show>
+              <Show when={screen.terminal.open() && !screen.terminal.bottomOpen()}>
+                <div
+                  classList={{
+                    "min-h-0 shrink-0": screen.side.layout().stacked,
+                    "min-h-0 flex-1": !screen.side.layout().stacked,
+                  }}
+                >
+                  <TerminalPanel stacked={screen.side.layout().stacked} />
+                </div>
+              </Show>
             </div>
           </Show>
         </div>
 
-        <Show when={isDesktop() ? screen.side.layout().visible : screen.terminal.open()}>
-          <div class="min-w-0 h-full flex flex-1 flex-col">
-            <Show when={isDesktop() && (screen.review.panelOpen() || screen.files.open())}>
-              <div class="min-h-0 flex-1">
-                <SessionDesktopReview review={review} />
-              </div>
-            </Show>
-            <Show when={screen.side.layout().stacked}>
-              <div class="relative h-2 shrink-0" onPointerDown={() => screen.size.start()}>
+        <Show when={screen.terminal.open() && (!isDesktop() || screen.terminal.bottomOpen())}>
+          <div classList={{ "relative min-h-0 shrink-0": isDesktop() }}>
+            <Show when={isDesktop()}>
+              <div
+                class="absolute z-10 -top-1 left-0 right-0 h-2"
+                onPointerDown={() => screen.size.start()}
+              >
                 <ResizeHandle
                   class="!relative !inset-auto !h-full !w-full !transform-none"
                   direction="vertical"
@@ -180,16 +216,7 @@ export function SessionScreen(props: { session: SessionModel }) {
                 />
               </div>
             </Show>
-            <Show when={screen.terminal.open()}>
-              <div
-                classList={{
-                  "min-h-0 shrink-0": screen.side.layout().stacked,
-                  "min-h-0 flex-1": !screen.side.layout().stacked,
-                }}
-              >
-                <TerminalPanel stacked={screen.side.layout().stacked} />
-              </div>
-            </Show>
+            <TerminalPanel stacked={isDesktop()} />
           </div>
         </Show>
       </div>

packages/app/src/session/session-resolution.test.ts

@@ -0,0 +1,23 @@
+import { describe, expect, test } from "bun:test"
+import { createRoot } from "solid-js"
+import { createSessionResolution } from "./session-resolution"
+
+describe("session resolution", () => {
+  test("waits for a route session ID", () => {
+    createRoot((dispose) => {
+      let syncs = 0
+      const sessions = {
+        get: () => undefined,
+        sync: () => {
+          syncs++
+          return Promise.resolve()
+        },
+      }
+      const session = createSessionResolution(() => undefined, () => sessions)
+
+      expect(session()).toBeUndefined()
+      expect(syncs).toBe(0)
+      dispose()
+    })
+  })
+})

packages/app/src/session/session-resolution.ts

@@ -29,15 +29,20 @@ type Resolution<T> = { id: string; store: SessionStore<T> } & (
 // session that simply has not resolved yet. Resolve failures rethrow on read so
 // the enclosing SessionRouteErrorBoundary renders the scoped session error.
 export function createSessionResolution<T>(
-  sessionID: () => string,
+  sessionID: () => string | undefined,
   sessions: () => SessionStore<T>,
   options?: { children?: boolean },
 ) {
-  const cached = createMemo(() => sessions().get(sessionID()))
+  const cached = createMemo(() => {
+    const id = sessionID()
+    if (!id) return
+    return sessions().get(id)
+  })
   const [status, setStatus] = createSignal<Resolution<T>>()
 
   createEffect(
     on([sessionID, sessions] as const, ([id, store]) => {
+      if (!id) return
       let stale = false
       onCleanup(() => {
         stale = true
@@ -60,10 +65,11 @@ export function createSessionResolution<T>(
 
   return createMemo(() => {
     const id = sessionID()
+    if (!id) return
     const value = cached()
     if (value) return value
     const state = status()
-    if (state?.id !== id || state.store !== sessions()) return undefined
+    if (!state || state.id !== id || state.store !== sessions()) return undefined
     if (state.state === "failed") throw state.failure
     // A session missing after settlement was deleted, possibly by another client.
     // Match the resolve error so the boundary shows the

packages/app/src/session/story-model.tsx

@@ -84,7 +84,6 @@ export type SessionPreviewProps = {
   draft?: string
   request?: { type: "permission"; value: PermissionRequest } | { type: "question"; value: FormInfo }
   reviewOpened?: boolean
-  backgroundTasks?: { id: string; type: "shell" | "subagent"; label: string }[]
   child?: { parentID: string }
   terminal?: { title: string; lines: string[] }
 }
@@ -196,13 +195,6 @@ function SessionSurfaceState(props: SessionPreviewProps & { onReset: () => void
         setState("request", undefined)
         setState("activity", `Permission response: ${response}`)
       },
-      background: {
-        blocking: () => [],
-        tasks: () => props.backgroundTasks ?? [],
-        move: async () => {
-          setState("activity", "Requested background execution")
-        },
-      },
       blocked: () => state.request !== undefined,
     },
     centered: () => true,

packages/app/src/session/terminal/terminal-key-event.test.ts

@@ -0,0 +1,17 @@
+import { describe, expect, test } from "bun:test"
+import { terminalKeyInput } from "./terminal-key-event"
+
+describe("terminalKeyInput", () => {
+  test("maps Command+Delete to the terminal line-clear control code", () => {
+    const event = new KeyboardEvent("keydown", { key: "Backspace", metaKey: true })
+
+    expect(terminalKeyInput(event)).toBe("\x15")
+  })
+
+  test("leaves other Backspace shortcuts to the terminal", () => {
+    expect(terminalKeyInput(new KeyboardEvent("keydown", { key: "Backspace" }))).toBeUndefined()
+    expect(
+      terminalKeyInput(new KeyboardEvent("keydown", { key: "Backspace", metaKey: true, shiftKey: true })),
+    ).toBeUndefined()
+  })
+})

packages/app/src/session/terminal/terminal-key-event.ts

@@ -0,0 +1,5 @@
+export function terminalKeyInput(event: KeyboardEvent) {
+  if (!event.metaKey || event.ctrlKey || event.altKey || event.shiftKey) return
+  if (event.key.toLowerCase() !== "backspace") return
+  return "\x15"
+}

packages/app/src/session/terminal/terminal.tsx

@@ -15,6 +15,7 @@ import { useServerSDK } from "@/runtime/server/client"
 import { terminalFontFamily, useSettings } from "@/settings/model"
 import type { LocalPTY } from "@/session/terminal/context"
 import { disposeIfDisposable, getHoveredLinkText, setOptionIfSupported } from "@/session/terminal/runtime-adapters"
+import { terminalKeyInput } from "@/session/terminal/terminal-key-event"
 import { terminalWriter } from "@/session/terminal/writer"
 
 const TOGGLE_TERMINAL_ID = "terminal.toggle"
@@ -408,6 +409,12 @@ export const Terminal = (props: TerminalProps) => {
       t.attachCustomKeyEventHandler((event) => {
         const key = event.key.toLowerCase()
 
+        const input = terminalKeyInput(event)
+        if (input) {
+          t.input(input, true)
+          return true
+        }
+
         if (event.ctrlKey && event.shiftKey && !event.metaKey && key === "c") {
           document.execCommand("copy")
           return true

packages/app/src/session/timeline/background-work.stories.tsx

@@ -0,0 +1,36 @@
+import { BackgroundMoveHint, BackgroundWorkSummary } from "./message-timeline"
+
+const tasks = [
+  { id: "task_explore", type: "subagent" as const, agent: "explore", label: "Reviewing component implementation" },
+  { id: "task_status", type: "shell" as const, label: "opencode2 service status" },
+  { id: "task_openapi", type: "shell" as const, label: "opencode2 api get /openapi.json" },
+  { id: "task_tests", type: "shell" as const, label: "bun test packages/app" },
+]
+
+export default {
+  title: "OpenCode/Session/Background work",
+  id: "session-background-work",
+  parameters: {
+    docs: {
+      description: {
+        component: "Production controls for moving blocking work and inspecting active background tasks.",
+      },
+    },
+  },
+}
+
+export const InlineMoveHint = {
+  render: () => (
+    <div class="flex w-[696px] max-w-full flex-col items-start gap-4">
+      <BackgroundMoveHint keybind={["Ctrl", "B"]} />
+    </div>
+  ),
+}
+
+export const SummaryPanelEntry = {
+  render: () => (
+    <div class="w-[280px] rounded-[6px] bg-v2-background-bg-base px-0.5 py-1.5 shadow-[var(--v2-elevation-raised)]">
+      <BackgroundWorkSummary tasks={tasks} />
+    </div>
+  ),
+}

packages/app/src/session/timeline/interaction.ts

@@ -1,8 +1,7 @@
 import type { SessionMessageUser } from "@opencode-ai/client/promise"
-import { createAutoScroll } from "@opencode-ai/ui/hooks"
 import { createResizeObserver } from "@solid-primitives/resize-observer"
 import { useLocation } from "@solidjs/router"
-import { createEffect, on, onCleanup } from "solid-js"
+import { createEffect, createSignal, on, onCleanup } from "solid-js"
 import { createStore } from "solid-js/store"
 import { useLayout } from "@/shell/state/layout"
 import type { SessionModel } from "../model"
@@ -16,7 +15,6 @@ export function createSessionTimelineInteraction(session: SessionModel) {
   const [state, setState] = createStore({
     messageID: undefined as string | undefined,
     pendingMessage: undefined as string | undefined,
-    gestureAt: 0,
     scroll: {
       overflow: false,
       jump: false,
@@ -26,13 +24,18 @@ export function createSessionTimelineInteraction(session: SessionModel) {
       dock: undefined as HTMLDivElement | undefined,
     },
   })
-  const autoScroll = createAutoScroll({ working: () => true, overflowAnchor: "none" })
+  // The single source of truth for "follow the newest content". The virtualizer pins and unpins
+  // it from scroll geometry; everything else only expresses explicit intent.
+  const [pinned, setPinned] = createSignal(true)
+  const pin = () => setPinned(true)
+  const unpin = () => {
+    if (!scroller || scroller.scrollHeight - scroller.clientHeight <= 1) return
+    setPinned(false)
+  }
   let scroller: HTMLDivElement | undefined
   let dockHeight = 0
   let revealMessage = (_id: string) => {}
   let scrollToEnd = () => {}
-  let captureHistoryAnchor = () => {}
-  let restoreHistoryAnchor = (_done: boolean) => {}
   let scrollMark = 0
   let messageMark = 0
   let scrollStateFrame: number | undefined
@@ -102,10 +105,10 @@ export function createSessionTimelineInteraction(session: SessionModel) {
     pendingMessage: () => state.pendingMessage,
     setPendingMessage: (value) => setState("pendingMessage", value),
     setActiveMessage,
-    autoScroll: {
-      pause: autoScroll.pause,
-      forceScrollToBottom: () => {
-        autoScroll.resume()
+    follow: {
+      unpin,
+      toBottom: () => {
+        pin()
         scrollToEnd()
       },
     },
@@ -117,7 +120,7 @@ export function createSessionTimelineInteraction(session: SessionModel) {
   })
   const resume = () => {
     setState("messageID", undefined)
-    autoScroll.resume()
+    pin()
     scrollToEnd()
     clearMessageHash()
     if (scroller) scheduleScrollState(scroller)
@@ -133,21 +136,23 @@ export function createSessionTimelineInteraction(session: SessionModel) {
       resume()
       return
     }
-    autoScroll.pause()
+    unpin()
     scrollToMessage(messages[target], "auto")
   }
-  const shouldAnchorBottom = () =>
-    !location.hash && !state.messageID && !state.pendingMessage && !autoScroll.userScrolled()
-  const markGesture = (target?: EventTarget | null) => {
+  // A gesture inside a nested scrollable region scrolls that region, not the timeline.
+  const markUserScroll = (target?: EventTarget | null) => {
     if (!scroller) return
     const element = target instanceof Element ? target : undefined
     const nested = element?.closest("[data-scrollable]")
     if (nested && nested !== scroller) return
-    setState("gestureAt", Date.now())
+    scrollMark += 1
+  }
+  const selectionInteraction = () => {
+    const selection = window.getSelection()
+    if (selection && selection.toString().length > 0) unpin()
   }
   const setScrollRef = (element: HTMLDivElement | undefined) => {
     scroller = element
-    autoScroll.scrollRef(element)
     if (!element) return
     scheduleScrollState(element)
     fill()
@@ -158,15 +163,12 @@ export function createSessionTimelineInteraction(session: SessionModel) {
     historyRequests.add(owner.key)
     const before = timeline.messages().length
     try {
-      await timeline.history.loadOlder({
-        before: () => owner.run(captureHistoryAnchor),
-        after: (done) => owner.run(() => restoreHistoryAnchor(done)),
-      })
+      await timeline.history.loadOlder()
     } finally {
       historyRequests.delete(owner.key)
     }
     if (!owner.current() || timeline.messages().length <= before) return
-    if (!autoScroll.userScrolled() || !scroller || scroller.scrollTop >= 200 || !timeline.history.more()) return
+    if (pinned() || !scroller || scroller.scrollTop >= 200 || !timeline.history.more()) return
     if (historyContinuationFrame !== undefined) cancelAnimationFrame(historyContinuationFrame)
     historyContinuationFrame = requestAnimationFrame(() => {
       historyContinuationFrame = undefined
@@ -177,7 +179,7 @@ export function createSessionTimelineInteraction(session: SessionModel) {
     if (
       historyRequests.has(session.ownership.key()) ||
       timeline.history.loading() ||
-      !autoScroll.userScrolled() ||
+      pinned() ||
       !scroller ||
       scroller.scrollTop >= 200
     )
@@ -189,7 +191,7 @@ export function createSessionTimelineInteraction(session: SessionModel) {
     fillFrame = requestAnimationFrame(() => {
       fillFrame = undefined
       if (!session.identity.params.id || !timeline.ready()) return
-      if (autoScroll.userScrolled() || timeline.history.loading() || !scroller) return
+      if (!pinned() || timeline.history.loading() || !scroller) return
       if (scroller.scrollHeight > scroller.clientHeight + 1 || !timeline.history.more()) return
       void loadOlder()
     })
@@ -218,15 +220,16 @@ export function createSessionTimelineInteraction(session: SessionModel) {
       () => session.identity.params.id,
       (id, previous) => {
         if (!id || !previous || id === previous || state.messageID || state.pendingMessage || location.hash) return
-        autoScroll.resume()
+        pin()
+        scrollToEnd()
       },
     ),
   )
   createEffect(
     on(
-      autoScroll.userScrolled,
-      (scrolled) => {
-        if (scrolled) return
+      pinned,
+      (value) => {
+        if (!value) return
         setState("messageID", undefined)
         clearMessageHash()
       },
@@ -241,11 +244,11 @@ export function createSessionTimelineInteraction(session: SessionModel) {
           timeline.ready(),
           timeline.history.more(),
           timeline.history.loading(),
-          autoScroll.userScrolled(),
+          pinned(),
           visibleUserMessages().length,
         ] as const,
-      ([id, ready, more, loading, scrolled]) => {
-        if (id && ready && more && !loading && !scrolled) fill()
+      ([id, ready, more, loading, following]) => {
+        if (id && ready && more && !loading && following) fill()
       },
       { defer: true },
     ),
@@ -264,8 +267,7 @@ export function createSessionTimelineInteraction(session: SessionModel) {
       if (next === dockHeight) return
       const delta = next - dockHeight
       const stick = scroller
-        ? !autoScroll.userScrolled() ||
-          scroller.scrollHeight - scroller.clientHeight - scroller.scrollTop < 10 + Math.max(0, delta)
+        ? pinned() || scroller.scrollHeight - scroller.clientHeight - scroller.scrollTop < 10 + Math.max(0, delta)
         : false
       dockHeight = next
       if (stick) scrollToEnd()
@@ -285,7 +287,6 @@ export function createSessionTimelineInteraction(session: SessionModel) {
       resume,
       setActiveMessage,
     },
-    autoScroll,
     lastUserMessage: timeline.lastUserMessage,
     resource: timeline.resource,
     ready: timeline.ready,
@@ -293,25 +294,19 @@ export function createSessionTimelineInteraction(session: SessionModel) {
     scroller: () => scroller,
     view: {
       anchor,
-      hasGesture: () => Date.now() - state.gestureAt < 250,
-      markGesture,
-      markUserScroll: () => {
-        scrollMark += 1
-      },
+      markUserScroll,
       onHistoryScroll,
+      pin,
+      pinned,
+      selectionInteraction,
       scheduleScrollState,
       setContentRef: (element: HTMLDivElement | undefined) => {
         setState("refs", "content", element)
-        autoScroll.contentRef(element)
         if (scroller) scheduleScrollState(scroller)
       },
       setDockRef: (element: HTMLDivElement | undefined) => {
         setState("refs", "dock", element)
       },
-      setHistoryAnchor: (handlers: { capture: () => void; restore: (done: boolean) => void }) => {
-        captureHistoryAnchor = handlers.capture
-        restoreHistoryAnchor = handlers.restore
-      },
       setRevealMessage: (reveal: (id: string) => void) => {
         revealMessage = reveal
       },
@@ -319,7 +314,7 @@ export function createSessionTimelineInteraction(session: SessionModel) {
       setScrollToEnd: (scroll: () => void) => {
         scrollToEnd = scroll
       },
-      shouldAnchorBottom,
+      unpin,
     },
   }
 }

packages/app/src/session/timeline/measure.test.ts

@@ -1,30 +0,0 @@
-import { expect, test } from "bun:test"
-import { scheduleConnectedMeasure } from "./measure"
-
-test("does not measure an element detached before the frame", async () => {
-  const element = document.createElement("div")
-  document.body.append(element)
-  let calls = 0
-
-  scheduleConnectedMeasure(element, () => {
-    calls += 1
-  })
-  element.remove()
-  await new Promise<void>((resolve) => requestAnimationFrame(() => resolve()))
-
-  expect(calls).toBe(0)
-})
-
-test("measures a connected element on the next frame", async () => {
-  const element = document.createElement("div")
-  document.body.append(element)
-  let calls = 0
-
-  scheduleConnectedMeasure(element, () => {
-    calls += 1
-  })
-  await new Promise<void>((resolve) => requestAnimationFrame(() => resolve()))
-
-  expect(calls).toBe(1)
-  element.remove()
-})

packages/app/src/session/timeline/measure.ts

@@ -1,5 +0,0 @@
-export function scheduleConnectedMeasure<T extends HTMLElement>(element: T, measure: (element: T) => void) {
-  return requestAnimationFrame(() => {
-    if (element.isConnected) measure(element)
-  })
-}

packages/app/src/session/timeline/message-timeline.tsx

@@ -1,11 +1,15 @@
-import { createEffect, createMemo, createSignal, on, Show, type Accessor } from "solid-js"
+import { createEffect, createMemo, createSignal, For, on, Show, type Accessor } from "solid-js"
+import createPresence from "solid-presence"
 import { createStore } from "solid-js/store"
 import type { SessionUserActions } from "@opencode-ai/session-ui/actions"
+import { Badge } from "@opencode-ai/ui/badge"
 import { DiffChanges } from "@opencode-ai/ui/diff-changes"
 import { Icon } from "@opencode-ai/ui/icon"
 import { IconButton } from "@opencode-ai/ui/icon-button"
 import { InlineInput } from "@opencode-ai/ui/inline-input"
+import { Keybind } from "@opencode-ai/ui/keybind"
 import { Menu } from "@opencode-ai/ui/menu"
+import { TextShimmer } from "@opencode-ai/ui/text-shimmer"
 import { Tooltip } from "@opencode-ai/ui/tooltip"
 import { ProjectAvatar } from "@opencode-ai/ui/project-avatar"
 import type { Project } from "@/runtime/server/types"
@@ -15,7 +19,7 @@ import { SessionContextUsage } from "@/session/timeline/session-context-usage"
 import { useLanguage } from "@/runtime/i18n/language"
 import { useData } from "@/runtime/server/current"
 import { useWorkspaceLocation } from "@/workspaces/location"
-import { Timeline } from "@opencode-ai/session-ui/timeline/projection"
+import { Timeline, TimelineRow } from "@opencode-ai/session-ui/timeline/projection"
 import { createSessionTimelineRowRenderer } from "@opencode-ai/session-ui/timeline/row"
 import { createTimelineController, type TimelineController, type TimelineSessionSource } from "./controller"
 import { createTimelineVirtualizer } from "./virtualizer"
@@ -24,6 +28,98 @@ import { SessionWorkspaceMenu } from "@/session/timeline/session-workspace-menu"
 import { getProjectAvatarVariant } from "@/shell/state/layout"
 import { displayName, getProjectAvatarSource } from "@/shell/layout/helpers"
 import { parseCommentNote, readPromptPresentation } from "@/composer/comment-note"
+import { useCommand } from "@/shell/commands/command"
+
+type BackgroundTask = {
+  id: string
+  type: "shell" | "subagent"
+  label: string
+  agent?: string
+}
+
+type SessionBackground = {
+  blocking: Accessor<{ type: "shell" | "subagent"; partID: string; id?: string; label?: string }[]>
+  tasks: Accessor<BackgroundTask[]>
+  move: () => Promise<void>
+}
+
+export function BackgroundMoveHint(props: { keybind?: string[] }) {
+  const language = useLanguage()
+  const command = useCommand()
+  const marker = "__OPENCODE_BACKGROUND_KEYBIND__"
+  const parts = createMemo(() => language.t("session.background.moveInline", { keybind: marker }).split(marker))
+  const keys = () => props.keybind ?? command.keybindParts("session.background")
+  const keybind = () => props.keybind?.join("+") ?? command.keybind("session.background")
+
+  return (
+    <div
+      data-component="session-background-hint"
+      class="flex h-6 max-w-full items-center justify-center gap-[3px] overflow-hidden text-[13px] font-[440] leading-5 tracking-[-0.04px] text-v2-text-text-muted"
+      aria-label={language.t("session.background.moveInline", { keybind: keybind() })}
+    >
+      <span data-slot="session-background-hint-prefix" class="shrink-0">
+        {parts()[0].trim()}
+      </span>
+      <Keybind keys={keys()} variant="neutral" />
+      <span class="min-w-0 truncate">{parts()[1].trim()}</span>
+    </div>
+  )
+}
+
+export function BackgroundWorkSummary(props: { tasks: BackgroundTask[] }) {
+  const language = useLanguage()
+  const [open, setOpen] = createSignal(false)
+  const taskType = (task: BackgroundTask) => {
+    if (task.type === "shell") return language.t("ui.tool.shell")
+    if (!task.agent) return language.t("ui.tool.agent.default")
+    return task.agent.slice(0, 1).toUpperCase() + task.agent.slice(1)
+  }
+
+  return (
+    <Popover
+      open={open()}
+      placement={language.direction() === "rtl" ? "right-end" : "left-end"}
+      gutter={4}
+      onOpenChange={setOpen}
+    >
+      <Popover.Trigger
+        as="button"
+        type="button"
+        data-component="session-background-summary"
+        class="flex h-7 w-full items-center gap-2 rounded-[4px] px-3 text-[13px] font-[440] leading-5 tracking-[-0.04px] text-v2-text-text-base hover:bg-v2-overlay-simple-overlay-hover focus-visible:bg-v2-overlay-simple-overlay-hover focus-visible:outline-none data-[expanded]:bg-v2-overlay-simple-overlay-pressed"
+        aria-label={language.plural("session.background.runningCount", props.tasks.length)}
+      >
+        <Badge class="!w-4 !px-0 !border-v2-border-border-strong !bg-v2-background-bg-layer-03">
+          {props.tasks.length}
+        </Badge>
+        <TextShimmer
+          as="span"
+          text={language.t("session.background.running")}
+          active
+          class="min-w-0 flex-1 truncate text-start"
+        />
+      </Popover.Trigger>
+      <Popover.Portal>
+        <Popover.Content
+          data-component="session-background-list"
+          class="z-[60] w-[200px] overflow-hidden rounded-[6px] bg-v2-background-bg-layer-01 p-0.5 shadow-[var(--v2-elevation-floating)] outline-none"
+        >
+          <For each={props.tasks.slice(0, 10)}>
+            {(task) => (
+              <div
+                data-component="session-background-list-item"
+                class="flex h-7 min-w-0 items-center gap-2 rounded-[4px] px-3 text-[13px] font-[440] leading-none tracking-[-0.04px]"
+              >
+                <span class="shrink-0 text-v2-text-text-base">{taskType(task)}</span>
+                <span class="min-w-0 flex-1 truncate text-v2-text-text-faint">{task.label}</span>
+              </div>
+            )}
+          </For>
+        </Popover.Content>
+      </Popover.Portal>
+    </Popover>
+  )
+}
 
 function WorkspaceMoveAction(props: {
   variant: "inline" | "panel"
@@ -94,6 +190,7 @@ function SessionSummaryPanel(props: {
   moveDismissed: boolean
   onMoveDismiss: () => void
   onReview: () => void
+  backgroundTasks: BackgroundTask[]
 }) {
   const language = useLanguage()
   const location = () => {
@@ -168,6 +265,9 @@ function SessionSummaryPanel(props: {
             )}
           </Show>
         </button>
+        <Show when={props.backgroundTasks.length > 0}>
+          <BackgroundWorkSummary tasks={props.backgroundTasks} />
+        </Show>
       </div>
       <Show when={props.local && props.diffs && props.diffs.length > 0 && props.moveEligible}>
         <WorkspaceMoveAction
@@ -186,18 +286,18 @@ function SessionSummaryPanel(props: {
 
 type MessageTimelineProps = {
   session: TimelineSessionSource
+  background: SessionBackground
   actions?: SessionUserActions
   scroll: { overflow: boolean; jump: boolean }
   onResumeScroll: () => void
   setScrollRef: (el: HTMLDivElement | undefined) => void
   onScheduleScrollState: (el: HTMLDivElement) => void
-  onAutoScrollHandleScroll: () => void
-  onMarkScrollGesture: (target?: EventTarget | null) => void
-  hasScrollGesture: boolean
-  onUserScroll: () => void
+  onPin: () => void
+  onUnpin: () => void
+  onUserScroll: (target?: EventTarget | null) => void
   onHistoryScroll: () => void
-  onAutoScrollInteraction: (event: MouseEvent) => void
-  shouldAnchorBottom: boolean
+  onSelectionInteraction: (event: MouseEvent) => void
+  pinned: boolean
   centered: boolean
   setContentRef: (el: HTMLDivElement) => void
   diffs: Accessor<{ additions: number; deletions: number }[] | undefined>
@@ -207,7 +307,6 @@ type MessageTimelineProps = {
   anchor: (id: string) => string
   setRevealMessage?: (fn: (id: string) => void) => void
   setScrollToEnd?: (fn: () => void) => void
-  setHistoryAnchor?: (handlers: { capture: () => void; restore: (done: boolean) => void }) => void
 }
 
 export function MessageTimeline(props: MessageTimelineProps) {
@@ -264,28 +363,25 @@ function MessageTimelineView(
   )
   const turnPadding = () => "px-4 md:px-5"
   const showHeader = createMemo(() => props.data.showHeader() || workspaceSession())
-  const shouldAnchorBottom = createMemo(() => props.shouldAnchorBottom)
-  const hasScrollGesture = createMemo(() => props.hasScrollGesture)
+  const pinned = createMemo(() => props.pinned)
   const messageByID = projection.messageByID
   const virtualized = createTimelineVirtualizer({
     sessionKey: props.data.sessionKey,
     projection,
     showHeader,
-    shouldAnchorBottom,
-    hasScrollGesture,
+    pinned,
     scroll: () => props.scroll,
     onResumeScroll: props.onResumeScroll,
     setScrollRef: props.setScrollRef,
     setContentRef: props.setContentRef,
     onScheduleScrollState: props.onScheduleScrollState,
-    onAutoScrollHandleScroll: props.onAutoScrollHandleScroll,
-    onAutoScrollInteraction: props.onAutoScrollInteraction,
-    onMarkScrollGesture: props.onMarkScrollGesture,
+    onPin: props.onPin,
+    onUnpin: props.onUnpin,
+    onSelectionInteraction: props.onSelectionInteraction,
     onUserScroll: props.onUserScroll,
     onHistoryScroll: props.onHistoryScroll,
     setRevealMessage: props.setRevealMessage,
     setScrollToEnd: props.setScrollToEnd,
-    setHistoryAnchor: props.setHistoryAnchor,
   })
   const VirtualizedTimeline = virtualized.View
   const [title, setTitle] = createStore({
@@ -350,14 +446,59 @@ function MessageTimelineView(
     padding: turnPadding,
     anchor: props.anchor,
   })
-
+  const backgroundHintPartID = createMemo(() => {
+    const blocking = new Set(props.background.blocking().map((task) => task.partID))
+    const row = projection
+      .rows()
+      .findLast(
+        (row) => row._tag === "AssistantPart" && row.group.type === "part" && blocking.has(row.group.ref.partID),
+      )
+    if (row?._tag !== "AssistantPart" || row.group.type !== "part") return
+    return row.group.ref.partID
+  })
+  const [backgroundHintRef, setBackgroundHintRef] = createSignal<HTMLDivElement>()
+  const backgroundHintVisibility = createMemo<{ show: boolean; animate: boolean }>(
+    (previous) => {
+      const show = backgroundHintPartID() !== undefined
+      return { show, animate: previous.animate || previous.show !== show }
+    },
+    { show: backgroundHintPartID() !== undefined, animate: false },
+  )
+  const backgroundHintPresence = createPresence({
+    show: () => backgroundHintVisibility().show,
+    element: () => backgroundHintRef() ?? null,
+  })
   return (
     <VirtualizedTimeline
       workspaceSession={workspaceSession}
+      bottomSpacer={
+        <Show when={backgroundHintPresence.present()}>
+          <div
+            data-component="session-background-hint-row"
+            classList={{
+              "min-w-0 w-full max-w-full": true,
+              "md:max-w-200 2xl:max-w-[1000px] md:mx-auto": props.centered,
+            }}
+          >
+            <div
+              ref={setBackgroundHintRef}
+              class="duration-150 motion-reduce:animate-none"
+              classList={{
+                [`flex h-8 items-start pt-2 ${turnPadding()}`]: true,
+                "animate-in fade-in": backgroundHintVisibility().animate && backgroundHintVisibility().show,
+                "animate-out fade-out fill-mode-forwards":
+                  backgroundHintVisibility().animate && !backgroundHintVisibility().show,
+              }}
+            >
+              <BackgroundMoveHint />
+            </div>
+          </div>
+        </Show>
+      }
       deferred={(row) => {
         if (row._tag !== "AssistantPart" || row.group.type !== "part") return false
         const content = Timeline.resolveContent(messageByID().get(row.group.ref.messageID), row.group.ref.partID)
-        return content?.type === "tool" && ["edit", "write", "patch"].includes(content.name)
+        return content?.type === "tool" && ["edit", "write"].includes(content.name)
       }}
       renderRow={(row, onSizeChange) => <rowRenderer.Row row={row} onSizeChange={onSizeChange} />}
       header={
@@ -485,6 +626,7 @@ function MessageTimelineView(
                                 setSummary(false)
                                 props.onReview()
                               }}
+                              backgroundTasks={props.background.tasks()}
                             />
                           </Popover.Content>
                         </Popover.Portal>

packages/app/src/session/timeline/observe-element-offset.ts

@@ -3,6 +3,7 @@ import { observeElementOffset, type Virtualizer } from "@tanstack/solid-virtual"
 export function observeElementOffsetReconnectAware<TScrollElement extends Element, TItemElement extends Element>(
   instance: Virtualizer<TScrollElement, TItemElement>,
   callback: (offset: number, isScrolling: boolean) => void,
+  onReconnect?: () => void,
 ) {
   let active = true
   const deliver = (offset: number, isScrolling: boolean) => {
@@ -54,6 +55,7 @@ export function observeElementOffsetReconnectAware<TScrollElement extends Elemen
       }
       if (!removed || !element.isConnected || !mutationNodesContainElement(record.addedNodes, element)) return
       removed = false
+      onReconnect?.()
       startCheck()
     })
   })

packages/app/src/session/timeline/virtualizer.tsx

@@ -1,7 +1,6 @@
 import { createVirtualizer, defaultRangeExtractor, elementScroll, type VirtualItem } from "@tanstack/solid-virtual"
 import { isScrollKeyTarget, scrollKey, scrollKeyOwner, ScrollView } from "@opencode-ai/ui/scroll-view"
 import { TimelineRow } from "@opencode-ai/session-ui/timeline/projection"
-import { normalizeWheelDelta, shouldMarkBoundaryGesture } from "@/session/message-gesture"
 import { useLanguage } from "@/runtime/i18n/language"
 import {
   createEffect,
@@ -17,11 +16,14 @@ import {
 } from "solid-js"
 import { createStore } from "solid-js/store"
 import type { createTimelineProjection } from "./projection"
-import { scheduleConnectedMeasure } from "./measure"
 import { observeElementOffsetReconnectAware } from "./observe-element-offset"
 import { filterVirtualIndexes } from "./virtual-items"
 
 const fallbackItemSize = 60
+// Distance from the bottom that counts as "at the end". Deliberately tight: a collapse clamps
+// exactly to the end, while a one-pixel nudge upward is a deliberate move away from it.
+const endEpsilon = 0.5
+const upwardKeys = new Set(["up", "page-up", "home"])
 const cache = new Map<string, { measurements: VirtualItem[]; toolOpen: Record<string, boolean | undefined> }>()
 
 type Projection = Pick<
@@ -33,25 +35,25 @@ type Input = {
   sessionKey: Accessor<string>
   projection: Projection
   showHeader: Accessor<boolean>
-  shouldAnchorBottom: Accessor<boolean>
-  hasScrollGesture: Accessor<boolean>
+  /** True while the timeline follows the newest content. Drives every anchoring decision. */
+  pinned: Accessor<boolean>
   scroll: Accessor<{ overflow: boolean; jump: boolean }>
   onResumeScroll: () => void
   setScrollRef: (element: HTMLDivElement | undefined) => void
   setContentRef: (element: HTMLDivElement) => void
   onScheduleScrollState: (element: HTMLDivElement) => void
-  onAutoScrollHandleScroll: () => void
-  onAutoScrollInteraction: (event: MouseEvent) => void
-  onMarkScrollGesture: (target?: EventTarget | null) => void
-  onUserScroll: () => void
+  onPin: () => void
+  onUnpin: () => void
+  onSelectionInteraction: (event: MouseEvent) => void
+  onUserScroll: (target?: EventTarget | null) => void
   onHistoryScroll: () => void
   setRevealMessage?: (fn: (id: string) => void) => void
   setScrollToEnd?: (fn: () => void) => void
-  setHistoryAnchor?: (handlers: { capture: () => void; restore: (done: boolean) => void }) => void
 }
 
 type ViewProps = {
   header: JSX.Element
+  bottomSpacer?: JSX.Element
   workspaceSession: Accessor<boolean>
   deferred: (row: TimelineRow.TimelineRow) => boolean
   renderRow: (row: Accessor<TimelineRow.TimelineRow>, onSizeChange?: () => void) => JSX.Element
@@ -62,88 +64,31 @@ export function createTimelineVirtualizer(input: Input) {
   const ownerSessionKey = input.sessionKey()
   const cached = cache.get(ownerSessionKey)
   const initialMeasurements = cached?.measurements
-  const coldBottomMount = !initialMeasurements?.length && input.shouldAnchorBottom()
+  const coldBottomMount = !initialMeasurements?.length && input.pinned()
   const [listRoot, setListRoot] = createSignal<HTMLDivElement>()
   const [toolOpen, setToolOpen] = createStore<Record<string, boolean | undefined>>(cached?.toolOpen ?? {})
   const [renderOverscan, setRenderOverscan] = createSignal(initialMeasurements?.length || coldBottomMount ? 6 : 20)
   const rows = input.projection.rows
   const rowByKey = input.projection.rowByKey
-  let touchGesture: number | undefined
-  let prependAnchor: { key: string; offset: number } | undefined
-  let prependAnchorFrame: number | undefined
-  let prependLoading = false
-  let resizePinnedIndexes: number[] = []
-  let resizePinFrame: number | undefined
+  const knownKeys = new Set(rows().map(TimelineRow.key))
+  const addedKeys = new Set<string>()
+  let touchStart: number | undefined
+  let pointerHeld = false
+  let maxScroll = 0
   let virtualContent: HTMLDivElement | undefined
-
-  const clearPrependAnchor = () => {
-    prependLoading = false
-    prependAnchor = undefined
-    if (prependAnchorFrame === undefined) return
-    cancelAnimationFrame(prependAnchorFrame)
-    prependAnchorFrame = undefined
-  }
-
-  const capturePrependAnchor = () => {
-    prependLoading = true
-    updatePrependAnchor()
-  }
-
-  const updatePrependAnchor = () => {
-    const root = listRoot()
-    if (!root) return
-    const view = root.getBoundingClientRect()
-    const anchor = [...root.querySelectorAll<HTMLElement>("[data-timeline-key]")]
-      .map((element) => ({ element, rect: element.getBoundingClientRect() }))
-      .filter((item) => item.rect.bottom > view.top && item.rect.top < view.bottom)
-      .sort((a, b) => a.rect.top - b.rect.top)[0]
-    if (!anchor) return
-    if (!anchor.element.dataset.timelineKey) return
-    prependAnchor = { key: anchor.element.dataset.timelineKey, offset: anchor.rect.top - view.top }
-  }
-
-  const restorePrependAnchor = (done: boolean) => {
-    if (done) prependLoading = false
-    applyPrependAnchor()
-  }
-
-  const applyPrependAnchor = () => {
-    const root = listRoot()
-    if (!root || !prependAnchor) return
-    if (prependAnchorFrame !== undefined) cancelAnimationFrame(prependAnchorFrame)
-    let frames = 0
-    let stable = 0
-    const apply = () => {
-      prependAnchorFrame = undefined
-      const anchor = prependAnchor
-      if (!anchor) return
-      const element = root.querySelector<HTMLElement>(`[data-timeline-key="${CSS.escape(anchor.key)}"]`)
-      const delta = element
-        ? element.getBoundingClientRect().top - root.getBoundingClientRect().top - anchor.offset
-        : undefined
-      if (delta !== undefined && Math.abs(delta) > 0.5) {
-        root.scrollTop += delta
-        stable = 0
-      } else {
-        stable += 1
-      }
-      frames += 1
-      if (stable >= 30 || frames >= 180) {
-        if (!prependLoading) prependAnchor = undefined
-        return
-      }
-      prependAnchorFrame = requestAnimationFrame(apply)
-    }
-    prependAnchorFrame = requestAnimationFrame(apply)
-  }
+  let scrollTop = 0
 
   const virtualizer = createVirtualizer<HTMLDivElement, HTMLDivElement>({
     get count() {
       return rows().length
     },
     getScrollElement: () => listRoot() ?? null,
-    observeElementOffset: observeElementOffsetReconnectAware,
-    initialOffset: () => (input.shouldAnchorBottom() ? Number.MAX_SAFE_INTEGER : 0),
+    // Route navigation detaches and reattaches the scroll element, which drops its offset.
+    observeElementOffset: (instance, callback) =>
+      observeElementOffsetReconnectAware(instance, callback, () => {
+        if (input.pinned()) virtualizer.scrollToEnd()
+      }),
+    initialOffset: () => (input.pinned() ? Number.MAX_SAFE_INTEGER : 0),
     initialMeasurementsCache: initialMeasurements,
     estimateSize: () => fallbackItemSize,
     scrollToFn: (offset, options, instance) => {
@@ -152,67 +97,62 @@ export function createTimelineVirtualizer(input: Input) {
     },
     get getItemKey() {
       const items = rows()
+      items
+        .map(TimelineRow.key)
+        .filter((key) => !knownKeys.has(key))
+        .forEach((key) => {
+          knownKeys.add(key)
+          addedKeys.add(key)
+        })
       return (index: number) => {
         const row = items[index]
         if (!row) return `removed:${index}`
         return TimelineRow.key(row)
       }
     },
-    anchorTo: "end",
-    followOnAppend: true,
+    get anchorTo() {
+      return input.pinned() ? "end" : "start"
+    },
+    get followOnAppend() {
+      return input.pinned()
+    },
     scrollEndThreshold: 80,
     get scrollMargin() {
       return input.showHeader() ? 64 : 0
     },
-    overscan: 50,
     paddingEnd: 64,
     rangeExtractor: (range) => {
       const id = input.projection.activeMessageID()
       const active = id ? (input.projection.messageLastRowIndex().get(id) ?? -1) : -1
       const indexes = defaultRangeExtractor({ ...range, overscan: renderOverscan() })
       return filterVirtualIndexes(
-        [...new Set([...resizePinnedIndexes, ...indexes, ...(active < 0 ? [] : [active])])].sort((a, b) => a - b),
+        [...new Set([...indexes, ...(active < 0 ? [] : [active])])].sort((a, b) => a - b),
         range.count,
       )
     },
   })
   const resizeItem = virtualizer.resizeItem
   let resizeAnchorScheduled = false
+  // Rows measure asynchronously, so the last row can still hold its estimate when TanStack
+  // reconciles the end. Coalesce one correction per measurement batch, before paint.
   const anchorResizedBottom = () => {
-    if (resizeAnchorScheduled || input.hasScrollGesture()) return
+    if (resizeAnchorScheduled) return
     resizeAnchorScheduled = true
     queueMicrotask(() => {
       resizeAnchorScheduled = false
-      if (!input.shouldAnchorBottom() || input.hasScrollGesture()) return
+      if (!input.pinned()) return
       virtualizer.scrollToEnd()
     })
   }
   virtualizer.resizeItem = (index, size) => {
-    const item = virtualizer.measurementsCache[index]
-    const previous = item ? (virtualizer.itemSizeCache.get(item.key) ?? item.size) : undefined
-    const root = listRoot()
-    if (root && previous !== undefined && Math.abs(size - previous) > root.clientHeight) {
-      const view = root.getBoundingClientRect()
-      resizePinnedIndexes = [...root.querySelectorAll<HTMLElement>("[data-index]")]
-        .filter((element) => {
-          const rect = element.getBoundingClientRect()
-          return rect.bottom > view.top && rect.top < view.bottom
-        })
-        .map((element) => Number(element.dataset.index))
-      if (resizePinFrame !== undefined) cancelAnimationFrame(resizePinFrame)
-      resizePinFrame = requestAnimationFrame(() => {
-        resizePinFrame = requestAnimationFrame(() => {
-          resizePinFrame = undefined
-          resizePinnedIndexes = []
-        })
-      })
-    }
     resizeItem(index, size)
-    if (root && input.shouldAnchorBottom()) anchorResizedBottom()
+    if (listRoot() && input.pinned()) anchorResizedBottom()
   }
-  virtualizer.shouldAdjustScrollPositionOnItemSizeChange = (item) => {
-    if (input.shouldAnchorBottom()) return false
-    const first = virtualizer.range?.startIndex
+  virtualizer.shouldAdjustScrollPositionOnItemSizeChange = (item, _delta, instance) => {
+    if (!instance.itemSizeCache.has(item.key) && addedKeys.delete(String(item.key))) {
+      return item.start < (instance.scrollOffset ?? 0) + instance.scrollAdjustments
+    }
+    const first = instance.range?.startIndex
     return first !== undefined && item.index < first
   }
   const virtualItemByKey = createMemo(
@@ -226,92 +166,72 @@ export function createTimelineVirtualizer(input: Input) {
       if (index === undefined) return
       virtualizer.scrollToIndex(index, { align: "center" })
     })
-    input.setScrollToEnd?.(() => virtualizer.scrollToEnd())
-    input.setHistoryAnchor?.({ capture: capturePrependAnchor, restore: restorePrependAnchor })
+    input.setScrollToEnd?.(() => {
+      input.onPin()
+      virtualizer.scrollToEnd()
+    })
   })
 
   let overscanFrame: number | undefined
   onMount(() => {
     overscanFrame = requestAnimationFrame(() => {
-      if (input.shouldAnchorBottom()) virtualizer.scrollToEnd()
-      overscanFrame = requestAnimationFrame(() => {
-        overscanFrame = undefined
-        if (renderOverscan() < 20) setRenderOverscan(20)
-        if (input.shouldAnchorBottom()) virtualizer.scrollToEnd()
-      })
+      overscanFrame = undefined
+      if (renderOverscan() < 20) setRenderOverscan(20)
     })
   })
 
-  const maybeAnchorBottom = () => {
-    if (rows().length === 0) return
-    if (!input.shouldAnchorBottom() || input.hasScrollGesture()) return
-    if (resizePinFrame !== undefined) cancelAnimationFrame(resizePinFrame)
-    clearPrependAnchor()
-    if (prependAnchorFrame !== undefined) cancelAnimationFrame(prependAnchorFrame)
-    virtualizer.scrollToEnd()
-  }
-
   let measuredSessionKey = input.sessionKey()
   createEffect(() => {
     const key = input.sessionKey()
-    rows().length
     if (measuredSessionKey !== key) {
       measuredSessionKey = key
       virtualizer.measure()
     }
-    maybeAnchorBottom()
   })
 
   const bindListRoot = (root: HTMLDivElement) => {
     if (root === listRoot()) return
     setListRoot(root)
+    // TanStack owns anchoring; browser scroll anchoring would fight its adjustments.
+    root.style.overflowAnchor = "none"
+    scrollTop = root.scrollTop
+    maxScroll = root.scrollHeight - root.clientHeight
     input.setScrollRef(root)
   }
 
+  // Upward input is the one intent geometry cannot recover: nudging up while still a pixel from
+  // the end must stop following, even though the resulting position still looks like the end.
   const handleListWheel = (event: WheelEvent & { currentTarget: HTMLDivElement }) => {
-    if (!prependLoading) clearPrependAnchor()
-    const root = event.currentTarget
-    const delta = normalizeWheelDelta({
-      deltaY: event.deltaY,
-      deltaMode: event.deltaMode,
-      rootHeight: root.clientHeight,
-    })
-    if (!delta) return
-    markBoundaryGesture({ root, target: event.target, delta, onMarkScrollGesture: input.onMarkScrollGesture })
+    input.onUserScroll(event.target)
+    if (event.deltaY < 0) input.onUnpin()
   }
 
   const handleListTouchStart = (event: TouchEvent) => {
-    if (!prependLoading) clearPrependAnchor()
-    touchGesture = event.touches[0]?.clientY
+    input.onUserScroll(event.target)
+    touchStart = event.touches[0]?.clientY
   }
 
   const handleListTouchMove = (event: TouchEvent & { currentTarget: HTMLDivElement }) => {
-    const next = event.touches[0]?.clientY
-    const previous = touchGesture
-    touchGesture = next
-    if (next === undefined || previous === undefined) return
-    const delta = previous - next
-    if (!delta) return
-    markBoundaryGesture({
-      root: event.currentTarget,
-      target: event.target,
-      delta,
-      onMarkScrollGesture: input.onMarkScrollGesture,
-    })
-  }
-
-  const handleListTouchEnd = () => {
-    touchGesture = undefined
+    const current = event.touches[0]?.clientY
+    if (current === undefined || touchStart === undefined) return
+    // Dragging the content downward reveals earlier messages.
+    if (current <= touchStart) return
+    touchStart = current
+    input.onUnpin()
   }
 
+  // Drag-selecting past the edge and dragging the scrollbar both scroll without a wheel or key,
+  // so a held pointer is what separates those from the virtualizer's own measurement adjustments.
   const handleListPointerDown = (event: PointerEvent & { currentTarget: HTMLDivElement }) => {
-    if (!prependLoading) clearPrependAnchor()
-    input.onMarkScrollGesture(event.target)
-  }
-
-  const handleListPointerMove = (event: PointerEvent) => {
-    if (event.buttons !== 1) return
-    input.onMarkScrollGesture(event.target)
+    input.onUserScroll(event.target)
+    pointerHeld = true
+    const release = () => {
+      pointerHeld = false
+      window.removeEventListener("pointerup", release)
+      window.removeEventListener("pointercancel", release)
+    }
+    window.addEventListener("pointerup", release)
+    window.addEventListener("pointercancel", release)
   }
 
   const handleListKeyDown = (event: KeyboardEvent & { currentTarget: HTMLDivElement }) => {
@@ -319,18 +239,25 @@ export function createTimelineVirtualizer(input: Input) {
     if (!key) return
     if (!isScrollKeyTarget(event.target, key)) return
     if (scrollKeyOwner(event.currentTarget, event.target, key) !== event.currentTarget) return
-    if (!prependLoading) clearPrependAnchor()
-    input.onMarkScrollGesture(event.currentTarget)
+    input.onUserScroll(event.currentTarget)
+    if (upwardKeys.has(key)) input.onUnpin()
   }
 
+  // Following resumes by arriving at the end, either by scrolling there or by content shrinking
+  // under a viewport that was already there. Merely resting near the end is not enough, otherwise
+  // a later scroll would overwrite an upward intent expressed a pixel short of the bottom.
   const handleListScroll = (event: Event & { currentTarget: HTMLDivElement }) => {
-    if (prependLoading) updatePrependAnchor()
-    input.onScheduleScrollState(event.currentTarget)
+    const root = event.currentTarget
+    const previousTop = scrollTop
+    const previousMaxScroll = maxScroll
+    scrollTop = root.scrollTop
+    maxScroll = root.scrollHeight - root.clientHeight
+    const atEnd = maxScroll - scrollTop <= endEpsilon
+    const arrived = scrollTop > previousTop + endEpsilon || maxScroll < previousMaxScroll
+    if (maxScroll <= 1 || (atEnd && arrived)) input.onPin()
+    else if (pointerHeld && scrollTop < previousTop - endEpsilon) input.onUnpin()
+    input.onScheduleScrollState(root)
     input.onHistoryScroll()
-    if (!input.hasScrollGesture()) return
-    input.onUserScroll()
-    input.onAutoScrollHandleScroll()
-    input.onMarkScrollGesture(event.currentTarget)
   }
 
   function View(props: ViewProps) {
@@ -381,7 +308,10 @@ export function createTimelineVirtualizer(input: Input) {
             {props.renderRow(row, () => {
               setReady(true)
               if (contentMeasureFrame !== undefined) cancelAnimationFrame(contentMeasureFrame)
-              contentMeasureFrame = scheduleConnectedMeasure(element, virtualizer.measureElement)
+              contentMeasureFrame = requestAnimationFrame(() => {
+                contentMeasureFrame = undefined
+                if (element.isConnected) virtualizer.measureElement(element)
+              })
             })}
           </div>
         </div>
@@ -423,13 +353,10 @@ export function createTimelineVirtualizer(input: Input) {
           onWheel={handleListWheel}
           onTouchStart={handleListTouchStart}
           onTouchMove={handleListTouchMove}
-          onTouchEnd={handleListTouchEnd}
-          onTouchCancel={handleListTouchEnd}
           onPointerDown={handleListPointerDown}
-          onPointerMove={handleListPointerMove}
           onKeyDown={handleListKeyDown}
           onScroll={handleListScroll}
-          onClick={input.onAutoScrollInteraction}
+          onClick={input.onSelectionInteraction}
           class="relative min-w-0 w-full h-full"
           style={{ "--sticky-accordion-top": input.showHeader() ? "48px" : "0px" }}
         >
@@ -446,10 +373,11 @@ export function createTimelineVirtualizer(input: Input) {
             <Show when={rows().length > 0}>
               <div
                 data-timeline-row="bottom-spacer"
-                aria-hidden="true"
                 class="h-16 absolute top-0 left-0 w-full"
                 style={{ transform: `translateY(${virtualizer.getTotalSize() - 64}px)` }}
-              />
+              >
+                {props.bottomSpacer}
+              </div>
             </Show>
           </div>
         </ScrollView>
@@ -458,16 +386,13 @@ export function createTimelineVirtualizer(input: Input) {
   }
 
   onCleanup(() => {
-    clearPrependAnchor()
     cache.delete(ownerSessionKey)
     cache.set(ownerSessionKey, { measurements: virtualizer.takeSnapshot(), toolOpen: { ...toolOpen } })
     while (cache.size > 16) cache.delete(cache.keys().next().value!)
-    if (resizePinFrame !== undefined) cancelAnimationFrame(resizePinFrame)
     if (overscanFrame !== undefined) cancelAnimationFrame(overscanFrame)
     input.setScrollRef(undefined)
     input.setRevealMessage?.(() => {})
     input.setScrollToEnd?.(() => {})
-    input.setHistoryAnchor?.({ capture: () => {}, restore: () => {} })
   })
 
   return {
@@ -478,30 +403,3 @@ export function createTimelineVirtualizer(input: Input) {
     View,
   }
 }
-
-function boundaryTarget(root: HTMLElement, target: EventTarget | null) {
-  const current = target instanceof Element ? target : undefined
-  const nested = current?.closest("[data-scrollable]")
-  if (!(nested instanceof HTMLElement) || nested === root) return undefined
-  return nested
-}
-
-function markBoundaryGesture(input: {
-  root: HTMLElement
-  target: EventTarget | null
-  delta: number
-  onMarkScrollGesture: (target?: EventTarget | null) => void
-}) {
-  const target = boundaryTarget(input.root, input.target)
-  if (
-    target &&
-    !shouldMarkBoundaryGesture({
-      delta: input.delta,
-      scrollTop: target.scrollTop,
-      scrollHeight: target.scrollHeight,
-      clientHeight: target.clientHeight,
-    })
-  )
-    return
-  input.onMarkScrollGesture(input.root)
-}

packages/app/src/session/use-session-hash-scroll.ts

@@ -15,7 +15,7 @@ export const useSessionHashScroll = (input: {
   pendingMessage: () => string | undefined
   setPendingMessage: (value: string | undefined) => void
   setActiveMessage: (message: SessionMessageUser | undefined) => void
-  autoScroll: { pause: () => void; forceScrollToBottom: () => void }
+  follow: { unpin: () => void; toBottom: () => void }
   scroller: () => HTMLDivElement | undefined
   anchor: (id: string) => string
   revealMessage?: (id: string) => void
@@ -101,7 +101,7 @@ export const useSessionHashScroll = (input: {
   const applyHash = (behavior: ScrollBehavior) => {
     const hash = location.hash.slice(1)
     if (!hash) {
-      input.autoScroll.forceScrollToBottom()
+      input.follow.toBottom()
       const el = input.scroller()
       if (el) input.scheduleScrollState(el)
       return
@@ -109,7 +109,7 @@ export const useSessionHashScroll = (input: {
 
     const messageId = messageIdFromHash(hash)
     if (messageId) {
-      input.autoScroll.pause()
+      input.follow.unpin()
       const msg = messageById().get(messageId)
       if (msg) {
         scrollToMessage(msg, behavior)
@@ -120,12 +120,12 @@ export const useSessionHashScroll = (input: {
 
     const target = document.getElementById(hash)
     if (target) {
-      input.autoScroll.pause()
+      input.follow.unpin()
       scrollToElement(target, behavior)
       return
     }
 
-    input.autoScroll.forceScrollToBottom()
+    input.follow.toBottom()
     const el = input.scroller()
     if (el) input.scheduleScrollState(el)
   }
@@ -166,7 +166,7 @@ export const useSessionHashScroll = (input: {
     if (pending) input.setPendingMessage(undefined)
     if (input.currentMessageId() === targetId && !pending) return
 
-    input.autoScroll.pause()
+    input.follow.unpin()
     cancel()
     queue(() => scrollToMessage(msg, "auto"))
   })

packages/app/src/settings/general/general.tsx

@@ -7,7 +7,7 @@ import { TextInput } from "@opencode-ai/ui/text-input"
 import { useLanguage } from "@/runtime/i18n/language"
 import { usePlatform } from "@/runtime/platform/platform"
 import { useUpdaterAction } from "@/shell/updates/action"
-import { type WorkspaceDefaultDestination, useSettings } from "@/settings/model"
+import { type TerminalPlacement, type WorkspaceDefaultDestination, useSettings } from "@/settings/model"
 import { ExternalLink } from "@/runtime/platform/external-link"
 import { SettingsList } from "@/settings/list"
 import { SettingsRow } from "@/settings/row"
@@ -123,6 +123,33 @@ const ShellSetting: Component<{ controller: ShellSettingsController }> = (props)
   )
 }
 
+const TerminalPlacementSetting: Component = () => {
+  const language = useLanguage()
+  const settings = useSettings()
+  const options = createMemo((): { value: TerminalPlacement; label: string }[] => [
+    { value: "side", label: language.t("settings.general.row.terminalPlacement.side") },
+    { value: "bottom", label: language.t("settings.general.row.terminalPlacement.bottom") },
+  ])
+
+  return (
+    <SettingsRow
+      title={language.t("settings.general.row.terminalPlacement.title")}
+      description={language.t("settings.general.row.terminalPlacement.description")}
+    >
+      <Select
+        data-action="settings-terminal-placement"
+        options={options()}
+        current={options().find((option) => option.value === settings.general.terminalPlacement())}
+        value={(option) => option.value}
+        label={(option) => option.label}
+        placement="bottom-end"
+        gutter={6}
+        onSelect={(option) => option && settings.general.setTerminalPlacement(option.value)}
+      />
+    </SettingsRow>
+  )
+}
+
 const AppearanceSection: Component<{ controller: AppearanceSettingsController }> = (props) => {
   const language = useLanguage()
   return (
@@ -273,6 +300,7 @@ export const SettingsGeneral: Component<{
         <PermissionScopeSetting controller={permissionScope} />
 
         <ShellSetting controller={shell} />
+        <TerminalPlacementSetting />
 
         <SettingsRow
           title={language.t("settings.general.row.reasoningSummaries.title")}

packages/app/src/settings/model.tsx

@@ -6,6 +6,7 @@ import { ScopedKey, type ServerScope } from "@/runtime/server/scope"
 
 export type WorkspaceDefaultDestination = "last-used" | "local" | "new"
 export type WorkspaceLastUsed = "local" | "workspace"
+export type TerminalPlacement = "side" | "bottom"
 
 export interface NotificationSettings {
   agent: boolean
@@ -36,6 +37,7 @@ export interface Settings {
     editToolPartsExpanded: boolean
     showCustomAgents: boolean
     mobileTitlebarPosition: "top" | "bottom"
+    terminalPlacement: TerminalPlacement
   }
   appearance: {
     fontSize: number
@@ -121,6 +123,7 @@ const defaultSettings: Settings = {
     editToolPartsExpanded: false,
     showCustomAgents: false,
     mobileTitlebarPosition: "top",
+    terminalPlacement: "side",
   },
   appearance: {
     fontSize: 14,
@@ -240,6 +243,13 @@ export const { use: useSettings, provider: SettingsProvider } = createSimpleCont
         setMobileTitlebarPosition(value: "top" | "bottom") {
           setStore("general", "mobileTitlebarPosition", value)
         },
+        terminalPlacement: withFallback(
+          () => store.general?.terminalPlacement,
+          defaultSettings.general.terminalPlacement,
+        ),
+        setTerminalPlacement(value: TerminalPlacement) {
+          setStore("general", "terminalPlacement", value)
+        },
       },
       visibility: {
         fileTree: showFileTree,

packages/app/src/settings/workspaces/workspaces.tsx

@@ -93,14 +93,24 @@ export const SettingsWorkspaces: Component<{ activeDirectory?: string }> = (prop
       activeDirectory: props.activeDirectory,
     }
   }
-  const loadSessions = async (context = captureDeleteContext()) => {
-    const fetched = await listAllSessions(context.sdk.api.session, { order: "desc" })
-    fetched.forEach(context.data.session.remember)
-    return mergeWorkspaceSessionInventory(fetched, context.data.session.list())
+  // Fetch sessions per workspace directory instead of paging through every session on the server.
+  const loadSessions = async (directories: readonly string[], context = captureDeleteContext()) => {
+    const fetched = await Promise.all(
+      directories.map((directory) => listAllSessions(context.sdk.api.session, { order: "desc", directory })),
+    )
+    const sessions = fetched.flat()
+    return mergeWorkspaceSessionInventory(sessions, context.data.session.list())
   }
+  const workspaceDirectories = createMemo(() => workspaces().map((workspace) => workspace.directory))
   const sessionQuery = useQuery(() => ({
-    queryKey: [serverSDK.scope, null, "settings-workspace-sessions"] as const,
-    queryFn: () => loadSessions().then(() => Date.now()),
+    queryKey: [
+      serverSDK.scope,
+      null,
+      "settings-workspace-sessions",
+      workspaceDirectories().map((directory) => String(pathKey(directory))),
+    ] as const,
+    queryFn: () => loadSessions(workspaceDirectories()),
+    enabled: workspaceDirectories().length > 0,
     refetchOnMount: "always",
   }))
   const sessionsByWorkspace = createMemo(
@@ -108,7 +118,7 @@ export const SettingsWorkspaces: Component<{ activeDirectory?: string }> = (prop
       new Map(
         workspaces().map((workspace) => [
           pathKey(workspace.directory),
-          sessionQuery.isSuccess ? sessionsForWorkspace(data.session.list(), workspace.directory) : [],
+          sessionQuery.data ? sessionsForWorkspace(sessionQuery.data, workspace.directory) : [],
         ]),
       ),
   )
@@ -136,7 +146,7 @@ export const SettingsWorkspaces: Component<{ activeDirectory?: string }> = (prop
     const [working, branch, sessions] = await Promise.all([
       context.sdk.api.vcs.status({ location: { directory: workspace.directory } }),
       context.sdk.api.vcs.diff({ location: { directory: workspace.directory }, mode: "branch" }),
-      loadSessions(context),
+      loadSessions([workspace.directory], context),
     ])
     const result = inspectWorkspaceDeletion({
       workspace: workspace.directory,

packages/app/src/shell/routes/routes.tsx

@@ -1,4 +1,4 @@
-import { Navigate, Route, useParams } from "@solidjs/router"
+import { Route, useParams } from "@solidjs/router"
 import { createMemo, lazy, Show, type ParentProps } from "solid-js"
 import { Home } from "@/home/route"
 import { ServerProvider } from "@/runtime/server/current"
@@ -6,7 +6,7 @@ import { useGlobal } from "@/runtime/server/runtime"
 import { ServerConnection } from "@/runtime/server/registry"
 import { LayoutProvider } from "@/shell/state/layout"
 import Shell from "@/shell/shell"
-import { parseServerKey } from "./session"
+import { requireServerKey } from "./session"
 
 export const File = lazy(() => import("@opencode-ai/session-ui/file").then((module) => ({ default: module.File })))
 const loadDraftRoute = () => Promise.all([import("@/new-session/route"), File.preload()]).then(([module]) => module)
@@ -44,14 +44,12 @@ export function AppRoutes() {
 function TargetServerRoute(props: ParentProps) {
   const params = useParams<{ serverKey: string }>()
   const global = useGlobal()
-  const connection = createMemo(() => {
-    const key = parseServerKey(params.serverKey)
-    if (!key) return
-    return global.servers.list().find((item) => ServerConnection.key(item) === key)
-  })
+  const connection = createMemo(() =>
+    global.servers.list().find((item) => ServerConnection.key(item) === requireServerKey(params.serverKey)),
+  )
 
   return (
-    <Show when={connection()} keyed fallback={<Navigate href="/" />}>
+    <Show when={connection()} keyed>
       {(connection) => <ServerProvider conn={connection}>{props.children}</ServerProvider>}
     </Show>
   )

packages/app/src/shell/routes/session.test.ts

@@ -1,6 +1,6 @@
 import { describe, expect, test } from "bun:test"
 import { ServerConnection } from "@/runtime/server/registry"
-import { parseServerKey, requireServerKey, rootSession, sessionHref } from "./session"
+import { requireServerKey, rootSession, sessionHref } from "./session"
 
 describe("session routes", () => {
   test("builds and decodes a server-keyed session route", () => {
@@ -12,8 +12,6 @@ describe("session routes", () => {
   })
 
   test("rejects malformed server keys", () => {
-    expect(parseServerKey(undefined)).toBeUndefined()
-    expect(parseServerKey("not-base64")).toBeUndefined()
     expect(() => requireServerKey("not-base64")).toThrow("Invalid server route")
   })
 

packages/app/src/shell/routes/session.ts

@@ -7,14 +7,8 @@ export function sessionHref(server: ServerConnection.Key, sessionID: string) {
 }
 
 export function requireServerKey(segment: string | undefined) {
-  const key = parseServerKey(segment)
-  if (!key) throw new Error("Invalid server route")
-  return key
-}
-
-export function parseServerKey(segment: string | undefined) {
   const key = decode64(segment)
-  if (!key || base64Encode(key) !== segment) return
+  if (!key || base64Encode(key) !== segment) throw new Error("Invalid server route")
   return ServerConnection.Key.make(key)
 }
 

packages/app/src/shell/shell.tsx

@@ -3,6 +3,7 @@ import { createStore } from "solid-js/store"
 import { Titlebar, type TitlebarUpdate } from "@/shell/titlebar/titlebar"
 import { usePlatform } from "@/runtime/platform/platform"
 import { ToastRegion } from "@/shell/notifications/toast"
+import { TitlebarRightProvider } from "@/shell/titlebar/right-slot"
 
 const DebugBar = lazy(() => import("@/shell/debug/debug-bar").then((module) => ({ default: module.DebugBar })))
 
@@ -23,30 +24,32 @@ export default function Layout(props: ParentProps) {
   }
 
   return (
-    <div
-      class="relative bg-v2-background-bg-deep flex-1 min-h-0 min-w-0 flex flex-col select-none [&_input]:select-text [&_textarea]:select-text [&_[contenteditable]]:select-text"
-      style={{
-        "padding-top": "env(safe-area-inset-top, 0px)",
-        "padding-bottom": "env(safe-area-inset-bottom, 0px)",
-      }}
-    >
-      <Titlebar
-        update={update}
-        debugTools={
-          import.meta.env.DEV
-            ? { visible: state.debugTools, toggle: () => setState("debugTools", (value) => !value) }
-            : undefined
-        }
-      />
-      <main class="flex-1 min-h-0 min-w-0 overflow-x-hidden flex flex-col items-start contain-strict">
-        <Suspense>{props.children}</Suspense>
-      </main>
-      <Show when={import.meta.env.DEV && state.debugTools}>
-        <Suspense>
-          <DebugBar inline />
-        </Suspense>
-      </Show>
-      <ToastRegion />
-    </div>
+    <TitlebarRightProvider>
+      <div
+        class="relative bg-v2-background-bg-deep flex-1 min-h-0 min-w-0 flex flex-col select-none [&_input]:select-text [&_textarea]:select-text [&_[contenteditable]]:select-text"
+        style={{
+          "padding-top": "env(safe-area-inset-top, 0px)",
+          "padding-bottom": "env(safe-area-inset-bottom, 0px)",
+        }}
+      >
+        <Titlebar
+          update={update}
+          debugTools={
+            import.meta.env.DEV
+              ? { visible: state.debugTools, toggle: () => setState("debugTools", (value) => !value) }
+              : undefined
+          }
+        />
+        <main class="flex-1 min-h-0 min-w-0 overflow-x-hidden flex flex-col items-start contain-strict">
+          <Suspense>{props.children}</Suspense>
+        </main>
+        <Show when={import.meta.env.DEV && state.debugTools}>
+          <Suspense>
+            <DebugBar inline />
+          </Suspense>
+        </Show>
+        <ToastRegion />
+      </div>
+    </TitlebarRightProvider>
   )
 }

packages/app/src/shell/tabs/tabs.tsx

@@ -229,12 +229,12 @@ export const { use: useTabs, provider: TabsProvider } = createSimpleContext({
           )
         })
       },
-      async promoteDraft(draftID: string, session: Omit<SessionTab, "type">) {
+      promoteDraft(draftID: string, session: Omit<SessionTab, "type">) {
         // Keep the replacement and navigation atomic so /new-session never renders
         // after its backing draft tab has been removed from the store.
         const active = location.pathname === "/new-session" && location.query.draftId === draftID
         const next = { type: "session" as const, ...session }
-        await startTransition(() => {
+        void startTransition(() => {
           setStore(
             produce((tabs) => {
               const index = tabs.findIndex((tab) => tab.type === "draft" && tab.draftID === draftID)

packages/app/src/shell/titlebar/right-slot.test.ts

@@ -0,0 +1,27 @@
+import { describe, expect, test } from "bun:test"
+import { createRoot } from "solid-js"
+import { createTitlebarRightSlot } from "./right-slot"
+
+describe("titlebar right slot", () => {
+  test("selects the latest owner and restores the previous owner after overlap", () => {
+    createRoot((dispose) => {
+      const slot = createTitlebarRightSlot()
+      const committed = slot.createRegistration()
+      committed.register()
+      expect(committed.active()).toBe(true)
+
+      const shadow = slot.createRegistration()
+      shadow.register()
+      expect(committed.active()).toBe(false)
+      expect(shadow.active()).toBe(true)
+
+      shadow.unregister()
+      expect(committed.active()).toBe(true)
+      expect(shadow.active()).toBe(false)
+
+      committed.unregister()
+      expect(committed.active()).toBe(false)
+      dispose()
+    })
+  })
+})

packages/app/src/shell/titlebar/right-slot.tsx

@@ -0,0 +1,65 @@
+import { createContext, onCleanup, onMount, Show, useContext, type ParentProps } from "solid-js"
+import { createStore } from "solid-js/store"
+import { Portal } from "solid-js/web"
+
+type Registration = {
+  active: () => boolean
+  register: () => void
+  unregister: () => void
+}
+
+type TitlebarRightSlot = {
+  createRegistration: () => Registration
+  mount: () => HTMLElement | undefined
+  setMount: (mount: HTMLElement) => void
+}
+
+const TitlebarRightContext = createContext<TitlebarRightSlot>()
+
+export function TitlebarRightProvider(props: ParentProps) {
+  return (
+    <TitlebarRightContext.Provider value={createTitlebarRightSlot()}>{props.children}</TitlebarRightContext.Provider>
+  )
+}
+
+export function createTitlebarRightSlot(): TitlebarRightSlot {
+  const [store, setStore] = createStore<{ mount?: HTMLElement; registrations: symbol[] }>({ registrations: [] })
+  return {
+    mount: () => store.mount,
+    setMount: (mount) => setStore("mount", mount),
+    createRegistration() {
+      const id = Symbol()
+      return {
+        active: () => store.registrations.at(-1) === id,
+        register: () => setStore("registrations", (items) => [...items, id]),
+        unregister: () => setStore("registrations", (items) => items.filter((item) => item !== id)),
+      }
+    },
+  }
+}
+
+export function TitlebarRightMount() {
+  const slot = useTitlebarRightSlot()
+  return <div ref={slot.setMount} id="opencode-titlebar-right" class="flex shrink-0 items-center justify-end gap-0" />
+}
+
+export function TitlebarRight(props: ParentProps) {
+  const slot = useTitlebarRightSlot()
+  const registration = slot.createRegistration()
+  onMount(() => {
+    registration.register()
+    onCleanup(registration.unregister)
+  })
+
+  return (
+    <Show when={registration.active() && slot.mount()} keyed>
+      {(mount) => <Portal mount={mount}>{props.children}</Portal>}
+    </Show>
+  )
+}
+
+function useTitlebarRightSlot() {
+  const slot = useContext(TitlebarRightContext)
+  if (!slot) throw new Error("TitlebarRight must be used within TitlebarRightProvider")
+  return slot
+}

packages/app/src/shell/titlebar/titlebar.tsx

@@ -1,15 +1,4 @@
-import {
-  createEffect,
-  createMemo,
-  createResource,
-  createSignal,
-  Match,
-  on,
-  onMount,
-  Show,
-  Switch,
-  untrack,
-} from "solid-js"
+import { createEffect, createMemo, createResource, Match, createSignal, Show, Switch, untrack } from "solid-js"
 import { createStore } from "solid-js/store"
 import { useLocation, useNavigate } from "@solidjs/router"
 import { IconButton } from "@opencode-ai/ui/icon-button"
@@ -34,6 +23,7 @@ import { tabKey, useTabs } from "@/shell/tabs/tabs"
 import type { ComposerState } from "@/composer/persistence"
 import "./titlebar.css"
 import { newTabTooltipKeybind } from "@/shell/commands/tooltip-keybind"
+import { TitlebarRightMount } from "@/shell/titlebar/right-slot"
 
 const titlebarHeight = 36
 const minTitlebarZoom = 0.25
@@ -46,15 +36,6 @@ export type TitlebarUpdate = {
   install: () => void
 }
 
-export function useTitlebarRightMount() {
-  const language = useLanguage()
-  const [mount, setMount] = createSignal<HTMLElement | null>(null)
-  const sync = () => setMount(document.getElementById("opencode-titlebar-right"))
-  onMount(sync)
-  createEffect(on(language.direction, sync, { defer: true }))
-  return mount
-}
-
 export function Titlebar(props: { update?: TitlebarUpdate; debugTools?: { visible: boolean; toggle: () => void } }) {
   const platform = usePlatform()
   const command = useCommand()
@@ -421,7 +402,7 @@ function TitlebarRight(props: { state: TitlebarRightState }) {
       <Show when={props.state.update.visible}>
         <TitlebarUpdateIconButton state={props.state.update} />
       </Show>
-      <div id="opencode-titlebar-right" class="flex shrink-0 items-center justify-end gap-0" />
+      <TitlebarRightMount />
     </div>
   )
 }

packages/app/test-browser/solid-virtual.test.ts

@@ -27,6 +27,34 @@ test("end anchoring survives consecutive resizes when the first scroll write is
   expect(writes).toEqual([{ offset: 120, adjustments: 80 }])
 })
 
+test("start anchoring preserves a stable visible item across prepends", () => {
+  const root = document.createElement("div")
+  const writes: number[] = []
+  const options = (keys: string[]) => ({
+    count: keys.length,
+    estimateSize: () => 50,
+    initialOffset: 50,
+    initialRect: { width: 400, height: 100 },
+    anchorTo: "start" as const,
+    getItemKey: (index: number) => keys[index]!,
+    getScrollElement: () => root,
+    scrollToFn: (offset: number) => writes.push(offset),
+    observeElementRect: () => {},
+    observeElementOffset: (_element: HTMLDivElement, callback: (offset: number, isScrolling: boolean) => void) => {
+      callback(50, false)
+    },
+  })
+  const virtualizer = new Virtualizer<HTMLDivElement, HTMLDivElement>(options(["c", "d", "e"]))
+  virtualizer._willUpdate()
+  virtualizer.getVirtualItems()
+
+  virtualizer.setOptions(options(["a", "b", "c", "d", "e"]))
+  virtualizer._willUpdate()
+
+  expect(virtualizer.getScrollOffset()).toBe(150)
+  expect(writes.at(-1)).toBe(150)
+})
+
 test("reactive count updates preserve measured row sizes", () => {
   createRoot((dispose) => {
     const [count, setCount] = createSignal(2)

packages/app/vite.config.ts

@@ -1,5 +1,6 @@
 import { sentryVitePlugin } from "@sentry/vite-plugin"
 import { defineConfig } from "vite"
+import { VitePWA } from "vite-plugin-pwa"
 import desktopPlugin from "./vite.js"
 
 const sentry =
@@ -20,7 +21,47 @@ const sentry =
     : false
 
 export default defineConfig({
-  plugins: [desktopPlugin, sentry] as any,
+  plugins: [
+    desktopPlugin,
+    VitePWA({
+      strategies: "generateSW",
+      manifest: false,
+      workbox: {
+        cleanupOutdatedCaches: true,
+        clientsClaim: true,
+        inlineWorkboxRuntime: true,
+        navigateFallback: "/index.html",
+        navigateFallbackDenylist: [/^\/api(?:\/|$)/],
+        globPatterns: [
+          "index.html",
+          "site.webmanifest",
+          "favicon*",
+          "apple-touch-icon*",
+          "web-app-manifest*",
+          "assets/index-*.{js,css}",
+          "assets/session-*.js",
+          "assets/Inter.ttf",
+          "assets/JetBrainsMonoNerdFontMono-Regular.woff2",
+        ],
+        runtimeCaching: [
+          {
+            urlPattern: ({ url }) => url.origin === self.location.origin && url.pathname.startsWith("/assets/"),
+            handler: "CacheFirst",
+            options: {
+              cacheName: "opencode-assets",
+              cacheableResponse: {
+                statuses: [200],
+              },
+              expiration: {
+                maxEntries: 1000,
+              },
+            },
+          },
+        ],
+      },
+    }),
+    sentry,
+  ] as any,
   server: {
     host: "0.0.0.0",
     allowedHosts: true,

packages/cli/src/services/web-ui.ts

@@ -32,9 +32,10 @@ function serveUI(request: HttpServerRequest.HttpServerRequest, url: URL, assets:
   if (request.method !== "GET" && request.method !== "HEAD")
     return Effect.succeed(HttpServerResponse.empty({ status: 405 }))
   const html = name === "index.html"
+  const revalidate = html || name === "sw.js" || name === "registerSW.js"
   const headers = {
     "content-type": FSUtil.mimeType(name),
-    "cache-control": html ? "no-cache" : "public, max-age=31536000, immutable",
+    "cache-control": revalidate ? "no-cache" : "public, max-age=31536000, immutable",
     "content-security-policy": html
       ? cspForHtml(typeof file === "string" ? file : Buffer.from(file).toString())
       : csp(),

packages/cli/test/web-ui.test.ts

@@ -20,6 +20,8 @@ describe("web UI", () => {
     const assets = {
       "index.html": await Bun.file(index).text(),
       "app.js": await Bun.file(asset).text(),
+      "sw.js": "service worker",
+      "registerSW.js": "registration",
       "font.woff2": new Uint8Array([0, 1, 2, 255]),
     }
 
@@ -53,6 +55,13 @@ describe("web UI", () => {
 
           const script = yield* Effect.promise(() => fetch(`${origin}/app.js`))
           expect(yield* Effect.promise(() => script.text())).toBe("console.log('embedded')")
+          expect(script.headers.get("cache-control")).toBe("public, max-age=31536000, immutable")
+
+          const worker = yield* Effect.promise(() => fetch(`${origin}/sw.js`))
+          expect(worker.headers.get("cache-control")).toBe("no-cache")
+
+          const registration = yield* Effect.promise(() => fetch(`${origin}/registerSW.js`))
+          expect(registration.headers.get("cache-control")).toBe("no-cache")
 
           const font = yield* Effect.promise(() => fetch(`${origin}/font.woff2`))
           expect(new Uint8Array(yield* Effect.promise(() => font.arrayBuffer()))).toEqual(

packages/client/src/promise/generated/types.ts

@@ -263,6 +263,8 @@ export type SessionInboxCompaction = {
 
 export type InstructionEntryInfo = { key: InstructionEntryKey; value: JsonValue }
 
+export type InstructionEntrySnapshot = Array<{ key: InstructionEntryKey; value: JsonValue; removed: boolean }>
+
 export type SessionCreated = {
   id: string
   created: number
@@ -344,16 +346,6 @@ export type SessionDeleted = {
   data: { sessionID: string }
 }
 
-export type SessionForked = {
-  id: string
-  created: number
-  metadata?: { [x: string]: any }
-  type: "session.forked"
-  durable: { aggregateID: string; seq: number; version: 2 }
-  location?: LocationRef
-  data: { sessionID: string; parentID: string; boundary: SessionForkBoundary; instructions?: { [x: string]: string } }
-}
-
 export type SessionInboxDelivered = {
   id: string
   created: number
@@ -1097,7 +1089,7 @@ export type PtyUpdated = {
   data: { info: Pty }
 }
 
-export type SessionStatus2 = {
+export type SessionStatusUpdated = {
   id: string
   created: number
   metadata?: { [x: string]: any }
@@ -1312,6 +1304,22 @@ export type FormWhen = {
 
 export type ToolContent = ToolTextContent | ToolFileContent
 
+export type SessionForked = {
+  id: string
+  created: number
+  metadata?: { [x: string]: any }
+  type: "session.forked"
+  durable: { aggregateID: string; seq: number; version: 2 }
+  location?: LocationRef
+  data: {
+    sessionID: string
+    parentID: string
+    boundary: SessionForkBoundary
+    instructions?: { [x: string]: string }
+    instructionEntries?: InstructionEntrySnapshot
+  }
+}
+
 export type SessionShellStarted = {
   id: string
   created: number
@@ -2109,7 +2117,7 @@ export type V2Event =
   | FormReplied
   | FormCancelled
   | WebsearchUpdated
-  | SessionStatus2
+  | SessionStatusUpdated
   | SessionIdle
   | TuiPromptAppend
   | TuiCommandExecute

packages/client/src/solid/data.ts

@@ -1101,6 +1101,9 @@ export function createData(config: CreateDataInput) {
       get(sessionID: string) {
         return store.session.info[sessionID]
       },
+      creating(sessionID: string) {
+        return creating.has(sessionID)
+      },
       remember(info: SessionInfo) {
         setStore("session", "info", info.id, reconcile(info))
         sync.complete(`session:${info.id}`)

packages/client/test/contract-identity.test.ts

@@ -19,8 +19,8 @@ test("effect entrypoint exposes canonical Schema contracts", () => {
 test("generated Effect API names canonical and composed outputs", async () => {
   const source = await Bun.file(new URL("../src/effect/api/api.ts", import.meta.url)).text()
 
-  expect(source).toContain("export type Endpoint5_5Output = Session.Info")
-  expect(source).toContain("export type Endpoint19_0Output = OpenCodeEvent")
+  expect(source).toContain("export type SessionGetOutput = Session.Info")
+  expect(source).toContain("export type EventSubscribeOutput = OpenCodeEvent")
   expect(source).not.toContain("HttpApiClient.ForApi")
 })
 

packages/client/test/solid-data.test.ts

@@ -1,4 +1,4 @@
-import { test } from "bun:test"
+import { expect, test } from "bun:test"
 import { createRoot } from "solid-js"
 import { createData, type CreateDataInput } from "../src/solid"
 import { OpenCode, type OpenCodeEvent, type SessionInfo } from "../src/promise"
@@ -72,6 +72,37 @@ test("revalidates after an event overtakes an active session read", async () =>
   }
 })
 
+test("reports optimistic sessions as creating until the request settles", async () => {
+  const release = Promise.withResolvers<void>()
+  const api = OpenCode.make({
+    baseUrl: "http://opencode.local",
+    fetch: async (input, init) => {
+      const request = input instanceof Request ? input : new Request(input, init)
+      if (!request.url.endsWith("/api/session")) throw new Error(`Unexpected request: ${request.url}`)
+      await release.promise
+      return Response.json({ data: session(0) })
+    },
+  })
+  const event: CreateDataInput["event"] = {
+    on: () => () => {},
+    listen: () => () => {},
+  }
+  const setup = createRoot((dispose) => ({
+    data: createData({ api: () => api, directory: "/project", event, connection: { status: () => "connected" } }),
+    dispose,
+  }))
+
+  try {
+    const created = setup.data.session.create({ id: "ses_refresh", location: { directory: "/project" } })
+    expect(setup.data.session.creating(created.id)).toBe(true)
+    release.resolve()
+    await created.request
+    expect(setup.data.session.creating(created.id)).toBe(false)
+  } finally {
+    setup.dispose()
+  }
+})
+
 async function wait(check: () => boolean) {
   const started = Date.now()
   while (!check()) {

packages/core/package.json

@@ -118,7 +118,6 @@
     "@opencode-ai/ai": "workspace:*",
     "@opencode-ai/schema": "workspace:*",
     "@opencode-ai/plugin": "workspace:*",
-    "@opencode-ai/shell-scan": "workspace:*",
     "@opencode-ai/util": "workspace:*",
     "@standard-schema/spec": "catalog:",
     "@parcel/watcher": "2.5.1",

packages/core/src/location-activity.ts

@@ -0,0 +1,74 @@
+export * as LocationActivity from "./location-activity.js"
+
+import { Clock, Context, Duration, Effect, Layer, RcMap, Schema } from "effect"
+import { Bus } from "./bus.js"
+import { Location } from "./location.js"
+import { LocationServiceMap } from "./location-service-map.js"
+import { SessionEvent } from "./session/event.js"
+import { makeGlobalNode } from "@opencode-ai/util/effect/app-node"
+
+const isSessionEvent = Schema.is(SessionEvent.Durable)
+
+export class Service extends Context.Service<Service, {}>()("@opencode/LocationActivity") {}
+
+export function layer(options: { readonly timeToLive?: Duration.Input; readonly sweepInterval?: Duration.Input } = {}) {
+  return Layer.effect(
+    Service,
+    Effect.gen(function* () {
+      const clock = yield* Clock.Clock
+      const bus = yield* Bus.Service
+      const locations = yield* LocationServiceMap.Service
+      const timeToLive = Duration.toMillis(options.timeToLive ?? "60 minutes")
+      const entries = new Map<string, { readonly ref: Location.Ref; expiresAt: number }>()
+      const key = (ref: Location.Ref) => `${ref.directory}\0${ref.workspaceID ?? ""}`
+      const touch = (ref: Location.Ref) =>
+        Effect.sync(() => {
+          entries.set(key(ref), { ref, expiresAt: clock.currentTimeMillisUnsafe() + timeToLive })
+        })
+
+      const unsubscribe = yield* bus.listen((event) => {
+        if (!isSessionEvent(event)) return Effect.void
+        const location = event.location
+        if (!location) return Effect.void
+        return RcMap.has(locations.rcMap, location).pipe(
+          Effect.flatMap((active) => (active ? touch(location) : Effect.void)),
+        )
+      })
+      yield* Effect.addFinalizer(() => unsubscribe)
+      yield* Effect.gen(function* () {
+        yield* Effect.sleep(options.sweepInterval ?? "1 minute")
+        const refs = Array.from(yield* RcMap.keys(locations.rcMap))
+        const cached = new Set(refs.map(key))
+        yield* Effect.forEach(
+          refs,
+          (ref) => (entries.has(key(ref)) ? Effect.void : touch(ref)),
+          { discard: true },
+        )
+        for (const id of entries.keys()) {
+          if (!cached.has(id)) entries.delete(id)
+        }
+        const now = clock.currentTimeMillisUnsafe()
+        const expired = Array.from(entries.values()).filter((entry) => entry.expiresAt <= now)
+        yield* Effect.forEach(
+          expired,
+          (entry) => {
+            entries.delete(key(entry.ref))
+            return Effect.logInfo("location services evicted", {
+              directory: entry.ref.directory,
+              workspaceID: entry.ref.workspaceID,
+            }).pipe(Effect.andThen(locations.invalidate(entry.ref)))
+          },
+          { discard: true },
+        )
+      }).pipe(Effect.forever, Effect.forkScoped)
+
+      return Service.of({})
+    }),
+  )
+}
+
+export const node = makeGlobalNode({
+  service: Service,
+  layer: layer(),
+  deps: [Bus.node, LocationServiceMap.node],
+})

packages/core/src/location-services.ts

@@ -1,4 +1,4 @@
-import { Effect, Layer, LayerMap } from "effect"
+import { Duration, Effect, Layer, LayerMap } from "effect"
 import { existsSync } from "fs"
 import path from "path"
 import { Agent } from "./agent.js"
@@ -147,7 +147,7 @@ export function buildLocationServiceMap(
             Layer.provide(LayerNode.compile(location.hoisted)),
           )
         },
-        { idleTimeToLive: (ref) => (existsSync(ref.directory) ? "60 minutes" : 0) },
+        { idleTimeToLive: (ref) => (existsSync(ref.directory) ? Duration.infinity : Duration.zero) },
       ),
       (inner) => ({
         ...inner,

packages/core/src/plugin/skill/opencode.md

@@ -130,7 +130,7 @@ secret into configuration.
 For any request to migrate OpenCode configuration, agents, commands, skills,
 plugins, integrations, or other behavior from V1 to V2, read the full
 [migration guide](https://opencode.ai/v2/docs/migrate-v1) before acting. In
-the repository, its source is `packages/www/content/docs/migrate-v1.mdx`.
+the repository, its source is `packages/www/src/docs/content/migrate-v1.mdx`.
 
 V1 config files and `.opencode/` definitions are intended to remain compatible.
 The only intentional breaking changes are the server API and plugin API. Native

packages/core/src/session.ts

@@ -54,6 +54,7 @@ import { KeyedMutex } from "./effect/keyed-mutex.js"
 import { fileURLToPath } from "url"
 import { SessionEnvironment } from "./session/environment.js"
 import { SessionHistory } from "./session/history.js"
+import { InstructionEntry } from "./session/instruction-entry.js"
 
 // get project -> project.locations
 //
@@ -437,6 +438,14 @@ const layer = Layer.effect(
           })
         if (!boundary) return yield* new ForkEmptyError({ sessionID: input.sessionID })
         const sessionID = SessionSchema.ID.create()
+        const inherited = yield* db
+          .transaction(() =>
+            Effect.all({
+              instructions: InstructionState.current(db, parent.id),
+              instructionEntries: InstructionEntry.snapshot(db, parent.id),
+            }),
+          )
+          .pipe(Effect.orDie)
         // The fork adopts the parent's newest instruction values rather than the
         // values in effect at the boundary; copied history may contain frozen
         // instruction-update text the initial baseline already reflects.
@@ -444,7 +453,7 @@ const layer = Layer.effect(
           sessionID,
           parentID: parent.id,
           boundary: { ...input.boundary, messageID: boundary.id },
-          instructions: yield* InstructionState.current(db, parent.id),
+          ...inherited,
         })
         return yield* result.get(sessionID).pipe(Effect.orDie)
       }),

packages/core/src/session/instruction-entry.ts

@@ -13,9 +13,59 @@ export const Key = InstructionEntry.Key
 export type Key = typeof Key.Type
 export const Info = InstructionEntry.Info
 export type Info = typeof Info.Type
+export const Snapshot = InstructionEntry.Snapshot
+export type Snapshot = typeof Snapshot.Type
 export const MaxValueBytes = InstructionEntry.MaxValueBytes
 export const ValueTooLargeError = InstructionEntry.ValueTooLargeError
 
+type DatabaseService = Database.Interface["db"]
+const InsertBatchSize = 10
+
+export const snapshot = Effect.fn("InstructionEntry.snapshot")(function* (
+  db: DatabaseService,
+  sessionID: SessionSchema.ID,
+) {
+  return yield* db
+    .select({
+      key: InstructionEntryTable.key,
+      value: InstructionEntryTable.value,
+      removed: InstructionEntryTable.removed,
+    })
+    .from(InstructionEntryTable)
+    .where(eq(InstructionEntryTable.session_id, sessionID))
+    .orderBy(asc(InstructionEntryTable.key))
+    .all()
+    .pipe(Effect.orDie)
+})
+
+export const initialize = Effect.fn("InstructionEntry.initialize")(function* (
+  db: DatabaseService,
+  sessionID: SessionSchema.ID,
+  entries: Snapshot,
+  created: number,
+) {
+  const batches = Array.from({ length: Math.ceil(entries.length / InsertBatchSize) }, (_, index) =>
+    entries.slice(index * InsertBatchSize, (index + 1) * InsertBatchSize),
+  )
+  yield* Effect.forEach(
+    batches,
+    (batch) =>
+      db
+        .insert(InstructionEntryTable)
+        .values(
+          batch.map((entry) => ({
+            ...entry,
+            session_id: sessionID,
+            time_created: created,
+            time_updated: created,
+          })),
+        )
+        .run()
+        .pipe(Effect.orDie),
+    { discard: true },
+  )
+})
+
 export interface Interface {
   readonly list: (sessionID: SessionSchema.ID) => Effect.Effect<ReadonlyArray<Info>>
   readonly put: (input: {

packages/core/src/session/projector.ts

@@ -15,6 +15,7 @@ import { SessionInbox } from "./inbox.js"
 import { Workspace } from "../workspace.js"
 import { InstructionState } from "./instruction-state.js"
 import { SessionInboxTable, SessionMessageTable, SessionTable } from "./sql.js"
+import { InstructionEntry } from "./instruction-entry.js"
 import { Slug } from "../util/slug.js"
 import { FSUtil } from "@opencode-ai/util/fs-util"
 import { Money } from "@opencode-ai/schema/money"
@@ -171,6 +172,9 @@ const projectFork = Effect.fn("SessionProjector.projectFork")(function* (
     .pipe(Effect.orDie)
   if (!stored) return yield* Effect.die(new SessionAlreadyProjected())
 
+  if (event.data.instructionEntries)
+    yield* InstructionEntry.initialize(db, event.data.sessionID, event.data.instructionEntries, event.created)
+
   let cursor = -1
   while (copiedSeq !== undefined) {
     const rows = yield* db

packages/core/src/shell/parse.ts

@@ -198,7 +198,7 @@ const scanLegacy = Effect.fnUntraced(function* (command: string, shell: string,
 })
 
 async function scanPortable(command: string, shell: string, cwd: string) {
-  const { ShellScan } = await import("@opencode-ai/shell-scan")
+  const { ShellScan } = await import("./scan.js")
   const powershell = ShellSelect.ps(shell)
   const result = powershell ? ShellScan.scanPowerShell(command) : ShellScan.scan(command)
   if (result.kind === "opaque") return { commands: [{ resource: command, save: command }], directories: [] }

packages/core/src/shell/scan.ts

@@ -1,4 +1,4 @@
-export * as ShellScan from "./index.js"
+export * as ShellScan from "./scan.js"
 
 export type OpaqueReason =
   | "command-substitution"

packages/core/test/location-layer.test.ts

@@ -3,14 +3,16 @@ import path from "path"
 import { describe, expect } from "bun:test"
 import { Config } from "@opencode-ai/schema/config"
 import { Money } from "@opencode-ai/schema/money"
-import { DateTime, Deferred, Effect, Equal, Fiber, Hash, RcMap, Schema, Stream } from "effect"
+import { DateTime, Deferred, Duration, Effect, Equal, Fiber, Hash, Layer, LayerMap, RcMap, Schema, Stream } from "effect"
+import { TestClock } from "effect/testing"
 import { Plugin as EffectPlugin } from "@opencode-ai/plugin/effect"
 import { Agent } from "@opencode-ai/core/agent"
 import { Catalog } from "@opencode-ai/core/catalog"
 import { AppNodeBuilder } from "@opencode-ai/core/effect/app-node-builder"
 import { LayerNode } from "@opencode-ai/util/effect/layer-node"
 import { Global } from "@opencode-ai/util/global"
-import { LocationServiceMap } from "@opencode-ai/core/location-services"
+import { LocationServiceMap, type LocationServices } from "@opencode-ai/core/location-services"
+import { LocationActivity } from "@opencode-ai/core/location-activity"
 import { Location } from "@opencode-ai/core/location"
 import { Plugin } from "@opencode-ai/core/plugin"
 import { SdkPlugins } from "@opencode-ai/core/plugin/sdk"
@@ -21,6 +23,7 @@ import { Project } from "@opencode-ai/core/project"
 import { Provider } from "@opencode-ai/core/provider"
 import { AbsolutePath } from "@opencode-ai/core/schema"
 import { Session } from "@opencode-ai/core/session"
+import { SessionEvent } from "@opencode-ai/core/session/event"
 import { SessionRunnerModel } from "@opencode-ai/core/session/runner/model"
 import { tmpdir } from "./fixture/tmpdir"
 import { tempGlobalLayer } from "./fixture/global"
@@ -41,8 +44,55 @@ const itWithSdk = testEffect(
     [Global.node, tempGlobalLayer],
   ]),
 )
+const activityLocations = Layer.effect(
+  LocationServiceMap.Service,
+  LayerMap.make(
+    (ref) =>
+      // oxlint-disable-next-line typescript-eslint/no-unsafe-type-assertion
+      Layer.succeed(
+        Location.Service,
+        Location.Service.of({
+          directory: ref.directory,
+          workspaceID: ref.workspaceID,
+          project: { id: Project.ID.global, directory: ref.directory, canonical: ref.directory },
+        }),
+      ) as unknown as Layer.Layer<LocationServices>,
+    { idleTimeToLive: Duration.infinity },
+  ),
+)
+const itWithActivity = testEffect(
+  AppNodeBuilder.build(
+    LayerNode.group([Database.node, Bus.node, LocationServiceMap.node, LocationActivity.node]),
+    [[LocationServiceMap.node, activityLocations]],
+  ),
+)
 
 describe("LocationServiceMap", () => {
+  itWithActivity.effect("refreshes lifetime from Session events only", () =>
+    Effect.gen(function* () {
+      const locations = yield* LocationServiceMap.Service
+      const bus = yield* Bus.Service
+      const ref = Location.Ref.make({ directory: AbsolutePath.make("/project") })
+      const sessionID = Session.ID.make("ses_location_activity")
+      const read = Location.Service.pipe(Effect.provide(locations.get(ref)), Effect.scoped)
+
+      yield* read
+      yield* TestClock.adjust("59 minutes")
+      yield* bus.publish(Catalog.Event.Updated, {}, { location: ref })
+      yield* TestClock.adjust("2 minutes")
+      expect(Array.from(yield* RcMap.keys(locations.rcMap))).toEqual([])
+
+      yield* read
+      yield* bus.publish(SessionEvent.Execution.Started, { sessionID }, { location: ref })
+      yield* TestClock.adjust("59 minutes")
+      yield* bus.publish(SessionEvent.Execution.Succeeded, { sessionID }, { location: ref })
+      yield* TestClock.adjust("1 minute")
+      expect(Array.from(yield* RcMap.keys(locations.rcMap))).toEqual([ref])
+      yield* TestClock.adjust("59 minutes")
+      expect(Array.from(yield* RcMap.keys(locations.rcMap))).toEqual([])
+    }),
+  )
+
   it.live("retries a location after its missing directory is recreated", () =>
     Effect.acquireRelease(
       Effect.promise(() => tmpdir()),

packages/core/test/session-create.test.ts

@@ -13,6 +13,7 @@ import { LayerNode } from "@opencode-ai/util/effect/layer-node"
 import { Hash } from "@opencode-ai/util/hash"
 import { Bus } from "@opencode-ai/core/bus"
 import { EventTable } from "@opencode-ai/core/event/sql"
+import { Instructions } from "@opencode-ai/core/instructions/index"
 import { Location } from "@opencode-ai/core/location"
 import { Model } from "@opencode-ai/core/model"
 import { Project } from "@opencode-ai/core/project"
@@ -24,6 +25,7 @@ import { SessionMessage } from "@opencode-ai/core/session/message"
 import { SessionProjector } from "@opencode-ai/core/session/projector"
 import { SessionExecution } from "@opencode-ai/core/session/execution"
 import { SessionInbox } from "@opencode-ai/core/session/inbox"
+import { InstructionEntry } from "@opencode-ai/core/session/instruction-entry"
 import { SessionEvent } from "@opencode-ai/core/session/event"
 import { SessionTable } from "@opencode-ai/core/session/sql"
 import { SessionStore } from "@opencode-ai/core/session/store"
@@ -42,6 +44,7 @@ const it = testEffect(
       SessionStore.node,
       Session.node,
       SessionTransfer.node,
+      InstructionEntry.node,
     ]),
     [
       [Bus.node, Bus.configured({ persist: true })],
@@ -437,6 +440,60 @@ describe("Session.create", () => {
     }),
   )
 
+  it.effect("inherits instruction entries when forking", () =>
+    Effect.gen(function* () {
+      const session = yield* Session.Service
+      const entries = yield* InstructionEntry.Service
+      const bus = yield* Bus.Service
+      const { db } = yield* Database.Service
+      const parent = yield* session.create({ location })
+      yield* session.prompt({ sessionID: parent.id, text: "Fork context", resume: false })
+      yield* SessionInbox.promote(db, bus, parent.id, "steer")
+      yield* entries.put({ sessionID: parent.id, key: "deploy-target", value: "production" })
+      yield* entries.put({ sessionID: parent.id, key: "retired", value: true })
+      yield* entries.remove({ sessionID: parent.id, key: "retired" })
+      yield* Effect.forEach(
+        Array.from({ length: 20 }, (_, index) => index),
+        (index) => entries.put({ sessionID: parent.id, key: `entry-${String(index).padStart(2, "0")}`, value: index }),
+        { discard: true },
+      )
+
+      const forked = yield* session.fork({ sessionID: parent.id, boundary: { type: "through" } })
+      const inheritedList = yield* entries.list(forked.id)
+      const inheritedValues = yield* entries.load(forked.id).pipe(Effect.flatMap(Instructions.read))
+
+      expect(inheritedList).toHaveLength(21)
+      expect(inheritedList).toContainEqual({ key: "deploy-target", value: "production" })
+      expect(inheritedValues).toContainEqual({
+        key: Instructions.Key.make("api/retired"),
+        value: Instructions.removed,
+      })
+
+      const recorded = yield* db
+        .select()
+        .from(EventTable)
+        .where(eq(EventTable.aggregate_id, forked.id))
+        .get()
+        .pipe(Effect.orDie)
+      if (!recorded) return yield* Effect.die(new Error("Fork event not found"))
+      yield* entries.put({ sessionID: parent.id, key: "deploy-target", value: "staging" })
+      yield* entries.put({ sessionID: parent.id, key: "new-parent-entry", value: true })
+      yield* bus.remove(forked.id)
+      yield* db.delete(SessionTable).where(eq(SessionTable.id, forked.id)).run().pipe(Effect.orDie)
+      yield* bus.replay({
+        id: recorded.id,
+        created: recorded.created,
+        aggregateID: recorded.aggregate_id,
+        seq: recorded.seq,
+        type: recorded.type,
+        data: recorded.data,
+      })
+
+      expect(yield* entries.list(forked.id)).toEqual(inheritedList)
+      expect(yield* entries.load(forked.id).pipe(Effect.flatMap(Instructions.read))).toEqual(inheritedValues)
+    }),
+  )
+
   it.effect("does not copy a running assistant into a fork", () =>
     Effect.gen(function* () {
       const session = yield* Session.Service

packages/core/test/shell-parse-parity.test.ts

@@ -1,7 +1,7 @@
 import { describe, expect, test } from "bun:test"
-import { ShellScan } from "@opencode-ai/shell-scan"
 import { Effect } from "effect"
 import { ShellParse } from "../src/shell/parse.js"
+import { ShellScan } from "../src/shell/scan.js"
 
 describe("ShellParse portable parity", () => {
   test("matches tree-sitter for generated supported syntax", async () => {

packages/core/test/shell-scan/adversarial.test.ts

@@ -1,5 +1,5 @@
 import { describe, expect, test } from "bun:test"
-import { ShellScan } from "../src/index.js"
+import { ShellScan } from "../../src/shell/scan.js"
 
 describe("ShellScan adversarial corpus", () => {
   test.each([