refactor(core): reuse Markdown chunk byte counts

.github/workflows/deploy.yml

@@ -5,7 +5,6 @@ on:
     branches:
       - dev
       - production
-      - beta
   workflow_dispatch:
 
 concurrency: ${{ github.workflow }}-${{ github.ref }}
@@ -16,7 +15,7 @@ permissions:
 
 jobs:
   deploy:
-    if: github.repository == 'anomalyco/opencode' && (github.ref_name == 'dev' || github.ref_name == 'production' || github.ref_name == 'beta')
+    if: github.repository == 'anomalyco/opencode' && (github.ref_name == 'dev' || github.ref_name == 'production')
     runs-on: ubuntu-latest
     environment: ${{ github.ref_name }}
     steps:
@@ -29,7 +28,6 @@ jobs:
           node-version: "24"
 
       - uses: aws-actions/configure-aws-credentials@7474bc4690e29a8392af63c5b98e7449536d5c3a # v4.3.1
-        if: github.ref_name != 'beta'
         with:
           role-to-assume: ${{ vars.AWS_DEPLOY_ROLE_ARN }}
           role-session-name: opencode-${{ github.run_id }}

infra/app.ts

@@ -1,5 +1,4 @@
 import { domain } from "./stage"
-import { createWebApp } from "./webapp"
 
 const GITHUB_APP_ID = new sst.Secret("GITHUB_APP_ID")
 const GITHUB_APP_PRIVATE_KEY = new sst.Secret("GITHUB_APP_PRIVATE_KEY")
@@ -60,4 +59,12 @@ new sst.cloudflare.x.Astro("Web", {
   },
 })
 
-createWebApp("app." + domain)
+new sst.cloudflare.StaticSite("WebApp", {
+  domain: "app." + domain,
+  path: "packages/app",
+  build: {
+    // Preserve Sentry credentials and run source-map uploads on every deployment.
+    command: "bun run build",
+    output: "./dist",
+  },
+})

infra/webapp.ts

@@ -1,18 +0,0 @@
-export function createWebApp(domain: string) {
-  return new sst.cloudflare.StaticSite("WebApp", {
-    domain,
-    path: "packages/app",
-    environment:
-      $app.stage === "beta"
-        ? {
-            OPENCODE_CHANNEL: "beta",
-            VITE_SENTRY_ENVIRONMENT: "beta",
-          }
-        : undefined,
-    build: {
-      // Preserve Sentry credentials and run source-map uploads on every deployment.
-      command: "bun run build",
-      output: "./dist",
-    },
-  })
-}

packages/ai/src/protocols/anthropic-messages.ts

@@ -1343,28 +1343,20 @@ const onMessageDelta = (
   event: AnthropicEvent & { readonly delta?: AnthropicStreamDelta },
 ): StepResult => {
   const usage = mergeUsage(state.usage, mapUsage(event.usage, state.providerMetadataKey), state.providerMetadataKey)
-  const pendingFinish = (() => {
-    const stopReason = event.delta?.stop_reason
-    if (stopReason === null || stopReason === undefined) return state.pendingFinish
-
-    const stopSequence = event.delta?.stop_sequence
-    const finishMetadata =
-      stopSequence === null || stopSequence === undefined
-        ? state.pendingFinish?.providerMetadata
-        : providerMetadata(state.providerMetadataKey, { stopSequence })
-    return {
-      reason: {
-        normalized: mapFinishReason(stopReason),
-        raw: stopReason,
-      },
-      providerMetadata: finishMetadata,
-    }
-  })()
   return [
     {
       ...state,
       usage,
-      pendingFinish,
+      pendingFinish: {
+        reason: {
+          normalized: mapFinishReason(event.delta?.stop_reason),
+          raw: event.delta?.stop_reason ?? undefined,
+        },
+        providerMetadata:
+          event.delta?.stop_sequence === null || event.delta?.stop_sequence === undefined
+            ? undefined
+            : providerMetadata(state.providerMetadataKey, { stopSequence: event.delta.stop_sequence }),
+      },
     },
     NO_EVENTS,
   ]

packages/ai/test/provider/anthropic-messages.test.ts

@@ -949,41 +949,6 @@ describe("Anthropic Messages route", () => {
     }),
   )
 
