feat(session-ui): summarize each turn's changed files (#55064)

Co-authored-by: Brendonovich <14191578+Brendonovich@users.noreply.github.com>

Author: opencode-agent[bot]

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

@@ -790,6 +790,8 @@ export const dict = {
   "settings.timeline.description.text-only": "Hide all activity.",
   "settings.timeline.description.custom": "Uses advanced settings.",
   "settings.timeline.custom": "Custom",
+  "settings.timeline.row.turnDiffs.title": "Changed files",
+  "settings.timeline.row.turnDiffs.description": "List the files each turn changed when it finishes",
   "settings.timeline.advanced": "Advanced",
   "settings.timeline.advanced.description": "Set placement and details for each activity category.",
   "settings.timeline.group": "Group",

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

@@ -180,6 +180,7 @@ export function createTimelineController(input: { session: TimelineSessionSource
     timelineDetail,
     pendingInputIDs,
     queuedCompactionIDs,
+    turnDiffs: settings.general.showTurnDiffs,
   })
 
   const [pending, setPending] = createStore({ rename: false })

packages/app/src/session/timeline/turn-diffs.test.ts

@@ -0,0 +1,32 @@
+import { describe, expect, test } from "bun:test"
+import type { FileDiffInfo } from "@opencode/client/promise"
+import { createRoot } from "solid-js"
+import { createTurnDiffCache } from "./turn-diffs"
+
+const turn = { sessionID: "ses_a", from: "msg_open" }
+
+// Every pending promise callback runs before the next macrotask.
+const settle = () => new Promise((resolve) => setImmediate(resolve))
+
+const diff = { file: "src/a.ts", patch: "", additions: 1, deletions: 0, status: "modified" } satisfies FileDiffInfo
+
+describe("turn diff cache", () => {
+  test("loads each turn once and retries after a failure", async () => {
+    const cache = createRoot(() => createTurnDiffCache())
+    const failed = Promise.withResolvers<readonly FileDiffInfo[]>()
+    const calls: string[] = []
+
+    cache.load(turn, () => (calls.push("failed"), failed.promise))
+    cache.load(turn, () => (calls.push("duplicate"), Promise.resolve([diff])))
+    failed.reject(new Error("offline"))
+    await settle()
+    expect(cache.get(turn)).toBeUndefined()
+
+    cache.load(turn, () => (calls.push("retry"), Promise.resolve([diff])))
+    await settle()
+    cache.load(turn, () => (calls.push("cached"), Promise.resolve([])))
+
+    expect(calls).toEqual(["failed", "retry"])
+    expect(cache.get(turn)).toEqual([diff])
+  })
+})

packages/app/src/session/timeline/turn-diffs.ts

@@ -0,0 +1,30 @@
+import type { FileDiffInfo } from "@opencode/client/promise"
+import type { TurnDiffInput } from "@opencode/session-ui/context"
+import { createStore } from "solid-js/store"
+
+/**
+ * One tab's in-memory cache of the files each finished turn changed. A finished turn's snapshots never
+ * change, so each turn loads once per tab and survives the timeline remounting; closing the tab drops it.
+ */
+export function createTurnDiffCache() {
+  const [diffs, setDiffs] = createStore<Record<string, readonly FileDiffInfo[] | undefined>>({})
+  const loading = new Set<string>()
+  const key = (input: TurnDiffInput) => `${input.sessionID}/${input.from}`
+
+  return {
+    get: (input: TurnDiffInput) => diffs[key(input)],
+    load(input: TurnDiffInput, fetch: () => Promise<readonly FileDiffInfo[]>) {
+      const id = key(input)
+
+      if (diffs[id] || loading.has(id)) return
+      loading.add(id)
+      // A failed load leaves the turn unloaded, so the next request retries.
+      void fetch()
+        .then(
+          (value) => setDiffs(id, value),
+          () => undefined,
+        )
+        .finally(() => loading.delete(id))
+    },
+  }
+}

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

@@ -317,6 +317,17 @@ export const SettingsGeneral: Component = () => {
                 onChange={settings.general.setTimelineDetail}
               />
             </div>
+            <SettingsRow
+              title={language.t("settings.timeline.row.turnDiffs.title")}
+              description={language.t("settings.timeline.row.turnDiffs.description")}
+            >
+              <div data-action="settings-show-turn-diffs">
+                <Switch
+                  checked={settings.general.showTurnDiffs()}
+                  onChange={(checked) => settings.general.setShowTurnDiffs(checked)}
+                />
+              </div>
+            </SettingsRow>
           </SettingsList>
         </section>
 

packages/app/src/settings/model.test.ts

@@ -93,6 +93,7 @@ describe("settings schema", () => {
         showFileTree: false,
         timelineDetail: timelinePresets[2].value,
         showCustomAgents: false,
+        showTurnDiffs: false,
         mobileTitlebarPosition: "top",
         terminalPlacement: "side",
         followUpBehavior: "steer",

packages/app/src/settings/model.tsx

@@ -116,6 +116,7 @@ const generalSchema = Persistence.struct({
     tools: placementOnlySchema,
   }),
   showCustomAgents: Schema.Boolean,
+  showTurnDiffs: Schema.Boolean,
   mobileTitlebarPosition: Schema.Literals(["top", "bottom"]),
   // Owned by the review extension, which copies it out once; kept so settings rewrites cannot drop it first.
   mobileDiffWrap: Persistence.optional(Schema.Boolean),
@@ -278,6 +279,7 @@ export const defaultSettings: Settings = {
     showFileTree: false,
     timelineDetail: { ...timelinePresets[2].value },
     showCustomAgents: false,
+    showTurnDiffs: false,
     mobileTitlebarPosition: "top",
     terminalPlacement: "side",
     followUpBehavior: "steer",
@@ -351,6 +353,10 @@ export const { use: useSettings, provider: SettingsProvider } = createSimpleCont
         setShowCustomAgents(value: boolean) {
           setStore("general", "showCustomAgents", value)
         },
+        showTurnDiffs: withFallback(() => store.general?.showTurnDiffs, defaultSettings.general.showTurnDiffs),
+        setShowTurnDiffs(value: boolean) {
+          setStore("general", "showTurnDiffs", value)
+        },
         mobileTitlebarPosition: withFallback(
           () => store.general?.mobileTitlebarPosition,
           defaultSettings.general.mobileTitlebarPosition,

packages/app/src/shell/routes/session-ui-provider.tsx

@@ -8,10 +8,11 @@ import type { ServerConnection } from "@/runtime/server/registry"
 import { sessionHref } from "@/shell/routes/session"
 import { useData } from "@/runtime/server/current"
 import { useServerSDK } from "@/runtime/server/client"
-import { useTabs } from "@/shell/tabs/tabs"
+import { useTabs, type Tab } from "@/shell/tabs/tabs"
 import { readLocalImage } from "@/runtime/server/image"
 import { useLanguage } from "@/runtime/i18n/language"
 import { showToast } from "@/shell/notifications/toast"
+import { createTurnDiffCache } from "@/session/timeline/turn-diffs"
 
 export function SessionUIProvider(
   props: ParentProps<{
@@ -65,6 +66,23 @@ export function SessionUIProvider(
 
   const providers = useProviders(directory)
 
+  // Turn diffs live in the tab's in-memory state, so they outlast timeline remounts and go when the tab closes.
+  const turnDiffs = () => {
+    const id = params.id
+
+    if (!id) return
+
+    const tab =
+      tabs.store.find(
+        (item) =>
+          item.type === "session" &&
+          item.server === props.server &&
+          (item.sessionId === id || item.routeSessionId === id),
+      ) ?? ({ type: "session", server: props.server, sessionId: id } satisfies Tab)
+
+    return tabs.state(tab, "turnDiffs", createTurnDiffCache)
+  }
+
   const sessionUIData = createMemo(() => ({
     provider: providers.ready()
       ? { all: providers.all(), default: providers.default(), connected: providers.connected().map((item) => item.id) }
@@ -88,6 +106,10 @@ export function SessionUIProvider(
       sessionID={params.id}
       shellRunning={(id) => !!data.shell.get(id)}
       shellOutput={(input) => serverSDK.api.shell.output(input)}
+      turnDiff={{
+        get: (input) => turnDiffs()?.get(input),
+        load: (input) => turnDiffs()?.load(input, () => serverSDK.api.session.diff(input)),
+      }}
       onNavigateToSession={navigateToSession}
       onSessionHref={href}
     >

packages/session-ui/src/context/data.tsx

@@ -36,6 +36,17 @@ type Data = {
   }
 }
 
+/** Names a finished turn by its Session and the user message that opened it. */
+export type TurnDiffInput = { sessionID: string; from: string }
+
+/** The host's cache of the files each finished turn changed. */
+export type TurnDiffSource = {
+  /** The turn's diffs, or undefined until they load. */
+  get: (input: TurnDiffInput) => readonly FileDiffInfo[] | undefined
+  /** Starts loading the turn's diffs unless they are cached or already loading. */
+  load: (input: TurnDiffInput) => void
+}
+
 export type NavigateToSessionFn = (sessionID: string) => void
 
 export type SessionHrefFn = (sessionID: string) => string
@@ -48,6 +59,7 @@ export const { use: useData, provider: DataProvider } = createSimpleContext({
     sessionID?: string
     shellRunning?: (id: string) => boolean
     shellOutput?: (input: ShellOutputInput) => Promise<ShellOutputOutput>
+    turnDiff?: TurnDiffSource
     onNavigateToSession?: NavigateToSessionFn
     onSessionHref?: SessionHrefFn
   }) => {
@@ -65,6 +77,7 @@ export const { use: useData, provider: DataProvider } = createSimpleContext({
       sessionHref: props.onSessionHref,
       shellRunning: props.shellRunning,
       shellOutput: props.shellOutput,
+      turnDiff: props.turnDiff,
     }
   },
 })

packages/session-ui/src/storybook/current-session-story.tsx

@@ -62,6 +62,7 @@ export function CurrentSessionProviders(props: { document: SessionDocument; chil
         },
         session_diff: { [CURRENT_SESSION_ID]: props.document.diffs },
       }}
+      turnDiff={{ get: () => props.document.diffs, load: () => {} }}
     >
       <FileComponentProvider component={File}>{props.children}</FileComponentProvider>
     </DataProvider>
@@ -76,6 +77,7 @@ export function CurrentSessionTimelineStory(props: {
   width?: string
   shellToolDefaultOpen?: boolean
   editToolDefaultOpen?: boolean
+  turnDiffs?: boolean
 }) {
   // Inline story documents rebuild their messages on every prop read, and the timeline projection keys text by identity.
   const document = createMemo(() => props.document)
@@ -118,6 +120,7 @@ export function CurrentSessionTimelineStory(props: {
                   actions={actions}
                   shellToolDefaultOpen={props.shellToolDefaultOpen}
                   editToolDefaultOpen={props.editToolDefaultOpen}
+                  turnDiffs={props.turnDiffs}
                 />
               </CurrentSessionProviders>
             </div>