@neurocode-ai/session-ui 1.18.8

package/src/components/session-diff.test.ts

@@ -0,0 +1,135 @@
+import { describe, expect, test } from "bun:test"
+import { normalize, resolveFileDiff, text } from "./session-diff"
+
+describe("session diff", () => {
+  test("renders whole-file unified patches as complete diffs", () => {
+    const diff = {
+      file: "a.ts",
+      patch:
+        "Index: a.ts\n===================================================================\n--- a.ts\t\n+++ a.ts\t\n@@ -1,2 +1,2 @@\n one\n-two\n+three\n",
+      additions: 1,
+      deletions: 1,
+      status: "modified" as const,
+    }
+    const view = normalize(diff)
+
+    expect(view.fileDiff.name).toBe("a.ts")
+    expect(view.fileDiff.isPartial).toBe(false)
+    expect(text(view, "deletions")).toBe("one\ntwo\n")
+    expect(text(view, "additions")).toBe("one\nthree\n")
+  })
+
+  test("keeps missing final newlines from unified patches", () => {
+    const diff = {
+      file: "a.ts",
+      patch:
+        "Index: a.ts\n===================================================================\n--- a.ts\t\n+++ a.ts\t\n@@ -1,2 +1,2 @@\n one\n-two\n\\n+three\n\\n",
+      additions: 1,
+      deletions: 1,
+      status: "modified" as const,
+    }
+    const view = normalize(diff)
+
+    expect(text(view, "deletions")).toBe("one\ntwo")
+    expect(text(view, "additions")).toBe("one\nthree")
+  })
+
+  test("renders whole-file VCS patches as complete diffs", () => {
+    const fileDiff = resolveFileDiff({
+      file: "a.ts",
+      patch:
+        "diff --git a/a.ts b/a.ts\nindex 1a2b3c4..5d6e7f8 100644\n--- a/a.ts\n+++ b/a.ts\n@@ -1,2 +1,2 @@\n one\n-old\n+new\n",
+    })
+
+    expect(fileDiff.isPartial).toBe(false)
+    expect(fileDiff.additionLines).toEqual(["one\n", "new\n"])
+  })
+
+  test("keeps ordinary leading tool patches partial", () => {
+    const fileDiff = resolveFileDiff({
+      file: "a.ts",
+      patch:
+        "Index: a.ts\n===================================================================\n--- a.ts\n+++ a.ts\n@@ -1,5 +1,5 @@\n-old\n+new\n two\n three\n four\n five\n",
+    })
+
+    expect(fileDiff.isPartial).toBe(true)
+    expect(fileDiff.additionLines).toEqual(["new\n", "two\n", "three\n", "four\n", "five\n"])
+  })
+
+  test("keeps separated patch hunks partial without complete file contents", () => {
+    const fileDiff = resolveFileDiff({
+      file: "project.ts",
+      patch:
+        'Index: project.ts\n===================================================================\n--- project.ts\t\n+++ project.ts\t\n@@ -1,3 +1,2 @@\n import { and } from "drizzle-orm"\n-import { sql } from "drizzle-orm"\n import { ProjectTable } from "./project.sql"\n@@ -346,3 +345,3 @@\n import { Database } from "@/storage/db"\n-import { ProjectTable } from "./project.sql"\n+import { ProjectTable } from "../project/project.sql"\n import { SessionTable } from "../session/session.sql"\n',
+    })
+
+    expect(fileDiff.isPartial).toBe(true)
+    expect(fileDiff.hunks).toHaveLength(2)
+    expect(fileDiff.hunks[1]?.collapsedBefore).toBeGreaterThan(0)
+  })
+
+  test("renders headerless persisted patches", () => {
+    const view = normalize({
+      file: "a.ts",
+      patch: "@@ -1 +1 @@\n-old\n+new\n",
+      additions: 1,
+      deletions: 1,
+      status: "modified" as const,
+    })
+
+    expect(view.fileDiff.name).toBe("a.ts")
+    expect(view.fileDiff.isPartial).toBe(true)
+    expect(text(view, "deletions")).toBe("old\n")
+    expect(text(view, "additions")).toBe("new\n")
+  })
+
+  test("does not share headerless patch metadata between files", () => {
+    const patch = "@@ -1 +1 @@\n-old\n+new\n"
+
+    expect(resolveFileDiff({ file: "a.ts", patch }).name).toBe("a.ts")
+    expect(resolveFileDiff({ file: "b.ts", patch }).name).toBe("b.ts")
+  })
+
+  test("keeps capped header-only patches partial", () => {
+    const fileDiff = resolveFileDiff({
+      file: "a.ts",
+      patch:
+        "Index: a.ts\n===================================================================\n--- a.ts\t\n+++ a.ts\t\n",
+    })
+
+    expect(fileDiff.name).toBe("a.ts")
+    expect(fileDiff.isPartial).toBe(true)
+    expect(fileDiff.hunks).toEqual([])
+  })
+
+  test("keeps full legacy content as a complete diff", () => {
+    const diff = {
+      file: "a.ts",
+      before: "one\n",
+      after: "two\n",
+      additions: 1,
+      deletions: 1,
+      status: "modified" as const,
+    }
+    const view = normalize(diff)
+
+    expect(view.fileDiff.isPartial).toBe(false)
+    expect(text(view, "deletions")).toBe("one\n")
+    expect(text(view, "additions")).toBe("two\n")
+  })
+
+  test("ignores malformed persisted patches", () => {
+    const diff = {
+      file: "a.ts",
+      patch:
+        "diff --git a/a.ts b/a.ts\nindex ff4ceb2..65a1de0 100644\n--- a/a.ts\n+++ b/a.ts\n@@ -1,3 +1,3 @@\n keep\n+add\n same\r",
+      additions: 1,
+      deletions: 1,
+      status: "modified" as const,
+    }
+    const view = normalize(diff)
+
+    expect(text(view, "deletions")).toBe("")
+    expect(text(view, "additions")).toBe("")
+  })
+})