-  it.effect("preserves terminal state across usage-only message deltas", () =>
-    Effect.gen(function* () {
-      const response = yield* LLMClient.generate(request).pipe(
-        Effect.provide(
-          fixedResponse(
-            sseEvents(
-              { type: "message_start", message: { usage: { input_tokens: 5 } } },
-              {
-                type: "message_delta",
-                delta: { stop_reason: "end_turn", stop_sequence: "X" },
-                usage: { output_tokens: 8 },
-              },
-              { type: "message_delta", delta: {}, usage: { output_tokens: 10 } },
-              { type: "message_stop" },
-            ),
-          ),
-        ),
-      )
-
-      expect(response.usage).toMatchObject({ inputTokens: 5, outputTokens: 10, totalTokens: 15 })
-      expect(response.finishReason).toEqual({ normalized: "stop", raw: "end_turn" })
-      expect(response.events.find((event) => event.type === "step-finish")).toMatchObject({
-        reason: { normalized: "stop", raw: "end_turn" },
-        usage: { inputTokens: 5, outputTokens: 10, totalTokens: 15 },
-        providerMetadata: { anthropic: { stopSequence: "X" } },
-      })
-      expect(response.events.at(-1)).toMatchObject({
-        type: "finish",
-        reason: { normalized: "stop", raw: "end_turn" },
-        usage: { inputTokens: 5, outputTokens: 10, totalTokens: 15 },
-        providerMetadata: { anthropic: { stopSequence: "X" } },
-      })
-    }),
-  )
-
   it.effect("requires message_stop before completing a streamed message", () =>
     Effect.gen(function* () {
       const error = yield* LLMClient.generate(request).pipe(

packages/app/README.md

@@ -71,25 +71,4 @@ Environment options:
 
 ## Deployment
 
-The `deploy` GitHub Actions workflow uses SST to deploy the web app from these branches in `anomalyco/opencode`:
-
-| Branch       | Site                  |
-| ------------ | --------------------- |
-| `dev`        | `app.dev.opencode.ai` |
-| `production` | `app.opencode.ai`     |
-| `beta`       | `beta.opencode.ai`    |
-
-Changes merged into `v2` reach the beta site when they are promoted to `beta`. The beta SST stage deploys
-only the web app, using the same `WebApp` StaticSite definition as production. It sets the build channel
-and Sentry environment to `beta` without deploying the API, console, database, or billing infrastructure.
-
-The hosted app defaults to `http://localhost:49374`, matching the managed V2 service. Saved server selections
-override this default. Connecting still requires the service's credentials.
-
-The workflow reuses the repository's `CLOUDFLARE_API_TOKEN` and web Sentry settings. The Cloudflare token
-must cover SST's R2 state storage, KV assets, Workers, and custom-domain management in the account that
-owns `opencode.ai`. The beta GitHub environment must allow deployments from the `beta` branch; it does not
-need AWS credentials.
-
-SST manages the beta site's custom domain. The first deployment creates its DNS record and TLS certificate.
-Do not create a CNAME for `beta.opencode.ai` first, because it would conflict with the Workers custom domain.
+You can deploy the `dist` folder to any static host provider (netlify, surge, now, etc.)

packages/app/src/runtime/platform/web.ts

@@ -53,7 +53,7 @@ export function createWebPlatform(version: string) {
 }
 
 function getCurrentServerUrl() {
-  if (location.hostname.includes("opencode.ai")) return "http://localhost:49374"
+  if (location.hostname.includes("opencode.ai")) return "http://localhost:4096"
   if (import.meta.env.DEV)
     return `http://${import.meta.env.VITE_OPENCODE_SERVER_HOST ?? "localhost"}:${import.meta.env.VITE_OPENCODE_SERVER_PORT ?? "4096"}`
   return location.origin

packages/app/src/shell/shell.tsx

@@ -43,12 +43,12 @@ export default function Layout(props: ParentProps) {
         style={{
           "padding-top": "env(safe-area-inset-top, 0px)",
           "padding-bottom": "env(safe-area-inset-bottom, 0px)",
-          // Native Windows chrome supplies the gap; retain paint clearance for the panels' outer outlines.
+          // The native Windows titlebar already includes the gap above the content panels.
           "--shell-top-inset":
             platform.platform === "desktop" &&
             platform.os === "windows" &&
             !(mobile() && preferences.general.mobileTitlebarPosition() === "bottom")
-              ? "1px"
+              ? "0px"
               : "8px",
         }}
       >

packages/core/src/config/plugin/mcp.ts

@@ -46,12 +46,12 @@ export const register = Effect.fn("ConfigMCPPlugin.register")(function* (
     const servers = new Map<string, ServerConfig>()
     for (const document of documents) {
       for (const [name, server] of Object.entries(document.info.mcp?.servers ?? {})) {
-        servers.set(name, server)
+        servers.set(name, { ...server, timeout: { ...timeout, ...server.timeout } })
       }
     }
     for (const [name, server] of servers) {
       if (draft.get(name)) continue
-      draft.set(name, { ...server, timeout: { ...timeout, ...server.timeout } })
+      draft.set(name, server)
     }
   })
 })

packages/core/src/session.ts

@@ -3,8 +3,9 @@ export * from "./session/schema.js"
 
 import { Cause, Effect, Layer, Schema, Context, RcMap, Stream, Scope } from "effect"
 import { ListAnchor } from "@opencode-ai/schema/session"
-import { and, desc, eq } from "drizzle-orm"
+import { and, asc, desc, eq, gt, isNull, like, lt, or, type SQL } from "drizzle-orm"
 import { Project } from "./project.js"
+import { Workspace } from "@opencode-ai/schema/workspace"
 import { Model } from "@opencode-ai/schema/model"
 import { Location } from "./location.js"
 import { SessionMessage } from "./session/message.js"
@@ -12,13 +13,14 @@ import { PromptInput } from "@opencode-ai/schema/prompt-input"
 import { Bus } from "./bus.js"
 import { Database } from "./database/database.js"
 import { SessionProjector } from "./session/projector.js"
-import { SessionMessageTable } from "./session/sql.js"
+import { SessionMessageTable, SessionTable } from "./session/sql.js"
 import { SessionSchema } from "./session/schema.js"
-import { AbsolutePath, RelativePath } from "./schema.js"
+import { AbsolutePath, PositiveInt, RelativePath } from "./schema.js"
 import { Agent } from "@opencode-ai/schema/agent"
 import { App } from "./app.js"
 import { Slug } from "./util/slug.js"
 import path from "path"
+import { fromRow } from "./session/info.js"
 import { SessionRunner } from "./session/runner/index.js"
 import { SessionStore } from "./session/store.js"
 import { SessionExecution } from "./session/execution.js"
@@ -56,6 +58,7 @@ import { Job } from "./job.js"
 import { Command } from "./command.js"
 import { Global } from "@opencode-ai/util/global"
 import { SessionEnvironment } from "./session/environment.js"
+import { SessionHistory } from "./session/history.js"
 import { InstructionEntry } from "./session/instruction-entry.js"
 
 // get project -> project.locations
@@ -69,8 +72,30 @@ import { InstructionEntry } from "./session/instruction-entry.js"
 
 export { ListAnchor }
 
-export const ListInput = SessionStore.ListInput
-export type ListInput = SessionStore.ListInput
+const ListInputBase = {
+  workspaceID: Workspace.ID.pipe(Schema.optional),
+  search: Schema.String.pipe(Schema.optional),
+  limit: PositiveInt.pipe(Schema.optional),
+  order: Schema.Literals(["asc", "desc"]).pipe(Schema.optional),
+  parentID: Schema.NullOr(SessionSchema.ID).pipe(Schema.optional),
+  anchor: ListAnchor.pipe(Schema.optional),
+}
+
+const ListDirectoryInput = Schema.Struct({
+  ...ListInputBase,
+  directory: AbsolutePath,
+})
+
+const ListProjectInput = Schema.Struct({
+  ...ListInputBase,
+  project: Project.ID,
+  subpath: RelativePath.pipe(Schema.optional),
+})
+
+const ListAllInput = Schema.Struct(ListInputBase)
+
+export const ListInput = Schema.Union([ListDirectoryInput, ListProjectInput, ListAllInput])
+export type ListInput = typeof ListInput.Type
 
 type CreateBaseInput = {
   id?: SessionSchema.ID
@@ -136,9 +161,15 @@ export interface Interface {
   }) => Effect.Effect<SessionEnvironment.Variables | undefined, NotFoundError>
   readonly view: (input: { sessionID: SessionSchema.ID; idle: number }) => Effect.Effect<void, NotFoundError>
   readonly remove: (sessionID: SessionSchema.ID) => Effect.Effect<void, NotFoundError>
-  readonly messages: (
-    input: SessionStore.MessagesInput,
-  ) => Effect.Effect<SessionMessage.Info[], NotFoundError | MessageDecodeError>
+  readonly messages: (input: {
+    sessionID: SessionSchema.ID
+    limit?: number
+    order?: "asc" | "desc"
+    cursor?: {
+      id: SessionMessage.ID
+      direction: "previous" | "next"
+    }
+  }) => Effect.Effect<SessionMessage.Info[], NotFoundError | MessageDecodeError>
   readonly message: (input: {
     sessionID: SessionSchema.ID
     messageID: SessionMessage.ID
@@ -378,12 +409,83 @@ const layer = Layer.effect(
         yield* bus.publish(SessionEvent.Deleted, { sessionID })
         yield* bus.remove(sessionID)
       }),
-      list: Effect.fn("Session.list")(function* (input) {
-        return { data: yield* store.list(input) }
+      list: Effect.fn("Session.list")(function* (input = {}) {
+        const direction = input.anchor?.direction ?? "next"
+        const requestedOrder = input.order ?? "desc"
+        const order = direction === "previous" ? (requestedOrder === "asc" ? "desc" : "asc") : requestedOrder
+        const sortColumn = SessionTable.time_updated
+        const conditions: SQL[] = []
+        if ("directory" in input) conditions.push(eq(SessionTable.directory, input.directory))
+        if (input.workspaceID) conditions.push(eq(SessionTable.workspace_id, input.workspaceID))
+        if ("project" in input) conditions.push(eq(SessionTable.project_id, input.project))
+        if ("project" in input && input.subpath !== undefined) conditions.push(eq(SessionTable.path, input.subpath))
+        if (input.search) conditions.push(like(SessionTable.title, `%${input.search}%`))
+        if (input.parentID !== undefined)
+          conditions.push(
+            input.parentID === null ? isNull(SessionTable.parent_id) : eq(SessionTable.parent_id, input.parentID),
+          )
+        if (input.anchor) {
+          conditions.push(
+            order === "asc"
+              ? or(
+                  gt(sortColumn, input.anchor.time),
+                  and(eq(sortColumn, input.anchor.time), gt(SessionTable.id, input.anchor.id)),
+                )!
+              : or(
+                  lt(sortColumn, input.anchor.time),
+                  and(eq(sortColumn, input.anchor.time), lt(SessionTable.id, input.anchor.id)),
+                )!,
+          )
+        }
+        const query = db
+          .select()
+          .from(SessionTable)
+          .where(conditions.length > 0 ? and(...conditions) : undefined)
+          .orderBy(
+            order === "asc" ? asc(sortColumn) : desc(sortColumn),
+            order === "asc" ? asc(SessionTable.id) : desc(SessionTable.id),
+          )
+        const rows = yield* (input.limit === undefined ? query.all() : query.limit(input.limit).all()).pipe(
+          Effect.orDie,
+        )
+        return { data: (direction === "previous" ? rows.toReversed() : rows).map((row) => fromRow(row)) }
       }),
       messages: Effect.fn("Session.messages")(function* (input) {
         yield* result.get(input.sessionID)
-        return yield* store.messages(input)
+        const direction = input.cursor?.direction ?? "next"
+        const requestedOrder = input.order ?? "desc"
+        const order = direction === "previous" ? (requestedOrder === "asc" ? "desc" : "asc") : requestedOrder
+        const anchor = input.cursor
+          ? yield* db
+              .select({ seq: SessionMessageTable.seq })
+              .from(SessionMessageTable)
+              .where(
+                and(eq(SessionMessageTable.session_id, input.sessionID), eq(SessionMessageTable.id, input.cursor.id)),
+              )
+              .get()
+              .pipe(Effect.orDie)
+          : undefined
+        if (input.cursor && !anchor) return []
+        const boundary = anchor
+          ? order === "asc"
+            ? gt(SessionMessageTable.seq, anchor.seq)
+            : lt(SessionMessageTable.seq, anchor.seq)
+          : undefined
+        const where = boundary
+          ? and(eq(SessionMessageTable.session_id, input.sessionID), boundary)
+          : eq(SessionMessageTable.session_id, input.sessionID)
+        const query = db
+          .select()
+          .from(SessionMessageTable)
+          .where(where)
+          .orderBy(order === "asc" ? asc(SessionMessageTable.seq) : desc(SessionMessageTable.seq))
+        const rows = yield* (input.limit === undefined ? query.all() : query.limit(input.limit).all()).pipe(
+          Effect.orDie,
+        )
+        return yield* Effect.forEach(
+          direction === "previous" ? rows.toReversed() : rows,
+          SessionHistory.decodeMessageRow,
+        )
       }),
       message: (input) => sessions.forSession(input.sessionID).message(input.messageID),
       updateMessage: (input) => sessions.forSession(input.sessionID).updateMessage(input),

packages/core/src/session/store.ts

@@ -1,10 +1,7 @@
 export * as SessionStore from "./store.js"
 
-import { and, asc, desc, eq, gt, isNotNull, isNull, like, lt, notInArray, or, sql, type SQL } from "drizzle-orm"
-import { Context, Effect, Layer, Schema } from "effect"
-import { Project } from "@opencode-ai/schema/project"
-import { Workspace } from "@opencode-ai/schema/workspace"
-import { AbsolutePath, PositiveInt, RelativePath } from "@opencode-ai/schema/schema"
+import { and, eq, isNotNull, isNull, notInArray, sql } from "drizzle-orm"
+import { Context, Effect, Layer } from "effect"
 import { Database } from "../database/database.js"
 import { makeGlobalNode } from "@opencode-ai/util/effect/app-node"
 import { SessionHistory } from "./history.js"
@@ -14,45 +11,8 @@ import { Session } from "@opencode-ai/schema/session"
 import { SessionMessageTable, SessionTable } from "./sql.js"
 import { fromRow } from "./info.js"
 
-const ListInputBase = {
-  workspaceID: Workspace.ID.pipe(Schema.optional),
-  search: Schema.String.pipe(Schema.optional),
-  limit: PositiveInt.pipe(Schema.optional),
-  order: Schema.Literals(["asc", "desc"]).pipe(Schema.optional),
-  parentID: Schema.NullOr(Session.ID).pipe(Schema.optional),
-  anchor: Session.ListAnchor.pipe(Schema.optional),
-}
-
-const ListDirectoryInput = Schema.Struct({
-  ...ListInputBase,
-  directory: AbsolutePath,
-})
-
-const ListProjectInput = Schema.Struct({
-  ...ListInputBase,
-  project: Project.ID,
-  subpath: RelativePath.pipe(Schema.optional),
-})
-
-const ListAllInput = Schema.Struct(ListInputBase)
-
-export const ListInput = Schema.Union([ListDirectoryInput, ListProjectInput, ListAllInput])
-export type ListInput = typeof ListInput.Type
-
-export type MessagesInput = {
-  sessionID: Session.ID
-  limit?: number
-  order?: "asc" | "desc"
-  cursor?: {
-    id: SessionMessage.ID
-    direction: "previous" | "next"
-  }
-}
-
 export interface Interface {
   readonly get: (sessionID: Session.ID) => Effect.Effect<Session.Info | undefined>
-  readonly list: (input?: ListInput) => Effect.Effect<Session.Info[]>
-  readonly messages: (input: MessagesInput) => Effect.Effect<SessionMessage.Info[], MessageDecodeError>
   readonly context: (sessionID: Session.ID) => Effect.Effect<SessionMessage.Info[], MessageDecodeError>
   readonly message: (
     messageID: SessionMessage.ID,
@@ -95,83 +55,6 @@ const layer = Layer.effect(
         const row = yield* db.select().from(SessionTable).where(eq(SessionTable.id, sessionID)).get().pipe(Effect.orDie)
         return row ? fromRow(row) : undefined
       }),
-      list: Effect.fn("SessionStore.list")(function* (input = {}) {
-        const direction = input.anchor?.direction ?? "next"
-        const requestedOrder = input.order ?? "desc"
-        const order = direction === "previous" ? (requestedOrder === "asc" ? "desc" : "asc") : requestedOrder
-        const sortColumn = SessionTable.time_updated
-        const conditions: SQL[] = []
-        if ("directory" in input) conditions.push(eq(SessionTable.directory, input.directory))
-        if (input.workspaceID) conditions.push(eq(SessionTable.workspace_id, input.workspaceID))
-        if ("project" in input) conditions.push(eq(SessionTable.project_id, input.project))
-        if ("project" in input && input.subpath !== undefined) conditions.push(eq(SessionTable.path, input.subpath))
-        if (input.search) conditions.push(like(SessionTable.title, `%${input.search}%`))
-        if (input.parentID !== undefined)
-          conditions.push(
-            input.parentID === null ? isNull(SessionTable.parent_id) : eq(SessionTable.parent_id, input.parentID),
-          )
-        if (input.anchor) {
-          conditions.push(
-            order === "asc"
-              ? or(
-                  gt(sortColumn, input.anchor.time),
-                  and(eq(sortColumn, input.anchor.time), gt(SessionTable.id, input.anchor.id)),
-                )!
-              : or(
-                  lt(sortColumn, input.anchor.time),
-                  and(eq(sortColumn, input.anchor.time), lt(SessionTable.id, input.anchor.id)),
-                )!,
-          )
-        }
-        const query = db
-          .select()
-          .from(SessionTable)
-          .where(conditions.length > 0 ? and(...conditions) : undefined)
-          .orderBy(
-            order === "asc" ? asc(sortColumn) : desc(sortColumn),
-            order === "asc" ? asc(SessionTable.id) : desc(SessionTable.id),
-          )
-        const rows = yield* (input.limit === undefined ? query.all() : query.limit(input.limit).all()).pipe(
-          Effect.orDie,
-        )
-        return (direction === "previous" ? rows.toReversed() : rows).map((row) => fromRow(row))
-      }),
-      messages: Effect.fn("SessionStore.messages")(function* (input) {
-        const direction = input.cursor?.direction ?? "next"
-        const requestedOrder = input.order ?? "desc"
-        const order = direction === "previous" ? (requestedOrder === "asc" ? "desc" : "asc") : requestedOrder
-        const anchor = input.cursor
-          ? yield* db
-              .select({ seq: SessionMessageTable.seq })
-              .from(SessionMessageTable)
-              .where(
-                and(eq(SessionMessageTable.session_id, input.sessionID), eq(SessionMessageTable.id, input.cursor.id)),
-              )
-              .get()
-              .pipe(Effect.orDie)
-          : undefined
-        if (input.cursor && !anchor) return []
-        const boundary = anchor
-          ? order === "asc"
-            ? gt(SessionMessageTable.seq, anchor.seq)
-            : lt(SessionMessageTable.seq, anchor.seq)
-          : undefined
-        const where = boundary
-          ? and(eq(SessionMessageTable.session_id, input.sessionID), boundary)
-          : eq(SessionMessageTable.session_id, input.sessionID)
-        const query = db
-          .select()
-          .from(SessionMessageTable)
-          .where(where)
-          .orderBy(order === "asc" ? asc(SessionMessageTable.seq) : desc(SessionMessageTable.seq))
-        const rows = yield* (input.limit === undefined ? query.all() : query.limit(input.limit).all()).pipe(
-          Effect.orDie,
-        )
-        return yield* Effect.forEach(
-          direction === "previous" ? rows.toReversed() : rows,
-          SessionHistory.decodeMessageRow,
-        )
-      }),
       context: Effect.fn("SessionStore.context")((sessionID) => SessionHistory.load(db, sessionID)),
       message: Effect.fn("SessionStore.message")(function* (messageID) {
         const row = yield* db

packages/core/src/tool/html-markdown.ts

@@ -95,7 +95,7 @@ export function convertHTMLToMarkdown(html: string) {
     const remaining = limit - outputBytes
     const next = bytes.byteLength <= remaining ? value : sliceBytes(value, remaining)
     output.push(next)
-    outputBytes += encoder.encode(next).byteLength
+    outputBytes += bytes.byteLength <= remaining ? bytes.byteLength : encoder.encode(next).byteLength
     last = next.at(-1) ?? last
   }
   const appendRaw = (value: string) => {

packages/core/test/mcp.test.ts

@@ -1207,68 +1207,6 @@ test("adds, disconnects, and reconnects MCP servers at runtime", async () => {
   )
 })
 
-testEffect(Layer.empty).live(
-  "merges MCP defaults into the winning configured server without changing runtime overrides",
-  () =>
-    Effect.gen(function* () {
-      const entries = [
-        new Document({
-          type: "document",
-          info: new Info({
-            mcp: new ConfigMCP.Info({
-              timeout: { startup: 10, catalog: 20, execution: 30 },
-              servers: {
-                resources: { type: "local", command: ["earlier"], disabled: true, timeout: { execution: 90 } },
-              },
-            }),
-          }),
-        }),
-        new Document({
-          type: "document",
-          info: new Info({
-            mcp: new ConfigMCP.Info({
-              timeout: { catalog: 40 },
-              servers: {
-                resources: { type: "local", command: ["later"], disabled: true, timeout: { startup: 50 } },
-              },
-            }),
-          }),
-        }),
-      ]
-      const original = JSON.stringify(entries)
-      yield* Effect.gen(function* () {
-        const service = yield* Mcp.Service
-        const check = yield* service.transform((draft) => {
-          expect(draft.get("resources")).toEqual({
-            type: "local",
-            command: ["later"],
-            disabled: true,
-            timeout: { startup: 50, catalog: 40, execution: 30 },
-          })
-        })
-        yield* check.dispose
-        const runtime = {
-          type: "local",
-          command: ["runtime"],
-          disabled: true,
-          timeout: { catalog: 60 },
-        } satisfies ConfigMCP.Local
-        yield* service.add("resources", runtime)
-        yield* service.reload()
-        yield* service.transform((draft) => {
-          expect(draft.get("resources")).toEqual(runtime)
-        })
-      }).pipe(
-        Effect.provide(
-          resourceMcpLayer("https://unused.example", undefined, undefined, {
-            entries: () => Effect.succeed(entries),
-          }),
-        ),
-      )
-      expect(JSON.stringify(entries)).toBe(original)
-    }),
-)
-
 testEffect(resourceMcpLayer(new ConfigMCP.Local({ type: "local", command: ["unused"], disabled: true }))).live(
   "manages live MCP servers entirely through scoped transforms",
   () =>

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

@@ -21,7 +21,6 @@ import { SessionProjector } from "@opencode-ai/core/session/projector"
 import { SessionExecution } from "@opencode-ai/core/session/execution"
 import { fromRow } from "@opencode-ai/core/session/info"
 import { SessionInbox } from "@opencode-ai/core/session/inbox"
-import { SessionStore } from "@opencode-ai/core/session/store"
 import { Shell } from "@opencode-ai/schema/shell"
 import {
   InstructionStateTable,
@@ -33,10 +32,9 @@ import { testEffect } from "./lib/effect"
 import { Snapshot } from "@opencode-ai/core/snapshot"
 
 const it = testEffect(
-  AppNodeBuilder.build(
-    LayerNode.group([Database.node, Bus.node, SessionProjector.node, SessionInbox.node, SessionStore.node]),
-    [[Bus.node, Bus.configured({ persist: true })]],
-  ),
+  AppNodeBuilder.build(LayerNode.group([Database.node, Bus.node, SessionProjector.node, SessionInbox.node]), [
+    [Bus.node, Bus.configured({ persist: true })],
+  ]),
 )
 const sessionsLayer = AppNodeBuilder.build(Session.node, [[SessionExecution.node, SessionExecution.noopLayer]])
 const sessionID = Session.ID.make("ses_projector_test")
@@ -280,9 +278,7 @@ describe("SessionProjector", () => {
       yield* db.run(sql`update session_message set data = '{"time":{"created":0}}' where id = ${messageID}`)
 
       const sessions = yield* Session.Service
-      const store = yield* SessionStore.Service
       const expected = { _tag: "Session.MessageDecodeError", sessionID, messageID }
-      expect(yield* store.messages({ sessionID }).pipe(Effect.flip)).toMatchObject(expected)
       expect(yield* sessions.messages({ sessionID }).pipe(Effect.flip)).toMatchObject(expected)
       expect(yield* sessions.context(sessionID).pipe(Effect.flip)).toMatchObject(expected)
       expect(yield* sessions.message({ sessionID, messageID }).pipe(Effect.catchDefect(Effect.succeed))).toMatchObject(
@@ -291,21 +287,6 @@ describe("SessionProjector", () => {
     }).pipe(Effect.provide(sessionsLayer)),
   )
 
-  it.effect("checks session existence before resolving a missing message cursor", () =>
-    Effect.gen(function* () {
-      const sessions = yield* Session.Service
-      const missing = Session.ID.make("ses_missing")
-      expect(
-        yield* sessions
-          .messages({
-            sessionID: missing,
-            cursor: { id: SessionMessage.ID.make("msg_missing"), direction: "next" },
-          })
-          .pipe(Effect.flip),
-      ).toEqual(new Session.NotFoundError({ sessionID: missing }))
-    }).pipe(Effect.provide(sessionsLayer)),
-  )
-
   it.effect("consumes the pending row and projects the message at promotion", () =>
     Effect.gen(function* () {
       const db = yield* seedSession()

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

@@ -1,190 +0,0 @@
-import { describe, expect } from "bun:test"
-import { Effect } from "effect"
-import { Bus } from "@opencode-ai/core/bus"
-import { Database } from "@opencode-ai/core/database/database"
-import { AppNodeBuilder } from "@opencode-ai/core/effect/app-node-builder"
-import { ProjectTable } from "@opencode-ai/core/project/sql"
-import { SessionProjector } from "@opencode-ai/core/session/projector"
-import { SessionStore } from "@opencode-ai/core/session/store"
-import { Event } from "@opencode-ai/schema/event"
-import { Project } from "@opencode-ai/schema/project"
-import { AbsolutePath } from "@opencode-ai/schema/schema"
-import { Session } from "@opencode-ai/schema/session"
-import { SessionEvent } from "@opencode-ai/schema/session-event"
-import { SessionMessage } from "@opencode-ai/schema/session-message"
-import { LayerNode } from "@opencode-ai/util/effect/layer-node"
-import { testEffect } from "./lib/effect"
-
-const it = testEffect(
-  AppNodeBuilder.build(LayerNode.group([Database.node, Bus.node, SessionProjector.node, SessionStore.node]), [
-    [Bus.node, Bus.configured({ persist: true })],
-  ]),
-)
-
-const seedSessions = (rows: { id: string; updated: number }[]) =>
-  Effect.gen(function* () {
-    const database = yield* Database.Service
-    const bus = yield* Bus.Service
-    const directory = AbsolutePath.make("/project")
-    yield* database.db.insert(ProjectTable).values({ id: Project.ID.global, worktree: directory, sandboxes: [] }).run()
-    yield* Effect.forEach(rows, (row) =>
-      Effect.gen(function* () {
-        const sessionID = Session.ID.make(row.id)
-        yield* bus.publish(SessionEvent.Created, {
-          sessionID,
-          projectID: Project.ID.global,
-          location: { directory },
-          slug: "store-test",
-          version: "test",
-        })
-        yield* bus.replay({
-          id: Event.ID.create(),
-          created: row.updated,
-          aggregateID: sessionID,
-          seq: 1,
-          type: Bus.versionedType(SessionEvent.Renamed.type, 1),
-          data: { sessionID, title: row.id },
-        })
-      }),
-    )
-    return bus
-  })
-
-describe("SessionStore", () => {
-  it.effect("lists by updated time and ID with exclusive two-item pages in either direction", () =>
-    Effect.gen(function* () {
-      yield* seedSessions([
-        { id: "ses_d", updated: 20 },
-        { id: "ses_z", updated: 10 },
-        { id: "ses_a", updated: 30 },
-        { id: "ses_c", updated: 20 },
-        { id: "ses_y", updated: 10 },
-        { id: "ses_e", updated: 30 },
-        { id: "ses_b", updated: 20 },
-      ])
-      const store = yield* SessionStore.Service
-      expect((yield* store.list()).map((session) => String(session.id))).toEqual([
-        "ses_e",
-        "ses_a",
-        "ses_d",
-        "ses_c",
-        "ses_b",
-        "ses_z",
-        "ses_y",
-      ])
-      expect((yield* store.list({ order: "asc" })).map((session) => String(session.id))).toEqual([
-        "ses_y",
-        "ses_z",
-        "ses_b",
-        "ses_c",
-        "ses_d",
-        "ses_a",
-        "ses_e",
-      ])
-      const pages: { order: "asc" | "desc"; direction: "next" | "previous"; ids: string[] }[] = [
-        { order: "asc", direction: "next", ids: ["ses_d", "ses_a"] },
-        { order: "asc", direction: "previous", ids: ["ses_z", "ses_b"] },
-        { order: "desc", direction: "next", ids: ["ses_b", "ses_z"] },
-        { order: "desc", direction: "previous", ids: ["ses_a", "ses_d"] },
-      ]
-      yield* Effect.forEach(pages, (page) =>
-        Effect.gen(function* () {
-          const sessions = yield* store.list({
-            order: page.order,
-            limit: 2,
-            anchor: { id: Session.ID.make("ses_c"), time: 20, direction: page.direction },
-          })
-          expect(sessions.map((session) => String(session.id))).toEqual(page.ids)
-        }),
-      )
-    }),
-  )
-
-  it.effect("pages messages by durable sequence, not timestamp or ID, and scopes cursor lookup", () =>
-    Effect.gen(function* () {
-      const sessionID = Session.ID.make("ses_messages")
-      const foreignID = Session.ID.make("ses_foreign")
-      const bus = yield* seedSessions([
-        { id: sessionID, updated: 0 },
-        { id: foreignID, updated: 0 },
-      ])
-      const store = yield* SessionStore.Service
-      yield* Effect.forEach(
-        [
-          { id: "evt_z", created: 300 },
-          { id: "evt_b", created: 700 },
-          { id: "evt_x", created: 100 },
-          { id: "evt_c", created: 400 },
-          { id: "evt_w", created: 200 },
-          { id: "evt_a", created: 600 },
-          { id: "evt_y", created: 500 },
-        ],
-        (event, index) =>
-          bus.replay({
-            id: Event.ID.make(event.id),
-            created: event.created,
-            aggregateID: sessionID,
-            seq: index + 2,
-            type: Bus.versionedType(SessionEvent.Synthetic.type, 1),
-            data: { sessionID, text: event.id },
-          }),
-      )
-      yield* bus.publish(
-        SessionEvent.Synthetic,
-        { sessionID: foreignID, text: "foreign" },
-        {
-          id: Event.ID.make("evt_foreign"),
-        },
-      )
-      expect((yield* store.messages({ sessionID })).map((message) => String(message.id))).toEqual([
-        "msg_y",
-        "msg_a",
-        "msg_w",
-        "msg_c",
-        "msg_x",
-        "msg_b",
-        "msg_z",
-      ])
-      expect((yield* store.messages({ sessionID, order: "asc" })).map((message) => String(message.id))).toEqual([
-        "msg_z",
-        "msg_b",
-        "msg_x",
-        "msg_c",
-        "msg_w",
-        "msg_a",
-        "msg_y",
-      ])
-      const pages: { order: "asc" | "desc"; direction: "next" | "previous"; ids: string[] }[] = [
-        { order: "asc", direction: "next", ids: ["msg_w", "msg_a"] },
-        { order: "asc", direction: "previous", ids: ["msg_b", "msg_x"] },
-        { order: "desc", direction: "next", ids: ["msg_x", "msg_b"] },
-        { order: "desc", direction: "previous", ids: ["msg_a", "msg_w"] },
-      ]
-      yield* Effect.forEach(pages, (page) =>
-        Effect.gen(function* () {
-          const messages = yield* store.messages({
-            sessionID,
-            order: page.order,
-            limit: 2,
-            cursor: { id: SessionMessage.ID.make("msg_c"), direction: page.direction },
-          })
-          expect(messages.map((message) => String(message.id))).toEqual(page.ids)
-        }),
-      )
-      expect(yield* store.messages({ sessionID: Session.ID.make("ses_missing") })).toEqual([])
-      expect(
-        yield* store.messages({
-          sessionID,
-          cursor: { id: SessionMessage.ID.make("msg_missing"), direction: "next" },
-        }),
-      ).toEqual([])
-      expect(
-        yield* store.messages({
-          sessionID,
-          order: "asc",
-          cursor: { id: SessionMessage.ID.make("msg_foreign"), direction: "next" },
-        }),
-      ).toEqual([])
-    }),
-  )
-})

packages/core/test/shared-schema.test.ts

@@ -2,7 +2,6 @@ import { expect, test } from "bun:test"
 import { Schema } from "effect"
 import { Agent } from "@opencode-ai/core/agent"
 import { Session } from "@opencode-ai/core/session"
-import { SessionStore } from "@opencode-ai/core/session/store"
 import { Location } from "@opencode-ai/schema/location"
 import { Model } from "@opencode-ai/schema/model"
 import { Provider } from "@opencode-ai/schema/provider"
@@ -127,7 +126,6 @@ test("Core reuses the canonical shared schemas", async () => {
     [Session.ID, schemaSession.Session.ID],
     [Session.Info, schemaSession.Session.Info],
     [Session.ListAnchor, schemaSession.Session.ListAnchor],
-    [Session.ListInput, SessionStore.ListInput],
     [coreSessionInbox.Delivery, SessionInbox.Delivery],
     [coreSessionInbox.Item, SessionInbox.Item],
     [coreSessionInbox.User, SessionInbox.User],

packages/core/test/tool-webfetch.test.ts

@@ -128,6 +128,15 @@ describe("WebFetchTool helpers", () => {
     expect(output).toHaveLength(WebFetchTool.MAX_RESPONSE_BYTES - 64 * 1024)
   })
 
+  test.each(["x", "\u00e9", "\u{1f600}"])("preserves UTF-8 boundaries at the content limit for %s", (character) => {
+    const budget = WebFetchTool.MAX_RESPONSE_BYTES - 64 * 1024
+    const fitting = "aa" + character.repeat(Math.floor((budget - 2) / Buffer.byteLength(character)))
+    expect(WebFetchTool.convertHTMLToMarkdown(fitting)).toBe(fitting)
+    const truncated = WebFetchTool.convertHTMLToMarkdown(fitting + character)
+    expect(truncated).toBe(fitting)
+    expect(Buffer.byteLength(truncated)).toBe(Buffer.byteLength(fitting))
+  })
+
   test("bounds deeply nested list output and fragmented code fences", () => {
     const lists = `${"<ul><li>item".repeat(2_000)}${"</li></ul>".repeat(2_000)}`
     const quotes = `${"<blockquote><p>item".repeat(2_000)}${"</p></blockquote>".repeat(2_000)}`

packages/session-ui/component-tests/tool-header.spec.ts

@@ -1,126 +0,0 @@
-import { expect, story } from "../../storybook/playwright/story"
-
-const id = "current-session-tool-headers--shared-headers"
-
-story("shares compact title and detail metrics across tool families", async ({ mount }, info) => {
-  const root = await mount(id)
-  await root.getByRole("button", { name: /^Used 7 / }).click()
-  const headers = root.locator('[data-component="context-tool-group-list"] [data-component="tool-header"]')
-  await expect(headers).toHaveCount(7)
-  const titles = headers.locator('[data-slot="basic-tool-tool-title"]')
-  await expect(headers.locator('[data-component="text-shimmer"][aria-label="Write"]')).toBeVisible()
-  await expect(headers.locator('[data-component="text-shimmer"][aria-label="Edit"]')).toBeVisible()
-  for (const title of await titles.all()) {
-    await expect(title).toBeVisible()
-    await expect(title).toHaveCSS("font-family", /^Inter,/)
-    await expect(title).toHaveCSS("font-size", "13px")
-    await expect(title).toHaveCSS("line-height", "16px")
-    await expect(title).toHaveCSS("font-weight", "530")
-    await expect(title.locator('[data-component="text-shimmer"]')).toHaveAttribute("data-active", "false")
-  }
-  const details = headers.locator(
-    '[data-slot="basic-tool-tool-subtitle"], [data-slot="basic-tool-tool-arg"], [data-slot="tool-header-directory"]',
-  )
-  expect(await details.count()).toBeGreaterThan(7)
-  for (const detail of await details.all()) {
-    await expect(detail).toHaveCSS("font-size", "13px")
-    await expect(detail).toHaveCSS("line-height", "16px")
-    await expect(detail).toHaveCSS("font-weight", "440")
-  }
-  await expect(headers.locator('[data-slot="basic-tool-tool-arg"]')).toHaveText([
-    "offset=12",
-    "limit=40",
-    "pattern=header",
-    "include=*.tsx",
-  ])
-  await root.locator('[data-component="session-timeline"]').screenshot({ path: info.outputPath("tool-headers.png") })
-})
-
-story("keeps pending file titles active without showing unfinished paths", async ({ mount }) => {
-  const root = await mount(id, { args: { phase: "streaming", pathKnown: false } })
-  await root
-    .locator(
-      '[data-component="collapsed-tool-group"] > [data-component="collapsible"] > [data-slot="collapsible-trigger"]',
-    )
-    .click()
-  for (const action of [undefined, "Provide paths", "Run tools"]) {
-    if (action) await root.getByRole("button", { name: action, exact: true }).click()
-    for (const name of ["edit", "write"]) {
-      const header = root.locator(`[data-timeline-part-id="tool_header_${name}"] [data-component="tool-header"]`)
-      await expect(header).toBeVisible()
-      await expect(header.locator('[data-component="text-shimmer"]')).toHaveAttribute("data-active", "true")
-      await expect(header.locator('[data-slot="basic-tool-tool-title"]')).toHaveCSS("line-height", "16px")
-      await expect(
-        header.locator('[data-slot="basic-tool-tool-subtitle"], [data-slot="tool-header-directory"]'),
-      ).toHaveCount(0)
-    }
-  }
-  await root.getByRole("button", { name: "Complete tools", exact: true }).click()
-  const group = root.getByRole("button", { name: /^Used 7 / })
-  if ((await group.getAttribute("aria-expanded")) === "false") await group.click()
-  for (const name of ["edit", "write"]) {
-    const header = root.locator(`[data-timeline-part-id="tool_header_${name}"] [data-component="tool-header"]`)
-    await expect(header.locator('[data-slot="basic-tool-tool-subtitle"]')).toHaveText(`${name}.ts`)
-    await expect(header.locator('[data-slot="tool-header-directory"]')).toContainText("src/components")
-    await expect(header.locator('[data-component="text-shimmer"]')).toHaveAttribute("data-active", "false")
-  }
-})
-
-for (const theme of ["light", "dark"]) {
-  for (const width of [390, 1000]) {
-    story(`truncates long file headers at ${width}px in ${theme}`, async ({ mount, page }, info) => {
-      await page.setViewportSize({ width, height: 850 })
-      const root = await mount(id, { args: { longPath: true }, globals: { theme } })
-      await root.getByRole("button", { name: /^Used 7 / }).click()
-      for (const name of ["edit", "write"]) {
-        const header = root.locator(`[data-timeline-part-id="tool_header_${name}"] [data-component="tool-header"]`)
-        const filename = header.locator('[data-slot="basic-tool-tool-subtitle"]')
-        const directory = header.locator('[data-slot="tool-header-directory"] > span')
-        await expect(filename).toContainText(`${name}.ts`)
-        for (const text of [filename, directory]) {
-          await expect(text).toHaveCSS("text-overflow", "ellipsis")
-          await expect(text).toHaveCSS("white-space", "nowrap")
-          await expect(text).toHaveCSS("line-height", "16px")
-        }
-        expect(await filename.evaluate((node) => node.scrollWidth > node.clientWidth)).toBe(true)
-        const bounds = await header.boundingBox()
-        expect(bounds!.x + bounds!.width).toBeLessThanOrEqual(width)
-      }
-      expect(await page.evaluate(() => document.documentElement.scrollWidth <= window.innerWidth)).toBe(true)
-      await root
-        .locator('[data-component="session-timeline"]')
-        .screenshot({ path: info.outputPath("long-headers.png") })
-    })
-  }
-}
-
-story("preserves keyboard disclosures and the webfetch link", async ({ mount }) => {
-  const root = await mount(id)
-  await root.getByRole("button", { name: /^Used 7 / }).click()
-  for (const name of ["shell", "execute", "edit", "write"]) {
-    const row = root.locator(`[data-timeline-part-id="tool_header_${name}"]`)
-    const trigger = row.locator('[data-slot="collapsible-trigger"]').first()
-    const content = row.locator('[data-slot="collapsible-content"]').first()
-    await expect(trigger).toHaveAttribute("aria-expanded", "false")
-    await trigger.focus()
-    await trigger.press("Enter")
-    await expect(trigger).toHaveAttribute("aria-expanded", "true")
-    await expect(content).toBeVisible()
-    await expect(trigger).toBeFocused()
-    await trigger.press("Space")
-    await expect(trigger).toHaveAttribute("aria-expanded", "false")
-    await expect(content).toBeHidden()
-    await expect(trigger).toBeFocused()
-  }
-  const link = root.getByRole("link", { name: "https://example.com/docs" })
-  await expect(link).toBeVisible()
-  await expect(link).toHaveAttribute("href", "https://example.com/docs")
-  await expect(link).toHaveAttribute("target", "_blank")
-  await expect(link).toHaveAttribute("rel", /noopener/)
-  await expect(link).toHaveCSS("font-size", "13px")
-  await expect(link).toHaveCSS("font-weight", "440")
-  await expect(link).toHaveCSS("line-height", "16px")
-  await expect(link).toHaveCSS("letter-spacing", "-0.04px")
-  await link.focus()
-  await expect(link).toBeFocused()
-})

packages/session-ui/src/components/basic-tool.css

@@ -83,11 +83,22 @@
 
   [data-slot="basic-tool-tool-title"] {
     flex-shrink: 0;
+    font-family: var(--font-family-sans);
+    font-size: 14px;
+    font-style: normal;
+    font-weight: var(--font-weight-medium);
+    line-height: var(--line-height-large);
+    letter-spacing: var(--letter-spacing-normal);
     color: var(--v2-text-text-base);
 
     &.capitalize {
       text-transform: capitalize;
     }
+
+    &.agent-title {
+      color: var(--v2-text-text-base);
+      font-weight: var(--font-weight-medium);
+    }
   }
 
   [data-slot="basic-tool-tool-subtitle"] {
@@ -96,6 +107,13 @@
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
+    font-family: var(--font-family-sans);
+    font-variant-numeric: tabular-nums;
+    font-size: 14px;
+    font-style: normal;
+    font-weight: var(--font-weight-regular);
+    line-height: var(--line-height-large);
+    letter-spacing: var(--letter-spacing-normal);
     color: var(--v2-text-text-muted);
 
     &.clickable:not(.webfetch-link) {
@@ -135,6 +153,13 @@
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
+    font-family: var(--font-family-sans);
+    font-variant-numeric: tabular-nums;
+    font-size: 14px;
+    font-style: normal;
+    font-weight: var(--font-weight-regular);
+    line-height: var(--line-height-large);
+    letter-spacing: var(--letter-spacing-normal);
     color: var(--v2-text-text-muted);
   }
 
@@ -152,6 +177,23 @@
   [data-slot="basic-tool-tool-info-main"] {
     gap: 6px;
   }
+
+  [data-slot="basic-tool-tool-title"] {
+    font-family: var(--v2-font-family-sans);
+    font-size: 13px;
+    font-weight: 530;
+    /* Keep compact text on the shared metric; solid 13px line boxes clip Inter descenders. */
+    line-height: var(--line-height-compact);
+    letter-spacing: -0.04px;
+  }
+
+  [data-slot="basic-tool-tool-subtitle"] {
+    font-family: var(--v2-font-family-sans);
+    font-size: 13px;
+    font-weight: 440;
+    line-height: var(--line-height-compact);
+    letter-spacing: -0.04px;
+  }
 }
 
 [data-component="task-tool-card"] {

packages/session-ui/src/components/basic-tool.tsx

@@ -1,6 +1,7 @@
 import {
   createEffect,
   createMemo,
+  For,
   Match,
   on,
   onCleanup,
@@ -15,9 +16,17 @@ import { useI18n } from "@opencode-ai/ui/context/i18n"
 import { createStore } from "solid-js/store"
 import { Collapsible } from "@opencode-ai/ui/collapsible"
 import type { IconProps } from "@opencode-ai/ui/icon"
-import { ToolHeader, type ToolHeaderProps } from "./tool-header"
+import { TextShimmer } from "@opencode-ai/ui/text-shimmer"
 
-export type TriggerTitle = Omit<ToolHeaderProps, "active" | "onSubtitleClick">
+export type TriggerTitle = {
+  title: string
+  titleClass?: string
+  subtitle?: string
+  subtitleClass?: string
+  args?: string[]
+  argsClass?: string
+  action?: JSX.Element
+}
 
 const isTriggerTitle = (val: unknown): val is TriggerTitle => {
   if (typeof val !== "object" || val === null) return false
@@ -207,12 +216,54 @@ export function BasicTool(props: BasicToolProps) {
           <Switch>
             <Match when={triggerTitle()}>
               {(title) => (
-                <ToolHeader
-                  {...title()}
-                  active={pending()}
-                  onSubtitleClick={props.onSubtitleClick}
-                  action={!pending() ? title().action : undefined}
-                />
+                <div data-slot="basic-tool-tool-info-structured">
+                  <div data-slot="basic-tool-tool-info-main">
+                    <span
+                      data-slot="basic-tool-tool-title"
+                      classList={{
+                        [title().titleClass ?? ""]: !!title().titleClass,
+                      }}
+                    >
+                      <TextShimmer text={title().title} active={pending()} />
+                    </span>
+                    <Show when={!pending() || title().subtitle || title().args?.length}>
+                      <Show when={title().subtitle}>
+                        <span
+                          data-slot="basic-tool-tool-subtitle"
+                          classList={{
+                            [title().subtitleClass ?? ""]: !!title().subtitleClass,
+                            clickable: !!props.onSubtitleClick,
+                          }}
+                          onClick={(e) => {
+                            if (props.onSubtitleClick) {
+                              e.stopPropagation()
+                              props.onSubtitleClick()
+                            }
+                          }}
+                        >
+                          {title().subtitle}
+                        </span>
+                      </Show>
+                      <Show when={title().args?.length}>
+                        <For each={title().args}>
+                          {(arg) => (
+                            <span
+                              data-slot="basic-tool-tool-arg"
+                              classList={{
+                                [title().argsClass ?? ""]: !!title().argsClass,
+                              }}
+                            >
+                              {arg}
+                            </span>
+                          )}
+                        </For>
+                      </Show>
+                    </Show>
+                  </div>
+                  <Show when={!pending() && title().action}>
+                    <span data-slot="basic-tool-tool-action">{title().action}</span>
+                  </Show>
+                </div>
               )}
             </Match>
             <Match when={true}>{triggerContent() as JSX.Element}</Match>

packages/session-ui/src/components/message-part.css

@@ -446,6 +446,102 @@
   --tool-content-gap: 6px;
 }
 
+[data-component="edit-trigger"],
+[data-component="write-trigger"] {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 12px;
+  width: 100%;
+
+  [data-slot="message-part-title-area"] {
+    flex-grow: 1;
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    min-width: 0;
+  }
+
+  [data-slot="message-part-title"] {
+    flex: 1 1 auto;
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    min-width: 0;
+    font-family: var(--font-family-sans);
+    font-size: 14px;
+    font-style: normal;
+    font-weight: var(--font-weight-medium);
+    line-height: var(--line-height-large);
+    letter-spacing: var(--letter-spacing-normal);
+    color: var(--v2-text-text-muted);
+  }
+
+  [data-slot="message-part-title-spinner"] {
+    margin-left: 4px;
+    width: 16px;
+    height: 16px;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    flex-shrink: 0;
+    color: var(--v2-text-text-muted);
+
+    [data-component="spinner"] {
+      width: 16px;
+      height: 16px;
+    }
+  }
+
+  [data-slot="message-part-title-text"] {
+    flex-shrink: 0;
+    text-transform: capitalize;
+    color: var(--v2-text-text-base);
+  }
+
+  [data-slot="message-part-title-filename"] {
+    /* No text-transform - preserve original filename casing */
+    min-width: 0;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    font-weight: var(--font-weight-regular);
+    direction: ltr;
+    unicode-bidi: isolate;
+  }
+
+  [data-slot="message-part-path"] {
+    display: flex;
+    flex-grow: 1;
+    min-width: 0;
+    font-weight: var(--font-weight-regular);
+    direction: ltr;
+    unicode-bidi: isolate;
+  }
+
+  [data-slot="message-part-directory"] {
+    color: var(--v2-text-text-muted);
+    text-overflow: ellipsis;
+    overflow: hidden;
+    white-space: nowrap;
+    direction: rtl;
+    text-align: left;
+  }
+
+  [data-slot="message-part-filename"] {
+    color: var(--v2-text-text-base);
+    flex-shrink: 0;
+  }
+
+  [data-slot="message-part-actions"] {
+    display: flex;
+    gap: 16px;
+    align-items: center;
+    justify-content: flex-end;
+    flex-shrink: 0;
+  }
+}
+
 [data-component="edit-content"] {
   border-radius: inherit;
   border-top: 0.5px solid var(--v2-border-border-muted);
@@ -582,6 +678,24 @@
   gap: 0px;
   cursor: default;
 
+  [data-slot="context-tool-group-title"] {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    flex-shrink: 1;
+    min-width: 0;
+  }
+
+  [data-slot="context-tool-group-prefix"] {
+    flex-shrink: 0;
+    color: var(--v2-text-text-muted);
+    font-family: var(--v2-font-family-sans);
+    font-size: 13px;
+    font-weight: 440;
+    line-height: var(--line-height-compact);
+    letter-spacing: -0.04px;
+  }
+
   [data-slot="basic-tool-tool-title"] {
     overflow: hidden;
     text-overflow: ellipsis;
@@ -626,6 +740,17 @@
       gap: 6px;
     }
 
+    [data-slot="basic-tool-tool-title"],
+    [data-slot="basic-tool-tool-subtitle"],
+    [data-slot="basic-tool-tool-arg"],
+    [data-slot="context-tool-group-matches"] {
+      font-family: var(--v2-font-family-sans);
+      font-size: 13px;
+      font-weight: 440;
+      line-height: var(--line-height-compact);
+      letter-spacing: -0.04px;
+    }
+
     [data-slot="basic-tool-tool-subtitle"] {
       color: var(--v2-text-text-faint);
     }

packages/session-ui/src/components/tool-header.css

@@ -1,87 +0,0 @@
-[data-component="tool-header"] {
-  font-family: var(--v2-font-family-sans);
-  font-size: 13px;
-  font-style: normal;
-  font-weight: 440;
-  /* Truncated text still needs room for Inter descenders. */
-  line-height: var(--line-height-compact);
-  letter-spacing: -0.04px;
-  color: var(--v2-text-text-muted);
-
-  &[data-slot="basic-tool-tool-info-structured"] {
-    display: inline-flex;
-    align-items: center;
-    gap: 6px;
-    min-width: 0;
-    max-width: 100%;
-  }
-
-  [data-slot="basic-tool-tool-info-main"] {
-    display: flex;
-    align-items: baseline;
-    gap: 6px;
-    min-width: 0;
-    overflow: hidden;
-  }
-
-  [data-slot="basic-tool-tool-title"] {
-    flex-shrink: 0;
-    font: inherit;
-    font-weight: 530;
-    color: var(--v2-text-text-base);
-
-    &.capitalize {
-      text-transform: capitalize;
-    }
-  }
-
-  [data-slot="tool-header-affix"] {
-    flex-shrink: 0;
-  }
-
-  [data-slot="basic-tool-tool-subtitle"],
-  [data-slot="basic-tool-tool-arg"] {
-    flex-shrink: 1;
-    min-width: 0;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    font: inherit;
-    font-variant-numeric: tabular-nums;
-
-    &[dir] {
-      unicode-bidi: isolate;
-    }
-
-    &.clickable {
-      cursor: pointer;
-      text-decoration: underline;
-    }
-  }
-
-  [data-slot="tool-header-directory"] {
-    display: flex;
-    min-width: 0;
-    unicode-bidi: isolate;
-
-    > span {
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-      direction: rtl;
-      text-align: left;
-    }
-  }
-
-  [data-slot="basic-tool-tool-action"] {
-    display: inline-flex;
-    align-items: center;
-    gap: 6px;
-    flex-shrink: 0;
-  }
-
-  .webfetch-link {
-    font: inherit;
-    letter-spacing: inherit;
-  }
-}

packages/session-ui/src/components/tool-header.tsx

@@ -1,73 +0,0 @@
-import { children, For, Show, type JSX } from "solid-js"
-import { TextShimmer } from "@opencode-ai/ui/text-shimmer"
-
-export type ToolHeaderProps = {
-  title: string
-  active?: boolean
-  titleClass?: string
-  prefix?: string
-  suffix?: string
-  subtitle?: JSX.Element
-  subtitleClass?: string
-  subtitleDir?: "ltr" | "rtl"
-  directory?: string
-  args?: string[]
-  argsClass?: string
-  action?: JSX.Element
-  onSubtitleClick?: () => void
-}
-
-/** Shared presentation for tool rows; callers own values, status, and disclosure. */
-export function ToolHeader(props: ToolHeaderProps) {
-  const subtitle = children(() => props.subtitle)
-  const action = children(() => props.action)
-  return (
-    <div data-component="tool-header" data-slot="basic-tool-tool-info-structured">
-      <div data-slot="basic-tool-tool-info-main">
-        <Show when={props.prefix}>
-          <span data-slot="tool-header-affix">{props.prefix}</span>
-        </Show>
-        <span data-slot="basic-tool-tool-title" class={props.titleClass}>
-          <Show when={props.active !== undefined} fallback={props.title}>
-            <TextShimmer text={props.title} active={props.active} />
-          </Show>
-        </span>
-        <Show when={props.suffix}>
-          <span data-slot="tool-header-affix">{props.suffix}</span>
-        </Show>
-        <Show when={subtitle()}>
-          <span
-            data-slot="basic-tool-tool-subtitle"
-            dir={props.subtitleDir}
-            classList={{
-              [props.subtitleClass ?? ""]: !!props.subtitleClass,
-              clickable: !!props.onSubtitleClick,
-            }}
-            onClick={(event) => {
-              if (!props.onSubtitleClick) return
-              event.stopPropagation()
-              props.onSubtitleClick()
-            }}
-          >
-            {subtitle()}
-          </span>
-        </Show>
-        <For each={props.args}>
-          {(arg) => (
-            <span data-slot="basic-tool-tool-arg" class={props.argsClass}>
-              {arg}
-            </span>
-          )}
-        </For>
-      </div>
-      <Show when={props.directory}>
-        <span data-slot="tool-header-directory" dir="ltr">
-          <span>{props.directory}</span>
-        </span>
-      </Show>
-      <Show when={action()}>
-        <span data-slot="basic-tool-tool-action">{action()}</span>
-      </Show>
-    </div>
-  )
-}

packages/session-ui/src/message/message-content.tsx

@@ -14,6 +14,7 @@ import { IconButton } from "@opencode-ai/ui/icon-button"
 import { Icon } from "@opencode-ai/ui/icon"
 import { Button } from "@opencode-ai/ui/button"
 import { TextReveal } from "@opencode-ai/ui/text-reveal"
+import { TextShimmer } from "@opencode-ai/ui/text-shimmer"
 import { BasicTool } from "../components/basic-tool"
 import { reasoningHeading } from "../timeline/projection"
 import { Card } from "@opencode-ai/ui/card"
@@ -533,14 +534,30 @@ export function AssistantReasoningContent(props: {
           props.onOpenChange?.(value)
           props.onContentRendered?.()
         }}
-        trigger={{
-          title: i18n.t(props.streaming ? "ui.sessionTurn.status.thinking" : "ui.message.thought"),
-          subtitle: (
-            <Show when={props.streaming && !open()} fallback={!props.streaming ? duration() : undefined}>
-              <TextReveal text={heading()} />
-            </Show>
-          ),
-        }}
+        trigger={
+          <div data-slot="basic-tool-tool-info-structured">
+            <div data-slot="basic-tool-tool-info-main">
+              <span data-slot="basic-tool-tool-title">
+                <TextShimmer
+                  text={i18n.t(props.streaming ? "ui.sessionTurn.status.thinking" : "ui.message.thought")}
+                  active={props.streaming}
+                />
+              </span>
+              <Show
+                when={props.streaming && !open()}
+                fallback={
+                  <Show when={!props.streaming && duration()}>
+                    {(value) => <span data-slot="basic-tool-tool-subtitle">{value()}</span>}
+                  </Show>
+                }
+              >
+                <span data-slot="basic-tool-tool-subtitle">
+                  <TextReveal text={heading()} />
+                </span>
+              </Show>
+            </div>
+          </div>
+        }
       >
         <PacedMarkdown text={props.content.text} cacheKey={props.id} streaming={props.streaming} />
       </BasicTool>

packages/session-ui/src/styles/index.css

@@ -1,7 +1,6 @@
 @layer theme, base, components, utilities;
 
 @import "../components/basic-tool.css" layer(components);
-@import "../components/tool-header.css" layer(components);
 @import "../components/file.css" layer(components);
 @import "../components/markdown.css" layer(components);
 @import "../components/message-part.css" layer(components);

packages/session-ui/src/timeline/tool-headers.stories.tsx

@@ -1,84 +0,0 @@
-import { createMemo, createSignal } from "solid-js"
-import { CurrentSessionProviders } from "../storybook/current-session-story"
-import { storyDocument, storyTool } from "../storybook/current-session-scenarios"
-import { SessionTimeline } from "./session-timeline"
-
-export default {
-  title: "OpenCode/Work/Tool headers",
-  id: "current-session-tool-headers",
-  component: SessionTimeline,
-  parameters: { layout: "fullscreen" },
-}
-
-export const SharedHeaders = {
-  args: { phase: "completed", pathKnown: true, longPath: false },
-  argTypes: { phase: { control: "select", options: ["streaming", "running", "completed"] } },
-  render: (args: { phase: "streaming" | "running" | "completed"; pathKnown: boolean; longPath: boolean }) => {
-    const [phase, setPhase] = createSignal(args.phase)
-    const [known, setKnown] = createSignal(args.pathKnown)
-    const path = (name: string) =>
-      args.longPath
-        ? `src/components/session/timeline/tools/deeply/nested/directory/with/a/long/path/${"long-filename-".repeat(8)}${name}.ts`
-        : `src/components/${name}.ts`
-    const document = createMemo(() =>
-      storyDocument(
-        [
-          storyTool("tool_header_read", "read", phase(), { path: path("read"), offset: 12, limit: 40 }),
-          storyTool(
-            "tool_header_grep",
-            "grep",
-            phase(),
-            { path: "src/components", pattern: "header", include: "*.tsx" },
-            { metadata: { matches: 3 } },
-          ),
-          storyTool("tool_header_shell", "shell", phase(), { command: "printf checked" }, { output: "checked" }),
-          storyTool(
-            "tool_header_execute",
-            "execute",
-            phase(),
-            { code: 'console.log("checked")' },
-            { output: "checked" },
-          ),
-          storyTool("tool_header_webfetch", "webfetch", phase(), { url: "https://example.com/docs" }),
-          storyTool("tool_header_edit", "edit", phase(), {
-            ...(known() ? { path: path("edit") } : {}),
-            oldString: "export const before = true\n",
-            newString: "export const after = true\n",
-          }),
-          storyTool("tool_header_write", "write", phase(), {
-            ...(known() ? { path: path("write") } : {}),
-            content: "export const written = true\n",
-          }),
-        ],
-        phase() !== "completed",
-      ),
-    )
-    return (
-      <section class="mx-auto flex w-full max-w-[840px] flex-col gap-4 p-6">
-        <div class="flex flex-wrap gap-3">
-          <button type="button" onClick={() => setKnown(true)}>
-            Provide paths
-          </button>
-          <button type="button" onClick={() => setPhase("running")}>
-            Run tools
-          </button>
-          <button type="button" onClick={() => setPhase("completed")}>
-            Complete tools
-          </button>
-          <button
-            type="button"
-            onClick={() => {
-              setPhase(args.phase)
-              setKnown(args.pathKnown)
-            }}
-          >
-            Reset
-          </button>
-        </div>
-        <CurrentSessionProviders document={document()}>
-          <SessionTimeline document={document()} />
-        </CurrentSessionProviders>
-      </section>
-    )
-  },
-}

packages/session-ui/src/tools/tool-renderer.tsx

@@ -19,7 +19,6 @@ import { type SessionSummary, useData } from "../context"
 import { useFileComponent } from "@opencode-ai/ui/context/file"
 import { type UiI18n, useI18n } from "@opencode-ai/ui/context/i18n"
 import { BasicTool, GenericTool } from "../components/basic-tool"
-import { ToolHeader } from "../components/tool-header"
 import { Accordion } from "@opencode-ai/ui/accordion"
 import { StickyAccordionHeader } from "@opencode-ai/ui/sticky-accordion-header"
 import { Collapsible } from "@opencode-ai/ui/collapsible"
@@ -561,7 +560,15 @@ export function CurrentContextToolGroup(props: {
         onOpenChange={change}
         trigger={
           <div data-component="context-tool-group-trigger" aria-label={label().text}>
-            <ToolHeader title={label().title} prefix={label().before} suffix={label().after} />
+            <span data-slot="context-tool-group-title">
+              <Show when={label().before}>
+                {(before) => <span data-slot="context-tool-group-prefix">{before()}</span>}
+              </Show>
+              <span data-slot="basic-tool-tool-title">{label().title}</span>
+              <Show when={label().after}>
+                {(after) => <span data-slot="context-tool-group-prefix">{after()}</span>}
+              </Show>
+            </span>
           </div>
         }
       >
@@ -682,22 +689,32 @@ export function CurrentContextToolGroup(props: {
                           <div data-component="tool-trigger">
                             <div data-slot="basic-tool-tool-trigger-content">
                               <div data-slot="basic-tool-tool-info">
-                                <ToolHeader
-                                  title={trigger().title}
-                                  subtitle={trigger().subtitle}
-                                  args={trigger().args}
-                                  active={tool().state.status === "streaming" || tool().state.status === "running"}
-                                  action={
-                                    <Show when={trigger().matches}>
-                                      {(matches) => (
-                                        <>
-                                          <span data-slot="context-tool-group-dot" />
-                                          <span data-slot="context-tool-group-matches">{matches()}</span>
-                                        </>
-                                      )}
+                                <div data-slot="basic-tool-tool-info-structured">
+                                  <div data-slot="basic-tool-tool-info-main">
+                                    <span data-slot="basic-tool-tool-title">
+                                      <TextShimmer
+                                        text={trigger().title}
+                                        active={
+                                          tool().state.status === "streaming" || tool().state.status === "running"
+                                        }
+                                      />
+                                    </span>
+                                    <Show when={trigger().subtitle}>
+                                      {(subtitle) => <span data-slot="basic-tool-tool-subtitle">{subtitle()}</span>}
                                     </Show>
-                                  }
-                                />
+                                    <For each={trigger().args}>
+                                      {(arg) => <span data-slot="basic-tool-tool-arg">{arg}</span>}
+                                    </For>
+                                  </div>
+                                  <Show when={trigger().matches}>
+                                    {(matches) => (
+                                      <>
+                                        <span data-slot="context-tool-group-dot" />
+                                        <span data-slot="context-tool-group-matches">{matches()}</span>
+                                      </>
+                                    )}
+                                  </Show>
+                                </div>
                               </div>
                             </div>
                           </div>
@@ -1192,23 +1209,28 @@ ToolRegistry.register({
         {...props}
         hideDetails
         icon="window-cursor"
-        trigger={{
-          title: i18n.t("ui.tool.webfetch"),
-          subtitle: (
-            <Show when={!pending() && url()}>
-              <a
-                class="webfetch-link"
-                href={url()}
-                target="_blank"
-                rel="noopener noreferrer"
-                onClick={(event) => event.stopPropagation()}
-              >
-                <span data-slot="webfetch-link-text">{url()}</span>
-                <Icon name="outline-square-arrow" class="webfetch-link-icon" />
-              </a>
-            </Show>
-          ),
-        }}
+        trigger={
+          <div data-slot="basic-tool-tool-info-structured">
+            <div data-slot="basic-tool-tool-info-main">
+              <span data-slot="basic-tool-tool-title">
+                <TextShimmer text={i18n.t("ui.tool.webfetch")} active={pending()} />
+              </span>
+              <Show when={!pending() && url()}>
+                <a
+                  data-slot="basic-tool-tool-subtitle"
+                  class="webfetch-link"
+                  href={url()}
+                  target="_blank"
+                  rel="noopener noreferrer"
+                  onClick={(event) => event.stopPropagation()}
+                >
+                  <span data-slot="webfetch-link-text">{url()}</span>
+                  <Icon name="outline-square-arrow" class="webfetch-link-icon" />
+                </a>
+              </Show>
+            </div>
+          </div>
+        }
       />
     )
   },
@@ -1421,15 +1443,16 @@ ToolRegistry.register({
         compact
         allowOpenWhilePending
         trigger={(open) => (
-          <ToolHeader
-            title={i18n.t("ui.tool.execute")}
-            active={pending()}
-            subtitle={
+          <div data-slot="basic-tool-tool-info-structured">
+            <div data-slot="basic-tool-tool-info-main">
+              <span data-slot="basic-tool-tool-title">
+                <TextShimmer text={i18n.t("ui.tool.execute")} active={pending()} />
+              </span>
               <Show when={!open() && code()}>
                 <ShellSubmessage text={code().split("\n")[0]} animate={sawPending} />
               </Show>
-            }
-          />
+            </div>
+          </div>
         )}
       >
         <ConsoleOutput copy={code()} variant="shell">
@@ -1509,20 +1532,25 @@ ToolRegistry.register({
         compact
         allowOpenWhilePending
         trigger={(open) => (
-          <ToolHeader
-            title={i18n.t("ui.tool.shell")}
-            active={pending()}
-            subtitle={
+          <div data-slot="basic-tool-tool-info-structured">
+            <div data-slot="basic-tool-tool-info-main">
+              <span data-slot="basic-tool-tool-title">
+                <TextShimmer text={i18n.t("ui.tool.shell")} active={pending()} />
+              </span>
               <Show when={!open()}>
                 <Show
                   when={command()}
-                  fallback={<Show when={streaming()}>{i18n.t("ui.tool.shell.writingCommand")}</Show>}
+                  fallback={
+                    <Show when={streaming()}>
+                      <span data-slot="basic-tool-tool-subtitle">{i18n.t("ui.tool.shell.writingCommand")}</span>
+                    </Show>
+                  }
                 >
                   {(command) => <ShellSubmessage text={command()} animate={sawStreaming} />}
                 </Show>
               </Show>
-            }
-          />
+            </div>
+          </div>
         )}
       >
         <ConsoleOutput copy={command()} variant="shell">
@@ -1635,13 +1663,30 @@ ToolRegistry.register({
           icon="code-lines"
           rail={false}
           defer={props.deferContent !== false}
-          trigger={{
-            title: i18n.t("ui.messagePart.title.edit"),
-            subtitle: !pending() ? filename() : undefined,
-            subtitleDir: "ltr",
-            directory: !pending() && inputPath().includes("/") ? displayDirectory(inputPath()) : undefined,
-            action: <Show when={diff()}>{(diff) => <DiffChanges appearance="standard" changes={diff()} />}</Show>,
-          }}
+          trigger={
+            <div data-component="edit-trigger">
+              <div data-slot="message-part-title-area">
+                <div data-slot="message-part-title">
+                  <span data-slot="message-part-title-text">
+                    <TextShimmer text={i18n.t("ui.messagePart.title.edit")} active={pending()} />
+                  </span>
+                  <Show when={!pending()}>
+                    <span data-slot="message-part-title-filename">{filename()}</span>
+                  </Show>
+                </div>
+                <Show when={!pending() && inputPath().includes("/")}>
+                  <div data-slot="message-part-path">
+                    <span data-slot="message-part-directory">{displayDirectory(inputPath())}</span>
+                  </div>
+                </Show>
+              </div>
+              <div data-slot="message-part-actions">
+                <Show when={!pending() ? diff() : undefined}>
+                  {(diff) => <DiffChanges appearance="standard" changes={diff()} />}
+                </Show>
+              </div>
+            </div>
+          }
         >
           <Show when={path()}>
             <ToolFileAccordion
@@ -1687,12 +1732,26 @@ ToolRegistry.register({
           icon="code-lines"
           rail={false}
           defer={props.deferContent !== false}
-          trigger={{
-            title: i18n.t("ui.messagePart.title.write"),
-            subtitle: !pending() ? filename() : undefined,
-            subtitleDir: "ltr",
-            directory: !pending() && path().includes("/") ? displayDirectory(path()) : undefined,
-          }}
+          trigger={
+            <div data-component="write-trigger">
+              <div data-slot="message-part-title-area">
+                <div data-slot="message-part-title">
+                  <span data-slot="message-part-title-text">
+                    <TextShimmer text={i18n.t("ui.messagePart.title.write")} active={pending()} />
+                  </span>
+                  <Show when={!pending()}>
+                    <span data-slot="message-part-title-filename">{filename()}</span>
+                  </Show>
+                </div>
+                <Show when={!pending() && path().includes("/")}>
+                  <div data-slot="message-part-path">
+                    <span data-slot="message-part-directory">{displayDirectory(path())}</span>
+                  </div>
+                </Show>
+              </div>
+              <div data-slot="message-part-actions">{/* <DiffChanges diff={diff} /> */}</div>
+            </div>
+          }
         >
           <Show when={content() && path()}>
             <ToolFileAccordion path={path()}>

packages/tui/test/cli/tui/diff-viewer.test.tsx

@@ -1,14 +1,11 @@
 /** @jsxImportSource @opentui/solid */
 import { afterAll, expect, test } from "bun:test"
-import { once } from "node:events"
 import { readdir } from "node:fs/promises"
 import path from "node:path"
 import {
   BoxRenderable,
-  CliRenderEvents,
   DiffRenderable,
   ImageRenderable,
-  InputRenderable,
   MouseButton,
   type Renderable,
   ScrollBoxRenderable,
@@ -318,9 +315,6 @@ test.each(["branch", "committed", "working"] as const)(
       expect(viewer.app.captureCharFrame()).toMatch(/●\s+v2/)
       expect(viewer.branchesRequests[0].searchParams.get("location[directory]")).toBe("/repo/session")
       expect(viewer.branchesRequests[0].searchParams.get("limit")).toBe("100")
-      // The picker can paint before its deferred input focus.
-      if (!viewer.app.renderer.currentFocusedEditor) await once(viewer.app.renderer, CliRenderEvents.FOCUSED_EDITOR)
-      expect(viewer.app.renderer.currentFocusedEditor).toBeInstanceOf(InputRenderable)
       await viewer.app.mockInput.typeText("origin/release")
       await Bun.sleep(160)
       await viewer.app.waitFor(() => viewer.branchesRequests.at(-1)?.searchParams.get("search") === "origin/release")

sst.config.ts

@@ -7,35 +7,27 @@ export default $config({
       removal: input?.stage === "production" ? "retain" : "remove",
       protect: ["production"].includes(input?.stage),
       home: "cloudflare",
-      providers:
-        input.stage === "beta"
-          ? {}
-          : {
-              aws: {
-                version: "7.30.0",
-                region: "us-east-1",
-                profile: process.env.GITHUB_ACTIONS
-                  ? undefined
-                  : input.stage === "production"
-                    ? "opencode-production"
-                    : "opencode-dev",
-              },
-              stripe: {
-                version: "0.0.28",
-                apiKey: process.env.STRIPE_SECRET_KEY!,
-              },
-              random: "4.19.2",
-              planetscale: "0.4.1",
-              honeycomb: "0.49.0",
-            },
+      providers: {
+        aws: {
+          version: "7.30.0",
+          region: "us-east-1",
+          profile: process.env.GITHUB_ACTIONS
+            ? undefined
+            : input.stage === "production"
+              ? "opencode-production"
+              : "opencode-dev",
+        },
+        stripe: {
+          version: "0.0.28",
+          apiKey: process.env.STRIPE_SECRET_KEY!,
+        },
+        random: "4.19.2",
+        planetscale: "0.4.1",
+        honeycomb: "0.49.0",
+      },
     }
   },
   async run() {
-    if ($app.stage === "beta") {
-      const { createWebApp } = await import("./infra/webapp.js")
-      return { WebAppUrl: createWebApp("beta.opencode.ai").url }
-    }
-
     const stage = await import("./infra/stage.js")
     await import("./infra/app.js")
     const lake = stage.deployAws ? await import("./infra/lake.js") : undefined