diff --git a/apps/desktop/src/electron/ElectronMenu.test.ts b/apps/desktop/src/electron/ElectronMenu.test.ts index 3dc218d8252..58870bbab1d 100644 --- a/apps/desktop/src/electron/ElectronMenu.test.ts +++ b/apps/desktop/src/electron/ElectronMenu.test.ts @@ -31,6 +31,12 @@ const TestLayer = ElectronMenu.layer.pipe( Layer.provide(Layer.succeed(HostProcessPlatform, "linux")), ); +const makeWindow = (zoomFactor = 1): Electron.BrowserWindow => + ({ + id: 7, + webContents: { getZoomFactor: () => zoomFactor }, + }) as unknown as Electron.BrowserWindow; + describe("ElectronMenu", () => { beforeEach(() => { buildFromTemplateMock.mockReset(); @@ -70,7 +76,7 @@ describe("ElectronMenu", () => { const electronMenu = yield* ElectronMenu.ElectronMenu; const selectedItemId = yield* electronMenu.showContextMenu({ - window: {} as Electron.BrowserWindow, + window: makeWindow(), items: [{ id: "copy", label: "Copy" }], position: Option.none(), }); @@ -81,20 +87,24 @@ describe("ElectronMenu", () => { it.effect("resolves with none when the menu closes without a click", () => Effect.gen(function* () { + let popupOptions: Electron.PopupOptions | undefined; buildFromTemplateMock.mockImplementation(() => ({ popup: (options: Electron.PopupOptions) => { + popupOptions = options; options.callback?.(); }, })); const electronMenu = yield* ElectronMenu.ElectronMenu; const selectedItemId = yield* electronMenu.showContextMenu({ - window: {} as Electron.BrowserWindow, + window: makeWindow(2), items: [{ id: "copy", label: "Copy" }], position: Option.some({ x: 10.8, y: 20.2 }), }); assert.isTrue(Option.isNone(selectedItemId)); + assert.equal(popupOptions?.x, 21); + assert.equal(popupOptions?.y, 40); assert.deepEqual(buildFromTemplateMock.mock.calls[0]?.[0][0], { label: "Copy", enabled: true, diff --git a/apps/desktop/src/electron/ElectronMenu.ts b/apps/desktop/src/electron/ElectronMenu.ts index 09fb5d1807d..4d3e5a1c241 100644 --- a/apps/desktop/src/electron/ElectronMenu.ts +++ b/apps/desktop/src/electron/ElectronMenu.ts @@ -94,13 +94,20 @@ function normalizeContextMenuItems(source: readonly ContextMenuItem[]): ContextM return normalizedItems; } +// Renderer positions arrive in CSS pixels; popup() expects window points, so +// page zoom must be factored in or menus drift proportionally to their +// distance from the window origin. const normalizePosition = ( position: Option.Option, + zoomFactor: number, ): Option.Option => Option.filter( position, - ({ x, y }) => Number.isFinite(x) && Number.isFinite(y) && x >= 0 && y >= 0, - ).pipe(Option.map(({ x, y }) => ({ x: Math.floor(x), y: Math.floor(y) }))); + ({ x, y }) => + Number.isFinite(x) && Number.isFinite(y) && x >= 0 && y >= 0 && Number.isFinite(zoomFactor), + ).pipe( + Option.map(({ x, y }) => ({ x: Math.floor(x * zoomFactor), y: Math.floor(y * zoomFactor) })), + ); export const make = Effect.gen(function* () { const platform = yield* HostProcessPlatform; @@ -214,7 +221,10 @@ export const make = Effect.gen(function* () { try { const menu = Electron.Menu.buildFromTemplate(buildTemplate(normalizedItems, complete)); - const popupPosition = normalizePosition(input.position); + const popupPosition = normalizePosition( + input.position, + input.window.webContents.getZoomFactor(), + ); const popupOptions = Option.match(popupPosition, { onNone: (): Electron.PopupOptions => ({ window: input.window, diff --git a/apps/desktop/src/wsl/DesktopWslEnvironment.test.ts b/apps/desktop/src/wsl/DesktopWslEnvironment.test.ts index cdb3fc78286..895d246e368 100644 --- a/apps/desktop/src/wsl/DesktopWslEnvironment.test.ts +++ b/apps/desktop/src/wsl/DesktopWslEnvironment.test.ts @@ -16,6 +16,7 @@ import { formatNodePtyProbeFailureReason, formatWslShellTransportFailureReason, parseNodePath, + parseNodeVersion, parseResolvedPath, parseToolchainReport, probeWslDistros, @@ -173,6 +174,29 @@ describe("parseNodePath", () => { }); }); +describe("parseNodeVersion", () => { + it("extracts the node version from a nodeVersion: line", () => { + expect(parseNodeVersion("nodeVersion:24.10.0")).toBe("24.10.0"); + }); + + it("returns null when the version value is empty", () => { + expect(parseNodeVersion("nodeVersion:")).toBeNull(); + }); + + it("returns null when there is no nodeVersion line at all", () => { + expect(parseNodeVersion("nodePath:/usr/bin/node\nresolvedPath:/usr/bin")).toBeNull(); + }); + + it("ignores surrounding noise and trims whitespace", () => { + const stdout = [ + "some preamble noise", + " nodeVersion:22.16.0 ", + "nodePath:/usr/bin/node", + ].join("\n"); + expect(parseNodeVersion(stdout)).toBe("22.16.0"); + }); +}); + describe("parseResolvedPath", () => { it("preserves spaces and apostrophes in the resolved login-shell PATH", () => { const resolvedPath = "/home/test user/bin:/opt/test's tools/bin:/usr/bin:/bin"; diff --git a/apps/desktop/src/wsl/DesktopWslEnvironment.ts b/apps/desktop/src/wsl/DesktopWslEnvironment.ts index b38675f0e1f..c6c274d8500 100644 --- a/apps/desktop/src/wsl/DesktopWslEnvironment.ts +++ b/apps/desktop/src/wsl/DesktopWslEnvironment.ts @@ -32,7 +32,11 @@ export interface EnsureWslNodePtyOptions { } export type EnsureWslNodePtyResult = - | { readonly ok: true; readonly nodePath: string; readonly resolvedPath: string } + | { + readonly ok: true; + readonly nodePath: string; + readonly resolvedPath: string; + } | { readonly ok: false; readonly reason: string; @@ -222,6 +226,7 @@ export const formatNodePtyProbeFailureReason = (exitCode: number): string | null const NODE_PTY_PROBE_SCRIPT = ( linuxServerDir: string, ) => `printf 'nodePath:%s\\n' "$(command -v node 2>/dev/null)" +printf 'nodeVersion:%s\\n' "$(node -p 'process.versions.node' 2>/dev/null)" printf 'resolvedPath:%s\\n' "$PATH" cd ${shellQuote(linuxServerDir)} && node <<'NODE' >/dev/null 2>&1 // The server bundle externalizes its deps to node_modules, and the WSL Node @@ -318,6 +323,16 @@ export const parseNodePath = (stdout: string): string | null => { return path ?? null; }; +export const parseNodeVersion = (stdout: string): string | null => { + const version = stdout + .split("\n") + .map((line) => line.trim()) + .filter((line) => line.startsWith("nodeVersion:")) + .map((line) => line.slice("nodeVersion:".length).trim()) + .find((value) => value.length > 0); + return version ?? null; +}; + // Captures the login-shell PATH after the shared resolver has loaded version // managers. Preserve the value byte-for-byte apart from a Windows-style CR so // paths containing spaces or apostrophes can be forwarded as one env argv. @@ -404,7 +419,11 @@ const ensureNodePtyImpl = ( const transportFailureReason = formatWslShellTransportFailureReason(probe.transportFailure); if (transportFailureReason !== null) { - return { ok: false, reason: transportFailureReason, fatal: false } as const; + return { + ok: false, + reason: transportFailureReason, + fatal: false, + } as const; } // No node at all, even after the shared resolver repaired PATH. Surface @@ -457,12 +476,31 @@ const ensureNodePtyImpl = ( } as const; } - if (probe.exitCode === 0) return { ok: true, nodePath, resolvedPath } as const; + if (probe.exitCode === 0) { + const rawVersion = parseNodeVersion(probe.stdout); + if ( + rawVersion !== null && + options.nodeEngineRange && + !satisfiesSemverRange(rawVersion, options.nodeEngineRange.trim()) + ) { + const range = options.nodeEngineRange.trim(); + return { + ok: false, + reason: `WSL Node.js ${rawVersion} does not satisfy the server's required engine range (${range}). Install a compatible version, and restart the desktop app.`, + fatal: true, + } as const; + } + return { ok: true, nodePath, resolvedPath } as const; + } if (options.allowBuild !== true) { const packagedProbeFailure = formatNodePtyProbeFailureReason(probe.exitCode); if (packagedProbeFailure !== null) { - return { ok: false, reason: packagedProbeFailure, fatal: true } as const; + return { + ok: false, + reason: packagedProbeFailure, + fatal: true, + } as const; } } diff --git a/apps/marketing/public/harnesses/grok-dark.svg b/apps/marketing/public/harnesses/grok-dark.svg new file mode 100644 index 00000000000..d094fcc6f85 --- /dev/null +++ b/apps/marketing/public/harnesses/grok-dark.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/apps/marketing/src/pages/index.astro b/apps/marketing/src/pages/index.astro index 477daeb3cb0..9d1cfbdd125 100644 --- a/apps/marketing/src/pages/index.astro +++ b/apps/marketing/src/pages/index.astro @@ -33,6 +33,9 @@ const mobileEndorsementRows = [ + + +
@@ -41,7 +44,7 @@ const mobileEndorsementRows = [

- Orchestrate Claude Code, Codex, OpenCode and Cursor from one surface. + Orchestrate Claude Code, Codex, OpenCode, Cursor, and Grok from one surface. Bring your own subscription. Fork the whole thing.

@@ -173,7 +176,7 @@ const mobileEndorsementRows = [

Bring your own sub

T3 Code doesn't resell tokens. Plug in Claude Code, Codex, OpenCode, - or Cursor with the credentials you already have — we orchestrate + Cursor, or Grok with the credentials you already have — we orchestrate them, you keep your plan.

@@ -207,6 +210,13 @@ const mobileEndorsementRows = [
cursor-agent
+
+
+
+
Grok CLI
+
grok login
+
+
@@ -615,8 +625,9 @@ const mobileEndorsementRows = [ .hero-float-mark.hf-claude { background: radial-gradient(circle at 30% 25%, rgba(217, 119, 87, 0.22), rgba(20, 20, 24, 0.92) 65%); top: 8%; left: 7%; animation-delay: 0s; transform: rotate(-8deg); } .hero-float-mark.hf-codex { background: radial-gradient(circle at 30% 25%, rgba(255, 255, 255, 0.08), rgba(20, 20, 24, 0.92) 65%); top: 6%; right: 7%; animation-delay: -2.5s; transform: rotate(6deg); } - .hero-float-mark.hf-opencode { background: radial-gradient(circle at 30% 25%, rgba(255, 255, 255, 0.06), rgba(20, 20, 24, 0.92) 65%); top: 32%; left: 5%; animation-delay: -5s; transform: rotate(4deg); } + .hero-float-mark.hf-opencode { background: radial-gradient(circle at 30% 25%, rgba(255, 255, 255, 0.06), rgba(20, 20, 24, 0.92) 65%); top: 30%; left: 5%; animation-delay: -5s; transform: rotate(4deg); } .hero-float-mark.hf-cursor { background: radial-gradient(circle at 30% 25%, rgba(255, 255, 255, 0.08), rgba(20, 20, 24, 0.92) 65%); top: 30%; right: 5%; animation-delay: -7s; transform: rotate(-5deg); } + .hero-float-mark.hf-grok { background: radial-gradient(circle at 30% 25%, rgba(255, 255, 255, 0.08), rgba(20, 20, 24, 0.92) 65%); top: 52%; left: 6%; animation-delay: -1.2s; transform: rotate(3deg); } @media (max-width: 1180px) { .hero-float-mark { width: 76px; height: 76px; border-radius: 20px; } @@ -625,6 +636,7 @@ const mobileEndorsementRows = [ .hero-float-mark.hf-codex { top: 2%; right: 3%; } .hero-float-mark.hf-opencode { top: 26%; left: 2%; } .hero-float-mark.hf-cursor { top: 24%; right: 2%; } + .hero-float-mark.hf-grok { top: 48%; left: 2%; transform: rotate(3deg); } } @media (max-width: 820px) { @@ -659,17 +671,18 @@ const mobileEndorsementRows = [ height: 44px; } - /* Two above the title, two flanking the call-to-action area. */ + /* Three stacked on the left, two on the right — keeps the center CTA clear. */ .hero-float-mark.hf-claude { top: 44px; left: 10px; transform: rotate(-10deg); } - .hero-float-mark.hf-codex { - top: 44px; - right: 10px; - transform: rotate(8deg); + .hero-float-mark.hf-grok { + top: 240px; + left: 4px; + right: auto; + transform: rotate(-4deg); } .hero-float-mark.hf-opencode { @@ -679,6 +692,12 @@ const mobileEndorsementRows = [ transform: rotate(-6deg); } + .hero-float-mark.hf-codex { + top: 44px; + right: 10px; + transform: rotate(8deg); + } + .hero-float-mark.hf-cursor { top: 474px; right: 4px; @@ -688,6 +707,14 @@ const mobileEndorsementRows = [ } @media (max-width: 340px) { + .hero-float-mark.hf-grok { + top: 220px; + left: 0; + width: 52px; + height: 52px; + border-radius: 14px; + } + .hero-float-mark.hf-opencode, .hero-float-mark.hf-cursor { top: 580px; @@ -704,6 +731,7 @@ const mobileEndorsementRows = [ right: 0; } + .hero-float-mark.hf-grok img, .hero-float-mark.hf-opencode img, .hero-float-mark.hf-cursor img { width: 30px; @@ -750,7 +778,7 @@ const mobileEndorsementRows = [ .harness-grid { display: grid; - grid-template-columns: repeat(4, 1fr); + grid-template-columns: repeat(5, 1fr); gap: 0; border: 1px solid var(--border); border-radius: var(--radius); @@ -1205,6 +1233,10 @@ const mobileEndorsementRows = [ .harness-grid { grid-template-columns: 1fr 1fr; } .harness { border-right: 0; border-bottom: 1px solid var(--border); } .harness:nth-child(odd) { border-right: 1px solid var(--border); } + .harness:nth-child(5):last-child { + grid-column: 1 / -1; + border-right: 0; + } .git-inner { grid-template-columns: 1fr; gap: 40px; } .open-grid { grid-template-columns: 1fr; } } diff --git a/apps/mobile/src/Stack.tsx b/apps/mobile/src/Stack.tsx index 4eb4a5061e8..db244d7c726 100644 --- a/apps/mobile/src/Stack.tsx +++ b/apps/mobile/src/Stack.tsx @@ -15,6 +15,7 @@ import { DynamicColorIOS, Platform, Pressable, ScrollView, StyleSheet } from "re import { useResolveClassNames } from "uniwind"; import { AppText as Text } from "./components/AppText"; +import { renderCompactBrandTitle } from "./components/CompactBrandTitle"; import { ArchivedThreadsRouteScreen } from "./features/archive/ArchivedThreadsRouteScreen"; import { useAgentNotificationNavigation } from "./features/agent-awareness/notificationNavigation"; import { ClerkSettingsSheetDetentProvider } from "./features/cloud/ClerkSettingsSheetDetent"; @@ -377,7 +378,8 @@ export const RootStack = createNativeStackNavigator({ ...GLASS_HEADER_OPTIONS, contentStyle: { backgroundColor: "transparent" }, headerBackVisible: false, - title: "Threads", + headerTitle: renderCompactBrandTitle, + title: "T3 Code", }, }), Thread: createNativeStackScreen({ diff --git a/apps/mobile/src/components/CompactBrandTitle.tsx b/apps/mobile/src/components/CompactBrandTitle.tsx new file mode 100644 index 00000000000..2ecf34aa40c --- /dev/null +++ b/apps/mobile/src/components/CompactBrandTitle.tsx @@ -0,0 +1,60 @@ +import { View } from "react-native"; + +import { AppText as Text } from "./AppText"; +import { T3Wordmark } from "./T3Wordmark"; +import { useThemeColor } from "../lib/useThemeColor"; + +/** + * Compact brand lockup sized for native navigation bars. + */ +export function CompactBrandTitle() { + const iconColor = useThemeColor("--color-icon"); + const mutedColor = useThemeColor("--color-foreground-muted"); + const subtleColor = useThemeColor("--color-subtle"); + + return ( + + + + Code + + + + Alpha + + + + ); +} + +export function renderCompactBrandTitle() { + return ; +} diff --git a/apps/mobile/src/features/home/HomeRouteScreen.tsx b/apps/mobile/src/features/home/HomeRouteScreen.tsx index 49cf06d85ec..cd9467c774e 100644 --- a/apps/mobile/src/features/home/HomeRouteScreen.tsx +++ b/apps/mobile/src/features/home/HomeRouteScreen.tsx @@ -4,6 +4,7 @@ import { useNavigation } from "@react-navigation/native"; import { useMemo, useState } from "react"; import { NativeHeaderToolbar, NativeStackScreenOptions } from "../../native/StackHeader"; +import { renderCompactBrandTitle } from "../../components/CompactBrandTitle"; import { useProjects, useThreadShells } from "../../state/entities"; import { usePendingNewTasks } from "../../state/use-pending-new-tasks"; import { useWorkspaceState } from "../../state/workspace"; @@ -86,7 +87,9 @@ export function HomeRouteScreen() { > <> {/* Restore the compact title in case the split branch blanked it. */} - + { + it("replaces a client command timestamp with the server receipt timestamp", () => { + const command: ClientOrchestrationCommand = { + type: "project.create", + commandId: CommandId.make("command-1"), + projectId: ProjectId.make("project-1"), + title: "Clock-safe project", + workspaceRoot: "/tmp/clock-safe-project", + createdAt: clientCreatedAt, + }; + + expect(canonicalizeClientCommandTimestamps(command, serverReceivedAt)).toEqual({ + ...command, + createdAt: serverReceivedAt, + }); + }); + + it("replaces both timestamps when the first turn bootstraps a thread", () => { + const command: ClientOrchestrationCommand = { + type: "thread.turn.start", + commandId: CommandId.make("command-2"), + threadId: ThreadId.make("thread-1"), + message: { + messageId: MessageId.make("message-1"), + role: "user", + text: "Start a thread", + attachments: [], + }, + runtimeMode: "full-access", + interactionMode: "default", + bootstrap: { + createThread: { + projectId: ProjectId.make("project-1"), + title: "Clock-safe thread", + modelSelection: { + instanceId: ProviderInstanceId.make("codex"), + model: "gpt-5.4", + }, + runtimeMode: "full-access", + interactionMode: "default", + branch: null, + worktreePath: null, + createdAt: clientCreatedAt, + }, + }, + createdAt: clientCreatedAt, + }; + + const result = canonicalizeClientCommandTimestamps(command, serverReceivedAt); + + expect(result.type).toBe("thread.turn.start"); + if (result.type !== "thread.turn.start") { + throw new Error("Expected a thread.turn.start command"); + } + expect(result.createdAt).toBe(serverReceivedAt); + expect(result.bootstrap?.createThread?.createdAt).toBe(serverReceivedAt); + }); +}); diff --git a/apps/server/src/orchestration/Normalizer.ts b/apps/server/src/orchestration/Normalizer.ts index bed166eba45..24c65900b29 100644 --- a/apps/server/src/orchestration/Normalizer.ts +++ b/apps/server/src/orchestration/Normalizer.ts @@ -1,8 +1,10 @@ +import * as DateTime from "effect/DateTime"; import * as Effect from "effect/Effect"; import * as FileSystem from "effect/FileSystem"; import * as Path from "effect/Path"; import { type ClientOrchestrationCommand, + type IsoDateTime, type OrchestrationCommand, OrchestrationDispatchCommandError, PROVIDER_SEND_TURN_MAX_IMAGE_BYTES, @@ -13,8 +15,38 @@ import { ServerConfig } from "../config.ts"; import { parseBase64DataUrl } from "../imageMime.ts"; import * as WorkspacePaths from "../workspace/WorkspacePaths.ts"; +export const canonicalizeClientCommandTimestamps = ( + command: ClientOrchestrationCommand, + receivedAt: IsoDateTime, +): ClientOrchestrationCommand => { + const canonicalCommand = + "createdAt" in command + ? { + ...command, + createdAt: receivedAt, + } + : command; + + if (canonicalCommand.type !== "thread.turn.start" || !canonicalCommand.bootstrap?.createThread) { + return canonicalCommand; + } + + return { + ...canonicalCommand, + bootstrap: { + ...canonicalCommand.bootstrap, + createThread: { + ...canonicalCommand.bootstrap.createThread, + createdAt: receivedAt, + }, + }, + }; +}; + export const normalizeDispatchCommand = (command: ClientOrchestrationCommand) => Effect.gen(function* () { + const receivedAt = DateTime.formatIso(yield* DateTime.now); + const canonicalCommand = canonicalizeClientCommandTimestamps(command, receivedAt); const fileSystem = yield* FileSystem.FileSystem; const path = yield* Path.Path; const serverConfig = yield* ServerConfig; @@ -47,30 +79,33 @@ export const normalizeDispatchCommand = (command: ClientOrchestrationCommand) => ), ); - if (command.type === "project.create") { + if (canonicalCommand.type === "project.create") { return { - ...command, + ...canonicalCommand, workspaceRoot: yield* normalizeProjectWorkspaceRootForCreate( - command.workspaceRoot, - command.createWorkspaceRootIfMissing, + canonicalCommand.workspaceRoot, + canonicalCommand.createWorkspaceRootIfMissing, ), - createWorkspaceRootIfMissing: command.createWorkspaceRootIfMissing === true, + createWorkspaceRootIfMissing: canonicalCommand.createWorkspaceRootIfMissing === true, } satisfies OrchestrationCommand; } - if (command.type === "project.meta.update" && command.workspaceRoot !== undefined) { + if ( + canonicalCommand.type === "project.meta.update" && + canonicalCommand.workspaceRoot !== undefined + ) { return { - ...command, - workspaceRoot: yield* normalizeProjectWorkspaceRoot(command.workspaceRoot), + ...canonicalCommand, + workspaceRoot: yield* normalizeProjectWorkspaceRoot(canonicalCommand.workspaceRoot), } satisfies OrchestrationCommand; } - if (command.type !== "thread.turn.start") { - return command as OrchestrationCommand; + if (canonicalCommand.type !== "thread.turn.start") { + return canonicalCommand as OrchestrationCommand; } const normalizedAttachments = yield* Effect.forEach( - command.message.attachments, + canonicalCommand.message.attachments, (attachment) => Effect.gen(function* () { const parsed = parseBase64DataUrl(attachment.dataUrl); @@ -87,7 +122,7 @@ export const normalizeDispatchCommand = (command: ClientOrchestrationCommand) => }); } - const attachmentId = createAttachmentId(command.threadId); + const attachmentId = createAttachmentId(canonicalCommand.threadId); if (!attachmentId) { return yield* new OrchestrationDispatchCommandError({ message: "Failed to create a safe attachment id.", @@ -135,9 +170,9 @@ export const normalizeDispatchCommand = (command: ClientOrchestrationCommand) => ); return { - ...command, + ...canonicalCommand, message: { - ...command.message, + ...canonicalCommand.message, attachments: normalizedAttachments, }, } satisfies OrchestrationCommand; diff --git a/apps/server/src/provider/Layers/OpenCodeAdapter.test.ts b/apps/server/src/provider/Layers/OpenCodeAdapter.test.ts index d0475e25284..b227ff1ab66 100644 --- a/apps/server/src/provider/Layers/OpenCodeAdapter.test.ts +++ b/apps/server/src/provider/Layers/OpenCodeAdapter.test.ts @@ -248,6 +248,38 @@ it.layer(OpenCodeAdapterTestLayer)("OpenCodeAdapterLive", (it) => { }), ); + it.effect("fails sendTurn for missing sessions through the typed error channel", () => + Effect.gen(function* () { + const adapter = yield* OpenCodeAdapter; + const result = yield* adapter + .sendTurn({ + threadId: asThreadId("thread-opencode-missing-send"), + input: "hello", + attachments: [], + }) + .pipe(Effect.result); + + NodeAssert.equal(result._tag, "Failure"); + NodeAssert.equal(result.failure._tag, "ProviderAdapterSessionNotFoundError"); + NodeAssert.equal(result.failure.provider, "opencode"); + NodeAssert.equal(result.failure.threadId, "thread-opencode-missing-send"); + }), + ); + + it.effect("fails stopSession for missing sessions through the typed error channel", () => + Effect.gen(function* () { + const adapter = yield* OpenCodeAdapter; + const result = yield* adapter + .stopSession(asThreadId("thread-opencode-missing-stop")) + .pipe(Effect.result); + + NodeAssert.equal(result._tag, "Failure"); + NodeAssert.equal(result.failure._tag, "ProviderAdapterSessionNotFoundError"); + NodeAssert.equal(result.failure.provider, "opencode"); + NodeAssert.equal(result.failure.threadId, "thread-opencode-missing-stop"); + }), + ); + it.effect("stops a configured-server session without trying to own server lifecycle", () => Effect.gen(function* () { const adapter = yield* OpenCodeAdapter; diff --git a/apps/server/src/provider/Layers/OpenCodeAdapter.ts b/apps/server/src/provider/Layers/OpenCodeAdapter.ts index 85ab41f8f3c..e7c58d757e6 100644 --- a/apps/server/src/provider/Layers/OpenCodeAdapter.ts +++ b/apps/server/src/provider/Layers/OpenCodeAdapter.ts @@ -229,28 +229,25 @@ function appendTurnItem( resolveTurnSnapshot(context, turnId).items.push(item); } -function ensureSessionContext( +const ensureSessionContext = Effect.fn("ensureSessionContext")(function* ( sessions: ReadonlyMap, threadId: ThreadId, -): OpenCodeSessionContext { +) { const session = sessions.get(threadId); if (!session) { - throw new ProviderAdapterSessionNotFoundError({ + return yield* new ProviderAdapterSessionNotFoundError({ provider: PROVIDER, threadId, }); } - // `ensureSessionContext` is a sync gate used from both sync helpers and - // Effect bodies. `Ref.getUnsafe` is an atomic read of the backing cell — - // no fiber suspension required, which keeps this callable everywhere. - if (Ref.getUnsafe(session.stopped)) { - throw new ProviderAdapterSessionClosedError({ + if (yield* Ref.get(session.stopped)) { + return yield* new ProviderAdapterSessionClosedError({ provider: PROVIDER, threadId, }); } return session; -} +}); function normalizeQuestionRequest(request: QuestionRequest): ReadonlyArray { return request.questions.map((question, index) => ({ @@ -1168,7 +1165,7 @@ export function makeOpenCodeAdapter( ); const sendTurn: OpenCodeAdapterShape["sendTurn"] = Effect.fn("sendTurn")(function* (input) { - const context = ensureSessionContext(sessions, input.threadId); + const context = yield* ensureSessionContext(sessions, input.threadId); // A sendTurn while a turn is active is a steer: OpenCode queues the // prompt into the busy session and the work continues as one turn, so // the active turn id is reused instead of opening a new turn. @@ -1292,7 +1289,7 @@ export function makeOpenCodeAdapter( const interruptTurn: OpenCodeAdapterShape["interruptTurn"] = Effect.fn("interruptTurn")( function* (threadId, turnId) { - const context = ensureSessionContext(sessions, threadId); + const context = yield* ensureSessionContext(sessions, threadId); yield* runOpenCodeSdk("session.abort", () => context.client.session.abort({ sessionID: context.openCodeSessionId }), ).pipe(Effect.mapError(toRequestError)); @@ -1314,7 +1311,7 @@ export function makeOpenCodeAdapter( const respondToRequest: OpenCodeAdapterShape["respondToRequest"] = Effect.fn( "respondToRequest", )(function* (threadId, requestId, decision) { - const context = ensureSessionContext(sessions, threadId); + const context = yield* ensureSessionContext(sessions, threadId); if (!context.pendingPermissions.has(requestId)) { return yield* new ProviderAdapterRequestError({ provider: PROVIDER, @@ -1334,7 +1331,7 @@ export function makeOpenCodeAdapter( const respondToUserInput: OpenCodeAdapterShape["respondToUserInput"] = Effect.fn( "respondToUserInput", )(function* (threadId, requestId, answers) { - const context = ensureSessionContext(sessions, threadId); + const context = yield* ensureSessionContext(sessions, threadId); const request = context.pendingQuestions.get(requestId); if (!request) { return yield* new ProviderAdapterRequestError({ @@ -1356,7 +1353,7 @@ export function makeOpenCodeAdapter( function* (threadId) { const context = sessions.get(threadId); if (!context) { - throw new ProviderAdapterSessionNotFoundError({ + return yield* new ProviderAdapterSessionNotFoundError({ provider: PROVIDER, threadId, }); @@ -1386,7 +1383,7 @@ export function makeOpenCodeAdapter( const readThread: OpenCodeAdapterShape["readThread"] = Effect.fn("readThread")( function* (threadId) { - const context = ensureSessionContext(sessions, threadId); + const context = yield* ensureSessionContext(sessions, threadId); const messages = yield* runOpenCodeSdk("session.messages", () => context.client.session.messages({ sessionID: context.openCodeSessionId, @@ -1412,7 +1409,7 @@ export function makeOpenCodeAdapter( const rollbackThread: OpenCodeAdapterShape["rollbackThread"] = Effect.fn("rollbackThread")( function* (threadId, numTurns) { - const context = ensureSessionContext(sessions, threadId); + const context = yield* ensureSessionContext(sessions, threadId); const messages = yield* runOpenCodeSdk("session.messages", () => context.client.session.messages({ sessionID: context.openCodeSessionId, diff --git a/apps/web/public/apple-touch-icon.png b/apps/web/public/apple-touch-icon.png index e0e1b9659b8..3eed25ea6b7 100644 Binary files a/apps/web/public/apple-touch-icon.png and b/apps/web/public/apple-touch-icon.png differ diff --git a/apps/web/public/favicon-16x16.png b/apps/web/public/favicon-16x16.png index 673d8459998..a3431b8c6df 100644 Binary files a/apps/web/public/favicon-16x16.png and b/apps/web/public/favicon-16x16.png differ diff --git a/apps/web/public/favicon-32x32.png b/apps/web/public/favicon-32x32.png index 25bcc95d4aa..862f7629971 100644 Binary files a/apps/web/public/favicon-32x32.png and b/apps/web/public/favicon-32x32.png differ diff --git a/apps/web/public/favicon.ico b/apps/web/public/favicon.ico index 36975b99782..750da22602e 100644 Binary files a/apps/web/public/favicon.ico and b/apps/web/public/favicon.ico differ diff --git a/apps/web/src/components/AppSidebarLayout.tsx b/apps/web/src/components/AppSidebarLayout.tsx index aefa9ab9f41..07ec0dc9077 100644 --- a/apps/web/src/components/AppSidebarLayout.tsx +++ b/apps/web/src/components/AppSidebarLayout.tsx @@ -1,5 +1,5 @@ import { useAtomValue } from "@effect/atom-react"; -import { useEffect, useRef, useState, type CSSProperties, type ReactNode } from "react"; +import { useEffect, useState, type CSSProperties, type ReactNode } from "react"; import { useLocation, useNavigate } from "@tanstack/react-router"; import { isElectron } from "../env"; @@ -56,8 +56,6 @@ function SidebarControl() { export function AppSidebarLayout({ children }: { children: ReactNode }) { const navigate = useNavigate(); const pathname = useLocation({ select: (location) => location.pathname }); - const pathnameRef = useRef(pathname); - pathnameRef.current = pathname; const isMacosDesktop = isElectron && isMacPlatform(navigator.platform); const [isWindowFullscreen, setIsWindowFullscreen] = useState(() => { const getWindowFullscreenState = window.desktopBridge?.getWindowFullscreenState; @@ -95,7 +93,7 @@ export function AppSidebarLayout({ children }: { children: ReactNode }) { const unsubscribe = onMenuAction((action) => { if (action === "open-settings") { - const isSettingsRoute = /^\/settings(\/|$)/.test(pathnameRef.current); + const isSettingsRoute = /^\/settings(\/|$)/.test(pathname); if (!isSettingsRoute) { void navigate({ to: "/settings" }); } @@ -105,7 +103,7 @@ export function AppSidebarLayout({ children }: { children: ReactNode }) { return () => { unsubscribe?.(); }; - }, [navigate]); + }, [navigate, pathname]); return ( diff --git a/apps/web/src/components/ChatView.logic.test.ts b/apps/web/src/components/ChatView.logic.test.ts index 1e0d1dded4a..5fb66aee6b2 100644 --- a/apps/web/src/components/ChatView.logic.test.ts +++ b/apps/web/src/components/ChatView.logic.test.ts @@ -1,4 +1,11 @@ -import { EnvironmentId, ProjectId, ProviderInstanceId, ThreadId, TurnId } from "@t3tools/contracts"; +import { + EnvironmentId, + MessageId, + ProjectId, + ProviderInstanceId, + ThreadId, + TurnId, +} from "@t3tools/contracts"; import { describe, expect, it } from "vite-plus/test"; import type { Thread } from "../types"; @@ -360,6 +367,7 @@ describe("hasServerAcknowledgedLocalDispatch", () => { localDispatch, phase: "ready", latestTurn: completedTurn, + latestUserMessageId: localDispatch.latestUserMessageId, session: readySession, hasPendingApproval: false, hasPendingUserInput: false, @@ -385,6 +393,7 @@ describe("hasServerAcknowledgedLocalDispatch", () => { localDispatch, phase: "ready", latestTurn: newerTurn, + latestUserMessageId: localDispatch.latestUserMessageId, session: { ...readySession, updatedAt: newerTurn.completedAt }, hasPendingApproval: false, hasPendingUserInput: false, @@ -411,6 +420,7 @@ describe("hasServerAcknowledgedLocalDispatch", () => { localDispatch, phase: "running", latestTurn: runningTurn, + latestUserMessageId: localDispatch.latestUserMessageId, session: { ...readySession, status: "running", @@ -426,6 +436,7 @@ describe("hasServerAcknowledgedLocalDispatch", () => { localDispatch, phase: "running", latestTurn: runningTurn, + latestUserMessageId: localDispatch.latestUserMessageId, session: { ...readySession, status: "running", @@ -438,12 +449,56 @@ describe("hasServerAcknowledgedLocalDispatch", () => { ).toBe(true); }); + it("acknowledges a steering message projected onto the current running turn", () => { + const runningTurn = { + ...completedTurn, + state: "running" as const, + completedAt: null, + }; + const runningSession = { + ...readySession, + status: "running" as const, + activeTurnId: runningTurn.turnId, + }; + const localDispatch = createLocalDispatchSnapshot( + makeThread({ + latestTurn: runningTurn, + session: runningSession, + messages: [ + { + id: MessageId.make("message-before-steer"), + role: "user", + text: "Initial prompt", + turnId: runningTurn.turnId, + createdAt: runningTurn.requestedAt, + updatedAt: runningTurn.requestedAt, + streaming: false, + }, + ], + }), + ); + + expect( + hasServerAcknowledgedLocalDispatch({ + localDispatch, + phase: "running", + latestTurn: runningTurn, + latestUserMessageId: MessageId.make("message-steer"), + session: runningSession, + hasPendingApproval: false, + hasPendingUserInput: false, + threadError: null, + }), + ).toBe(true); + }); + it("acknowledges pending user interaction and errors immediately", () => { const localDispatch = createLocalDispatchSnapshot(makeThread()); const common = { localDispatch, phase: "ready" as const, latestTurn: null, + latestUserMessageId: localDispatch.latestUserMessageId, session: null, hasPendingApproval: false, hasPendingUserInput: false, diff --git a/apps/web/src/components/ChatView.logic.ts b/apps/web/src/components/ChatView.logic.ts index f5031ad1b7a..8d76522f800 100644 --- a/apps/web/src/components/ChatView.logic.ts +++ b/apps/web/src/components/ChatView.logic.ts @@ -388,6 +388,7 @@ export async function waitForStartedServerThread( export interface LocalDispatchSnapshot { startedAt: string; preparingWorktree: boolean; + latestUserMessageId: ChatMessage["id"] | null; latestTurnTurnId: TurnId | null; latestTurnRequestedAt: string | null; latestTurnStartedAt: string | null; @@ -402,9 +403,11 @@ export function createLocalDispatchSnapshot( ): LocalDispatchSnapshot { const latestTurn = activeThread?.latestTurn ?? null; const session = activeThread?.session ?? null; + const latestUserMessage = activeThread?.messages.findLast((message) => message.role === "user"); return { startedAt: new Date().toISOString(), preparingWorktree: Boolean(options?.preparingWorktree), + latestUserMessageId: latestUserMessage?.id ?? null, latestTurnTurnId: latestTurn?.turnId ?? null, latestTurnRequestedAt: latestTurn?.requestedAt ?? null, latestTurnStartedAt: latestTurn?.startedAt ?? null, @@ -418,6 +421,7 @@ export function hasServerAcknowledgedLocalDispatch(input: { localDispatch: LocalDispatchSnapshot | null; phase: SessionPhase; latestTurn: Thread["latestTurn"] | null; + latestUserMessageId: ChatMessage["id"] | null; session: Thread["session"] | null; hasPendingApproval: boolean; hasPendingUserInput: boolean; @@ -432,6 +436,8 @@ export function hasServerAcknowledgedLocalDispatch(input: { const latestTurn = input.latestTurn ?? null; const session = input.session ?? null; + const latestUserMessageChanged = + input.localDispatch.latestUserMessageId !== input.latestUserMessageId; const latestTurnChanged = input.localDispatch.latestTurnTurnId !== (latestTurn?.turnId ?? null) || input.localDispatch.latestTurnRequestedAt !== (latestTurn?.requestedAt ?? null) || @@ -439,6 +445,13 @@ export function hasServerAcknowledgedLocalDispatch(input: { input.localDispatch.latestTurnCompletedAt !== (latestTurn?.completedAt ?? null); if (input.phase === "running") { + // Steering adds a user message to the current running turn without + // necessarily changing any of the turn timestamps. Treat that projected + // message as the server acknowledgment so the composer does not remain + // stuck in its local "Sending" state until the turn settles. + if (latestUserMessageChanged) { + return true; + } if (!latestTurnChanged) { return false; } diff --git a/apps/web/src/components/ChatView.tsx b/apps/web/src/components/ChatView.tsx index f9f6cc6b338..e6aa2b5dc42 100644 --- a/apps/web/src/components/ChatView.tsx +++ b/apps/web/src/components/ChatView.tsx @@ -54,6 +54,7 @@ import { useRef, useState, } from "react"; +import { flushSync } from "react-dom"; import { useNavigate } from "@tanstack/react-router"; import { useShallow } from "zustand/react/shallow"; import { @@ -205,6 +206,7 @@ import { } from "../state/entities"; import { environmentShell } from "../state/shell"; import { ChatComposer, type ChatComposerHandle } from "./chat/ChatComposer"; +import { DraftHeroHeadline } from "./chat/DraftHeroHeadline"; import { ExpandedImageDialog } from "./chat/ExpandedImageDialog"; import { PullRequestThreadDialog } from "./PullRequestThreadDialog"; import { MessagesTimeline } from "./chat/MessagesTimeline"; @@ -216,6 +218,14 @@ import { resolveEffectiveEnvMode } from "./BranchToolbar.logic"; import { ProviderStatusBanner } from "./chat/ProviderStatusBanner"; import { ThreadErrorBanner } from "./chat/ThreadErrorBanner"; import { ComposerBannerStack, type ComposerBannerStackItem } from "./chat/ComposerBannerStack"; +import { + DRAFT_HERO_TRANSITION_ANIMATION_ID, + DRAFT_HERO_TRANSITION_DURATION_MS, + DRAFT_HERO_TRANSITION_EASING, + MOBILE_COMPOSER_VIEW_TRANSITION_NAME, + MOBILE_DRAFT_HEADLINE_VIEW_TRANSITION_NAME, + runMobileComposerTransition, +} from "./chat/draftHeroTransition"; import { MAX_HIDDEN_MOUNTED_TERMINAL_THREADS, buildExpiredTerminalContextToastCopy, @@ -260,6 +270,78 @@ const EMPTY_ACTIVITIES: OrchestrationThreadActivity[] = []; const EMPTY_PROVIDERS: ServerProvider[] = []; const EMPTY_PROVIDER_SKILLS: ServerProvider["skills"] = []; const EMPTY_PENDING_USER_INPUT_ANSWERS: Record = {}; +function useDraftHeroLayoutTransition(isDraftHeroState: boolean) { + const transitionGroupRef = useRef(null); + const composerAnchorRef = useRef(null); + const previousStateRef = useRef(isDraftHeroState); + const previousComposerRectRef = useRef(null); + const animationRef = useRef(null); + const attachTransitionGroupRef = (element: HTMLDivElement | null) => { + transitionGroupRef.current = element; + }; + const attachComposerAnchorRef = (element: HTMLDivElement | null) => { + composerAnchorRef.current = element; + }; + const captureComposerRect = () => { + previousComposerRectRef.current = composerAnchorRef.current?.getBoundingClientRect() ?? null; + }; + + useLayoutEffect(() => { + const transitionGroup = transitionGroupRef.current; + const nextComposerRect = composerAnchorRef.current?.getBoundingClientRect() ?? null; + const stateChanged = previousStateRef.current !== isDraftHeroState; + const prefersReducedMotion = + typeof window !== "undefined" && + window.matchMedia?.("(prefers-reduced-motion: reduce)").matches; + const mobileComposerTransitionActive = + typeof document !== "undefined" && + document.documentElement.dataset.mobileComposerRouteTransition === "true"; + + animationRef.current?.cancel(); + animationRef.current = null; + + const previousComposerRect = previousComposerRectRef.current; + if ( + stateChanged && + !prefersReducedMotion && + !mobileComposerTransitionActive && + transitionGroup && + previousComposerRect && + nextComposerRect && + typeof transitionGroup.animate === "function" + ) { + const translateX = previousComposerRect.left - nextComposerRect.left; + const translateY = previousComposerRect.top - nextComposerRect.top; + if (Math.abs(translateX) >= 0.5 || Math.abs(translateY) >= 0.5) { + const animation = transitionGroup.animate( + [ + { transform: `translate3d(${translateX}px, ${translateY}px, 0)` }, + { transform: "translate3d(0, 0, 0)" }, + ], + { + duration: DRAFT_HERO_TRANSITION_DURATION_MS, + easing: DRAFT_HERO_TRANSITION_EASING, + }, + ); + animation.id = DRAFT_HERO_TRANSITION_ANIMATION_ID; + animationRef.current = animation; + void animation.finished + .catch(() => undefined) + .then(() => { + if (animationRef.current !== animation) { + return; + } + animationRef.current = null; + }); + } + } + + previousStateRef.current = isDraftHeroState; + previousComposerRectRef.current = nextComposerRect; + }, [isDraftHeroState]); + + return [attachTransitionGroupRef, attachComposerAnchorRef, captureComposerRect] as const; +} const PreviewPanel = lazy(() => import("./preview/PreviewPanel").then((module) => ({ default: module.PreviewPanel })), ); @@ -358,6 +440,7 @@ type ChatViewProps = threadId: ThreadId; onDiffPanelOpen?: () => void; reserveTitleBarControlInset?: boolean; + forceExpandedMobileComposer?: boolean; routeKind: "server"; draftId?: never; } @@ -366,6 +449,7 @@ type ChatViewProps = threadId: ThreadId; onDiffPanelOpen?: () => void; reserveTitleBarControlInset?: boolean; + forceExpandedMobileComposer?: boolean; routeKind: "draft"; draftId: DraftId; }; @@ -387,6 +471,8 @@ function useLocalDispatchState(input: { threadError: string | null | undefined; }) { const [localDispatch, setLocalDispatch] = useState(null); + const latestUserMessageId = + input.activeThread?.messages.findLast((message) => message.role === "user")?.id ?? null; const resetLocalDispatch = useCallback(() => { setLocalDispatch(null); @@ -398,6 +484,7 @@ function useLocalDispatchState(input: { localDispatch, phase: input.phase, latestTurn: input.activeLatestTurn, + latestUserMessageId, session: input.activeThread?.session ?? null, hasPendingApproval: input.activePendingApproval !== null, hasPendingUserInput: input.activePendingUserInput !== null, @@ -410,6 +497,7 @@ function useLocalDispatchState(input: { input.activeThread?.session, input.phase, input.threadError, + latestUserMessageId, localDispatch, ], ); @@ -964,6 +1052,14 @@ const PersistentThreadTerminalPanel = memo(function PersistentThreadTerminalPane ); }); +// Errors surface through two maps (draft-keyed and thread-keyed) whose entries +// can race around promotion, so each write carries its time to let the latest +// one win when they collide. +type LocalThreadErrorEntry = { + readonly message: string | null; + readonly at: number; +}; + function ChatViewContent(props: ChatViewProps) { const { environmentId, @@ -971,6 +1067,7 @@ function ChatViewContent(props: ChatViewProps) { routeKind, onDiffPanelOpen, reserveTitleBarControlInset = true, + forceExpandedMobileComposer = false, } = props; const draftId = routeKind === "draft" ? props.draftId : null; const routeThreadRef = useMemo( @@ -1021,10 +1118,10 @@ function ChatViewContent(props: ChatViewProps) { ); const composerDraftTarget: ScopedThreadRef | DraftId = routeKind === "server" ? routeThreadRef : props.draftId; - const serverThread = useThread(routeKind === "server" ? routeThreadRef : null); + const serverThread = useThread(routeThreadRef); const markThreadVisited = useUiStateStore((store) => store.markThreadVisited); - const activeThreadLastVisitedAt = useUiStateStore((store) => - routeKind === "server" ? store.threadLastVisitedAtById[routeThreadKey] : undefined, + const activeThreadLastVisitedAt = useUiStateStore( + (store) => store.threadLastVisitedAtById[routeThreadKey], ); const settings = useEnvironmentSettings(environmentId); const setStickyComposerModelSelection = useComposerDraftStore( @@ -1089,10 +1186,10 @@ function ChatViewContent(props: ChatViewProps) { const optimisticUserMessagesRef = useRef(optimisticUserMessages); optimisticUserMessagesRef.current = optimisticUserMessages; const [localDraftErrorsByDraftId, setLocalDraftErrorsByDraftId] = useState< - Record + Record >({}); const [localServerErrorsByThreadKey, setLocalServerErrorsByThreadKey] = useState< - Record + Record >({}); const [isConnecting, _setIsConnecting] = useState(false); const [isRevertingCheckpoint, setIsRevertingCheckpoint] = useState(false); @@ -1204,11 +1301,45 @@ function ChatViewContent(props: ChatViewProps) { ? scopeProjectRef(draftThread.environmentId, draftThread.projectId) : null; const fallbackDraftProject = useProject(fallbackDraftProjectRef); - const localDraftError = - routeKind === "server" && serverThread - ? null - : ((draftId ? localDraftErrorsByDraftId[draftId] : null) ?? null); - const localServerError = localServerErrorsByThreadKey[routeThreadKey] ?? null; + const localDraftError = serverThread + ? null + : ((draftId ? localDraftErrorsByDraftId[draftId]?.message : null) ?? null); + const localServerError = localServerErrorsByThreadKey[routeThreadKey]?.message ?? null; + // Draft errors are keyed by draftId while server errors are keyed by thread + // key, so a pending draft entry must migrate when the server thread loads or + // a failed send would silently disappear on promotion. When both keys hold + // an entry, the most recent write wins. + useEffect(() => { + if (!serverThread || !draftId) { + return; + } + const pendingDraftEntry = localDraftErrorsByDraftId[draftId]; + if (pendingDraftEntry === undefined) { + return; + } + setLocalDraftErrorsByDraftId((existing) => { + if (existing[draftId] === undefined) { + return existing; + } + const next = { ...existing }; + delete next[draftId]; + return next; + }); + setLocalServerErrorsByThreadKey((existing) => { + const currentEntry = existing[routeThreadKey]; + if ( + currentEntry !== undefined && + (currentEntry.at > pendingDraftEntry.at || + currentEntry.message === pendingDraftEntry.message) + ) { + return existing; + } + return { + ...existing, + [routeThreadKey]: pendingDraftEntry, + }; + }); + }, [draftId, localDraftErrorsByDraftId, routeThreadKey, serverThread]); const localDraftThread = useMemo( () => draftThread @@ -1223,7 +1354,10 @@ function ChatViewContent(props: ChatViewProps) { : undefined, [draftThread, fallbackDraftProject?.defaultModelSelection, threadId], ); - const isServerThread = routeKind === "server" && serverThread !== null; + // Promotion is data-driven: the draft route keeps rendering while the + // server thread (same pre-allocated ref) starts, so live state must not + // depend on which route is mounted. + const isServerThread = serverThread !== null; const activeThread = isServerThread ? serverThread : localDraftThread; const threadError = isServerThread ? (localServerError ?? serverThread?.session?.lastError ?? null) @@ -2054,6 +2188,16 @@ function ChatViewContent(props: ChatViewProps) { deriveTimelineEntries(timelineMessages, activeThread?.proposedPlans ?? [], workLogEntries), [activeThread?.proposedPlans, timelineMessages, workLogEntries], ); + const [dockedDraftHeroThreadKey, setDockedDraftHeroThreadKey] = useState(null); + const draftHeroDockRequested = + activeThreadKey !== null && dockedDraftHeroThreadKey === activeThreadKey; + const isDraftHeroState = + isLocalDraftThread && timelineEntries.length === 0 && !isWorking && !draftHeroDockRequested; + const [ + attachDraftHeroTransitionGroupRef, + attachDraftHeroComposerAnchorRef, + captureDraftHeroComposerRect, + ] = useDraftHeroLayoutTransition(isDraftHeroState); const { turnDiffSummaries, inferredCheckpointTurnCountByTurnId } = useTurnDiffSummaries(activeThread); const turnDiffSummaryByAssistantMessageId = useMemo(() => { @@ -2103,12 +2247,13 @@ function ChatViewContent(props: ChatViewProps) { worktreePath: activeThread?.worktreePath ?? null, }) : null; + const gitStatusCwd = activeThread?.worktreePath ?? gitCwd; const gitStatusQuery = useEnvironmentQuery( - gitCwd === null + gitStatusCwd === null ? null : vcsEnvironment.status({ environmentId, - input: { cwd: gitCwd }, + input: { cwd: gitStatusCwd }, }), ); const keybindings = useAtomValue(primaryServerKeybindingsAtom); @@ -2142,6 +2287,9 @@ function ChatViewContent(props: ChatViewProps) { terminalUiLaunchContext?.threadId === activeThreadId ? terminalUiLaunchContext : null; // Default true while loading to avoid toolbar flicker. const isGitRepo = gitStatusQuery.data?.isRepo ?? true; + const initialDiffPanelGitScope = + gitStatusQuery.data?.hasWorkingTreeChanges === true ? "unstaged" : "branch"; + const diffPanelGitStatusResolutionKey = gitStatusQuery.data ? "resolved" : "pending"; const terminalShortcutLabelOptions = useMemo( () => ({ context: { @@ -2217,6 +2365,7 @@ function ChatViewContent(props: ChatViewProps) { (targetThreadId: ThreadId | null, error: string | null) => { if (!targetThreadId) return; const nextError = sanitizeThreadErrorMessage(error); + const nextEntry: LocalThreadErrorEntry = { message: nextError, at: Date.now() }; if ( serverThread && targetThreadId === routeThreadRef.threadId && @@ -2224,24 +2373,24 @@ function ChatViewContent(props: ChatViewProps) { serverThread.id === targetThreadId ) { setLocalServerErrorsByThreadKey((existing) => { - if ((existing[routeThreadKey] ?? null) === nextError) { + if ((existing[routeThreadKey]?.message ?? null) === nextError) { return existing; } return { ...existing, - [routeThreadKey]: nextError, + [routeThreadKey]: nextEntry, }; }); return; } const localDraftErrorKey = draftId ?? targetThreadId; setLocalDraftErrorsByDraftId((existing) => { - if ((existing[localDraftErrorKey] ?? null) === nextError) { + if ((existing[localDraftErrorKey]?.message ?? null) === nextError) { return existing; } return { ...existing, - [localDraftErrorKey]: nextError, + [localDraftErrorKey]: nextEntry, }; }); }, @@ -2749,9 +2898,19 @@ function ChatViewContent(props: ChatViewProps) { }, [activeThreadRef, openPreview]); const addDiffSurface = useCallback(() => { if (!activeThreadRef || !isServerThread || !isGitRepo) return; + if (planSidebarOpen) { + dismissPlanSidebarForCurrentTurn(); + } useRightPanelStore.getState().open(activeThreadRef, "diff"); onDiffPanelOpen?.(); - }, [activeThreadRef, isGitRepo, isServerThread, onDiffPanelOpen]); + }, [ + activeThreadRef, + dismissPlanSidebarForCurrentTurn, + isGitRepo, + isServerThread, + onDiffPanelOpen, + planSidebarOpen, + ]); const addFilesSurface = useCallback(() => { if (!activeThreadRef || !activeProject) return; useRightPanelStore.getState().open(activeThreadRef, "files"); @@ -4067,7 +4226,16 @@ function ChatViewContent(props: ChatViewProps) { } return; } - if (!activeProject) return; + if (!activeProject) { + toastManager.add( + stackedThreadToast({ + type: "warning", + title: "Choose a project first", + description: "This draft no longer points to an available project.", + }), + ); + return; + } const threadIdForSend = activeThread.id; const isFirstMessage = !isServerThread || activeThread.messages.length === 0; const baseBranchForWorktree = @@ -4085,6 +4253,21 @@ function ChatViewContent(props: ChatViewProps) { } sendInFlightRef.current = true; + if (isDraftHeroState && activeThreadKey) { + let resolveDockStarted: (() => void) | undefined; + const dockStarted = new Promise((resolve) => { + resolveDockStarted = resolve; + }); + const dockTransition = runMobileComposerTransition(() => { + flushSync(() => { + captureDraftHeroComposerRect(); + setDockedDraftHeroThreadKey(activeThreadKey); + }); + resolveDockStarted?.(); + }); + void dockTransition.catch(() => resolveDockStarted?.()); + await dockStarted; + } beginLocalDispatch({ preparingWorktree: Boolean(baseBranchForWorktree) }); const composerImagesSnapshot = [...composerImages]; @@ -4338,6 +4521,9 @@ function ChatViewContent(props: ChatViewProps) { } sendInFlightRef.current = false; if (!turnStartSucceeded) { + setDockedDraftHeroThreadKey((currentThreadKey) => + currentThreadKey === activeThreadKey ? null : currentThreadKey, + ); resetLocalDispatch(); } }; @@ -5123,7 +5309,12 @@ function ChatViewContent(props: ChatViewProps) { /> ) : activeRightPanelSurface?.kind === "diff" ? ( - + ) : activeRightPanelSurface?.kind === "plan" ? ( {/* scroll to end pill — shown when user has scrolled away from the live edge */} @@ -5281,135 +5473,188 @@ function ChatViewContent(props: ChatViewProps) { )}
- {/* Input bar */} + {/* Input bar — centered hero while a draft has no messages, docked at the bottom otherwise */}
-