package/src/components/session-diff.ts

@@ -0,0 +1,145 @@
+import { parseDiffFromFile, parsePatchFiles, type FileDiffMetadata } from "@pierre/diffs"
+import { parsePatch } from "diff"
+import type { SnapshotFileDiff, VcsFileDiff } from "@neurocode-ai/sdk/v2"
+import type { FileDiffInfo } from "@neurocode-ai/client/promise"
+
+type LegacyDiff = {
+  file: string
+  patch?: string
+  before?: string
+  after?: string
+  additions: number
+  deletions: number
+  status?: "added" | "deleted" | "modified"
+}
+
+type SnapshotDiff = SnapshotFileDiff & { file: string }
+type ReviewDiff = SnapshotDiff | FileDiffInfo | VcsFileDiff | LegacyDiff
+export type DiffSource = Pick<LegacyDiff, "file" | "patch" | "before" | "after">
+
+export type ViewDiff = {
+  file: string
+  additions: number
+  deletions: number
+  status?: "added" | "deleted" | "modified"
+  fileDiff: FileDiffMetadata
+}
+
+const diffCacheLimit = 16
+const patchFileDiffCache = new Map<string, FileDiffMetadata>()
+
+export function resolveFileDiff(diff: DiffSource) {
+  if (typeof diff.patch === "string") return fileDiffFromPatch(diff.file, diff.patch)
+  return fileDiffFromContent(
+    diff.file,
+    typeof diff.before === "string" ? diff.before : "",
+    typeof diff.after === "string" ? diff.after : "",
+  )
+}
+
+export function normalize(diff: ReviewDiff): ViewDiff {
+  return {
+    file: diff.file,
+    additions: diff.additions,
+    deletions: diff.deletions,
+    status: diff.status,
+    fileDiff: resolveFileDiff(diff),
+  }
+}
+
+export function text(diff: ViewDiff, side: "deletions" | "additions") {
+  if (side === "deletions") return diff.fileDiff.deletionLines.join("")
+  return diff.fileDiff.additionLines.join("")
+}
+
+function fileDiffFromPatch(file: string, patch: string) {
+  const key = `${file}\0${patch}`
+  const hit = patchFileDiffCache.get(key)
+  if (hit) {
+    patchFileDiffCache.delete(key)
+    patchFileDiffCache.set(key, hit)
+    return hit
+  }
+
+  const contents = completePatchContents(patch)
+  const input = contents ? undefined : patchInput(file, patch)
+  const value = contents
+    ? fileDiffFromContent(file, contents.before, contents.after)
+    : ((input ? parsePatchFiles(input)[0]?.files[0] : undefined) ?? emptyFileDiff(file))
+  patchFileDiffCache.set(key, value)
+  while (patchFileDiffCache.size > diffCacheLimit) patchFileDiffCache.delete(patchFileDiffCache.keys().next().value!)
+  return value
+}
+
+function completePatchContents(patch: string) {
+  try {
+    const parsed = parsePatch(patch)[0]
+    if (!parsed || (!parsed.index && !parsed.oldFileName && !parsed.newFileName)) return
+    // Snapshot and VCS producers request full context. Tool patches use jsdiff's shorter default context.
+    if (!patch.startsWith("diff --git ") && !/^--- [^\n]*\t\r?\n\+\+\+ [^\n]*\t(?:\r?\n|$)/m.test(patch)) return
+    // Full patches collapse into one leading hunk. Separated hunks omit ranges and must stay partial.
+    if (parsed.hunks.length !== 1) return
+
+    const hunk = parsed.hunks[0]
+    if (!hunk || hunk.oldStart > 1 || hunk.newStart > 1) return
+
+    const before: Array<{ text: string; newline: boolean }> = []
+    const after: Array<{ text: string; newline: boolean }> = []
+    let previous: "-" | "+" | " " | undefined
+
+    for (const line of hunk.lines) {
+      if (line.startsWith("\\")) {
+        if (previous === "-" || previous === " ") {
+          const value = before.at(-1)
+          if (value) value.newline = false
+        }
+        if (previous === "+" || previous === " ") {
+          const value = after.at(-1)
+          if (value) value.newline = false
+        }
+        continue
+      }
+      if (line.startsWith("-")) {
+        before.push({ text: line.slice(1), newline: true })
+        previous = "-"
+        continue
+      }
+      if (line.startsWith("+")) {
+        after.push({ text: line.slice(1), newline: true })
+        previous = "+"
+        continue
+      }
+      if (!line.startsWith(" ")) return
+      before.push({ text: line.slice(1), newline: true })
+      after.push({ text: line.slice(1), newline: true })
+      previous = " "
+    }
+
+    const text = (lines: Array<{ text: string; newline: boolean }>) =>
+      lines.map((line) => line.text + (line.newline ? "\n" : "")).join("")
+    return { before: text(before), after: text(after) }
+  } catch {
+    return
+  }
+}
+
+function patchInput(file: string, patch: string) {
+  try {
+    const parsed = parsePatch(patch)[0]
+    if (!parsed) return
+    if (parsed.index || parsed.oldFileName || parsed.newFileName) return patch
+    if (!parsed.hunks.length) return
+    return `Index: ${file}\n===================================================================\n--- ${file}\t\n+++ ${file}\t\n${patch}`
+  } catch {
+    return
+  }
+}
+
+function fileDiffFromContent(file: string, before: string, after: string) {
+  if (!before && !after) return emptyFileDiff(file)
+  return parseDiffFromFile({ name: file, contents: before }, { name: file, contents: after })
+}
+
+function emptyFileDiff(file: string) {
+  return parseDiffFromFile({ name: file, contents: "" }, { name: file, contents: "" })
+}

package/src/components/session-retry.tsx

@@ -0,0 +1,74 @@
+import { createEffect, createMemo, createSignal, on, onCleanup, Show } from "solid-js"
+import type { SessionStatus } from "@neurocode-ai/sdk/v2/client"
+import { useI18n } from "@neurocode-ai/ui/context/i18n"
+import { Card } from "@neurocode-ai/ui/card"
+import { Tooltip } from "@neurocode-ai/ui/tooltip"
+import { Spinner } from "@neurocode-ai/ui/spinner"
+
+export function SessionRetry(props: { status: SessionStatus; show?: boolean }) {
+  const i18n = useI18n()
+  const retry = createMemo(() => {
+    if (props.status.type !== "retry") return
+    return props.status
+  })
+  const [seconds, setSeconds] = createSignal(0)
+  createEffect(
+    on(retry, (current) => {
+      if (!current) return
+      const update = () => {
+        const next = retry()?.next
+        if (!next) return
+        setSeconds(Math.round((next - Date.now()) / 1000))
+      }
+      update()
+      const timer = setInterval(update, 1000)
+      onCleanup(() => clearInterval(timer))
+    }),
+  )
+  const message = createMemo(() => {
+    const current = retry()
+    if (!current) return ""
+    if (current.message.includes("exceeded your current quota") && current.message.includes("gemini")) {
+      return i18n.t("ui.sessionTurn.retry.geminiHot")
+    }
+    if (current.message.length > 80) return current.message.slice(0, 80) + "..."
+    return current.message
+  })
+  const truncated = createMemo(() => {
+    const current = retry()
+    if (!current) return false
+    return current.message.length > 80
+  })
+  const info = createMemo(() => {
+    const current = retry()
+    if (!current) return ""
+    const count = Math.max(0, seconds())
+    const delay = count > 0 ? i18n.t("ui.sessionTurn.retry.inSeconds", { seconds: count }) : ""
+    const retrying = i18n.t("ui.sessionTurn.retry.retrying")
+    const line = [retrying, delay].filter(Boolean).join(" ")
+    if (!line) return i18n.t("ui.sessionTurn.retry.attempt", { attempt: current.attempt })
+    return i18n.t("ui.sessionTurn.retry.attemptLine", { line, attempt: current.attempt })
+  })
+
+  return (
+    <Show when={retry() && (props.show ?? true)}>
+      <div data-slot="session-turn-retry">
+        <Card variant="error" class="error-card">
+          <div class="flex items-start gap-2">
+            <Spinner class="size-4 mt-0.5" />
+            <div class="min-w-0">
+              <Show when={truncated()} fallback={<div data-slot="session-turn-retry-message">{message()}</div>}>
+                <Tooltip value={retry()?.message ?? ""} placement="top">
+                  <div data-slot="session-turn-retry-message" class="cursor-help truncate">
+                    {message()}
+                  </div>
+                </Tooltip>
+              </Show>
+              <Show when={info()}>{(line) => <div data-slot="session-turn-retry-info">{line()}</div>}</Show>
+            </div>
+          </div>
+        </Card>
+      </div>
+    </Show>
+  )
+}

package/src/components/session-review.css

@@ -0,0 +1,247 @@
+[data-component="session-review"] {
+  display: flex;
+  flex-direction: column;
+  gap: 0px;
+  height: 100%;
+
+  [data-slot="session-review-scroll"] {
+    flex: 1 1 auto;
+    min-height: 0;
+  }
+
+  .scroll-view__viewport {
+    display: flex;
+    flex-direction: column;
+  }
+
+  [data-slot="session-review-container"] {
+    flex: 1 1 auto;
+    padding-right: 0;
+  }
+
+  [data-slot="session-review-header"] {
+    z-index: 120;
+    background-color: var(--v2-background-bg-base);
+    height: 40px;
+    padding-bottom: 8px;
+    flex-shrink: 0;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    align-self: stretch;
+  }
+
+  [data-slot="session-review-title"] {
+    font-family: var(--font-family-sans);
+    font-size: var(--font-size-large);
+    font-weight: var(--font-weight-medium);
+    line-height: var(--line-height-large);
+    color: var(--text-strong);
+  }
+
+  [data-slot="session-review-actions"] {
+    display: flex;
+    align-items: center;
+    column-gap: 12px;
+  }
+
+  [data-slot="session-review-actions"] [data-component="radio-group"] {
+    [data-slot="radio-group-wrapper"],
+    [data-slot="radio-group-indicator"],
+    [data-slot="radio-group-item-control"] {
+      border-radius: 6px;
+    }
+
+    [data-slot="radio-group-item-input"]:not([data-checked], [data-disabled])
+      + [data-slot="radio-group-item-label"]:hover
+      [data-slot="radio-group-item-control"] {
+      border-radius: 4px;
+    }
+  }
+
+  [data-component="sticky-accordion-header"] {
+    --sticky-accordion-top: 0px;
+  }
+
+  [data-slot="session-review-accordion-item"][data-selected]
+    [data-slot="accordion-header"]
+    [data-slot="accordion-trigger"] {
+    background-color: var(--surface-base-active);
+  }
+
+  [data-slot="accordion-item"] {
+    [data-slot="accordion-content"] {
+      display: none;
+    }
+    &[data-expanded] {
+      [data-slot="accordion-content"] {
+        display: block;
+      }
+    }
+  }
+
+  [data-slot="accordion-content"] {
+    -webkit-user-select: text;
+    user-select: text;
+  }
+
+  [data-slot="session-review-accordion-content"] {
+    position: relative;
+    z-index: 0;
+    overflow: hidden;
+  }
+
+  [data-slot="session-review-trigger-content"] {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    width: 100%;
+    gap: 20px;
+  }
+
+  [data-slot="session-review-file-info"] {
+    flex-grow: 1;
+    display: flex;
+    align-items: center;
+    gap: 12px;
+    min-width: 0;
+  }
+
+  [data-slot="session-review-file-name-container"] {
+    display: flex;
+    align-items: center;
+    flex-grow: 1;
+    min-width: 0;
+  }
+
+  [data-slot="session-review-directory"] {
+    color: var(--text-base);
+    text-overflow: ellipsis;
+    overflow: hidden;
+    white-space: nowrap;
+    direction: rtl;
+    text-align: left;
+  }
+
+  [data-slot="session-review-filename"] {
+    color: var(--text-strong);
+    min-width: 0;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  [data-slot="session-review-view-button"] {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 2px;
+    margin-left: 8px;
+    border: none;
+    background: transparent;
+    color: var(--text-base);
+    cursor: pointer;
+    border-radius: 4px;
+    opacity: 0;
+    will-change: opacity;
+    transform: translateZ(0);
+    transition: opacity 0.15s ease;
+
+    &:hover {
+      color: var(--text-strong);
+      background: var(--surface-base);
+    }
+  }
+
+  [data-slot="accordion-trigger"]:hover [data-slot="session-review-view-button"] {
+    opacity: 1;
+  }
+
+  [data-slot="session-review-trigger-actions"] {
+    flex-shrink: 0;
+    display: flex;
+    gap: 16px;
+    align-items: center;
+    justify-content: flex-end;
+  }
+
+  [data-slot="session-review-diff-chevron"] {
+    display: inline-flex;
+    color: var(--icon-weaker);
+    transform: rotate(-90deg);
+    transition: transform 0.15s ease;
+  }
+
+  [data-slot="accordion-item"][data-expanded] [data-slot="session-review-diff-chevron"] {
+    transform: rotate(0deg);
+  }
+
+  [data-slot="session-review-change-group"] {
+    display: inline-flex;
+    align-items: center;
+    gap: 12px;
+  }
+
+  [data-slot="session-review-change"] {
+    font-family: var(--font-family-sans);
+    font-size: var(--font-size-small);
+    font-weight: var(--font-weight-medium);
+  }
+
+  [data-slot="session-review-change"][data-type="added"] {
+    color: var(--icon-diff-add-base);
+  }
+
+  [data-slot="session-review-change"][data-type="removed"] {
+    color: var(--icon-diff-delete-base);
+  }
+
+  [data-slot="session-review-change"][data-type="modified"] {
+    color: var(--icon-diff-modified-base);
+  }
+
+  [data-slot="session-review-diff-wrapper"] {
+    position: relative;
+    overflow: hidden;
+    z-index: 0;
+    --line-comment-z: 5;
+    --line-comment-popover-z: 30;
+    --line-comment-open-z: 6;
+  }
+
+  [data-slot="session-review-large-diff"] {
+    padding: 12px;
+    background: var(--v2-background-bg-base);
+  }
+
+  [data-slot="session-review-large-diff-title"] {
+    font-family: var(--font-family-sans);
+    font-size: var(--font-size-small);
+    font-weight: var(--font-weight-medium);
+    color: var(--text-strong);
+    margin-bottom: 4px;
+  }
+
+  [data-slot="session-review-large-diff-meta"] {
+    font-family: var(--font-family-sans);
+    font-size: var(--font-size-small);
+    color: var(--text-weak);
+    word-break: break-word;
+  }
+
+  [data-slot="session-review-large-diff-actions"] {
+    display: flex;
+    gap: 8px;
+    margin-top: 10px;
+  }
+}
+
+body:not([data-new-layout]) [data-component="session-review"] {
+  [data-slot="session-review-header"] {
+    background-color: var(--background-stronger);
+  }
+
+  [data-slot="session-review-large-diff"] {
+    background: var(--background-stronger);
+  }
+}

package/src/components/session-review.stories.tsx

@@ -0,0 +1,7 @@
+// @ts-nocheck
+import * as mod from "./session-review"
+import { create } from "@neurocode-ai/ui/storybook/scaffold"
+
+const story = create({ title: "UI/SessionReview", mod })
+export default { title: "UI/SessionReview", id: "components-session-review", component: story.meta.component }
+export const Basic = story.Basic