From 840750b40adff9dcd9eef6af5e7c8cb78dbbe1f1 Mon Sep 17 00:00:00 2001
From: Niclas Jost <dev@niclasjost.de>
Date: Sun, 1 Nov 2026 17:34:29 +0100
Subject: [PATCH 1/5] Load chat screenshots on demand and refetch an open chat
 once per burst

The desktop fetched every chat whole, with each screenshot as base64 (one chat was 19.5 MB of JSON vs 0.78 MB light),
and refetched it on every message, queue, run and conversation event (three times when a turn ends). Desktop now asks
for ?lite=images (screenshots as imageUrl, tool output whole) and says messages.images on the socket so pushed
messages come without pictures too. Message events patch the cache and cancel an in-flight fetch instead of
refetching; run and conversation events refetch the chat once per 250 ms burst. Reading messages no longer scans all
of message_images, and a picture request reads its block with json_each instead of parsing the whole message.
---
 .../src/components/chat/message-blocks.tsx    | 27 ++++++++----
 apps/desktop/src/lib/api.ts                   |  2 +-
 apps/desktop/src/lib/realtime.ts              | 35 +++++++++++-----
 packages/core/src/server/routes/chat.ts       |  4 +-
 packages/core/src/server/ws.ts                | 10 ++++-
 packages/core/src/services/conversations.ts   | 42 +++++++++++++------
 packages/core/src/services/liteMessage.ts     | 12 ++++--
 packages/core/test/conversations.test.ts      | 23 ++++++++++
 packages/shared/src/events.ts                 |  2 +
 9 files changed, 119 insertions(+), 38 deletions(-)

diff --git a/apps/desktop/src/components/chat/message-blocks.tsx b/apps/desktop/src/components/chat/message-blocks.tsx
index aed34be8..62d36fea 100644
--- a/apps/desktop/src/components/chat/message-blocks.tsx
+++ b/apps/desktop/src/components/chat/message-blocks.tsx
@@ -32,6 +32,7 @@ import { useSmoothText } from "./use-smooth-text";
 import { UserBubble } from "./user-bubble";
 import { CopyButton } from "./copy-button";
 import { Lightbox } from "./lightbox";
+import { useCoreFileUrl } from "./core-file";
 import { PauseMarker } from "./pause";
 import { QuestionCard, viewOfBlock } from "./question-card";
 import { ArtifactCard } from "@/components/artifacts/artifact-panel";
@@ -441,6 +442,16 @@ function imageSrc(image: string): string {
   return `data:${mime};base64,${image}`;
 }
 
+type Picture = Pick<ToolUseBlock, "image" | "imageUrl">;
+
+const hasPicture = (b: Picture) => !!(b.image || b.imageUrl);
+
+function usePictureSrc(picture: Picture): string | null {
+  const data = useMemo(() => (picture.image ? imageSrc(picture.image) : null), [picture.image]);
+  const remote = useCoreFileUrl(data ? undefined : picture.imageUrl, true);
+  return data ?? remote.src;
+}
+
 function StreamingMarkdown({ text, className }: { text: string; className?: string }) {
   const reduce = useReduceAnimations();
   const smooth = useSmoothText(text);
@@ -608,7 +619,7 @@ function CompactToolGroup({ steps, ctx, streaming }: { steps: Step[]; ctx: ToolC
   const metas = tools.map((s) => describe(s.block.name, s.block.input, ctx));
   const runningIdx = streaming ? tools.findIndex((s) => stepRunning(s.block, true)) : -1;
   const failed = tools.filter((s) => s.block.isError).length;
-  const images = tools.filter((s) => s.block.image).map((s) => s.block.image!);
+  const images = tools.filter((s) => hasPicture(s.block)).map((s) => s.block);
   const expanded = manual ?? (streaming && !easy);
   const single = tools.length === 1;
 
@@ -651,7 +662,7 @@ function CompactToolGroup({ steps, ctx, streaming }: { steps: Step[]; ctx: ToolC
       {!expanded && images.length > 0 && (
         <span className="mt-1 flex gap-1">
           {images.slice(-3).map((img, i) => (
-            <Thumbnail key={i} image={img} />
+            <Thumbnail key={i} picture={img} />
           ))}
         </span>
       )}
@@ -769,7 +780,7 @@ function ToolStep({
 
   const body = (
     <>
-      {block.image && <Screenshot image={block.image} alt={meta.title} />}
+      {hasPicture(block) && <Screenshot picture={block} alt={meta.title} />}
       <Collapse open={open}>{easy ? <EasyStepDetails block={block} edit={edit} /> : <ToolDetails block={block} edit={edit} />}</Collapse>
     </>
   );
@@ -793,10 +804,11 @@ function ToolStep({
   );
 }
 
-function Screenshot({ image, alt }: { image: string; alt: string }) {
+function Screenshot({ picture, alt }: { picture: Picture; alt: string }) {
   const { t } = useTranslation(["chat", "common"]);
   const [zoom, setZoom] = useState(false);
-  const src = imageSrc(image);
+  const src = usePictureSrc(picture);
+  if (!src) return <div className="mt-1 mb-1.5 h-32 w-56 max-w-full animate-pulse rounded-lg border bg-muted/30" />;
   return (
     <>
       <button
@@ -812,10 +824,11 @@ function Screenshot({ image, alt }: { image: string; alt: string }) {
   );
 }
 
-function Thumbnail({ image }: { image: string }) {
+function Thumbnail({ picture }: { picture: Picture }) {
   const { t } = useTranslation("chat");
   const [zoom, setZoom] = useState(false);
-  const src = imageSrc(image);
+  const src = usePictureSrc(picture);
+  if (!src) return <div className="h-10 w-16 animate-pulse rounded-md border bg-muted/30" />;
   return (
     <>
       <button
diff --git a/apps/desktop/src/lib/api.ts b/apps/desktop/src/lib/api.ts
index 81578199..5a173547 100644
--- a/apps/desktop/src/lib/api.ts
+++ b/apps/desktop/src/lib/api.ts
@@ -681,7 +681,7 @@ export const api = {
     /** `ongoing`: only chats with work ahead (working, standing still, or continuing by themselves later). */
     list: (q: { agentId?: string; workspaceId?: ScopeFilter; projectId?: string; search?: string; limit?: number; archived?: boolean; ongoing?: boolean } = {}) =>
       get<Conversation[]>("/api/conversations", q),
-    get: (id: string) => get<ConversationWithMessages>(`/api/conversations/${id}`),
+    get: (id: string) => get<ConversationWithMessages>(`/api/conversations/${id}`, { lite: "images" }),
     create: (input: { agentId: string; title?: string; workspaceId?: string | null; projectId?: string | null }) => post<Conversation>("/api/conversations", input),
     update: (id: string, input: ConversationPatch) => patch<Conversation>(`/api/conversations/${id}`, input),
     delete: (id: string) => del<{ ok: true }>(`/api/conversations/${id}`),
diff --git a/apps/desktop/src/lib/realtime.ts b/apps/desktop/src/lib/realtime.ts
index e3bb4d14..7c53fa8a 100644
--- a/apps/desktop/src/lib/realtime.ts
+++ b/apps/desktop/src/lib/realtime.ts
@@ -171,6 +171,7 @@ async function connect(queryClient: QueryClient) {
     useLive.getState().setConnected(true);
     // Streaming replies as what changed instead of the whole block list every time.
     ws.send(JSON.stringify({ type: "deltas.patch" } satisfies ClientEvent));
+    ws.send(JSON.stringify({ type: "messages.images" } satisfies ClientEvent));
     while (pendingSends.length) ws.send(JSON.stringify(pendingSends.shift()));
     // A new socket doesn't know which chat this window shows.
     if (viewing) ws.send(JSON.stringify({ type: "conversation.view", conversationId: viewing } satisfies ClientEvent));
@@ -237,6 +238,22 @@ function refreshSoon(qc: QueryClient, queryKey: readonly unknown[], filters: Omi
 const LISTS_ONLY = { predicate: (q: { queryKey: readonly unknown[] }) => q.queryKey[1] !== "detail" };
 const conversationLists = { queryKey: qk.conversationsAll, ...LISTS_ONLY };
 
+/** The open chat once per burst: a turn that ends says so in three events, and each refetch is the whole chat. */
+const refreshChat = (qc: QueryClient, id: string) => refreshSoon(qc, qk.conversation(id));
+
+/**
+ * A change pushed into the cached chat. A fetch that started before it would bring the old state back: it is cancelled
+ * first (after the cancel, so its rollback can't undo the change) and the chat fetched again after the burst.
+ */
+function patchChat(qc: QueryClient, id: string, apply: () => void) {
+  const queryKey = qk.conversation(id);
+  if (!qc.isFetching({ queryKey })) return apply();
+  void qc.cancelQueries({ queryKey }).then(() => {
+    apply();
+    refreshChat(qc, id);
+  });
+}
+
 /** A stored message into the cached chat right away; the optimistic copy of a message the human just sent goes. */
 function upsertMessage(qc: QueryClient, message: Message) {
   qc.setQueryData<ConversationWithMessages>(qk.conversation(message.conversationId), (old) => {
@@ -266,7 +283,7 @@ function handle(qc: QueryClient, event: ServerEvent) {
     case "run.started":
       live.runStarted(event.run);
       qc.invalidateQueries({ queryKey: qk.runs });
-      qc.invalidateQueries({ queryKey: qk.conversation(event.run.conversationId) });
+      refreshChat(qc, event.run.conversationId);
       qc.invalidateQueries(conversationLists);
       refreshSoon(qc, qk.bootstrap);
       break;
@@ -278,7 +295,7 @@ function handle(qc: QueryClient, event: ServerEvent) {
       break;
     case "run.paused":
       live.runPaused(event.run);
-      qc.invalidateQueries({ queryKey: qk.conversation(event.run.conversationId) });
+      refreshChat(qc, event.run.conversationId);
       qc.invalidateQueries(conversationLists);
       qc.invalidateQueries({ queryKey: qk.runs });
       qc.invalidateQueries({ queryKey: qk.agents });
@@ -288,7 +305,7 @@ function handle(qc: QueryClient, event: ServerEvent) {
       qc.setQueryData<ConversationWithMessages>(qk.conversation(event.run.conversationId), (old) =>
         old && old.activeRunId === event.run.id ? { ...old, activeRunId: null } : old,
       );
-      qc.invalidateQueries({ queryKey: qk.conversation(event.run.conversationId) });
+      refreshChat(qc, event.run.conversationId);
       qc.invalidateQueries(conversationLists);
       qc.invalidateQueries({ queryKey: qk.runs });
       qc.invalidateQueries({ queryKey: qk.agents });
@@ -301,22 +318,20 @@ function handle(qc: QueryClient, event: ServerEvent) {
       break;
     case "message.created":
     case "message.updated":
-      upsertMessage(qc, event.message);
-      // A fetch that started before this message must not take it away again.
-      qc.invalidateQueries({ queryKey: qk.conversation(event.message.conversationId) });
+      patchChat(qc, event.message.conversationId, () => upsertMessage(qc, event.message));
       break;
     case "queue.updated": {
       const key = qk.conversation(event.conversationId);
-      qc.setQueryData<ConversationWithMessages>(key, (old) => (old ? { ...old, queue: withPending(event.conversationId, event.queue) } : old));
-      // A fetch that started before this change must not bring the old queue back.
-      qc.invalidateQueries({ queryKey: key });
+      patchChat(qc, event.conversationId, () =>
+        qc.setQueryData<ConversationWithMessages>(key, (old) => (old ? { ...old, queue: withPending(event.conversationId, event.queue) } : old)),
+      );
       break;
     }
     case "conversation.updated":
       refreshSoon(qc, qk.conversationsAll, LISTS_ONLY);
       // Unread and failed chats are on "Needs you".
       refreshSoon(qc, qk.bootstrap);
-      qc.invalidateQueries({ queryKey: qk.conversation(event.conversation.id) });
+      refreshChat(qc, event.conversation.id);
       // Follow-ups show the chat's title.
       qc.invalidateQueries({ queryKey: qk.followups });
       break;
diff --git a/packages/core/src/server/routes/chat.ts b/packages/core/src/server/routes/chat.ts
index 29d4c26f..58fbd0b8 100644
--- a/packages/core/src/server/routes/chat.ts
+++ b/packages/core/src/server/routes/chat.ts
@@ -12,6 +12,7 @@ import {
   chatAttachmentImage,
   messageImage,
   messageWindow,
+  windowMessages,
   markConversationsRead,
   markConversationsUnread,
   sendMessage,
@@ -19,7 +20,6 @@ import {
   updateConversation,
 } from "../../services/conversations";
 import { editQueued, removeQueued, sendQueuedNow, submitMessage } from "../../services/messageQueue";
-import { liteMessage } from "../../services/liteMessage";
 import { answerByMessage } from "../../services/questions";
 import { answererOf } from "./questions";
 import { replySettles } from "../../services/humanTasks";
@@ -130,7 +130,7 @@ export function registerChatRoutes(app: Hono): void {
     getConversationSummary(id);
     const { limit, lite } = messageWindow((name) => c.req.query(name));
     const page = listMessagePage(id, { limit: limit ?? 50, before: c.req.query("before") || undefined });
-    return c.json(lite ? { ...page, messages: page.messages.map(liteMessage) } : page);
+    return c.json(lite ? { ...page, messages: windowMessages(page.messages, lite) } : page);
   });
 
   // A picture a tool returned (a screenshot), for light answers that leave it out of the message.
diff --git a/packages/core/src/server/ws.ts b/packages/core/src/server/ws.ts
index 151eb618..c1aed6cf 100644
--- a/packages/core/src/server/ws.ts
+++ b/packages/core/src/server/ws.ts
@@ -25,6 +25,8 @@ export interface WsData {
   conversations?: Set<string>;
   /** The client applies `run.delta` patches (it said `deltas.patch`); the others get the whole block list. */
   patches?: boolean;
+  /** Stored messages come without their screenshots, each its own request (it said `messages.images`). */
+  imageUrls?: boolean;
   /** The chat this client shows right now in a visible, focused window (`conversation.view`). */
   viewing?: string | null;
   /** Android phones this client watches, and how (H.264 or still pictures). */
@@ -524,12 +526,15 @@ function sendDelta(event: RunDelta) {
 function sendMessage(event: Extract<ServerEvent, { type: "message.created" | "message.updated" }>) {
   let full: string | null = null;
   let lite: string | null = null;
+  let images: string | null = null;
   for (const ws of audience()) {
     const device = ws.data.auth === "device";
     if (device && !ws.data.conversations?.has(event.message.conversationId)) continue;
     const payload = device
       ? (lite ??= JSON.stringify({ ...event, message: liteMessage(event.message) }))
-      : (full ??= timedSync(`send ${event.type}`, () => JSON.stringify(event)));
+      : ws.data.imageUrls && !ws.data.link
+        ? (images ??= JSON.stringify({ ...event, message: liteMessage(event.message, false) }))
+        : (full ??= timedSync(`send ${event.type}`, () => JSON.stringify(event)));
     try {
       ws.send(payload);
     } catch {
@@ -671,6 +676,9 @@ export const websocketHandler = {
       case "deltas.patch":
         ws.data.patches = true;
         break;
+      case "messages.images":
+        ws.data.imageUrls = true;
+        break;
       case "run.resync":
         if (typeof msg.runId !== "string" || msg.runId.length > 100) break;
         if (forwarded() && !ws.data.link) {
diff --git a/packages/core/src/services/conversations.ts b/packages/core/src/services/conversations.ts
index f95785b8..0766f79b 100644
--- a/packages/core/src/services/conversations.ts
+++ b/packages/core/src/services/conversations.ts
@@ -391,18 +391,23 @@ export function chatFillOnly(conversationId: string): boolean {
 
 /**
  * Which messages a client wants: all of them (default), or the latest `limit`. `lite`: screenshots as their own requests
- * and long tool output cut, for phones and other slow links (a long chat is megabytes of base64 pictures).
+ * and long tool output cut, for phones and other slow links (a long chat is megabytes of base64 pictures). `"images"`:
+ * only the screenshots as their own requests, tool output in full (the desktop app).
  */
 export interface MessageWindow {
   limit?: number;
-  lite?: boolean;
+  lite?: boolean | "images";
 }
 
-/** From a request's `?limit=` and `?lite=1`. */
+/** From a request's `?limit=` and `?lite=1` (or `?lite=images`). */
 export function messageWindow(query: (name: string) => string | undefined): MessageWindow {
   const limit = Number(query("limit"));
   const lite = query("lite");
-  return { limit: Number.isFinite(limit) && limit > 0 ? limit : undefined, lite: lite === "1" || lite === "true" };
+  return { limit: Number.isFinite(limit) && limit > 0 ? limit : undefined, lite: lite === "images" ? "images" : lite === "1" || lite === "true" };
+}
+
+export function windowMessages(messages: Message[], lite: MessageWindow["lite"]): Message[] {
+  return lite ? messages.map((m) => liteMessage(m, lite === true)) : messages;
 }
 
 export function getConversation(id: string, window: MessageWindow = {}): ConversationWithMessages {
@@ -412,7 +417,7 @@ export function getConversation(id: string, window: MessageWindow = {}): Convers
   const messages = page?.messages ?? listMessages(id);
   return {
     ...conversation,
-    messages: window.lite ? messages.map(liteMessage) : messages,
+    messages: windowMessages(messages, window.lite),
     activeRunId,
     queue: listQueue(id),
     ...(page ? { hasMore: page.hasMore } : {}),
@@ -426,7 +431,7 @@ export function windowConversation(conversation: ConversationWithMessages, windo
   const messages = conversation.messages.slice(-limit);
   return {
     ...conversation,
-    messages: window.lite ? messages.map(liteMessage) : messages,
+    messages: windowMessages(messages, window.lite),
     ...(window.limit ? { hasMore: conversation.messages.length > messages.length } : {}),
   };
 }
@@ -462,10 +467,14 @@ export function listMessagePage(conversationId: string, opts: { limit: number; b
 
 /** The picture a tool returned in a message, decoded, with its type. */
 export function messageImage(conversationId: string, messageId: string, toolUseId: string): { data: Uint8Array; mime: string } {
-  const row = get<{ blocks: string }>("SELECT blocks FROM messages WHERE id = ? AND conversation_id = ?", messageId, conversationId);
-  const block = parseJson<MessageBlock[]>(row?.blocks ?? "[]", []).find((b) => b.type === "tool_use" && b.id === toolUseId);
-  if (!block || block.type !== "tool_use") throw notFound("Picture");
-  // While its run works the picture is kept apart from the message.
+  const block = get<{ image: string | null }>(
+    `SELECT json_extract(b.value, '$.image') AS image FROM messages m, json_each(m.blocks) b
+     WHERE m.id = ? AND m.conversation_id = ? AND json_extract(b.value, '$.type') = 'tool_use' AND json_extract(b.value, '$.id') = ?`,
+    messageId,
+    conversationId,
+    toolUseId,
+  );
+  if (!block) throw notFound("Picture");
   const image = block.image ?? get<{ image: string }>("SELECT image FROM message_images WHERE message_id = ? AND block_id = ?", messageId, toolUseId)?.image;
   if (!image) throw notFound("Picture");
   const data = Buffer.from(image, "base64");
@@ -853,9 +862,16 @@ export function wholeBlocks(messageId: string, blocks: MessageBlock[]): MessageB
 
 /** Messages as they are read: with the screenshots their runs keep apart while they work. */
 function whole(messages: Message[]): Message[] {
-  const apart = new Set(all<{ message_id: string }>("SELECT DISTINCT message_id FROM message_images").map((r) => r.message_id));
-  if (!apart.size) return messages;
-  return messages.map((m) => (apart.has(m.id) ? { ...m, blocks: wholeBlocks(m.id, m.blocks) } : m));
+  if (!messages.length) return messages;
+  const images = new Map<string, ImageRow[]>();
+  const ids = messages.map((m) => m.id);
+  for (const row of all<ImageRow>(`SELECT * FROM message_images WHERE message_id IN (SELECT value FROM json_each(?))`, JSON.stringify(ids))) {
+    const list = images.get(row.message_id);
+    if (list) list.push(row);
+    else images.set(row.message_id, [row]);
+  }
+  if (!images.size) return messages;
+  return messages.map((m) => (images.has(m.id) ? { ...m, blocks: withImages(m.blocks, images.get(m.id)!) } : m));
 }
 
 export function listMessages(conversationId: string): Message[] {
diff --git a/packages/core/src/services/liteMessage.ts b/packages/core/src/services/liteMessage.ts
index ac94ae63..920f919b 100644
--- a/packages/core/src/services/liteMessage.ts
+++ b/packages/core/src/services/liteMessage.ts
@@ -7,14 +7,18 @@ export function messageImagePath(conversationId: string, messageId: string, tool
   return `/api/conversations/${encodeURIComponent(conversationId)}/messages/${encodeURIComponent(messageId)}/images/${encodeURIComponent(toolUseId)}`;
 }
 
-/** A message for a slow link: each screenshot becomes its own request (`imageUrl`) and long tool output is cut. */
-export function liteMessage(message: Message): Message {
+/**
+ * A message for a slow link: each screenshot becomes its own request (`imageUrl`) and long tool output is cut. With
+ * `cutResults` false only the screenshots go (the desktop app, which shows tool output in full).
+ */
+export function liteMessage(message: Message, cutResults = true): Message {
   let changed = false;
   const blocks = message.blocks.map((b) => {
-    if (b.type !== "tool_use" || (!b.image && (b.result?.length ?? 0) <= LITE_RESULT_CHARS)) return b;
+    const long = cutResults && (b.type === "tool_use" ? (b.result?.length ?? 0) > LITE_RESULT_CHARS : false);
+    if (b.type !== "tool_use" || (!b.image && !long)) return b;
     changed = true;
     const { image, ...rest } = b;
-    const cut = !!b.result && b.result.length > LITE_RESULT_CHARS;
+    const cut = long;
     return {
       ...rest,
       ...(image ? { imageUrl: messageImagePath(message.conversationId, message.id, b.id) } : {}),
diff --git a/packages/core/test/conversations.test.ts b/packages/core/test/conversations.test.ts
index a9d6d869..2a9c7cb0 100644
--- a/packages/core/test/conversations.test.ts
+++ b/packages/core/test/conversations.test.ts
@@ -12,6 +12,7 @@ import {
   discardPrivateChat,
   discardPrivateChats,
   getConversation,
+  messageImage,
   getConversationSummary,
   listConversations,
   listMessagePage,
@@ -375,6 +376,28 @@ describe("message windows", () => {
     expect(text).toEqual({ type: "text", text: "Done" } as never);
     expect(getConversation(conv.id).messages[0]!.blocks[0]).toMatchObject({ image: PNG });
   });
+
+  test("lite=images leaves pictures out but keeps tool output whole, and the picture is served from a stored or in-flight message", () => {
+    const conv = createConversation({ agentId: agent.id });
+    const blocks: MessageBlock[] = [
+      { type: "tool_use", id: "toolu_shot", name: "mcp__browser__browser_screenshot", input: {}, result: "ok", image: PNG },
+      { type: "tool_use", id: "toolu_long", name: "Bash", input: {}, result: "x".repeat(10_000) },
+    ];
+    const msg = addMessage({ conversationId: conv.id, role: "assistant", content: "", blocks });
+    const [shot, long] = getConversation(conv.id, { lite: "images" }).messages[0]!.blocks as Extract<MessageBlock, { type: "tool_use" }>[];
+    expect(shot!.image).toBeUndefined();
+    expect(shot!.imageUrl).toBe(`/api/conversations/${conv.id}/messages/${msg.id}/images/toolu_shot`);
+    expect(long!.result).toHaveLength(10_000);
+    expect(long!.resultTruncated).toBeUndefined();
+    expect(Buffer.from(messageImage(conv.id, msg.id, "toolu_shot").data).toString("base64")).toBe(PNG);
+    expect(() => messageImage(conv.id, msg.id, "toolu_long")).toThrow();
+
+    const inFlight = addMessage({ conversationId: conv.id, role: "assistant", content: "", blocks: [{ type: "tool_use", id: "toolu_live", name: "x", input: {} }] });
+    sql("INSERT INTO message_images (message_id, block_id, image) VALUES (?, ?, ?)", inFlight.id, "toolu_live", PNG);
+    expect(getConversation(conv.id).messages[1]!.blocks[0]).toMatchObject({ image: PNG });
+    expect(getConversation(conv.id, { lite: "images" }).messages[1]!.blocks[0]).toMatchObject({ imageUrl: expect.stringContaining("toolu_live") });
+    expect(Buffer.from(messageImage(conv.id, inFlight.id, "toolu_live").data).toString("base64")).toBe(PNG);
+  });
 });
 
 describe("plainPreview", () => {
diff --git a/packages/shared/src/events.ts b/packages/shared/src/events.ts
index d69f5053..593b1540 100644
--- a/packages/shared/src/events.ts
+++ b/packages/shared/src/events.ts
@@ -259,6 +259,8 @@ export type ClientEvent =
   | { type: "conversation.unsubscribe"; conversationId: ID }
   /** This client applies `run.delta` patches (`applyRunDelta`): send it what changed instead of the whole list. */
   | { type: "deltas.patch" }
+  /** This client loads screenshots by `imageUrl`: send stored messages without their base64 pictures. */
+  | { type: "messages.images" }
   /** The client missed a delta of this run (or joined while it ran): send its whole block list once. */
   | { type: "run.resync"; runId: ID };
 

From d7208da8f1554fe6ef251a392bc633a798407ccf Mon Sep 17 00:00:00 2001
From: Niclas Jost <dev@niclasjost.de>
Date: Sun, 1 Nov 2026 17:41:42 +0100
Subject: [PATCH 2/5] Render past chat messages once instead of on every
 streamed chunk

Thread rows are memoized and the visible message list only changes with the live run's ids, so a delta re-renders the
live turn, not all earlier messages (each with its markdown). Measured in a 56-message chat over one ~11 s answer:
long tasks 43 (3.7 s) -> 8 (0.8 s), React render time 2.96 s -> 1.46 s.
---
 apps/desktop/src/components/chat/thread.tsx   | 104 +++++++++++-------
 .../src/pages/chat/chat-conversation.tsx      |   6 +-
 2 files changed, 71 insertions(+), 39 deletions(-)

diff --git a/apps/desktop/src/components/chat/thread.tsx b/apps/desktop/src/components/chat/thread.tsx
index 1e643a3a..e31d4e70 100644
--- a/apps/desktop/src/components/chat/thread.tsx
+++ b/apps/desktop/src/components/chat/thread.tsx
@@ -1,4 +1,4 @@
-import { Fragment, useEffect, useLayoutEffect, useRef, useState, type ReactNode } from "react";
+import { Fragment, memo, useEffect, useLayoutEffect, useMemo, useRef, useState, type ReactNode } from "react";
 import { format, isToday, isYesterday } from "date-fns";
 import { AnimatePresence, motion } from "motion/react";
 import type { Agent, Conversation, Message } from "@godmode/shared";
@@ -19,6 +19,52 @@ function dayLabel(iso: string): string {
   return format(d, d.getFullYear() === new Date().getFullYear() ? t("chat:thread.dayFormat") : t("chat:thread.dayFormatYear"), { locale: dateLocale() });
 }
 
+const ThreadRow = memo(function ThreadRow({
+  message: m,
+  day,
+  animate,
+  flashing,
+  agent,
+  delegatedFrom,
+}: {
+  message: Message;
+  day: string | null;
+  animate: boolean;
+  flashing: boolean;
+  agent?: Agent;
+  delegatedFrom?: Conversation["delegatedFrom"];
+}) {
+  return (
+    <Fragment>
+      {day && (
+        <div className="eyebrow flex items-center gap-3 text-[10.5px]" role="separator">
+          <span className="h-px flex-1 bg-border" />
+          {day}
+          <span className="h-px flex-1 bg-border" />
+        </div>
+      )}
+      <motion.div
+        data-message-id={m.id}
+        data-turn-anchor={m.role === "user" && !m.source ? "" : undefined}
+        className={`rounded-xl transition-shadow duration-700 ${flashing ? "ring-2 ring-primary/40 ring-offset-4 ring-offset-background" : "ring-0"}`}
+        initial={animate ? { opacity: 0, y: 8 } : false}
+        animate={{ opacity: 1, y: 0 }}
+        transition={{ duration: 0.25, ease: EASE_OUT }}
+      >
+        {m.role === "user" && m.source ? (
+          <StartedMessage message={m} delegatedFrom={delegatedFrom} />
+        ) : m.role === "user" ? (
+          <UserMessage message={m} pending={m.id.startsWith("pending-")} />
+        ) : m.role === "assistant" ? (
+          <AssistantMessage message={m} agent={agent} />
+        ) : (
+          <SystemMessage message={m} />
+        )}
+      </motion.div>
+    </Fragment>
+  );
+});
+
 export interface ThreadProps {
   messages: Message[];
   agent?: Agent;
@@ -68,48 +114,32 @@ export function Thread({ messages, agent, inflight, onStop, stopping, onPause, p
   }, [sentCount, messages, pinTurn]);
 
   const isEmpty = messages.length === 0 && !inflight;
-  let lastDay = "";
+  const days = useMemo(() => {
+    let lastDay = "";
+    return messages.map((m) => {
+      const day = dayLabel(m.createdAt);
+      const show = day && day !== lastDay ? day : null;
+      lastDay = day || lastDay;
+      return show;
+    });
+  }, [messages]);
 
   return (
     <div className="relative min-h-0 flex-1">
       <div ref={scrollRef} className="h-full overflow-y-auto overscroll-contain [overflow-anchor:none]" tabIndex={-1} aria-label={t("thread.messages")}>
         <div ref={contentRef} className="mx-auto flex w-full max-w-3xl flex-col gap-6 px-4 pt-6 pb-10 @xl:px-6">
           {isEmpty && empty}
-          {messages.map((m) => {
-            const day = dayLabel(m.createdAt);
-            const showDay = day && day !== lastDay;
-            lastDay = day || lastDay;
-            const animate = !reduce && !initialIds.current!.has(m.id);
-            return (
-              <Fragment key={m.id}>
-                {showDay && (
-                  <div className="eyebrow flex items-center gap-3 text-[10.5px]" role="separator">
-                    <span className="h-px flex-1 bg-border" />
-                    {day}
-                    <span className="h-px flex-1 bg-border" />
-                  </div>
-                )}
-                <motion.div
-                  data-message-id={m.id}
-                  data-turn-anchor={m.role === "user" && !m.source ? "" : undefined}
-                  className={`rounded-xl transition-shadow duration-700 ${flash === m.id ? "ring-2 ring-primary/40 ring-offset-4 ring-offset-background" : "ring-0"}`}
-                  initial={animate ? { opacity: 0, y: 8 } : false}
-                  animate={{ opacity: 1, y: 0 }}
-                  transition={{ duration: 0.25, ease: EASE_OUT }}
-                >
-                  {m.role === "user" && m.source ? (
-                    <StartedMessage message={m} delegatedFrom={delegatedFrom} />
-                  ) : m.role === "user" ? (
-                    <UserMessage message={m} pending={m.id.startsWith("pending-")} />
-                  ) : m.role === "assistant" ? (
-                    <AssistantMessage message={m} agent={agent} />
-                  ) : (
-                    <SystemMessage message={m} />
-                  )}
-                </motion.div>
-              </Fragment>
-            );
-          })}
+          {messages.map((m, i) => (
+            <ThreadRow
+              key={m.id}
+              message={m}
+              day={days[i] ?? null}
+              animate={!reduce && !initialIds.current!.has(m.id)}
+              flashing={flash === m.id}
+              agent={agent}
+              delegatedFrom={delegatedFrom}
+            />
+          ))}
           {!inflight && after}
           {inflight && (
             <LiveAssistantMessage
diff --git a/apps/desktop/src/pages/chat/chat-conversation.tsx b/apps/desktop/src/pages/chat/chat-conversation.tsx
index cf36d8f4..b92765ae 100644
--- a/apps/desktop/src/pages/chat/chat-conversation.tsx
+++ b/apps/desktop/src/pages/chat/chat-conversation.tsx
@@ -220,9 +220,11 @@ function ConversationView({ conversationId }: { conversationId: string }) {
   const shownLinger = linger && !lingerDone && !live ? linger : null;
 
   // Hide the stored copy of the in-flight assistant message while it streams.
+  const liveMessageId = live?.messageId;
+  const liveRunId = live?.runId;
   const visibleMessages = useMemo(
-    () => (live ? messages.filter((m) => m.id !== live.messageId && !(m.role === "assistant" && m.runId === live.runId)) : messages),
-    [messages, live],
+    () => (liveRunId !== undefined ? messages.filter((m) => m.id !== liveMessageId && !(m.role === "assistant" && m.runId === liveRunId)) : messages),
+    [messages, liveMessageId, liveRunId],
   );
 
   const subagentSide = useMemo(() => {

From 03a5bcf20c0ca1e49ddac9bf013b64f41bdd2b8c Mon Sep 17 00:00:00 2001
From: Niclas Jost <dev@niclasjost.de>
Date: Sun, 1 Nov 2026 17:43:10 +0100
Subject: [PATCH 3/5] Keep chat lists and badges from re-rendering on every
 streamed token

The sidebar, workspace switcher, agent cards, activity and home lists subscribed to the whole live-runs map, which
changes with every delta. useLiveRunsMap hands them a new map only when a run starts, ends or moves to its next step.
---
 .../components/activity/activity-overview.tsx  |  4 ++--
 .../src/components/agents/agent-actions.tsx    |  4 ++--
 .../automations/followups-section.tsx          |  4 ++--
 .../src/components/chat/agent-picker.tsx       |  4 ++--
 .../src/components/layout/recent-chats.tsx     |  4 ++--
 .../workspaces/workspace-activity.ts           |  4 ++--
 apps/desktop/src/pages/chat/archived-page.tsx  |  4 ++--
 apps/desktop/src/pages/chat/chat-home.tsx      |  6 +++---
 apps/desktop/src/stores/live.ts                | 18 ++++++++++++++++++
 9 files changed, 35 insertions(+), 17 deletions(-)

diff --git a/apps/desktop/src/components/activity/activity-overview.tsx b/apps/desktop/src/components/activity/activity-overview.tsx
index b66dc8da..e1231e61 100644
--- a/apps/desktop/src/components/activity/activity-overview.tsx
+++ b/apps/desktop/src/components/activity/activity-overview.tsx
@@ -8,7 +8,7 @@ import type { Agent, Run, RunStatus, RunTrigger } from "@godmode/shared";
 import { useAllAgents, useRuns } from "@/lib/hooks";
 import { dateLocale, t as translate } from "@/i18n";
 import { errorMessage } from "@/lib/api";
-import { useLive, type LiveRun } from "@/stores/live";
+import { useLiveRunsMap, type LiveRun } from "@/stores/live";
 import { cn } from "@/lib/utils";
 import { AgentAvatar, EmptyState } from "@/components/common";
 import { Orb } from "@/components/aicss/Orb";
@@ -46,7 +46,7 @@ export function ActivityOverview() {
   const runsQ = useRuns(agentFilter, statusFilter);
   const { data: agents = [] } = useAllAgents();
   const agentById = useMemo(() => new Map(agents.map((a) => [a.id, a])), [agents]);
-  const liveRuns = useLive((s) => s.runs);
+  const liveRuns = useLiveRunsMap();
   const liveList = useMemo(
     // Working right now; a queued run shows in the list below as queued.
     () => Object.values(liveRuns).filter((r) => r.status === "running" && (agentFilter === "all" || r.agentId === agentFilter)),
diff --git a/apps/desktop/src/components/agents/agent-actions.tsx b/apps/desktop/src/components/agents/agent-actions.tsx
index ecca6d5f..c835be39 100644
--- a/apps/desktop/src/components/agents/agent-actions.tsx
+++ b/apps/desktop/src/components/agents/agent-actions.tsx
@@ -12,7 +12,7 @@ import { qk } from "@/lib/queryKeys";
 import { useMissingLogins, useScopeWorkspace } from "@/lib/hooks";
 import { modKey } from "@/lib/desktop";
 import { clearDraft, useDraft } from "@/lib/drafts";
-import { useLive, type LiveRun } from "@/stores/live";
+import { useLive, useLiveRunsMap, type LiveRun } from "@/stores/live";
 import { AgentAvatar, Kbd } from "@/components/common";
 import { liveMood } from "@/components/chat/conversation-mood";
 import { LiveDot } from "@/components/aicss/Motion";
@@ -52,7 +52,7 @@ export function useAgentLiveRuns(agentId: string | undefined): LiveRun[] {
           .join(",")
       : "",
   );
-  const runs = useLive((s) => s.runs);
+  const runs = useLiveRunsMap();
   return useMemo(() => (ids ? ids.split(",").flatMap((id) => (runs[id] ? [runs[id]] : [])) : []), [ids, runs]);
 }
 
diff --git a/apps/desktop/src/components/automations/followups-section.tsx b/apps/desktop/src/components/automations/followups-section.tsx
index 705c7510..83fa84df 100644
--- a/apps/desktop/src/components/automations/followups-section.tsx
+++ b/apps/desktop/src/components/automations/followups-section.tsx
@@ -9,7 +9,7 @@ import { Spinner } from "@/components/ui/spinner";
 import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip";
 import { FollowupTimePicker, followupIn, followupWhen, useFollowupActions } from "@/components/chat/followup";
 import { useNow } from "@/components/vault/use-now";
-import { useLive } from "@/stores/live";
+import { useLiveRunsMap } from "@/stores/live";
 import { useReduceAnimations } from "@/lib/motion";
 
 /** Chats agents will pick up again on their own (followup_schedule), soonest first. */
@@ -18,7 +18,7 @@ export function FollowupsSection({ followups, agentById }: { followups: Followup
   const { t } = useTranslation(["automations", "common"]);
   const now = useNow(30_000);
   const actions = useFollowupActions();
-  const liveRuns = useLive((s) => s.runs);
+  const liveRuns = useLiveRunsMap();
   const busy = new Set(Object.values(liveRuns).flatMap((r) => (r.status === "running" ? [r.conversationId] : [])));
   if (!followups.length) return null;
 
diff --git a/apps/desktop/src/components/chat/agent-picker.tsx b/apps/desktop/src/components/chat/agent-picker.tsx
index 6c8ea49a..78e67c14 100644
--- a/apps/desktop/src/components/chat/agent-picker.tsx
+++ b/apps/desktop/src/components/chat/agent-picker.tsx
@@ -7,7 +7,7 @@ import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, Command
 import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover";
 import { AgentAvatar } from "@/components/common";
 import { useWorkspaces } from "@/lib/hooks";
-import { useLive } from "@/stores/live";
+import { useLiveRunsMap } from "@/stores/live";
 import { cn } from "@/lib/utils";
 
 /** Pill button that opens a searchable agent list. */
@@ -26,7 +26,7 @@ export function AgentPicker({
   const [open, setOpen] = useState(false);
   const navigate = useNavigate();
   const { data: workspaces = [] } = useWorkspaces();
-  const liveRuns = useLive((s) => s.runs);
+  const liveRuns = useLiveRunsMap();
   const running = useMemo(() => new Set(Object.values(liveRuns).flatMap((r) => (r.status === "running" ? [r.agentId] : []))), [liveRuns]);
   const current = agents.find((a) => a.id === value) ?? null;
 
diff --git a/apps/desktop/src/components/layout/recent-chats.tsx b/apps/desktop/src/components/layout/recent-chats.tsx
index b6e79620..2f0591dd 100644
--- a/apps/desktop/src/components/layout/recent-chats.tsx
+++ b/apps/desktop/src/components/layout/recent-chats.tsx
@@ -38,7 +38,7 @@ import { useProjectIndex } from "@/components/projects/project-utils";
 import { qk } from "@/lib/queryKeys";
 import { cn } from "@/lib/utils";
 import { isMac, modKey } from "@/lib/desktop";
-import { useLive } from "@/stores/live";
+import { useLiveRunsMap } from "@/stores/live";
 import { type RecentSource, type RecentTab, useUi } from "@/stores/ui";
 import { useReduceAnimations } from "@/lib/motion";
 import { dateLocale, intlLocale, t as translate } from "@/i18n";
@@ -81,7 +81,7 @@ export function RecentChats() {
   const { data: workspaces = [] } = useWorkspaces();
   const conversationId = useMatch("/chat/:conversationId")?.params.conversationId;
   const { pathname } = useLocation();
-  const liveRuns = useLive((s) => s.runs);
+  const liveRuns = useLiveRunsMap();
   const runningConversations = new Set(Object.values(liveRuns).flatMap((r) => (r.status === "running" ? [r.conversationId] : [])));
   const queuedConversations = new Set(Object.values(liveRuns).flatMap((r) => (r.status === "queued" ? [r.conversationId] : [])));
   const { setArchived } = useArchiveChat();
diff --git a/apps/desktop/src/components/workspaces/workspace-activity.ts b/apps/desktop/src/components/workspaces/workspace-activity.ts
index 71647a5d..45f8cb8c 100644
--- a/apps/desktop/src/components/workspaces/workspace-activity.ts
+++ b/apps/desktop/src/components/workspaces/workspace-activity.ts
@@ -4,7 +4,7 @@ import { useQuery } from "@tanstack/react-query";
 import { api } from "@/lib/api";
 import { chatProject, useAllAgents, useAttention, useConversations, useScopeProject } from "@/lib/hooks";
 import { qk } from "@/lib/queryKeys";
-import { useLive } from "@/stores/live";
+import { useLiveRunsMap } from "@/stores/live";
 import { useUi } from "@/stores/ui";
 
 export interface WorkspaceActivity {
@@ -30,7 +30,7 @@ export function useWorkspaceActivity(): { of: (scope: string | null) => Workspac
   const { data: conversations } = useConversations();
   const { data: attention } = useAttention();
   const { data: tasks } = useQuery({ queryKey: qk.taskList("all"), queryFn: () => api.tasks.list({ workspaceId: "all" }), staleTime: 30_000 });
-  const runs = useLive((s) => s.runs);
+  const runs = useLiveRunsMap();
 
   const map = useMemo(() => {
     const out = new Map<string, WorkspaceActivity>();
diff --git a/apps/desktop/src/pages/chat/archived-page.tsx b/apps/desktop/src/pages/chat/archived-page.tsx
index 7d330d6a..5873896f 100644
--- a/apps/desktop/src/pages/chat/archived-page.tsx
+++ b/apps/desktop/src/pages/chat/archived-page.tsx
@@ -17,7 +17,7 @@ import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip
 import { useDebouncedValue } from "@/components/vault/use-debounced-value";
 import { errorMessage } from "@/lib/api";
 import { useAllAgents, useArchivedConversations } from "@/lib/hooks";
-import { useLive } from "@/stores/live";
+import { useLiveRunsMap } from "@/stores/live";
 import { useUi } from "@/stores/ui";
 import { dateLocale, t } from "@/i18n";
 import { useLocale } from "@/i18n/language";
@@ -43,7 +43,7 @@ export default function ArchivedPage() {
   const archived = useArchivedConversations(agentId, q, { limit: LIMIT, workspaceId: scope });
   // Archiving only files a chat: these still work, wait or come back on their own.
   const { data: ongoing = [] } = useArchivedConversations(agentId, q, { limit: LIMIT, workspaceId: scope, ongoing: true });
-  const liveRuns = useLive((s) => s.runs);
+  const liveRuns = useLiveRunsMap();
   const live = (c: Conversation) => {
     const statuses = Object.values(liveRuns).flatMap((r) => (r.conversationId === c.id ? [r.status] : []));
     const queued = !statuses.includes("running") && statuses.includes("queued");
diff --git a/apps/desktop/src/pages/chat/chat-home.tsx b/apps/desktop/src/pages/chat/chat-home.tsx
index 713f0f1d..e9350415 100644
--- a/apps/desktop/src/pages/chat/chat-home.tsx
+++ b/apps/desktop/src/pages/chat/chat-home.tsx
@@ -44,7 +44,7 @@ import { useVoiceSession } from "@/lib/voice";
 import { useDraft } from "@/lib/drafts";
 import { AwaySummaryCard } from "@/components/attention/away-summary";
 import { OffersCard } from "@/components/attention/offers-card";
-import { useLive, type LiveRun } from "@/stores/live";
+import { useLiveRunsMap, type LiveRun } from "@/stores/live";
 import { useUi } from "@/stores/ui";
 import { cn } from "@/lib/utils";
 import { EASE_OUT, useReduceAnimations } from "@/lib/motion";
@@ -500,7 +500,7 @@ function RunningNow({ agents }: { agents: Agent[] }) {
   const reduce = useReduceAnimations();
   const { t } = useTranslation("chat");
   const inScope = useInScope();
-  const runs = Object.values(useLive((s) => s.runs)).filter(inScope);
+  const runs = Object.values(useLiveRunsMap()).filter(inScope);
   const list = runs.filter((r) => r.status === "running");
   const queued = runs.length - list.length;
   if (list.length === 0) return null;
@@ -551,7 +551,7 @@ function RunningCard({ run, agent, index }: { run: LiveRun; agent?: Agent; index
 function RecentChats({ agents }: { agents: Agent[] }) {
   const { t } = useTranslation("chat");
   const { data: conversations = [], isLoading } = useScopedConversations();
-  const liveRuns = useLive((s) => s.runs);
+  const liveRuns = useLiveRunsMap();
   const running = useMemo(() => new Set(Object.values(liveRuns).flatMap((r) => (r.status === "running" ? [r.conversationId] : []))), [liveRuns]);
   const recent = useMemo(
     () =>
diff --git a/apps/desktop/src/stores/live.ts b/apps/desktop/src/stores/live.ts
index 1d8da56a..f8b2647b 100644
--- a/apps/desktop/src/stores/live.ts
+++ b/apps/desktop/src/stores/live.ts
@@ -1,3 +1,4 @@
+import { useMemo } from "react";
 import { create } from "zustand";
 import { applyRunDelta, type MessageBlock, type Run, type RunDelta } from "@godmode/shared";
 
@@ -203,6 +204,23 @@ export const useLive = create<LiveState>((set, get) => ({
 }));
 
 /** Live run currently streaming into a conversation (if any). */
+function runShape(r: LiveRun): string {
+  const last = r.blocks[r.blocks.length - 1];
+  return `${r.runId}|${r.status}|${r.conversationId}|${r.agentId}|${r.trigger ?? ""}|${r.activity ?? ""}|${r.blocks.length}|${last?.type ?? ""}|${last?.type === "tool_use" && last.result !== undefined ? 1 : 0}`;
+}
+
+/**
+ * The live runs for lists, badges and labels: a new map only when a run starts, ends, changes status or moves to its next
+ * step, not on every streamed token. Their `blocks` may be behind; read a single run with `useLive` to follow its text.
+ */
+export function useLiveRunsMap(): Record<string, LiveRun> {
+  const shape = useLive((s) => Object.values(s.runs).map(runShape).join("\n"));
+  return useMemo(() => {
+    void shape;
+    return useLive.getState().runs;
+  }, [shape]);
+}
+
 export function useConversationLiveRun(conversationId: string | undefined): LiveRun | null {
   return useLive((s) => {
     if (!conversationId) return null;

From 8e352f139231daa348a5a9fcded059c37c82a649 Mon Sep 17 00:00:00 2001
From: Niclas Jost <dev@niclasjost.de>
Date: Sun, 1 Nov 2026 17:49:44 +0100
Subject: [PATCH 4/5] Compile the desktop app with React Compiler (Oxc's Rust
 port)

oxc-transform-react runs React Compiler on src/ before plugin-react (JSX and Fast Refresh stay with it), so components
and hooks memoize on their own. 398 of 459 files compile today; the rest are skipped function by function and keep
working as before.
---
 apps/desktop/package.json   |   1 +
 apps/desktop/vite.config.ts |  25 ++++-
 pnpm-lock.yaml              | 214 +++++++++++++++++++++++++++++++++++-
 3 files changed, 237 insertions(+), 3 deletions(-)

diff --git a/apps/desktop/package.json b/apps/desktop/package.json
index 4431f226..a7ec6061 100644
--- a/apps/desktop/package.json
+++ b/apps/desktop/package.json
@@ -74,6 +74,7 @@
     "@types/react": "^19.3.0",
     "@types/react-dom": "^19.3.0",
     "@vitejs/plugin-react": "^6.1.2",
+    "oxc-transform-react": "0.156.0",
     "tailwindcss": "^4.3.3",
     "typescript": "^7.0.2",
     "vite": "^8.3.5"
diff --git a/apps/desktop/vite.config.ts b/apps/desktop/vite.config.ts
index 83603f58..62edba9e 100644
--- a/apps/desktop/vite.config.ts
+++ b/apps/desktop/vite.config.ts
@@ -3,6 +3,7 @@ import { readFileSync, existsSync } from "node:fs";
 import { homedir } from "node:os";
 import react from "@vitejs/plugin-react";
 import tailwindcss from "@tailwindcss/vite";
+import { transformSync } from "oxc-transform-react";
 import { defineConfig, type Plugin } from "vite";
 
 const CORE_URL = process.env.GODMODE_CORE_URL ?? "http://127.0.0.1:7777";
@@ -85,9 +86,31 @@ function settingsSearch(): Plugin {
   };
 }
 
+/**
+ * React Compiler (Oxc's Rust port) on the app's own components, before plugin-react turns JSX into calls and adds Fast
+ * Refresh: it memoizes components and hooks so a change re-renders only what reads it.
+ */
+function reactCompiler(): Plugin {
+  const src = path.resolve(__dirname, "src") + path.sep;
+  return {
+    name: "godmode-react-compiler",
+    enforce: "pre",
+    transform(code, id) {
+      const file = id.split("?")[0]!;
+      if (!file.startsWith(src) || !/\.(tsx|ts)$/.test(file) || file.endsWith(".d.ts")) return null;
+      const result = transformSync(file, code, { jsx: "preserve", sourcemap: true, reactCompiler: { target: "19" } });
+      if (result.fatal) {
+        this.warn(`React Compiler skipped ${path.relative(__dirname, file)}: ${result.errors.map((e) => e.message).join("; ")}`);
+        return null;
+      }
+      return { code: result.code, map: result.map };
+    },
+  };
+}
+
 // https://vite.dev/config/
 export default defineConfig(() => ({
-  plugins: [react(), tailwindcss(), devToken(), settingsSearch()],
+  plugins: [reactCompiler(), react(), tailwindcss(), devToken(), settingsSearch()],
   resolve: {
     alias: { "@": path.resolve(__dirname, "./src") },
   },
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 399ae421..e1616f6b 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -475,7 +475,10 @@ importers:
         version: 19.3.0(@types/react@19.3.0)
       '@vitejs/plugin-react':
         specifier: ^6.1.2
-        version: 6.1.2(vite@8.3.5(@types/node@26.6.6)(esbuild@0.28.2)(jiti@2.7.0)(tsx@4.23.15)(yaml@2.9.1))
+        version: 6.1.2(oxc-transform-react@0.156.0)(vite@8.3.5(@types/node@26.6.6)(esbuild@0.28.2)(jiti@2.7.0)(tsx@4.23.15)(yaml@2.9.1))
+      oxc-transform-react:
+        specifier: 0.156.0
+        version: 0.156.0
       tailwindcss:
         specifier: ^4.3.3
         version: 4.3.3
@@ -1714,6 +1717,128 @@ packages:
   '@oxc-project/types@0.155.0':
     resolution: {integrity: sha512-SeE8JPwW1xs1tHeNycjUtUBdhorRa8o4jlvjwk49R7/Z291i+4DQa7JJIgOm/TaYQZx+QrPQbVJ/9c8dMIZN8Q==}
 
+  '@oxc-transform-react/binding-android-arm-eabi@0.156.0':
+    resolution: {integrity: sha512-8wQ5hpMtiN6czk57sNwyi4spVd3JlcD77yssCIlnmIZyn/BWLxHKdtxQvCi04JUbIDpQqKvw9bbLeZlzIIrLuw==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm]
+    os: [android]
+
+  '@oxc-transform-react/binding-android-arm64@0.156.0':
+    resolution: {integrity: sha512-e6vRqXEnpXCRXWv8Tesv4Srpk2fspHhw3OZ+NCrJRAADtV/kLqvuHkPV5HvV/CsAmu67wb5oQyRnQOf8jsVH0w==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [android]
+
+  '@oxc-transform-react/binding-darwin-arm64@0.156.0':
+    resolution: {integrity: sha512-GIXda96DNSjlFDZEpWvknc7uiUApx94NQ3ue7+HwTRMxn78qNNQzfuBw1duIaaxCu6xcbBjHmX0bo31Rtml6VA==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@oxc-transform-react/binding-darwin-x64@0.156.0':
+    resolution: {integrity: sha512-rPB5ZKLEPiVMr14T+Dkhi9tiEzLhtA/yN41GwfLrqsWOMxMCSjfagwm/Be/doX4bdlQ798oB8mkZqkUZzKPl9A==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [x64]
+    os: [darwin]
+
+  '@oxc-transform-react/binding-freebsd-x64@0.156.0':
+    resolution: {integrity: sha512-MjzbjHgXD3PWdlWjXVUJsfnJ6nGfLdFvC0sCxq0iIfynR/PHzXAIrFymtvkHvfMT/lpR584gHWv/lz+XmH26Rg==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [x64]
+    os: [freebsd]
+
+  '@oxc-transform-react/binding-linux-arm-gnueabihf@0.156.0':
+    resolution: {integrity: sha512-n6chQcMuiC5k5W6OPHT36VxI8e9IAbH22bF1lyaKLB20lPZaPVoGU7h3lbg9jarM+US96POx3se0HtISEN90PQ==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm]
+    os: [linux]
+
+  '@oxc-transform-react/binding-linux-arm-musleabihf@0.156.0':
+    resolution: {integrity: sha512-9KYZbcBMkuLwB25jw4YJf1qLe3pJ7s4M+PGvqqNi9heGI9BlAjRiiCYx8dlYZ1Qe5GZS6L/5Bb5zJ6WWAYy/Ow==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm]
+    os: [linux]
+
+  '@oxc-transform-react/binding-linux-arm64-gnu@0.156.0':
+    resolution: {integrity: sha512-Ti42+TdrxGmufbaYlTxOVwn+OtyRuhpUBjbA+GmbzGIE9KXGTlJ+GV2W5HFEluxVkyciPoXS1AZQXFdbJrKvww==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [linux]
+    libc: [glibc]
+
+  '@oxc-transform-react/binding-linux-arm64-musl@0.156.0':
+    resolution: {integrity: sha512-5CMv/+/iJtZfhJlhVH3aLYzkUwKZpbQlofBXSAhhHqzjLrprTlgnJYis7GFf+rRZd08zjnbUbWANGVZ8jL6u2w==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [linux]
+    libc: [musl]
+
+  '@oxc-transform-react/binding-linux-ppc64-gnu@0.156.0':
+    resolution: {integrity: sha512-VYu7RQBQPUHdGDgQ6IS4WjHMB69u7yyIk7xDfipHWopcLnikMc4+Gp2YxIT5ffn/a6U216x6io7oaDJxRepamA==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [ppc64]
+    os: [linux]
+    libc: [glibc]
+
+  '@oxc-transform-react/binding-linux-riscv64-gnu@0.156.0':
+    resolution: {integrity: sha512-AW5XhjiB/W73vwn1dyMsSb/ceR9PGpl4ZojO/X/5lpqbzIB9wGcwLPciFb3pl2yQ1tLsXfBd0V/hg/Q+FxZeag==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [riscv64]
+    os: [linux]
+    libc: [glibc]
+
+  '@oxc-transform-react/binding-linux-riscv64-musl@0.156.0':
+    resolution: {integrity: sha512-bwLtY0g73vra6DFvR/Ec8lyySchTCaHDzkUuA58q2PxYY0GrhsveG+DbFPLdbEo96KiQieJVzW3FvAAFKV8vBA==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [riscv64]
+    os: [linux]
+    libc: [musl]
+
+  '@oxc-transform-react/binding-linux-s390x-gnu@0.156.0':
+    resolution: {integrity: sha512-W2MEasN4NqYw4kkTs5MdaZ8yFPGaslQFLZbNNUygyl26z8nk1zFq5d4gZjlyCmGkw+fB6CykjTy3Cjzowgwh8g==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [s390x]
+    os: [linux]
+    libc: [glibc]
+
+  '@oxc-transform-react/binding-linux-x64-gnu@0.156.0':
+    resolution: {integrity: sha512-+CfzH5OiKZjz/2TqVcgMhYaN0ruogou3T1+nycmG0WjptmDJ7BYHwHIYjfRaAI87beps4MgXltgMFLGkm2N/JQ==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [x64]
+    os: [linux]
+    libc: [glibc]
+
+  '@oxc-transform-react/binding-linux-x64-musl@0.156.0':
+    resolution: {integrity: sha512-3/tonoHWE0nqzkB9+4+X9ipAU325Yd8wCDUrqh0QpcEvs/RTl5VZ3i+PboYRmnu4jPDssh4Lg4pFsgkgBN89fw==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [x64]
+    os: [linux]
+    libc: [musl]
+
+  '@oxc-transform-react/binding-openharmony-arm64@0.156.0':
+    resolution: {integrity: sha512-yRo3fXeIJqTKs5AUUQrt4uOGGmlz1PqrgF2VrehrJFNBm/PHgKjXu7jjAPhu4c3z4UfFyVBHg4FArw3bMDQcLA==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [openharmony]
+
+  '@oxc-transform-react/binding-win32-arm64-msvc@0.156.0':
+    resolution: {integrity: sha512-hzNsvmSRyd7gWpzDxL7xtn3nzP2os+2Qhk/pFgrUMt/atd2Lo65+SDt1SL2Izc3t2sgbs1vCSW1udk6FBRlI2g==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [win32]
+
+  '@oxc-transform-react/binding-win32-ia32-msvc@0.156.0':
+    resolution: {integrity: sha512-DqX6XJMWxx3McbORNbD0ADoaWb6S4iMW0rrtIi8iQt2GXloHYUrYh4jqj1cbZNFXZtTJQJSB+vVRL1UVIiE7gg==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [ia32]
+    os: [win32]
+
+  '@oxc-transform-react/binding-win32-x64-msvc@0.156.0':
+    resolution: {integrity: sha512-q9prdGO0cgS+fFCsHmW6O8ckf6JS0u3D5DbFbg0Vxsft6cwi1aWI+bnFpi6MaiN3hn3zJF763K8DGl9qOQZ9TA==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [x64]
+    os: [win32]
+
   '@poppinss/colors@4.1.6':
     resolution: {integrity: sha512-H9xkIdFswbS8n1d6vmRd8+c10t2Qe+rZITbbDHHkQixH5+2x1FDGmi/0K+WgWiqQFKPSlIYB7jlH6Kpfn6Fleg==}
 
@@ -4657,6 +4782,10 @@ packages:
   orderedmap@2.1.1:
     resolution: {integrity: sha512-TvAWxi0nDe1j/rtMcWcIj94+Ffe6n7zhow33h40SKxmsmozs6dz/e+EajymfoFcHd7sxNn8yHM8839uixMOV6g==}
 
+  oxc-transform-react@0.156.0:
+    resolution: {integrity: sha512-BQQ/DKTy80gwDx+JHFc/gPnt2BXY0yqveRQo9IjWD/H7OpUkG5qQxwrQmQwVQzHfJnrCbUL518aeA9rvar6TDg==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+
   p-limit@7.3.3:
     resolution: {integrity: sha512-SKgVvDU5TNIxQ4r30U75BNLC6a+6GOEjngrk/ysM5+Zu3oJuk1SC5ApzIzY/7PjCEjoVPMWJ0zho/4QUiEB7TQ==}
     engines: {node: '>=20'}
@@ -6545,6 +6674,63 @@ snapshots:
 
   '@oxc-project/types@0.155.0': {}
 
+  '@oxc-transform-react/binding-android-arm-eabi@0.156.0':
+    optional: true
+
+  '@oxc-transform-react/binding-android-arm64@0.156.0':
+    optional: true
+
+  '@oxc-transform-react/binding-darwin-arm64@0.156.0':
+    optional: true
+
+  '@oxc-transform-react/binding-darwin-x64@0.156.0':
+    optional: true
+
+  '@oxc-transform-react/binding-freebsd-x64@0.156.0':
+    optional: true
+
+  '@oxc-transform-react/binding-linux-arm-gnueabihf@0.156.0':
+    optional: true
+
+  '@oxc-transform-react/binding-linux-arm-musleabihf@0.156.0':
+    optional: true
+
+  '@oxc-transform-react/binding-linux-arm64-gnu@0.156.0':
+    optional: true
+
+  '@oxc-transform-react/binding-linux-arm64-musl@0.156.0':
+    optional: true
+
+  '@oxc-transform-react/binding-linux-ppc64-gnu@0.156.0':
+    optional: true
+
+  '@oxc-transform-react/binding-linux-riscv64-gnu@0.156.0':
+    optional: true
+
+  '@oxc-transform-react/binding-linux-riscv64-musl@0.156.0':
+    optional: true
+
+  '@oxc-transform-react/binding-linux-s390x-gnu@0.156.0':
+    optional: true
+
+  '@oxc-transform-react/binding-linux-x64-gnu@0.156.0':
+    optional: true
+
+  '@oxc-transform-react/binding-linux-x64-musl@0.156.0':
+    optional: true
+
+  '@oxc-transform-react/binding-openharmony-arm64@0.156.0':
+    optional: true
+
+  '@oxc-transform-react/binding-win32-arm64-msvc@0.156.0':
+    optional: true
+
+  '@oxc-transform-react/binding-win32-ia32-msvc@0.156.0':
+    optional: true
+
+  '@oxc-transform-react/binding-win32-x64-msvc@0.156.0':
+    optional: true
+
   '@poppinss/colors@4.1.6':
     dependencies:
       kleur: 4.1.5
@@ -8065,10 +8251,12 @@ snapshots:
 
   '@ungap/structured-clone@1.4.0': {}
 
-  '@vitejs/plugin-react@6.1.2(vite@8.3.5(@types/node@26.6.6)(esbuild@0.28.2)(jiti@2.7.0)(tsx@4.23.15)(yaml@2.9.1))':
+  '@vitejs/plugin-react@6.1.2(oxc-transform-react@0.156.0)(vite@8.3.5(@types/node@26.6.6)(esbuild@0.28.2)(jiti@2.7.0)(tsx@4.23.15)(yaml@2.9.1))':
     dependencies:
       '@rolldown/pluginutils': 1.0.1
       vite: 8.3.5(@types/node@26.6.6)(esbuild@0.28.2)(jiti@2.7.0)(tsx@4.23.15)(yaml@2.9.1)
+    optionalDependencies:
+      oxc-transform-react: 0.156.0
 
   '@vitest/mocker@5.0.5(vite@8.3.5(@types/node@26.6.6)(esbuild@0.28.2)(jiti@2.7.0)(tsx@4.23.15)(yaml@2.9.1))':
     dependencies:
@@ -9569,6 +9757,28 @@ snapshots:
 
   orderedmap@2.1.1: {}
 
+  oxc-transform-react@0.156.0:
+    optionalDependencies:
+      '@oxc-transform-react/binding-android-arm-eabi': 0.156.0
+      '@oxc-transform-react/binding-android-arm64': 0.156.0
+      '@oxc-transform-react/binding-darwin-arm64': 0.156.0
+      '@oxc-transform-react/binding-darwin-x64': 0.156.0
+      '@oxc-transform-react/binding-freebsd-x64': 0.156.0
+      '@oxc-transform-react/binding-linux-arm-gnueabihf': 0.156.0
+      '@oxc-transform-react/binding-linux-arm-musleabihf': 0.156.0
+      '@oxc-transform-react/binding-linux-arm64-gnu': 0.156.0
+      '@oxc-transform-react/binding-linux-arm64-musl': 0.156.0
+      '@oxc-transform-react/binding-linux-ppc64-gnu': 0.156.0
+      '@oxc-transform-react/binding-linux-riscv64-gnu': 0.156.0
+      '@oxc-transform-react/binding-linux-riscv64-musl': 0.156.0
+      '@oxc-transform-react/binding-linux-s390x-gnu': 0.156.0
+      '@oxc-transform-react/binding-linux-x64-gnu': 0.156.0
+      '@oxc-transform-react/binding-linux-x64-musl': 0.156.0
+      '@oxc-transform-react/binding-openharmony-arm64': 0.156.0
+      '@oxc-transform-react/binding-win32-arm64-msvc': 0.156.0
+      '@oxc-transform-react/binding-win32-ia32-msvc': 0.156.0
+      '@oxc-transform-react/binding-win32-x64-msvc': 0.156.0
+
   p-limit@7.3.3:
     dependencies:
       yocto-queue: 1.2.2

From 07afa1deeba4eb0b19b01743546c6a9a8862e79d Mon Sep 17 00:00:00 2001
From: Niclas Jost <dev@niclasjost.de>
Date: Sun, 1 Nov 2026 18:00:55 +0100
Subject: [PATCH 5/5] Make the rest of the desktop app compile with React
 Compiler

The audit (oxc-transform-react with reportDiagnostics) skipped 172 functions in 80 files: refs read or written during
render, try/finally, dynamic import() in components, ??=, rule suppressions and memo-dependency mismatches. They are
rewritten to compile (latest-value refs updated in layout effects or useEffectEvent, render-relevant refs as state,
cleanup after try/catch, module-level loaders). 417 of 459 files compile; the one function left is the TanStack
virtualizer in the logins page, which the compiler skips by design.
---
 apps/desktop/src/App.tsx                      |  24 ++--
 .../components/activity/activity-overview.tsx |  17 +--
 .../src/components/agents/agent-dnd.tsx       |  13 +-
 .../src/components/agents/agent-form.tsx      |  16 ++-
 .../src/components/agents/agent-list.tsx      |   8 +-
 .../components/agents/character-studio.tsx    |   4 +-
 .../components/agents/detail/history-tab.tsx  |  21 +--
 .../src/components/agents/org-chart.tsx       |   8 +-
 .../src/components/agents/role-templates.tsx  |   4 +-
 .../src/components/agents/team-templates.tsx  |   4 +-
 .../src/components/aicss/ReasoningEffort.tsx  |   8 +-
 .../src/components/android/phone-screen.tsx   |   6 +-
 .../components/artifacts/artifact-frame.tsx   |   8 +-
 .../src/components/artifacts/live-preview.tsx |  37 +++--
 .../src/components/browser/live-view.tsx      |  12 +-
 apps/desktop/src/components/chat/composer.tsx |  10 +-
 .../src/components/chat/folder-picker.tsx     |   7 +-
 apps/desktop/src/components/chat/followup.tsx |   3 +-
 .../src/components/chat/message-blocks.tsx    |  12 +-
 .../src/components/chat/model-picker.tsx      |   3 +-
 .../src/components/chat/queue-tray.tsx        |   4 +-
 .../src/components/chat/quote-selection.tsx   |   6 +-
 apps/desktop/src/components/chat/thread.tsx   |  16 +--
 .../components/chat/use-stick-to-bottom.ts    |  18 +--
 .../src/components/chat/voice-mode.tsx        |   6 +-
 .../src/components/chat/voice-visuals.tsx     |   6 +-
 .../computer/computer-live-view.tsx           |  20 ++-
 .../src/components/devices/device-parts.tsx   |   2 +-
 apps/desktop/src/components/files/dialogs.tsx |   3 +-
 .../src/components/files/file-editor.tsx      |  14 +-
 .../components/github/pull-request-panel.tsx  |   6 +-
 .../human-tasks/human-task-board.tsx          |   8 +-
 .../src/components/layout/recent-chats.tsx    |   6 +-
 .../src/components/license/activate.tsx       |   4 +-
 .../src/components/license/deep-link.ts       |   7 +-
 .../src/components/license/reminder-email.tsx |   6 +-
 .../components/messaging/connect-dialog.tsx   |  19 +--
 .../desktop/src/components/mods/mod-parts.tsx |   3 +-
 .../src/components/onboarding/remote-step.tsx |   3 +-
 .../src/components/onboarding/setup-step.tsx  |  28 ++--
 .../src/components/onboarding/vault-step.tsx  |   6 +-
 .../permissions/mac-permissions.tsx           |   6 +-
 .../components/projects/project-dialog.tsx    |  15 ++-
 .../components/runners/chat-move-progress.tsx |  30 +++--
 .../src/components/runners/move-chat.tsx      |   8 +-
 .../components/settings/cloud-link-dialog.tsx |  11 +-
 .../settings/connect-app-dialog.tsx           |   7 +-
 .../components/settings/devices-section.tsx   |   7 +-
 .../components/settings/general-section.tsx   |   9 +-
 .../components/settings/pair-phone-dialog.tsx |  13 +-
 .../src/components/settings/settings-kit.tsx  |  41 +++---
 .../src/components/settings/voice-section.tsx |  18 +--
 .../components/tasks/description-editor.tsx   | 126 ++++++++++--------
 .../src/components/tasks/task-board.tsx       |  13 +-
 .../src/components/tasks/task-dialog.tsx      |  54 ++++----
 .../src/components/tasks/task-sheet.tsx       |  39 ++++--
 .../src/components/vault/camera-scanner.tsx   |  14 +-
 .../components/vault/card-details-dialog.tsx  |   3 +-
 .../src/components/vault/card-dialog.tsx      |   3 +-
 .../src/components/vault/chip-input.tsx       |   4 +-
 .../src/components/vault/copy-button.tsx      |  13 +-
 apps/desktop/src/components/vault/grant.tsx   |   3 +-
 .../vault/password-import-dialog.tsx          |   7 +-
 .../src/components/vault/qr-drop-zone.tsx     |   7 +-
 .../src/components/vault/strength-meter.tsx   |   2 +-
 .../src/components/workspaces/scope-dnd.tsx   |  16 +--
 .../workspaces/workspace-dialog.tsx           |  14 +-
 apps/desktop/src/i18n/language.tsx            |   8 +-
 apps/desktop/src/lib/drafts.ts                |   6 +-
 apps/desktop/src/pages/agents/agents-page.tsx |  35 +++--
 apps/desktop/src/pages/auth/login.tsx         |   6 +-
 apps/desktop/src/pages/auth/unlock.tsx        |   6 +-
 apps/desktop/src/pages/chat/archived-page.tsx |   7 +-
 .../src/pages/chat/chat-conversation.tsx      |  21 ++-
 .../src/pages/settings/settings-page.tsx      |  13 +-
 apps/desktop/src/pages/tasks/tasks-page.tsx   |  12 +-
 apps/desktop/src/pages/vault/cards-page.tsx   |   3 +-
 .../src/pages/workspaces/workspaces-page.tsx  |  22 +--
 apps/desktop/src/stores/live.ts               |  11 +-
 79 files changed, 591 insertions(+), 458 deletions(-)

diff --git a/apps/desktop/src/App.tsx b/apps/desktop/src/App.tsx
index 9c355459..e868ac36 100644
--- a/apps/desktop/src/App.tsx
+++ b/apps/desktop/src/App.tsx
@@ -1,4 +1,4 @@
-import { lazy, Suspense, useCallback, useEffect, useRef, useState, type ReactNode } from "react";
+import { lazy, Suspense, useCallback, useEffect, useLayoutEffect, useRef, useState, type ReactNode } from "react";
 import { Navigate, Route, Routes, useLocation, useNavigate, type Location } from "react-router";
 import { useQuery, useQueryClient } from "@tanstack/react-query";
 import { CloudErrorCode, type Bootstrap } from "@godmode/shared";
@@ -46,16 +46,23 @@ const SettingsDialog = lazy(() => import("@/pages/settings/settings-page"));
 
 const isSettingsPath = (pathname: string) => pathname === "/settings" || pathname.startsWith("/settings/");
 
+const listenTauri = <T,>(event: string, handler: (e: { payload: T }) => void) => import("@tauri-apps/api/event").then(({ listen }) => listen<T>(event, handler));
+
+const invokeTauri = (cmd: string, args?: Record<string, unknown>) => import("@tauri-apps/api/core").then(({ invoke }) => invoke(cmd, args));
+
 export function App() {
   const qc = useQueryClient();
   const navigate = useNavigate();
   // The page on screen as the router sees it (through Godmode Cloud the address bar has a /d/<device> prefix).
   const location = useLocation();
   const onScreen = useRef("");
-  onScreen.current = `${location.pathname}${location.search}`;
+  const screenPath = `${location.pathname}${location.search}`;
+  useLayoutEffect(() => {
+    onScreen.current = screenPath;
+  }, [screenPath]);
   const settingsOpen = isSettingsPath(location.pathname);
-  const underSettings = useRef<Location | null>(null);
-  if (!settingsOpen) underSettings.current = location;
+  const [underSettings, setUnderSettings] = useState<Location | null>(settingsOpen ? null : location);
+  if (!settingsOpen && underSettings !== location) setUnderSettings(location);
   const [coreReady, setCoreReady] = useState(false);
   const [coreError, setCoreError] = useState<string | null>(null);
   const [cloudIssue, setCloudIssue] = useState<CloudIssue | null>(null);
@@ -72,8 +79,7 @@ export function App() {
     if (!isTauri) return;
     let stopped = false;
     let unlisten: (() => void) | undefined;
-    void import("@tauri-apps/api/event").then(async ({ listen }) => {
-      const off = await listen<string>("navigate", (e) => navigate(e.payload));
+    void listenTauri<string>("navigate", (e) => navigate(e.payload)).then((off) => {
       if (stopped) off();
       else unlisten = off;
     });
@@ -124,7 +130,7 @@ export function App() {
   const minimizeToTray = boot.data?.settings.general.minimizeToTray;
   useEffect(() => {
     if (!isTauri || minimizeToTray === undefined) return;
-    void import("@tauri-apps/api/core").then(({ invoke }) => invoke("set_close_to_tray", { enabled: minimizeToTray })).catch(() => {});
+    void invokeTauri("set_close_to_tray", { enabled: minimizeToTray }).catch(() => {});
   }, [minimizeToTray]);
 
   // Realtime connection once authenticated
@@ -213,7 +219,7 @@ export function App() {
   return (
     <AppShell>
       <Suspense fallback={<div className="p-8" />}>
-        <Routes location={settingsOpen ? (underSettings.current ?? "/") : location}>
+        <Routes location={settingsOpen ? (underSettings ?? "/") : location}>
           <Route path="/" element={<ChatHome />} />
           <Route path="/chat/:conversationId" element={<ChatConversation />} />
           <Route path="/archived" element={<ArchivedPage />} />
@@ -252,7 +258,7 @@ export function App() {
       </Suspense>
       {settingsOpen && (
         <Suspense fallback={null}>
-          <SettingsDialog closeTo={underSettings.current ?? "/"} />
+          <SettingsDialog closeTo={underSettings ?? "/"} />
         </Suspense>
       )}
     </AppShell>
diff --git a/apps/desktop/src/components/activity/activity-overview.tsx b/apps/desktop/src/components/activity/activity-overview.tsx
index e1231e61..8d97b77c 100644
--- a/apps/desktop/src/components/activity/activity-overview.tsx
+++ b/apps/desktop/src/components/activity/activity-overview.tsx
@@ -3,10 +3,11 @@ import { useSearchParams } from "react-router";
 import { AnimatePresence, motion } from "motion/react";
 import { format, isToday, isYesterday } from "date-fns";
 import { useTranslation } from "react-i18next";
+import type { TFunction } from "i18next";
 import { Activity, RefreshCw, Search } from "lucide-react";
 import type { Agent, Run, RunStatus, RunTrigger } from "@godmode/shared";
 import { useAllAgents, useRuns } from "@/lib/hooks";
-import { dateLocale, t as translate } from "@/i18n";
+import { dateLocale } from "@/i18n";
 import { errorMessage } from "@/lib/api";
 import { useLiveRunsMap, type LiveRun } from "@/stores/live";
 import { cn } from "@/lib/utils";
@@ -26,16 +27,16 @@ const STATUSES: ("all" | RunStatus)[] = ["all", "running", "paused", "succeeded"
 
 const TRIGGERS: RunTrigger[] = ["chat", "routine", "check", "dream", "delegation", "task", "followup", "heartbeat", "manual", "api"];
 
-function dayLabel(d: Date) {
-  if (isToday(d)) return translate("common:words.today");
-  if (isYesterday(d)) return translate("common:words.yesterday");
-  return format(d, translate("activity:dayFormat"), { locale: dateLocale() });
+function dayLabel(d: Date, t: TFunction<["activity", "runs", "common"]>) {
+  if (isToday(d)) return t("common:words.today");
+  if (isYesterday(d)) return t("common:words.yesterday");
+  return format(d, t("activity:dayFormat"), { locale: dateLocale() });
 }
 
 /** Every run of every agent, filtered by agent, trigger and outcome; `?run=` opens one. */
 export function ActivityOverview() {
   const reduce = useReduceAnimations();
-  const { t, i18n } = useTranslation(["activity", "runs", "common"]);
+  const { t } = useTranslation(["activity", "runs", "common"]);
   const [params, setParams] = useSearchParams();
   const agentFilter = params.get("agent") ?? "all";
   const statusFilter = params.get("status") ?? "all";
@@ -75,13 +76,13 @@ export function ActivityOverview() {
   const groups = useMemo(() => {
     const out: { label: string; runs: Run[] }[] = [];
     for (const r of runs) {
-      const label = dayLabel(new Date(r.startedAt ?? r.createdAt));
+      const label = dayLabel(new Date(r.startedAt ?? r.createdAt), t);
       const last = out[out.length - 1];
       if (last?.label === label) last.runs.push(r);
       else out.push({ label, runs: [r] });
     }
     return out;
-  }, [runs, i18n.language]);
+  }, [runs, t]);
 
   const successRate = useMemo(() => {
     const finished = runs.filter((r) => r.status === "succeeded" || r.status === "failed");
diff --git a/apps/desktop/src/components/agents/agent-dnd.tsx b/apps/desktop/src/components/agents/agent-dnd.tsx
index 00fe2bc2..b77ceddc 100644
--- a/apps/desktop/src/components/agents/agent-dnd.tsx
+++ b/apps/desktop/src/components/agents/agent-dnd.tsx
@@ -324,14 +324,14 @@ function Dock({
 
 function DockTarget({ workspace, here }: { workspace: Workspace | null; here: boolean }) {
   const { t } = useTranslation("agents");
-  const drop = useAgentDrop({ kind: "workspace", workspaceId: workspace?.id ?? null }, `dock:${workspace?.id ?? "global"}`);
+  const { ref: dropRef, state: dropState } = useAgentDrop({ kind: "workspace", workspaceId: workspace?.id ?? null }, `dock:${workspace?.id ?? "global"}`);
   return (
     <div
-      ref={drop.ref}
+      ref={dropRef}
       className={cn(
         "flex shrink-0 items-center gap-1.5 rounded-xl border border-transparent px-2 py-1.5 text-sm transition-[background-color,border-color,transform] duration-150",
         here ? "text-muted-foreground opacity-50" : "text-foreground",
-        drop.state === "valid" && "scale-[1.04] border-brand/50 bg-brand/10",
+        dropState === "valid" && "scale-[1.04] border-brand/50 bg-brand/10",
       )}
     >
       <GroupIcon workspace={workspace} isGlobal={!workspace} className="size-5" />
@@ -342,7 +342,8 @@ function DockTarget({ workspace, here }: { workspace: Workspace | null; here: bo
 }
 
 /** Makes an agent draggable; the built-in agent stays put. */
-export function useAgentDrag(agent: Agent, id = `agent:${agent.id}`) {
+export function useAgentDrag(agent: Agent, dragId?: string) {
+  const id = dragId ?? `agent:${agent.id}`;
   const { setNodeRef, listeners, isDragging } = useDraggable({ id, data: { agent }, disabled: agent.isDefault });
   return {
     ref: setNodeRef,
@@ -381,9 +382,9 @@ export function DroppableSection({ target, dropId, ...props }: ComponentProps<ty
 
 /** Wraps a card or row so it can be picked up. */
 export function DraggableAgent({ agent, className, children }: { agent: Agent; className?: string; children: ReactNode }) {
-  const drag = useAgentDrag(agent);
+  const { ref: dragRef, props: dragProps, isDragging } = useAgentDrag(agent);
   return (
-    <div ref={drag.ref} {...drag.props} className={cn("h-full transition-opacity", drag.isDragging && "opacity-35", className)}>
+    <div ref={dragRef} {...dragProps} className={cn("h-full transition-opacity", isDragging && "opacity-35", className)}>
       {children}
     </div>
   );
diff --git a/apps/desktop/src/components/agents/agent-form.tsx b/apps/desktop/src/components/agents/agent-form.tsx
index 2892a90e..2d035460 100644
--- a/apps/desktop/src/components/agents/agent-form.tsx
+++ b/apps/desktop/src/components/agents/agent-form.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useMemo, useRef, useState, type ComponentProps, type ReactNode } from "react";
+import { useEffect, useEffectEvent, useMemo, useState, type ComponentProps, type ReactNode } from "react";
 import { useQuery } from "@tanstack/react-query";
 import { Link, useLocation } from "react-router";
 import { Trans, useTranslation } from "react-i18next";
@@ -332,15 +332,14 @@ export function AgentForm({
   };
 
   // Save shortcut
-  const submitRef = useRef(submit);
-  submitRef.current = submit;
+  const onSaveShortcut = useEffectEvent(() => submit());
   useEffect(() => {
     const onKey = (e: KeyboardEvent) => {
       const mod = isMac ? e.metaKey : e.ctrlKey;
       if (mod && e.key.toLowerCase() === "s") {
         e.preventDefault();
         if (document.querySelector('[role="dialog"], [role="alertdialog"]')) return;
-        submitRef.current();
+        onSaveShortcut();
       }
     };
     window.addEventListener("keydown", onKey);
@@ -1315,14 +1314,17 @@ function TeamField({
   const [resetNote, setResetNote] = useState<string | null>(null);
 
   // A new workspace can put the chosen lead out of bounds: back to the built-in agent, and say why.
-  useEffect(() => {
+  const checkLead = useEffectEvent(() => {
     if (!current) return;
     if (leadProblem(self, current, team) === "workspace") {
       setResetNote(t("agentForm.team.resetNote", { lead: builtin?.name ?? "Godmode", name: current.name }));
       onChange(null);
     }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [workspaceId, current?.id]);
+  });
+  const currentId = current?.id;
+  useEffect(() => {
+    checkLead();
+  }, [workspaceId, currentId]);
 
   if (isDefault) {
     return (
diff --git a/apps/desktop/src/components/agents/agent-list.tsx b/apps/desktop/src/components/agents/agent-list.tsx
index 8bc89799..8d90fe92 100644
--- a/apps/desktop/src/components/agents/agent-list.tsx
+++ b/apps/desktop/src/components/agents/agent-list.tsx
@@ -60,16 +60,16 @@ function AgentRow({
   const chat = useStartAgentChat();
   const chatting = chat.isPending && chat.variables?.agent.id === agent.id;
   const lead = leadOf(agent, all);
-  const drag = useAgentDrag(agent);
+  const { ref: dragRef, props: dragProps, isDragging } = useAgentDrag(agent);
   return (
     <li
-      ref={drag.ref}
-      {...drag.props}
+      ref={dragRef}
+      {...dragProps}
       className={cn(
         "group relative px-3 py-2 transition-[background-color,opacity] hover:bg-foreground/[0.025]",
         COLUMNS,
         (!!live || agent.status === "running") && "bg-brand/[0.04]",
-        drag.isDragging && "opacity-35",
+        isDragging && "opacity-35",
       )}
     >
       <div className={cn("flex min-w-0 items-center gap-3", !agent.enabled && "opacity-60")}>
diff --git a/apps/desktop/src/components/agents/character-studio.tsx b/apps/desktop/src/components/agents/character-studio.tsx
index 1ffde36f..2a1c7a59 100644
--- a/apps/desktop/src/components/agents/character-studio.tsx
+++ b/apps/desktop/src/components/agents/character-studio.tsx
@@ -162,7 +162,9 @@ export function PersonalityPicker({ value, onChange }: { value: string; onChange
   const isCustom = !!value.trim() && !personalityPreset(value);
   const [custom, setCustom] = useState(isCustom);
   const lastCustom = useRef(isCustom ? value : "");
-  if (isCustom) lastCustom.current = value;
+  useEffect(() => {
+    if (isCustom) lastCustom.current = value;
+  }, [isCustom, value]);
   const customOn = custom || isCustom;
 
   const card = (selected: boolean) =>
diff --git a/apps/desktop/src/components/agents/detail/history-tab.tsx b/apps/desktop/src/components/agents/detail/history-tab.tsx
index 2fd880ed..cacf5ab7 100644
--- a/apps/desktop/src/components/agents/detail/history-tab.tsx
+++ b/apps/desktop/src/components/agents/detail/history-tab.tsx
@@ -1,7 +1,7 @@
 import { useMemo } from "react";
 import { useQuery } from "@tanstack/react-query";
 import { motion } from "motion/react";
-import { format, formatDistanceToNowStrict, isToday, isYesterday } from "date-fns";
+import { format, formatDistanceToNowStrict, isToday, isYesterday, type Locale } from "date-fns";
 import { GitCommitHorizontal, History } from "lucide-react";
 import { useTranslation } from "react-i18next";
 import type { Agent, GitCommit } from "@godmode/shared";
@@ -11,7 +11,7 @@ import { EmptyState } from "@/components/common";
 import { CopyButton } from "@/components/chat/copy-button";
 import { Skeleton } from "@/components/ui/skeleton";
 import { useReduceAnimations } from "@/lib/motion";
-import { dateLocale, t } from "@/i18n";
+import { t } from "@/i18n";
 import { useLocale } from "@/i18n/language";
 
 /** isomorphic-git reports seconds; accept ISO strings and ms too. */
@@ -23,10 +23,10 @@ function commitDate(ts: string): Date {
   return new Date(ts);
 }
 
-function dayLabel(d: Date) {
+function dayLabel(d: Date, locale: Locale) {
   if (isToday(d)) return t("common:words.today");
   if (isYesterday(d)) return t("common:words.yesterday");
-  return format(d, t("agents:historyTab.dayFormat"), { locale: dateLocale() });
+  return format(d, t("agents:historyTab.dayFormat"), { locale });
 }
 
 export function HistoryTab({ agent }: { agent: Agent }) {
@@ -36,13 +36,15 @@ export function HistoryTab({ agent }: { agent: Agent }) {
   const q = useQuery({ queryKey: qk.agentCommits(agent.id), queryFn: () => api.agents.commits(agent.id) });
 
   const groups = useMemo(() => {
-    const out: { label: string; commits: (GitCommit & { date: Date })[] }[] = [];
+    const out: { label: string; start: number; commits: (GitCommit & { date: Date })[] }[] = [];
+    let count = 0;
     for (const c of q.data ?? []) {
       const date = commitDate(c.timestamp);
-      const label = Number.isNaN(date.getTime()) ? t("historyTab.unknownDate") : dayLabel(date);
+      const label = Number.isNaN(date.getTime()) ? t("historyTab.unknownDate") : dayLabel(date, dateLocale);
       const last = out[out.length - 1];
       if (last?.label === label) last.commits.push({ ...c, date });
-      else out.push({ label, commits: [{ ...c, date }] });
+      else out.push({ label, start: count, commits: [{ ...c, date }] });
+      count = count + 1;
     }
     return out;
   }, [q.data, t, dateLocale]);
@@ -67,7 +69,6 @@ export function HistoryTab({ agent }: { agent: Agent }) {
     );
   }
 
-  let index = 0;
   return (
     <div className="space-y-8">
       <p className="text-sm text-muted-foreground">
@@ -78,10 +79,10 @@ export function HistoryTab({ agent }: { agent: Agent }) {
         <section key={g.label}>
           <h3 className="eyebrow mb-3">{g.label}</h3>
           <ol className="relative space-y-1 border-l pl-6">
-            {g.commits.map((c) => {
+            {g.commits.map((c, j) => {
               const [title, ...rest] = c.message.trim().split("\n");
               const body = rest.join("\n").trim();
-              const i = index++;
+              const i = g.start + j;
               return (
                 <motion.li
                   key={c.oid}
diff --git a/apps/desktop/src/components/agents/org-chart.tsx b/apps/desktop/src/components/agents/org-chart.tsx
index c9f0e45a..5198a3d4 100644
--- a/apps/desktop/src/components/agents/org-chart.tsx
+++ b/apps/desktop/src/components/agents/org-chart.tsx
@@ -179,17 +179,17 @@ function Hub({ agent, dim, reports }: { agent: Agent; dim: boolean; reports: Age
   const workspaces = new Set(reports.flatMap((a) => (a.workspaceId ? [a.workspaceId] : []))).size;
   const where = global ? t("orgChart.hub.whereGlobalAnd", { count: workspaces }) : t("orgChart.hub.whereWorkspaces", { count: workspaces });
   const label = t("orgChart.hub.ariaLabel", { name: agent.name, role: agent.role || t("orgChart.noRoleLower"), status: agentPresenceLabel(presence) });
-  const drop = useAgentDrop({ kind: "hub", agent }, "hub");
+  const { ref: dropRef, state: dropState } = useAgentDrop({ kind: "hub", agent }, "hub");
   return (
     <div className="flex flex-col items-start gap-3 @2xl:flex-row @2xl:items-center">
       <div
-        ref={drop.ref}
+        ref={dropRef}
         className={cn(
           "group relative flex w-full max-w-sm items-center gap-3 rounded-xl border bg-card p-3 pr-4 shadow-card transition-[box-shadow,border-color,opacity] hover:border-foreground/15 hover:shadow-float",
           presence.state === "working" && "glow-border",
           dim && "opacity-40",
-          drop.state === "available" && "border-brand/30",
-          drop.state === "valid" && "border-brand/60 ring-4 ring-brand/15",
+          dropState === "available" && "border-brand/30",
+          dropState === "valid" && "border-brand/60 ring-4 ring-brand/15",
         )}
       >
         <AgentAvatar agent={agent} size="lg" mood={mood} still={dim} />
diff --git a/apps/desktop/src/components/agents/role-templates.tsx b/apps/desktop/src/components/agents/role-templates.tsx
index 07025b31..50d4192d 100644
--- a/apps/desktop/src/components/agents/role-templates.tsx
+++ b/apps/desktop/src/components/agents/role-templates.tsx
@@ -30,6 +30,8 @@ const searchText = (t: AgentTemplate) => {
   return [t.name, t.role, t.description, AGENT_TEMPLATE_CATEGORY_LABELS[t.category], ...(t.covers ?? []), shown.name, shown.role, shown.description, translate(`agents:roleTemplates.category.${t.category}`), ...(shown.covers ?? [])].join(" ");
 };
 
+const matching = (templates: AgentTemplate[], terms: RegExp[], _language: string) => templates.filter((t) => terms.every((re) => re.test(searchText(t))));
+
 /**
  * Every role a company has, by department: one agent per job, or one all-in-one agent per department that covers
  * them all. Searchable, because there are many.
@@ -55,7 +57,7 @@ export function RoleTemplates({
   const [filter, setFilter] = useState<Filter>("all");
   const [query, setQuery] = useState("");
   const terms = useMemo(() => wordStarts(query), [query]);
-  const found = useMemo(() => templates.filter((t) => terms.every((re) => re.test(searchText(t)))), [templates, terms, i18n.language]);
+  const found = useMemo(() => matching(templates, terms, i18n.language), [templates, terms, i18n.language]);
   const inFilter = (t: AgentTemplate, f: Filter) => f === "all" || (f === "all-in-one" ? !!t.covers : t.category === f);
   const shown = found.filter((t) => inFilter(t, filter));
   const grouped = AGENT_TEMPLATE_CATEGORIES.map((c) => ({ category: c, items: shown.filter((t) => t.category === c) })).filter((g) => g.items.length > 0);
diff --git a/apps/desktop/src/components/agents/team-templates.tsx b/apps/desktop/src/components/agents/team-templates.tsx
index 96f54893..4a755dd0 100644
--- a/apps/desktop/src/components/agents/team-templates.tsx
+++ b/apps/desktop/src/components/agents/team-templates.tsx
@@ -95,6 +95,8 @@ function seatsOf(node: OrgTemplateNode, byId: Map<string, AgentTemplate>, path =
 
 const flat = (s: Seat): Seat[] => [s, ...s.reports.flatMap(flat)];
 
+const templateTexts = (agents: AgentTemplate[], _language: string) => new Map(agents.map((a) => [a.id, templateText(a)]));
+
 export function StructureIcon({ icon, className }: { icon: string; className?: string }) {
   const Icon = ICONS[icon] ?? Users;
   return (
@@ -114,7 +116,7 @@ export function TeamTemplates({ kinds = ["company", "team"] }: { kinds?: TeamTem
   const { data: agents = [] } = useAgentTemplates();
   const [kind, setKind] = useState<TeamTemplate["kind"]>(kinds[0]!);
   const [picked, setPicked] = useState<TeamTemplate | null>(null);
-  const byId = useMemo(() => new Map(agents.map((a) => [a.id, templateText(a)])), [agents, i18n.language]);
+  const byId = useMemo(() => templateTexts(agents, i18n.language), [agents, i18n.language]);
   if (teams.isError) return null;
   const shown = (teams.data ?? []).filter((tpl) => tpl.kind === kind);
   return (
diff --git a/apps/desktop/src/components/aicss/ReasoningEffort.tsx b/apps/desktop/src/components/aicss/ReasoningEffort.tsx
index bab46e41..5dc331a9 100644
--- a/apps/desktop/src/components/aicss/ReasoningEffort.tsx
+++ b/apps/desktop/src/components/aicss/ReasoningEffort.tsx
@@ -185,13 +185,13 @@ export function ReasoningEffort({
   stops,
   value = 1,
   onChange,
-  label,
-  "aria-label": ariaLabel,
+  label: labelProp,
+  "aria-label": ariaLabelProp,
 }: ReasoningEffortProps = {}) {
   const { t } = useTranslation("aicss");
   const STOPS = stops ?? [t("reasoningEffort.low"), t("reasoningEffort.medium"), t("reasoningEffort.high"), t("reasoningEffort.extraHigh")];
-  label ??= t("reasoningEffort.label");
-  ariaLabel ??= t("reasoningEffort.ariaLabel");
+  const label = labelProp ?? t("reasoningEffort.label");
+  const ariaLabel = ariaLabelProp ?? t("reasoningEffort.ariaLabel");
   const count = STOPS.length;
   const rootRef = useRef<HTMLDivElement>(null);
   const trackRef = useRef<HTMLDivElement>(null);
diff --git a/apps/desktop/src/components/android/phone-screen.tsx b/apps/desktop/src/components/android/phone-screen.tsx
index 5fee12fd..7008d755 100644
--- a/apps/desktop/src/components/android/phone-screen.tsx
+++ b/apps/desktop/src/components/android/phone-screen.tsx
@@ -173,7 +173,8 @@ export function PhoneScreen({
             error: () => {
               decoder = null;
               waitingKey = true;
-              if (++failures >= 3) fallBack();
+              failures = failures + 1;
+              if (failures >= 3) fallBack();
               else askKeyframe();
             },
           });
@@ -356,7 +357,8 @@ export function PhoneScreen({
       dx += e.deltaX * unit;
       dy += e.deltaY * unit;
       at = { x: pt.x, y: pt.y };
-      timer ??= setTimeout(() => {
+      if (timer != null) return;
+      timer = setTimeout(() => {
         timer = null;
         const { width, height } = size.current;
         if (!at || !width) return;
diff --git a/apps/desktop/src/components/artifacts/artifact-frame.tsx b/apps/desktop/src/components/artifacts/artifact-frame.tsx
index 21ebf7d8..ff42c447 100644
--- a/apps/desktop/src/components/artifacts/artifact-frame.tsx
+++ b/apps/desktop/src/components/artifacts/artifact-frame.tsx
@@ -69,13 +69,15 @@ export function ArtifactFrame({
   const { resolved } = useTheme();
   const ref = useRef<HTMLIFrameElement>(null);
   const handlersRef = useRef(handlers);
-  handlersRef.current = handlers;
   const key = useMemo(() => hashOf(html), [html]);
   // One token per loaded document; what it said it saved isn't sent back to it.
   const session = useRef<Session>({ key: "", token: "", loaded: false, lastData: "", pending: 0, queued: null });
-  if (session.current.key !== key) session.current = { key, token: randomToken(), loaded: false, lastData: JSON.stringify(data ?? null), pending: 0, queued: null };
   const latest = useRef({ html, data, theme: resolved });
-  latest.current = { html, data, theme: resolved };
+  useLayoutEffect(() => {
+    handlersRef.current = handlers;
+    if (session.current.key !== key) session.current = { key, token: randomToken(), loaded: false, lastData: JSON.stringify(data ?? null), pending: 0, queued: null };
+    latest.current = { html, data, theme: resolved };
+  });
 
   // Layout effect: listening before the frame's page can say it is there.
   useLayoutEffect(() => {
diff --git a/apps/desktop/src/components/artifacts/live-preview.tsx b/apps/desktop/src/components/artifacts/live-preview.tsx
index f7b8c48c..9f82ffbe 100644
--- a/apps/desktop/src/components/artifacts/live-preview.tsx
+++ b/apps/desktop/src/components/artifacts/live-preview.tsx
@@ -16,16 +16,14 @@ export interface LiveInput {
   dataText?: string;
 }
 
-function documentOf(input: LiveInput, title: string, lastSpec: { current: unknown }): string | null {
+function documentOf(input: LiveInput, title: string, lastSpec: unknown): string | null {
   if (typeof input.html === "string") {
     const html = safePartialHtml(input.html);
     return html.trim() ? html : null;
   }
-  const spec = input.spec !== undefined && typeof input.spec === "object" ? input.spec : parsePartialJson(input.specText);
-  if (spec && typeof spec === "object") lastSpec.current = spec;
-  if (!lastSpec.current) return null;
+  if (!lastSpec) return null;
   try {
-    return specDocument(lastSpec.current as Parameters<typeof specDocument>[0], title);
+    return specDocument(lastSpec as Parameters<typeof specDocument>[0], title);
   } catch {
     return null;
   }
@@ -38,21 +36,36 @@ export function hasLivePreview(input: LiveInput | undefined): boolean {
 
 export function LivePreview({ input, title, className }: { input: LiveInput; title: string; className?: string }) {
   const reduce = useReduceAnimations();
-  const lastSpec = useRef<unknown>(undefined);
-  const lastData = useRef<unknown>(null);
-  const doc = documentOf(input, title, lastSpec);
-  const parsedData = input.data !== undefined ? input.data : parsePartialJson(input.dataText);
-  if (parsedData !== undefined) lastData.current = parsedData;
-  const data = lastData.current;
+  const specSource = input.spec !== undefined && typeof input.spec === "object" ? input.spec : input.specText;
+  const [lastSpec, setLastSpec] = useState<{ source: unknown; spec: unknown }>({ source: undefined, spec: undefined });
+  let spec = lastSpec.spec;
+  if (typeof input.html !== "string" && specSource !== lastSpec.source) {
+    const parsedSpec = input.spec !== undefined && typeof input.spec === "object" ? input.spec : parsePartialJson(input.specText);
+    if (parsedSpec && typeof parsedSpec === "object") {
+      spec = parsedSpec;
+      setLastSpec({ source: specSource, spec: parsedSpec });
+    }
+  }
+  const doc = documentOf(input, title, spec);
+  const dataSource = input.data !== undefined ? input.data : input.dataText;
+  const [lastData, setLastData] = useState<{ source: unknown; data: unknown }>({ source: undefined, data: null });
+  let data = lastData.data;
+  if (dataSource !== lastData.source) {
+    const parsedData = input.data !== undefined ? input.data : parsePartialJson(input.dataText);
+    if (parsedData !== undefined) {
+      data = parsedData;
+      setLastData({ source: dataSource, data: parsedData });
+    }
+  }
 
   const [slots, setSlots] = useState<[string | null, string | null]>([null, null]);
   const [front, setFront] = useState(0);
   const loadedAt = useRef(0);
   const timer = useRef<ReturnType<typeof setTimeout> | null>(null);
   const wanted = useRef<string | null>(null);
-  wanted.current = doc;
 
   useEffect(() => {
+    wanted.current = doc;
     if (!doc) return;
     const load = () => {
       timer.current = null;
diff --git a/apps/desktop/src/components/browser/live-view.tsx b/apps/desktop/src/components/browser/live-view.tsx
index 69162833..9852f91b 100644
--- a/apps/desktop/src/components/browser/live-view.tsx
+++ b/apps/desktop/src/components/browser/live-view.tsx
@@ -1,4 +1,4 @@
-import { useCallback, useEffect, useRef, useState, type FormEvent, type KeyboardEvent, type MouseEvent } from "react";
+import { useCallback, useEffect, useLayoutEffect, useRef, useState, type FormEvent, type KeyboardEvent, type MouseEvent } from "react";
 import { useMutation, useQueryClient } from "@tanstack/react-query";
 import { AnimatePresence, motion } from "motion/react";
 import { useTranslation } from "react-i18next";
@@ -83,7 +83,9 @@ export function LiveView({
   const controlled = expandedProp !== undefined;
   const expanded = expandedProp ?? expandedState;
   const onExpandedChangeRef = useRef(onExpandedChange);
-  onExpandedChangeRef.current = onExpandedChange;
+  useLayoutEffect(() => {
+    onExpandedChangeRef.current = onExpandedChange;
+  });
   const setExpanded = useCallback(
     (next: boolean) => {
       if (!controlled) setExpandedState(next);
@@ -101,7 +103,11 @@ export function LiveView({
   const viewportRef = useRef<HTMLDivElement>(null);
   const imgRef = useRef<HTMLImageElement>(null);
   const frameSize = useRef({ width: 0, height: 0 });
-  frameSize.current = { width: frame?.width ?? 0, height: frame?.height ?? 0 };
+  const frameWidth = frame?.width ?? 0;
+  const frameHeight = frame?.height ?? 0;
+  useLayoutEffect(() => {
+    frameSize.current = { width: frameWidth, height: frameHeight };
+  }, [frameWidth, frameHeight]);
 
   // Subscribe to frames while the profile is running.
   useEffect(() => {
diff --git a/apps/desktop/src/components/chat/composer.tsx b/apps/desktop/src/components/chat/composer.tsx
index a2dc946c..4f74363d 100644
--- a/apps/desktop/src/components/chat/composer.tsx
+++ b/apps/desktop/src/components/chat/composer.tsx
@@ -137,9 +137,11 @@ export function Composer({
 
   // Revoke thumbnails on unmount, unless they stay in the draft
   const attachmentsRef = useRef(attachments);
-  attachmentsRef.current = attachments;
   const disabledRef = useRef(disabled);
-  disabledRef.current = disabled;
+  useLayoutEffect(() => {
+    attachmentsRef.current = attachments;
+    disabledRef.current = disabled;
+  });
   const keepsFiles = !!filesKey;
   useEffect(() => () => {
     if (!keepsFiles) attachmentsRef.current.forEach((a) => a.previewUrl && URL.revokeObjectURL(a.previewUrl));
@@ -182,7 +184,7 @@ export function Composer({
     if (files.length === 0 || disabledRef.current) return;
     const read = await readAttachments(files, totalBytes(attachmentsRef.current), toast.warning);
     if (read.length) setAttachments((prev) => [...prev, ...read]);
-  }, []);
+  }, [setAttachments]);
 
   useImperativeHandle(
     ref,
@@ -203,7 +205,7 @@ export function Composer({
       },
       addFiles: (files: File[]) => void addFiles(files),
     }),
-    [addFiles],
+    [addFiles, setText],
   );
 
   const canSend = (text.trim().length > 0 || attachments.length > 0) && !busy && !blocked && !disabled;
diff --git a/apps/desktop/src/components/chat/folder-picker.tsx b/apps/desktop/src/components/chat/folder-picker.tsx
index 15f5ba4f..47455ba5 100644
--- a/apps/desktop/src/components/chat/folder-picker.tsx
+++ b/apps/desktop/src/components/chat/folder-picker.tsx
@@ -62,6 +62,8 @@ export function useShortPath(): (path: string) => string {
   return (path) => shortPath(path, boot?.homeDir);
 }
 
+const loadDialogPlugin = () => import("@tauri-apps/plugin-dialog");
+
 const looksLikePath = (q: string) => /^(\/|~|[a-zA-Z]:[\\/])/.test(q.trim());
 
 function lastFolder(): string | undefined {
@@ -190,9 +192,8 @@ export function FolderPickerDialog({
       setBrowsed(true);
     } catch (err) {
       toast.error(t("folderPicker.openError"), { description: errorMessage(err) });
-    } finally {
-      setPending(null);
     }
+    setPending(null);
   };
 
   const pick = (p: string) => {
@@ -203,7 +204,7 @@ export function FolderPickerDialog({
 
   const browseNative = async () => {
     try {
-      const { open: openDialog } = await import("@tauri-apps/plugin-dialog");
+      const { open: openDialog } = await loadDialogPlugin();
       const picked = await openDialog({ directory: true, defaultPath: current?.path });
       if (typeof picked === "string") pick(picked);
     } catch (err) {
diff --git a/apps/desktop/src/components/chat/followup.tsx b/apps/desktop/src/components/chat/followup.tsx
index 32f02e7b..72711e51 100644
--- a/apps/desktop/src/components/chat/followup.tsx
+++ b/apps/desktop/src/components/chat/followup.tsx
@@ -115,9 +115,8 @@ export function FollowupTimePicker({
       setOpen(false);
     } catch {
       /* the caller shows why */
-    } finally {
-      setBusy(false);
     }
+    setBusy(false);
   };
 
   return (
diff --git a/apps/desktop/src/components/chat/message-blocks.tsx b/apps/desktop/src/components/chat/message-blocks.tsx
index 62d36fea..174039a3 100644
--- a/apps/desktop/src/components/chat/message-blocks.tsx
+++ b/apps/desktop/src/components/chat/message-blocks.tsx
@@ -420,12 +420,12 @@ const FILE_EDIT_TOOLS = new Set(["Edit", "MultiEdit", "Write"]);
 type FileEditInput = { file_path?: string; notebook_path?: string; old_string?: string; new_string?: string; content?: string; edits?: { old_string?: string; new_string?: string }[] };
 
 /** Diff rows for file-editing tools (Edit / MultiEdit / Write), or null for anything else. */
-function fileEditOf(block: ToolUseBlock): { file: string; rows: DiffRow[] } | null {
-  const input = (block.input ?? {}) as FileEditInput;
+function fileEditOf(name: string, raw: unknown): { file: string; rows: DiffRow[] } | null {
+  const input = (raw ?? {}) as FileEditInput;
   const file = input.file_path ?? input.notebook_path ?? "";
-  if (block.name === "Edit" && typeof input.new_string === "string") return { file, rows: diffLines(input.old_string ?? "", input.new_string) };
-  if (block.name === "Write" && typeof input.content === "string") return { file, rows: diffLines("", input.content) };
-  if (block.name === "MultiEdit" && Array.isArray(input.edits)) {
+  if (name === "Edit" && typeof input.new_string === "string") return { file, rows: diffLines(input.old_string ?? "", input.new_string) };
+  if (name === "Write" && typeof input.content === "string") return { file, rows: diffLines("", input.content) };
+  if (name === "MultiEdit" && Array.isArray(input.edits)) {
     const rows: DiffRow[] = [];
     input.edits.forEach((e, i) => {
       if (i > 0) rows.push({ old: null, cur: null, type: "fold", text: "⋯" });
@@ -749,7 +749,7 @@ function ToolStep({
   );
   // Keyed by content: streaming deltas re-create `block` on every token, but the edit itself rarely changes.
   const editKey = FILE_EDIT_TOOLS.has(block.name) ? JSON.stringify(block.input) : "";
-  const edit = useMemo(() => (editKey ? fileEditOf(block) : null), [editKey]); // eslint-disable-line react-hooks/exhaustive-deps
+  const edit = useMemo(() => (editKey ? fileEditOf(block.name, JSON.parse(editKey)) : null), [editKey, block.name]);
 
   const header = (
     <button
diff --git a/apps/desktop/src/components/chat/model-picker.tsx b/apps/desktop/src/components/chat/model-picker.tsx
index a6040fe1..8923e83c 100644
--- a/apps/desktop/src/components/chat/model-picker.tsx
+++ b/apps/desktop/src/components/chat/model-picker.tsx
@@ -156,9 +156,8 @@ export function ModelPicker({
       qc.setQueryData(qk.models, await api.models.get(true));
     } catch (err) {
       toast.error(t("modelPicker.reloadError"), { description: errorMessage(err) });
-    } finally {
-      setRefreshing(false);
     }
+    setRefreshing(false);
   };
 
   const onListKeyDown = (e: KeyboardEvent<HTMLDivElement>) => {
diff --git a/apps/desktop/src/components/chat/queue-tray.tsx b/apps/desktop/src/components/chat/queue-tray.tsx
index a34327b1..fe8b97bd 100644
--- a/apps/desktop/src/components/chat/queue-tray.tsx
+++ b/apps/desktop/src/components/chat/queue-tray.tsx
@@ -55,7 +55,9 @@ export function QueueTray({
   const [editing, setEditing] = useState<{ id: string; text: string; from: string } | null>(null);
   // Rows that are animating out still hold their old handlers.
   const editingRef = useRef(editing);
-  editingRef.current = editing;
+  useLayoutEffect(() => {
+    editingRef.current = editing;
+  });
   // Right away: moving the focus on blurs the editor, which must not save a second time.
   const closeEditor = () => {
     editingRef.current = null;
diff --git a/apps/desktop/src/components/chat/quote-selection.tsx b/apps/desktop/src/components/chat/quote-selection.tsx
index 47811b3e..c2ba4062 100644
--- a/apps/desktop/src/components/chat/quote-selection.tsx
+++ b/apps/desktop/src/components/chat/quote-selection.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useRef, useState, type ReactNode } from "react";
+import { useEffect, useLayoutEffect, useRef, useState, type ReactNode } from "react";
 import { createPortal } from "react-dom";
 import { AnimatePresence, motion } from "motion/react";
 import { TextQuote } from "lucide-react";
@@ -38,7 +38,9 @@ export function QuoteSelection({ onQuote, disabled, children }: { onQuote: (quot
   const pillRef = useRef<HTMLButtonElement>(null);
   const [at, setAt] = useState<{ x: number; y: number; below: boolean } | null>(null);
   const onQuoteRef = useRef(onQuote);
-  onQuoteRef.current = onQuote;
+  useLayoutEffect(() => {
+    onQuoteRef.current = onQuote;
+  });
 
   const quote = () => {
     const picked = selectionIn(containerRef.current);
diff --git a/apps/desktop/src/components/chat/thread.tsx b/apps/desktop/src/components/chat/thread.tsx
index e31d4e70..7de750b4 100644
--- a/apps/desktop/src/components/chat/thread.tsx
+++ b/apps/desktop/src/components/chat/thread.tsx
@@ -102,26 +102,26 @@ export function Thread({ messages, agent, inflight, onStop, stopping, onPause, p
       clearTimeout(timer);
     };
   }, [focusId, focusPresent, scrollRef, unstick]);
-  const initialIds = useRef<Set<string> | null>(null);
-  if (initialIds.current === null) initialIds.current = new Set(messages.map((m) => m.id));
+  const [initialIds] = useState(() => new Set(messages.map((m) => m.id)));
   const sentCount = messages.filter((m) => m.role === "user" && !m.source).length;
   const lastSent = useRef(sentCount);
   useLayoutEffect(() => {
     const grew = sentCount > lastSent.current;
     lastSent.current = sentCount;
     const last = messages[messages.length - 1];
-    if (grew && last?.role === "user" && !last.source && !initialIds.current!.has(last.id)) pinTurn();
+    if (grew && last?.role === "user" && !last.source && !initialIds.has(last.id)) pinTurn();
   }, [sentCount, messages, pinTurn]);
 
   const isEmpty = messages.length === 0 && !inflight;
   const days = useMemo(() => {
+    const out: (string | null)[] = [];
     let lastDay = "";
-    return messages.map((m) => {
+    for (const m of messages) {
       const day = dayLabel(m.createdAt);
-      const show = day && day !== lastDay ? day : null;
+      out.push(day && day !== lastDay ? day : null);
       lastDay = day || lastDay;
-      return show;
-    });
+    }
+    return out;
   }, [messages]);
 
   return (
@@ -134,7 +134,7 @@ export function Thread({ messages, agent, inflight, onStop, stopping, onPause, p
               key={m.id}
               message={m}
               day={days[i] ?? null}
-              animate={!reduce && !initialIds.current!.has(m.id)}
+              animate={!reduce && !initialIds.has(m.id)}
               flashing={flash === m.id}
               agent={agent}
               delegatedFrom={delegatedFrom}
diff --git a/apps/desktop/src/components/chat/use-stick-to-bottom.ts b/apps/desktop/src/components/chat/use-stick-to-bottom.ts
index 0e55fa69..bae4028a 100644
--- a/apps/desktop/src/components/chat/use-stick-to-bottom.ts
+++ b/apps/desktop/src/components/chat/use-stick-to-bottom.ts
@@ -5,6 +5,8 @@ const FOLLOW_TAU_MS = 70;
 const JUMP_TAU_MS = 110;
 const PIN_OFFSET = 64;
 
+const maxTop = (el: HTMLElement) => Math.max(0, el.scrollHeight - el.clientHeight);
+
 export function useStickToBottom({ threshold = 72, reduceMotion = false }: { threshold?: number; reduceMotion?: boolean } = {}) {
   const scrollRef = useRef<HTMLDivElement>(null);
   const contentRef = useRef<HTMLDivElement>(null);
@@ -12,13 +14,13 @@ export function useStickToBottom({ threshold = 72, reduceMotion = false }: { thr
   const stickRef = useRef(true);
   const pinnedRef = useRef(false);
   const reduceRef = useRef(reduceMotion);
-  reduceRef.current = reduceMotion;
+  useLayoutEffect(() => {
+    reduceRef.current = reduceMotion;
+  });
   const [atBottom, setAtBottom] = useState(true);
 
   const engine = useRef({ frame: 0, last: 0, tau: FOLLOW_TAU_MS, mountedAt: 0, pointerDown: false, scrollbarDrag: false });
 
-  const maxTop = (el: HTMLElement) => Math.max(0, el.scrollHeight - el.clientHeight);
-
   const layoutSpacer = useCallback(() => {
     const el = scrollRef.current;
     const content = contentRef.current;
@@ -38,14 +40,14 @@ export function useStickToBottom({ threshold = 72, reduceMotion = false }: { thr
     if (spacer.style.height !== next) spacer.style.height = next;
   }, []);
 
-  const tick = useCallback((now: number) => {
+  const tick = useCallback(function step(now: number) {
     const e = engine.current;
     e.frame = 0;
     const el = scrollRef.current;
     if (!el || !stickRef.current) return;
     if (e.pointerDown) {
       e.last = now;
-      e.frame = requestAnimationFrame(tick);
+      e.frame = requestAnimationFrame(step);
       return;
     }
     const target = maxTop(el);
@@ -57,9 +59,9 @@ export function useStickToBottom({ threshold = 72, reduceMotion = false }: { thr
     }
     const dt = Math.min(64, Math.max(1, now - (e.last || now - 16)));
     e.last = now;
-    const step = diff * (1 - Math.exp(-dt / e.tau));
-    el.scrollTop += Math.abs(step) < 1 ? Math.sign(diff) : step;
-    e.frame = requestAnimationFrame(tick);
+    const delta = diff * (1 - Math.exp(-dt / e.tau));
+    el.scrollTop += Math.abs(delta) < 1 ? Math.sign(diff) : delta;
+    e.frame = requestAnimationFrame(step);
   }, []);
 
   const kick = useCallback(() => {
diff --git a/apps/desktop/src/components/chat/voice-mode.tsx b/apps/desktop/src/components/chat/voice-mode.tsx
index 6b2ceb90..8cde98ce 100644
--- a/apps/desktop/src/components/chat/voice-mode.tsx
+++ b/apps/desktop/src/components/chat/voice-mode.tsx
@@ -1,4 +1,4 @@
-import { useCallback, useEffect, useRef, useState } from "react";
+import { useCallback, useEffect, useLayoutEffect, useRef, useState } from "react";
 import { AnimatePresence, motion } from "motion/react";
 import type { Agent, CharacterMood, Message } from "@godmode/shared";
 import { Mic, MicOff, Square, X } from "lucide-react";
@@ -107,7 +107,9 @@ function VoiceModeOverlay({ agent, busy, activity, lastMessage, onSend, onStop }
   const [transcript, setTranscript] = useState("");
   const [reply, setReply] = useState("");
   const phaseRef = useRef(phase);
-  phaseRef.current = phase;
+  useLayoutEffect(() => {
+    phaseRef.current = phase;
+  });
   const emptyStreak = useRef(0);
   const speakLevel = useRef(0);
   const levelRef = useRef(0);
diff --git a/apps/desktop/src/components/chat/voice-visuals.tsx b/apps/desktop/src/components/chat/voice-visuals.tsx
index 0cdf2f6c..e612048f 100644
--- a/apps/desktop/src/components/chat/voice-visuals.tsx
+++ b/apps/desktop/src/components/chat/voice-visuals.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useRef, type RefObject } from "react";
+import { useEffect, useLayoutEffect, useRef, type RefObject } from "react";
 import { Orb, type OrbVariant } from "@/components/aicss/Orb";
 import { cn } from "@/lib/utils";
 
@@ -36,7 +36,9 @@ export function VoiceOrb({
 }) {
   const ref = useRef<HTMLButtonElement>(null);
   const phaseRef = useRef(phase);
-  phaseRef.current = phase;
+  useLayoutEffect(() => {
+    phaseRef.current = phase;
+  });
 
   useEffect(() => {
     let raf = 0;
diff --git a/apps/desktop/src/components/computer/computer-live-view.tsx b/apps/desktop/src/components/computer/computer-live-view.tsx
index 9111ce40..7f30dc88 100644
--- a/apps/desktop/src/components/computer/computer-live-view.tsx
+++ b/apps/desktop/src/components/computer/computer-live-view.tsx
@@ -1,4 +1,4 @@
-import { useCallback, useEffect, useRef, useState, type KeyboardEvent, type MouseEvent } from "react";
+import { useCallback, useEffect, useLayoutEffect, useRef, useState, type KeyboardEvent, type MouseEvent } from "react";
 import { useQueryClient } from "@tanstack/react-query";
 import { AnimatePresence, motion } from "motion/react";
 import { useTranslation } from "react-i18next";
@@ -94,7 +94,9 @@ export function ComputerLiveView({
   const controlled = expandedProp !== undefined;
   const expanded = expandedProp ?? expandedState;
   const onExpandedChangeRef = useRef(onExpandedChange);
-  onExpandedChangeRef.current = onExpandedChange;
+  useLayoutEffect(() => {
+    onExpandedChangeRef.current = onExpandedChange;
+  });
   const setExpanded = useCallback(
     (next: boolean) => {
       if (!controlled) setExpandedState(next);
@@ -110,7 +112,11 @@ export function ComputerLiveView({
   const viewportRef = useRef<HTMLDivElement>(null);
   const imgRef = useRef<HTMLImageElement>(null);
   const size = useRef({ width: 0, height: 0 });
-  size.current = { width: frame?.width ?? 0, height: frame?.height ?? 0 };
+  const frameWidth = frame?.width ?? 0;
+  const frameHeight = frame?.height ?? 0;
+  useLayoutEffect(() => {
+    size.current = { width: frameWidth, height: frameHeight };
+  }, [frameWidth, frameHeight]);
 
   useEffect(() => subscribeComputer(view), [view]);
   useEffect(() => setAgentPointer(null), [view]);
@@ -162,8 +168,12 @@ export function ComputerLiveView({
     const p = place(agentAction.x, agentAction.y);
     if (p && /click|drag/.test(agentAction.action)) ripple(p.x, p.y, true);
   }, [agentAction, place, ripple]);
-  const pointerAt =
-    (target.kind === "window" || target.kind === "tab") && agentPointer && now - agentPointer.at < AGENT_POINTER_IDLE_MS ? place(agentPointer.x, agentPointer.y) : null;
+  const pointerShown = (target.kind === "window" || target.kind === "tab") && !!agentPointer && now - agentPointer.at < AGENT_POINTER_IDLE_MS;
+  const [pointerAt, setPointerAt] = useState<{ x: number; y: number } | null>(null);
+  useLayoutEffect(() => {
+    const next = pointerShown && agentPointer ? place(agentPointer.x, agentPointer.y) : null;
+    setPointerAt((prev) => (prev === next || (prev && next && prev.x === next.x && prev.y === next.y) ? prev : next));
+  });
 
   /* ---------------------------- input forwarding ---------------------------- */
 
diff --git a/apps/desktop/src/components/devices/device-parts.tsx b/apps/desktop/src/components/devices/device-parts.tsx
index bb4cdd81..e3f1551b 100644
--- a/apps/desktop/src/components/devices/device-parts.tsx
+++ b/apps/desktop/src/components/devices/device-parts.tsx
@@ -155,7 +155,7 @@ export function HandoffButton({
 }) {
   const { t } = useTranslation("devices");
   const { group, targets, working, handoff, pending } = useHandoff();
-  label ??= t("handoff.label");
+  label = label ?? t("handoff.label");
   const icon = pending ? <Spinner /> : <ArrowRightFromLine />;
   const to = targets.length === 1 ? targets[0] : null;
   const unavailable = group?.role === "secondary" ? (group.primaryName ? t("handoff.primaryAway", { name: group.primaryName }) : t("handoff.primaryAwayFallback")) : t("handoff.noneOnline");
diff --git a/apps/desktop/src/components/files/dialogs.tsx b/apps/desktop/src/components/files/dialogs.tsx
index 211316e3..080b7703 100644
--- a/apps/desktop/src/components/files/dialogs.tsx
+++ b/apps/desktop/src/components/files/dialogs.tsx
@@ -242,9 +242,8 @@ export function NameDialog({
       onClose();
     } catch (err) {
       setError(errorMessage(err));
-    } finally {
-      setBusy(false);
     }
+    setBusy(false);
   };
 
   const title = mode?.kind === "rename" ? t("dialogs.name.titleRename", { name: current }) : mode?.kind === "note" ? t("dialogs.name.titleNote") : t("dialogs.name.titleFolder");
diff --git a/apps/desktop/src/components/files/file-editor.tsx b/apps/desktop/src/components/files/file-editor.tsx
index 4e7b16d0..5d6c3568 100644
--- a/apps/desktop/src/components/files/file-editor.tsx
+++ b/apps/desktop/src/components/files/file-editor.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useMemo, useRef, useState, type ReactNode } from "react";
+import { useEffect, useLayoutEffect, useMemo, useRef, useState, type ReactNode } from "react";
 import { Link } from "react-router";
 import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import { Trans, useTranslation } from "react-i18next";
@@ -192,11 +192,13 @@ export function FileEditor({
     toast.warning(t("editor.conflictToast", { name: nameOf(path) }), { description: t("editor.conflictToastDescription") });
 
   const saveRef = useRef<() => void>(() => {});
-  saveRef.current = () => {
-    if (!dirty || readOnly || save.isPending || !draft) return;
-    if (conflict) warnConflict();
-    else save.mutate({ content: value, base: draft.base });
-  };
+  useLayoutEffect(() => {
+    saveRef.current = () => {
+      if (!dirty || readOnly || save.isPending || !draft) return;
+      if (conflict) warnConflict();
+      else save.mutate({ content: value, base: draft.base });
+    };
+  });
   useEffect(() => {
     const onKey = (e: KeyboardEvent) => {
       const mod = isMac ? e.metaKey : e.ctrlKey;
diff --git a/apps/desktop/src/components/github/pull-request-panel.tsx b/apps/desktop/src/components/github/pull-request-panel.tsx
index 8c84eb6f..5cfe0aad 100644
--- a/apps/desktop/src/components/github/pull-request-panel.tsx
+++ b/apps/desktop/src/components/github/pull-request-panel.tsx
@@ -86,9 +86,8 @@ export function PullRequestPanel({ conversationId, url, onHide }: { conversation
       qc.setQueryData(qk.pullRequest(url), await api.github.pull(url, { refresh: true }));
     } catch {
       await query.refetch();
-    } finally {
-      setRefreshing(false);
     }
+    setRefreshing(false);
   };
   const width = "min(44vw, 620px)";
   const data = query.data;
@@ -496,9 +495,8 @@ function MergeBar({ pr, url }: { pr: PullRequestView; url: string }) {
       if (inDialog) setProblem(reason);
       else toast.error(t("pullRequest.autoMerge.disableFailed", { reason }));
       if (err instanceof ApiRequestError && err.code === GithubErrorCode.MergeRefused) void qc.invalidateQueries({ queryKey: qk.pullRequest(url) });
-    } finally {
-      setBusy(false);
     }
+    setBusy(false);
   };
 
   const confirm = async () => {
diff --git a/apps/desktop/src/components/human-tasks/human-task-board.tsx b/apps/desktop/src/components/human-tasks/human-task-board.tsx
index afd2913b..e46583b4 100644
--- a/apps/desktop/src/components/human-tasks/human-task-board.tsx
+++ b/apps/desktop/src/components/human-tasks/human-task-board.tsx
@@ -404,11 +404,13 @@ function QuickAdd({ onSubmit, onClose }: { onSubmit: (title: string) => Promise<
     setBusy(true);
     try {
       await onSubmit(t);
-      setTitle("");
-      ref.current?.focus();
-    } finally {
+    } catch (err) {
       setBusy(false);
+      throw err;
     }
+    setTitle("");
+    ref.current?.focus();
+    setBusy(false);
   };
   return (
     <div className="rounded-lg border bg-card p-2 shadow-card">
diff --git a/apps/desktop/src/components/layout/recent-chats.tsx b/apps/desktop/src/components/layout/recent-chats.tsx
index 2f0591dd..dc8f33f9 100644
--- a/apps/desktop/src/components/layout/recent-chats.tsx
+++ b/apps/desktop/src/components/layout/recent-chats.tsx
@@ -2,7 +2,7 @@ import { Link, useLocation, useMatch, useNavigate } from "react-router";
 import { useQuery, useQueryClient } from "@tanstack/react-query";
 import { differenceInCalendarDays, formatDistanceToNowStrict } from "date-fns";
 import type { Agent, Conversation, Workspace } from "@godmode/shared";
-import { Fragment, useEffect, useRef, useState } from "react";
+import { Fragment, useEffect, useLayoutEffect, useRef, useState } from "react";
 import { Trans, useTranslation } from "react-i18next";
 import { AlarmClock, Archive, Bot, CheckCheck, ChevronDown, CircleCheck, CircleDot, MessagesSquare, Pin, PinOff, Trash2, Workflow, Zap } from "lucide-react";
 import { toast } from "sonner";
@@ -165,7 +165,9 @@ export function RecentChats() {
   }
   const slots = rows.flatMap((r) => (r.folded ? [] : [r.c.id])).slice(0, 9);
   const slotsRef = useRef(slots);
-  slotsRef.current = slots;
+  useLayoutEffect(() => {
+    slotsRef.current = slots;
+  });
   const holding = useModifierHeld();
   useEffect(() => {
     const onKey = (e: KeyboardEvent) => {
diff --git a/apps/desktop/src/components/license/activate.tsx b/apps/desktop/src/components/license/activate.tsx
index 8025db95..73ae5c54 100644
--- a/apps/desktop/src/components/license/activate.tsx
+++ b/apps/desktop/src/components/license/activate.tsx
@@ -71,6 +71,7 @@ export function LicenseKeyForm({
       qc.setQueryData(qk.license, state);
       if (state.blocked) {
         setError(state.message ?? t("keyForm.cantUse"));
+        setBusy(false);
         return;
       }
       setKey("");
@@ -81,9 +82,8 @@ export function LicenseKeyForm({
     } catch (err) {
       setError(errorMessage(err));
       input.current?.focus();
-    } finally {
-      setBusy(false);
     }
+    setBusy(false);
   };
 
   return (
diff --git a/apps/desktop/src/components/license/deep-link.ts b/apps/desktop/src/components/license/deep-link.ts
index 69dc1f1c..530d95eb 100644
--- a/apps/desktop/src/components/license/deep-link.ts
+++ b/apps/desktop/src/components/license/deep-link.ts
@@ -50,6 +50,9 @@ async function activate(qc: QueryClient, key: string) {
   }
 }
 
+const loadTauriCore = () => import("@tauri-apps/api/core");
+const loadTauriEvent = () => import("@tauri-apps/api/event");
+
 /** Takes the links the desktop shell received (waiting ones first, on a cold start) once the core can be asked. */
 export function useLicenseDeepLinks(enabled: boolean) {
   const qc = useQueryClient();
@@ -61,7 +64,7 @@ export function useLicenseDeepLinks(enabled: boolean) {
     const drain = () => {
       draining = draining.then(async () => {
         if (stopped) return;
-        const { invoke } = await import("@tauri-apps/api/core");
+        const { invoke } = await loadTauriCore();
         // An older shell without the command answers with an error: no links then.
         const links = await invoke<string[]>("take_deep_links").catch(() => [] as string[]);
         for (const link of links) {
@@ -70,7 +73,7 @@ export function useLicenseDeepLinks(enabled: boolean) {
         }
       }).catch(() => {});
     };
-    void import("@tauri-apps/api/event").then(async ({ listen }) => {
+    void loadTauriEvent().then(async ({ listen }) => {
       const off = await listen("deep-link", drain);
       if (stopped) off();
       else unlisten = off;
diff --git a/apps/desktop/src/components/license/reminder-email.tsx b/apps/desktop/src/components/license/reminder-email.tsx
index 1b5d1cd1..86475a15 100644
--- a/apps/desktop/src/components/license/reminder-email.tsx
+++ b/apps/desktop/src/components/license/reminder-email.tsx
@@ -39,9 +39,8 @@ export function ReminderEmailForm({ onSkip, onSaved, className }: { onSkip?: ()
       onSaved?.();
     } catch (err) {
       setError(errorMessage(err));
-    } finally {
-      setBusy(false);
     }
+    setBusy(false);
   };
 
   return (
@@ -106,9 +105,8 @@ export function ReminderEmailSet({ email, className }: { email: string; classNam
       qc.setQueryData(qk.license, await api.license.removeReminders());
     } catch (err) {
       setError(errorMessage(err));
-    } finally {
-      setBusy(false);
     }
+    setBusy(false);
   };
 
   return (
diff --git a/apps/desktop/src/components/messaging/connect-dialog.tsx b/apps/desktop/src/components/messaging/connect-dialog.tsx
index 273d1080..47045d8c 100644
--- a/apps/desktop/src/components/messaging/connect-dialog.tsx
+++ b/apps/desktop/src/components/messaging/connect-dialog.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useState, type ReactNode } from "react";
+import { useEffect, useEffectEvent, useState, type ReactNode } from "react";
 import { useQueryClient } from "@tanstack/react-query";
 import { AnimatePresence, motion } from "motion/react";
 import { Trans, useTranslation } from "react-i18next";
@@ -102,9 +102,11 @@ export function ConnectDialog({
     }
   }
   const loaded = !!agents.data;
+  const onLoaded = useEffectEvent(() => {
+    if (provider && !agentIds.length) preselect();
+  });
   useEffect(() => {
-    if (loaded && provider && !agentIds.length) preselect();
-    // eslint-disable-next-line react-hooks/exhaustive-deps
+    if (loaded) onLoaded();
   }, [loaded]);
   const p = provider ?? shown;
   if (!p) return null;
@@ -129,9 +131,8 @@ export function ConnectDialog({
       if (!name) setName(result.bot.name);
     } catch (err) {
       setVerifyError(errorMessage(err));
-    } finally {
-      setChecking(false);
     }
+    setChecking(false);
   };
 
   const connect = async () => {
@@ -152,12 +153,14 @@ export function ConnectDialog({
       void qc.invalidateQueries({ queryKey: qk.messaging });
       toast.success(t("connect.connectedToast", { name: conn.name }));
     } catch (err) {
-      if (isGrantCancelled(err)) return;
+      if (isGrantCancelled(err)) {
+        setSaving(false);
+        return;
+      }
       if (isVaultLocked(err)) toastApiError(err, "", qc);
       else toast.error(t("connect.connectError"), { description: errorMessage(err) });
-    } finally {
-      setSaving(false);
     }
+    setSaving(false);
   };
 
   const index = STEPS.findIndex((s) => s.id === step);
diff --git a/apps/desktop/src/components/mods/mod-parts.tsx b/apps/desktop/src/components/mods/mod-parts.tsx
index 5ab13622..3b0ac93e 100644
--- a/apps/desktop/src/components/mods/mod-parts.tsx
+++ b/apps/desktop/src/components/mods/mod-parts.tsx
@@ -94,7 +94,7 @@ export function ModIconTile({
   icon,
   state,
   size = "md",
-  raised = state === "on",
+  raised: raisedProp,
   className,
 }: {
   icon: ModIcon;
@@ -103,6 +103,7 @@ export function ModIconTile({
   raised?: boolean;
   className?: string;
 }) {
+  const raised = raisedProp ?? state === "on";
   return (
     <div className={cn("relative shrink-0", className)}>
       <div
diff --git a/apps/desktop/src/components/onboarding/remote-step.tsx b/apps/desktop/src/components/onboarding/remote-step.tsx
index 251c6b5a..5c2aa5bf 100644
--- a/apps/desktop/src/components/onboarding/remote-step.tsx
+++ b/apps/desktop/src/components/onboarding/remote-step.tsx
@@ -42,9 +42,8 @@ export function RemoteStep({
       onDone(true);
     } catch (err) {
       setError(errorMessage(err));
-    } finally {
-      setBusy(false);
     }
+    setBusy(false);
   };
 
   return (
diff --git a/apps/desktop/src/components/onboarding/setup-step.tsx b/apps/desktop/src/components/onboarding/setup-step.tsx
index 53ef7b86..7ffab1a1 100644
--- a/apps/desktop/src/components/onboarding/setup-step.tsx
+++ b/apps/desktop/src/components/onboarding/setup-step.tsx
@@ -69,6 +69,7 @@ export function SetupStep({
   const [details, setDetails] = useState(false);
   const busy = useRef(false);
   const signInTried = useRef(false);
+  const [signInStarted, setSignInStarted] = useState(false);
 
   const refresh = useCallback(async () => {
     const next = await api.doctor.get(true);
@@ -80,6 +81,7 @@ export function SetupStep({
   const signIn = (r: DoctorReport) => {
     if (signInTried.current || !maySignIn || !find(r, "claude")?.ok || !missing(find(r, "claude-auth"))) return;
     signInTried.current = true;
+    setSignInStarted(true);
     if (login.state !== "waiting") login.start.mutate();
   };
 
@@ -102,23 +104,23 @@ export function SetupStep({
         }
         setJobs((j) => ({ ...j, [id]: { state: "installing" } }));
         const res = await api.doctor.install(id).catch((e) => ({ ok: false, output: errorMessage(e) }));
-        let ok = res.ok;
-        try {
-          r = await refresh();
-          // A check that started before the install finished may still say it is missing.
-          if (res.ok && !find(r, id)?.ok) r = await refresh();
-          ok = find(r, id)?.ok ?? res.ok;
-        } finally {
-          setJobs((j) => ({ ...j, [id]: { state: ok ? "done" : "failed", output: res.output } }));
-        }
+        const settle = (ok: boolean) => setJobs((j) => ({ ...j, [id]: { state: ok ? "done" : "failed", output: res.output } }));
+        // A check that started before the install finished may still say it is missing.
+        const checked = await refresh()
+          .then((next) => (res.ok && !find(next, id)?.ok ? refresh() : next))
+          .catch((e: unknown) => {
+            settle(res.ok);
+            throw e;
+          });
+        r = checked;
+        settle(find(r, id)?.ok ?? res.ok);
       }
       signIn(r);
     } catch (e) {
       setError(errorMessage(e));
-    } finally {
-      busy.current = false;
-      setRunning(false);
     }
+    busy.current = false;
+    setRunning(false);
   };
 
   const allOk = !!report && ROW_IDS.every((id) => !missing(find(report, id)));
@@ -147,7 +149,7 @@ export function SetupStep({
           ? "failed"
           : !started
             ? "idle"
-            : login.start.isPending || (running && maySignIn && (!claudeOk || !signInTried.current))
+            : login.start.isPending || (running && maySignIn && (!claudeOk || !signInStarted))
               ? "waiting"
               : claudeOk && maySignIn
                 ? "action"
diff --git a/apps/desktop/src/components/onboarding/vault-step.tsx b/apps/desktop/src/components/onboarding/vault-step.tsx
index 9335f846..885d33a6 100644
--- a/apps/desktop/src/components/onboarding/vault-step.tsx
+++ b/apps/desktop/src/components/onboarding/vault-step.tsx
@@ -75,9 +75,8 @@ function CreateVault({ userName, onDone, onBack }: { userName: string; onDone: (
       onDone();
     } catch (err) {
       setError(errorMessage(err));
-    } finally {
-      setBusy(false);
     }
+    setBusy(false);
   };
 
   return (
@@ -176,9 +175,8 @@ function UnlockInline({ onDone, onBack }: { onDone: () => void; onBack: () => vo
     } catch (err) {
       setError(unlockError(err));
       void controls.start(shake);
-    } finally {
-      setBusy(false);
     }
+    setBusy(false);
   };
 
   return (
diff --git a/apps/desktop/src/components/permissions/mac-permissions.tsx b/apps/desktop/src/components/permissions/mac-permissions.tsx
index 1d3a6323..384c34f0 100644
--- a/apps/desktop/src/components/permissions/mac-permissions.tsx
+++ b/apps/desktop/src/components/permissions/mac-permissions.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useMemo, useRef, useState } from "react";
+import { useEffect, useEffectEvent, useMemo, useRef, useState } from "react";
 import { useMutation, useQueryClient } from "@tanstack/react-query";
 import { AnimatePresence, motion } from "motion/react";
 import { useTranslation } from "react-i18next";
@@ -93,9 +93,9 @@ export function MacPermissionsGuide() {
   // Opened (again, maybe for another permission): start where asked, else at the first one missing.
   const firstMissing = list.find((p) => !p.ok)?.id ?? list[0]?.id ?? null;
   const ready = !!data;
+  const startAt = useEffectEvent((at: PrivacyId | null) => setCurrent(at ?? firstMissing));
   useEffect(() => {
-    if (open && ready) setCurrent(focus ?? firstMissing);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
+    if (open && ready) startAt(focus);
   }, [open, focus, ready]);
 
   const active = list.find((p) => p.id === current) ?? null;
diff --git a/apps/desktop/src/components/projects/project-dialog.tsx b/apps/desktop/src/components/projects/project-dialog.tsx
index fbedd505..dcbbcbdd 100644
--- a/apps/desktop/src/components/projects/project-dialog.tsx
+++ b/apps/desktop/src/components/projects/project-dialog.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useMemo, useRef, useState, type FormEvent } from "react";
+import { useEffect, useRef, useState, type FormEvent } from "react";
 import { Link } from "react-router";
 import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import { useTranslation } from "react-i18next";
@@ -76,11 +76,16 @@ export function ProjectDialog({
   const draftKey = project ? `project:${project.id}` : newKey;
   const [look, setLook] = useState(() => randomLook(workspace));
   const newLook = useRef(false);
-  const base = useMemo(() => formFrom(project, look), [open, project?.id, look]);
+  const [baseOf, setBaseOf] = useState(() => ({ open, id: project?.id, look, form: formFrom(project, look) }));
+  let base = baseOf.form;
+  if (baseOf.open !== open || baseOf.id !== project?.id || baseOf.look !== look) {
+    base = formFrom(project, look);
+    setBaseOf({ open, id: project?.id, look, form: base });
+  }
   const [live, setForm, kept] = useDraft(open ? draftKey : undefined, base);
-  const closing = useRef(live);
-  if (open) closing.current = live;
-  const form = open ? live : closing.current;
+  const [closing, setClosing] = useState(live);
+  if (open && closing !== live) setClosing(live);
+  const form = open ? live : closing;
   const { name, icon, color, description, instructions, browserProfileId, sources } = form;
   const set =
     <K extends keyof ProjectForm>(key: K) =>
diff --git a/apps/desktop/src/components/runners/chat-move-progress.tsx b/apps/desktop/src/components/runners/chat-move-progress.tsx
index 5e14fef5..4a8ac1a4 100644
--- a/apps/desktop/src/components/runners/chat-move-progress.tsx
+++ b/apps/desktop/src/components/runners/chat-move-progress.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useRef, useState } from "react";
+import { useEffect, useState } from "react";
 import type { QueryClient } from "@tanstack/react-query";
 import type { ChatMove, ConversationWithMessages, MoveChatInput } from "@godmode/shared";
 import { ArrowRightLeft, X } from "lucide-react";
@@ -25,13 +25,19 @@ function clock(seconds: number): string {
 
 /** Copy speed from the first bytes of the copy on, once there is enough to tell. */
 function useRate(move: ChatMove | undefined): number | null {
-  const first = useRef<{ at: number; bytes: number } | null>(null);
+  const [first, setFirst] = useState<{ at: number; bytes: number } | null>(null);
   const copying = move?.stage === "copying";
-  if (!copying) first.current = null;
-  else if (!first.current && move.bytes > 0) first.current = { at: Date.now(), bytes: move.bytes };
-  if (!copying || !first.current) return null;
-  const seconds = (Date.now() - first.current.at) / 1000;
-  return seconds >= 1.5 ? (move.bytes - first.current.bytes) / seconds : null;
+  if (!copying) {
+    if (first) setFirst(null);
+    return null;
+  }
+  if (!first) {
+    const bytes = move.bytes;
+    if (bytes > 0) setFirst(() => ({ at: Date.now(), bytes }));
+    return null;
+  }
+  const seconds = (Date.now() - first.at) / 1000;
+  return seconds >= 1.5 ? (move.bytes - first.bytes) / seconds : null;
 }
 
 function useElapsed(since: number): number {
@@ -46,11 +52,11 @@ function useElapsed(since: number): number {
 function ChatMoveToast({ toastId, conversationId, dest, agentName }: { toastId: string; conversationId: string; dest: string; agentName: string }) {
   const { t } = useTranslation("runners");
   const move = useChatMoves((s) => s.moves[conversationId]);
-  const started = useRef(Date.now());
-  const seen = useRef(false);
-  if (move) seen.current = true;
-  const finishing = !move && seen.current;
-  const elapsed = useElapsed(started.current);
+  const [started] = useState(() => Date.now());
+  const [seen, setSeen] = useState(false);
+  if (move && !seen) setSeen(true);
+  const finishing = !move && seen;
+  const elapsed = useElapsed(started);
   const rate = useRate(move);
 
   const percent = move?.stage === "copying" && move.total ? Math.min(100, (move.bytes / move.total) * 100) : finishing || move?.stage === "saving" || move?.stage === "continuing" ? 100 : null;
diff --git a/apps/desktop/src/components/runners/move-chat.tsx b/apps/desktop/src/components/runners/move-chat.tsx
index 2c9c858b..92ec8f65 100644
--- a/apps/desktop/src/components/runners/move-chat.tsx
+++ b/apps/desktop/src/components/runners/move-chat.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useRef, useState } from "react";
+import { useEffect, useState } from "react";
 import { useQueryClient } from "@tanstack/react-query";
 import { useTranslation } from "react-i18next";
 import type { Conversation } from "@godmode/shared";
@@ -78,9 +78,9 @@ export function MoveChatDialog({
     if (open) setTo(initial ?? targets[0] ?? null);
   }, [open, initial, targets]);
   // Once moved the chat works elsewhere: the closing dialog keeps saying where it came from.
-  const shown = useRef(from);
-  if (open) shown.current = from;
-  const origin = shown.current;
+  const [shown, setShown] = useState(from);
+  if (open && shown !== from) setShown(from);
+  const origin = open ? from : shown;
   const name = origin ? placeName(origin) : t("move.theOtherComputer");
   const away = !!origin && origin.state !== "online";
   const dest = to?.here ? thisComputerInline() : to ? placeName(to) : t("move.theOtherComputerInline");
diff --git a/apps/desktop/src/components/settings/cloud-link-dialog.tsx b/apps/desktop/src/components/settings/cloud-link-dialog.tsx
index 85f7b4da..0edbd451 100644
--- a/apps/desktop/src/components/settings/cloud-link-dialog.tsx
+++ b/apps/desktop/src/components/settings/cloud-link-dialog.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useState, type FormEvent } from "react";
+import { useEffect, useEffectEvent, useState, type FormEvent } from "react";
 import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import { AnimatePresence, motion } from "motion/react";
 import { Cloud, ExternalLink, RefreshCw, ShieldAlert } from "lucide-react";
@@ -133,11 +133,14 @@ export function CloudLinkDialog({ open, onOpenChange }: { open: boolean; onOpenC
     },
   });
 
-  useEffect(() => {
-    if (!open) return;
+  const onOpened = useEffectEvent(() => {
     link.reset();
     setStarted(status?.state === "linking");
-    // eslint-disable-next-line react-hooks/exhaustive-deps
+  });
+
+  useEffect(() => {
+    if (!open) return;
+    onOpened();
   }, [open]);
 
   const view = status?.state === "linking" && status.pending ? "pending" : started && status && isLinked(status) ? "linked" : "form";
diff --git a/apps/desktop/src/components/settings/connect-app-dialog.tsx b/apps/desktop/src/components/settings/connect-app-dialog.tsx
index c71fd683..f10fe151 100644
--- a/apps/desktop/src/components/settings/connect-app-dialog.tsx
+++ b/apps/desktop/src/components/settings/connect-app-dialog.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useId, useState, type FormEvent } from "react";
+import { useEffect, useEffectEvent, useId, useState, type FormEvent } from "react";
 import { useMutation, useQueryClient } from "@tanstack/react-query";
 import { AnimatePresence, motion } from "motion/react";
 import { Trans, useTranslation } from "react-i18next";
@@ -40,6 +40,8 @@ export function ConnectAppDialog({ tab, onClose, claudeCode }: { tab: ConnectTab
     },
   });
 
+  const resetCreate = useEffectEvent(() => create.reset());
+
   useEffect(() => {
     // Closed: the key leaves the page once the dialog has faded out.
     if (!tab) {
@@ -50,8 +52,7 @@ export function ConnectAppDialog({ tab, onClose, claudeCode }: { tab: ConnectTab
     setName("");
     setAccess("manage");
     setCreated(null);
-    create.reset();
-    // eslint-disable-next-line react-hooks/exhaustive-deps
+    resetCreate();
   }, [tab]);
 
   const ready = client === "claude-code" || name.trim().length > 0;
diff --git a/apps/desktop/src/components/settings/devices-section.tsx b/apps/desktop/src/components/settings/devices-section.tsx
index 45501603..da25a39e 100644
--- a/apps/desktop/src/components/settings/devices-section.tsx
+++ b/apps/desktop/src/components/settings/devices-section.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useRef, useState, type FormEvent, type ReactNode } from "react";
+import { useEffect, useEffectEvent, useRef, useState, type FormEvent, type ReactNode } from "react";
 import { useMutation, useQueryClient } from "@tanstack/react-query";
 import { AnimatePresence, motion, useReducedMotion } from "motion/react";
 import { Cable, Check, ClipboardPaste, Copy, KeyRound, LaptopMinimalCheck, LogOut, MessagesSquare, MonitorPause, MonitorSmartphone, MoonStar, Network, Plus, RefreshCw, Timer, Trash2, TriangleAlert, Unlink, X } from "lucide-react";
@@ -221,9 +221,10 @@ function InviteCode({ becomesPrimary }: { becomesPrimary?: boolean }) {
   const now = useNow(1000);
   const [copied, setCopied] = useState(false);
 
+  const createInvite = useEffectEvent(() => create.mutate());
+
   useEffect(() => {
-    create.mutate();
-    // eslint-disable-next-line react-hooks/exhaustive-deps
+    createInvite();
   }, []);
 
   const invite = create.data;
diff --git a/apps/desktop/src/components/settings/general-section.tsx b/apps/desktop/src/components/settings/general-section.tsx
index e1db8ddf..2f5b4e2e 100644
--- a/apps/desktop/src/components/settings/general-section.tsx
+++ b/apps/desktop/src/components/settings/general-section.tsx
@@ -21,6 +21,8 @@ import { CommitInput, Segmented, SectionHeading, SettingRow, SettingsGroup, useS
 
 type Theme = Settings["general"]["theme"];
 
+const loadAutostart = () => import("@tauri-apps/plugin-autostart");
+
 export function GeneralSection({ settings }: { settings: Settings }) {
   const { t } = useTranslation(["settings", "common"]);
   const { language, setLanguage, timeFormat, setTimeFormat, systemHour12 } = useLanguage();
@@ -39,7 +41,7 @@ export function GeneralSection({ settings }: { settings: Settings }) {
   useEffect(() => {
     if (!isTauri) return;
     let cancelled = false;
-    import("@tauri-apps/plugin-autostart")
+    loadAutostart()
       .then((m) => m.isEnabled())
       .then((v) => !cancelled && setAutostart(v))
       .catch(() => !cancelled && setAutostart(g.launchAtLogin));
@@ -51,16 +53,15 @@ export function GeneralSection({ settings }: { settings: Settings }) {
   const toggleAutostart = async (on: boolean) => {
     setAutostartBusy(true);
     try {
-      const m = await import("@tauri-apps/plugin-autostart");
+      const m = await loadAutostart();
       if (on) await m.enable();
       else await m.disable();
       setAutostart(on);
       patch({ general: { launchAtLogin: on } });
     } catch (e) {
       toast.error(t("general.launchAtLoginError"), { description: errorMessage(e) });
-    } finally {
-      setAutostartBusy(false);
     }
+    setAutostartBusy(false);
   };
 
   return (
diff --git a/apps/desktop/src/components/settings/pair-phone-dialog.tsx b/apps/desktop/src/components/settings/pair-phone-dialog.tsx
index 9e76788c..c3fb337b 100644
--- a/apps/desktop/src/components/settings/pair-phone-dialog.tsx
+++ b/apps/desktop/src/components/settings/pair-phone-dialog.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useState } from "react";
+import { useEffect, useEffectEvent, useState } from "react";
 import { useMutation, useQueryClient } from "@tanstack/react-query";
 import { AnimatePresence, motion } from "motion/react";
 import { Trans, useTranslation } from "react-i18next";
@@ -44,11 +44,16 @@ export function PairPhoneDialog({
     },
   });
 
+  const createOffer = useEffectEvent(() => create.mutate());
+  const renewOffer = useEffectEvent(() => {
+    if (!create.isPending) create.mutate();
+  });
+
   useEffect(() => {
     if (!open) return;
     setPaired(null);
     setOffer(null);
-    create.mutate();
+    createOffer();
     const off = onServerEvent((e) => {
       if (e.type === "mobile.paired") setPaired(e.device);
     });
@@ -56,15 +61,13 @@ export function PairPhoneDialog({
       off();
       void api.mobile.cancelPairing().catch(() => undefined);
     };
-    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [open]);
 
   const remaining = offer ? Math.max(0, Math.round((new Date(offer.expiresAt).getTime() - now) / 1000)) : 0;
   const expired = !!offer && remaining === 0;
 
   useEffect(() => {
-    if (open && expired && !paired && !create.isPending) create.mutate();
-    // eslint-disable-next-line react-hooks/exhaustive-deps
+    if (open && expired && !paired) renewOffer();
   }, [open, expired, paired]);
 
   const address = offer?.urls[0]?.replace(/^https?:\/\//, "");
diff --git a/apps/desktop/src/components/settings/settings-kit.tsx b/apps/desktop/src/components/settings/settings-kit.tsx
index 084c99b1..354fd4f7 100644
--- a/apps/desktop/src/components/settings/settings-kit.tsx
+++ b/apps/desktop/src/components/settings/settings-kit.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useId, useRef, useState, type ComponentProps, type KeyboardEvent, type ReactNode } from "react";
+import { useEffect, useId, useLayoutEffect, useRef, useState, type ComponentProps, type KeyboardEvent, type ReactNode } from "react";
 import { useMutation, useQueryClient } from "@tanstack/react-query";
 import { motion } from "motion/react";
 import { CircleAlert, Info, ShieldAlert, TriangleAlert } from "lucide-react";
@@ -65,14 +65,16 @@ export function useSettingsPatch() {
  * Local draft for a text-like value that commits after `delay` ms idle (null = only on blur/Enter).
  * Pending edits are flushed on unmount (e.g. when switching sections).
  */
-function useCommitDraft<T>(value: T, onCommit: (v: T) => void, delay: number | null = 600) {
+function useCommitDraft<T>(value: T, onCommit: (v: T, reset: (v: T) => void) => void, delay: number | null = 600) {
   const [draft, setDraftState] = useState(value);
   const focused = useRef(false);
   const dirty = useRef(false);
   const committed = useRef(value);
   const latest = useRef({ draft: value, onCommit });
   const timer = useRef<ReturnType<typeof setTimeout> | null>(null);
-  latest.current = { draft, onCommit };
+  useLayoutEffect(() => {
+    latest.current = { draft, onCommit };
+  });
 
   useEffect(() => {
     committed.current = value;
@@ -84,12 +86,22 @@ function useCommitDraft<T>(value: T, onCommit: (v: T) => void, delay: number | n
     timer.current = null;
   };
 
-  const flush = (v: T = latest.current.draft) => {
+  /** Replace the draft without saving (e.g. revert invalid input). */
+  const reset = (v: T) => {
+    clearTimer();
+    dirty.current = false;
+    committed.current = v;
+    latest.current.draft = v;
+    setDraftState(v);
+  };
+
+  const flush = (next?: T) => {
+    const v = next === undefined ? latest.current.draft : next;
     clearTimer();
     dirty.current = false;
     if (JSON.stringify(v) !== JSON.stringify(committed.current)) {
       committed.current = v;
-      latest.current.onCommit(v);
+      latest.current.onCommit(v, reset);
     }
   };
 
@@ -108,15 +120,6 @@ function useCommitDraft<T>(value: T, onCommit: (v: T) => void, delay: number | n
     if (delay !== null) timer.current = setTimeout(() => flush(v), delay);
   };
 
-  /** Replace the draft without saving (e.g. revert invalid input). */
-  const reset = (v: T) => {
-    clearTimer();
-    dirty.current = false;
-    committed.current = v;
-    latest.current.draft = v;
-    setDraftState(v);
-  };
-
   return {
     draft,
     setDraft,
@@ -166,7 +169,7 @@ export function CommitTextarea({
   className,
   ...props
 }: Omit<ComponentProps<typeof Textarea>, "value" | "onChange" | "defaultValue"> & { value: string; onCommit: (v: string) => void }) {
-  const d = useCommitDraft(value, onCommit, 800);
+  const d = useCommitDraft(value, (v) => onCommit(v), 800);
   return (
     <Textarea
       {...props}
@@ -232,19 +235,19 @@ export function NumberField({
   disabled?: boolean;
 }) {
   const toText = (v: number | null) => (v === null || v === undefined ? "" : String(v));
-  const d = useCommitDraft(toText(value), (text) => {
+  const d = useCommitDraft(toText(value), (text, reset) => {
     const t = text.trim();
     if (!t) {
       if (allowEmpty) onCommit(null);
-      else d.reset(toText(value));
+      else reset(toText(value));
       return;
     }
     let n = Number(t);
-    if (!Number.isFinite(n)) return d.reset(toText(value));
+    if (!Number.isFinite(n)) return reset(toText(value));
     if (min !== undefined) n = Math.max(min, n);
     if (max !== undefined) n = Math.min(max, n);
     if (step >= 1) n = Math.round(n);
-    if (String(n) !== t) d.reset(String(n));
+    if (String(n) !== t) reset(String(n));
     onCommit(n);
   }, null);
   return (
diff --git a/apps/desktop/src/components/settings/voice-section.tsx b/apps/desktop/src/components/settings/voice-section.tsx
index 1e157956..acb7c67f 100644
--- a/apps/desktop/src/components/settings/voice-section.tsx
+++ b/apps/desktop/src/components/settings/voice-section.tsx
@@ -41,6 +41,15 @@ export function VoiceSection({ settings }: { settings: Settings }) {
   const [playing, setPlaying] = useState<"loading" | "playing" | null>(null);
   const audioRef = useRef<HTMLAudioElement | null>(null);
 
+  const stop = () => {
+    if (typeof speechSynthesis !== "undefined") speechSynthesis.cancel();
+    if (audioRef.current) {
+      audioRef.current.pause();
+      audioRef.current = null;
+    }
+    setPlaying(null);
+  };
+
   useEffect(() => setRate(v.rate), [v.rate]);
   useEffect(() => () => stop(), []);
 
@@ -53,15 +62,6 @@ export function VoiceSection({ settings }: { settings: Settings }) {
 
   const usesOpenAi = v.sttProvider === "openai" || v.ttsProvider === "openai";
 
-  function stop() {
-    if (typeof speechSynthesis !== "undefined") speechSynthesis.cancel();
-    if (audioRef.current) {
-      audioRef.current.pause();
-      audioRef.current = null;
-    }
-    setPlaying(null);
-  }
-
   const testVoice = async () => {
     if (playing) return stop();
     if (v.ttsProvider === "browser") {
diff --git a/apps/desktop/src/components/tasks/description-editor.tsx b/apps/desktop/src/components/tasks/description-editor.tsx
index ec501e49..6708cdc4 100644
--- a/apps/desktop/src/components/tasks/description-editor.tsx
+++ b/apps/desktop/src/components/tasks/description-editor.tsx
@@ -1,4 +1,4 @@
-import { forwardRef, useEffect, useImperativeHandle, useRef, useState, type ComponentType, type ReactNode } from "react";
+import { forwardRef, useEffect, useImperativeHandle, useLayoutEffect, useRef, useState, type ComponentType, type ReactNode } from "react";
 import { useQueryClient } from "@tanstack/react-query";
 import { EditorContent, Node, NodeViewWrapper, ReactNodeViewRenderer, mergeAttributes, useEditor, useEditorState, type Editor, type JSONContent, type NodeViewProps } from "@tiptap/react";
 import { Plugin, PluginKey } from "@tiptap/pm/state";
@@ -150,6 +150,10 @@ const TaskLink = Link.extend({
 const PlainBreak = HardBreak.extend({ renderMarkdown: () => "\n" });
 
 let uploadSeq = 0;
+const nextUploadId = () => {
+  uploadSeq = uploadSeq + 1;
+  return `upload-${uploadSeq}`;
+};
 
 /**
  * The task description, as you'll read it: headings, lists, checklists and code render while you type (Markdown
@@ -190,7 +194,9 @@ export const DescriptionEditor = forwardRef<
   const emitted = useRef(value);
   // The editor is set up once: its handlers read the latest props through these.
   const props = useRef({ onChange, qc });
-  props.current = { onChange, qc };
+  useLayoutEffect(() => {
+    props.current = { onChange, qc };
+  });
   const uploadRef = useRef<(files: File[], at?: number) => void>(() => {});
 
   const editor = useEditor({
@@ -256,68 +262,70 @@ export const DescriptionEditor = forwardRef<
 
   useEffect(() => onBusyChange?.(uploads > 0), [uploads, onBusyChange]);
 
-  uploadRef.current = (files, at) => {
-    if (!files.length) return;
-    for (const file of files) {
-      if (file.size > MAX_TASK_ATTACHMENT_BYTES) {
-        toast.error(t("editor.tooLarge", { name: file.name }), { description: t("editor.maxSize", { size: formatBytes(MAX_TASK_ATTACHMENT_BYTES) }) });
-        continue;
-      }
-      const id = `upload-${++uploadSeq}`;
-      const image = file.type.startsWith("image/");
-      const preview = image ? URL.createObjectURL(file) : null;
-      const node = { type: "uploading", attrs: { id, name: file.name || "file", preview } };
-      const pos = at ?? editor.state.selection.from;
-      const $pos = editor.state.doc.resolve(Math.min(pos, editor.state.doc.content.size));
-      // An image gets a line of its own; a file chip goes where the cursor is.
-      const own = image && $pos.parent.isTextblock && $pos.parent.content.size > 0;
-      // A file right after an image goes on the next line, not glued to it.
-      const before = $pos.nodeBefore;
-      const afterImage = before?.type.name === "image" || (before?.type.name === "uploading" && !!before.attrs.preview);
-      editor
-        .chain()
-        .focus()
-        // Not an undo step: undoing it would drop the file when it lands (remove a file with its ×).
-        .setMeta("addToHistory", false)
-        .insertContentAt(
-          pos,
-          image
-            ? own
-              ? { type: "paragraph", content: [node] }
-              : [node]
-            : [...(afterImage ? [{ type: "hardBreak" }] : []), node, { type: "text", text: " " }],
-        )
-        .run();
-      // Where it can't go (a code block, say): at the end.
-      if (!findUpload(editor, id)) {
+  useLayoutEffect(() => {
+    uploadRef.current = (files, at) => {
+      if (!files.length) return;
+      for (const file of files) {
+        if (file.size > MAX_TASK_ATTACHMENT_BYTES) {
+          toast.error(t("editor.tooLarge", { name: file.name }), { description: t("editor.maxSize", { size: formatBytes(MAX_TASK_ATTACHMENT_BYTES) }) });
+          continue;
+        }
+        const id = nextUploadId();
+        const image = file.type.startsWith("image/");
+        const preview = image ? URL.createObjectURL(file) : null;
+        const node = { type: "uploading", attrs: { id, name: file.name || "file", preview } };
+        const pos = at ?? editor.state.selection.from;
+        const $pos = editor.state.doc.resolve(Math.min(pos, editor.state.doc.content.size));
+        // An image gets a line of its own; a file chip goes where the cursor is.
+        const own = image && $pos.parent.isTextblock && $pos.parent.content.size > 0;
+        // A file right after an image goes on the next line, not glued to it.
+        const before = $pos.nodeBefore;
+        const afterImage = before?.type.name === "image" || (before?.type.name === "uploading" && !!before.attrs.preview);
         editor
           .chain()
+          .focus()
+          // Not an undo step: undoing it would drop the file when it lands (remove a file with its ×).
           .setMeta("addToHistory", false)
-          .insertContentAt(editor.state.doc.content.size, { type: "paragraph", content: [node] })
+          .insertContentAt(
+            pos,
+            image
+              ? own
+                ? { type: "paragraph", content: [node] }
+                : [node]
+              : [...(afterImage ? [{ type: "hardBreak" }] : []), node, { type: "text", text: " " }],
+          )
           .run();
+        // Where it can't go (a code block, say): at the end.
+        if (!findUpload(editor, id)) {
+          editor
+            .chain()
+            .setMeta("addToHistory", false)
+            .insertContentAt(editor.state.doc.content.size, { type: "paragraph", content: [node] })
+            .run();
+        }
+        at = undefined; // the next one goes after this one
+        pending.current++;
+        setUploads((n) => n + 1);
+        api.tasks
+          .upload(file)
+          .then((a) => {
+            const done = a.mime.startsWith("image/")
+              ? editor.schema.nodes.image!.create({ src: a.url, alt: a.name })
+              : editor.schema.nodes.fileChip!.create({ href: a.url, name: a.name });
+            replaceUpload(editor, id, done);
+          })
+          .catch((err) => {
+            replaceUpload(editor, id, null);
+            toastApiError(err, t("editor.attachError", { name: file.name }), props.current.qc);
+          })
+          .finally(() => {
+            if (preview) URL.revokeObjectURL(preview);
+            pending.current--;
+            setUploads((n) => n - 1);
+          });
       }
-      at = undefined; // the next one goes after this one
-      pending.current++;
-      setUploads((n) => n + 1);
-      api.tasks
-        .upload(file)
-        .then((a) => {
-          const done = a.mime.startsWith("image/")
-            ? editor.schema.nodes.image!.create({ src: a.url, alt: a.name })
-            : editor.schema.nodes.fileChip!.create({ href: a.url, name: a.name });
-          replaceUpload(editor, id, done);
-        })
-        .catch((err) => {
-          replaceUpload(editor, id, null);
-          toastApiError(err, t("editor.attachError", { name: file.name }), props.current.qc);
-        })
-        .finally(() => {
-          if (preview) URL.revokeObjectURL(preview);
-          pending.current--;
-          setUploads((n) => n - 1);
-        });
-    }
-  };
+    };
+  });
 
   useImperativeHandle(
     ref,
diff --git a/apps/desktop/src/components/tasks/task-board.tsx b/apps/desktop/src/components/tasks/task-board.tsx
index 51221f99..54d37778 100644
--- a/apps/desktop/src/components/tasks/task-board.tsx
+++ b/apps/desktop/src/components/tasks/task-board.tsx
@@ -491,13 +491,12 @@ function QuickAdd({ onSubmit, onClose }: { onSubmit: (title: string) => Promise<
     const t = title.trim();
     if (!t || busy) return;
     setBusy(true);
-    try {
-      await onSubmit(t);
-      setTitle("");
-      ref.current?.focus();
-    } finally {
-      setBusy(false);
-    }
+    await onSubmit(t)
+      .then(() => {
+        setTitle("");
+        ref.current?.focus();
+      })
+      .finally(() => setBusy(false));
   };
   return (
     <div className="rounded-lg border bg-card p-2 shadow-card">
diff --git a/apps/desktop/src/components/tasks/task-dialog.tsx b/apps/desktop/src/components/tasks/task-dialog.tsx
index 7be03910..92301314 100644
--- a/apps/desktop/src/components/tasks/task-dialog.tsx
+++ b/apps/desktop/src/components/tasks/task-dialog.tsx
@@ -1,4 +1,4 @@
-import { useCallback, useEffect, useMemo, useRef, useState, type FormEvent, type KeyboardEvent, type ReactNode } from "react";
+import { useCallback, useEffect, useEffectEvent, useMemo, useRef, useState, type FormEvent, type KeyboardEvent, type ReactNode } from "react";
 import { useMutation, useQueryClient } from "@tanstack/react-query";
 import { ChevronRight, Folder, FolderGit2, FolderKanban, Globe2, Maximize2, Minimize2, Paperclip, Target, X } from "lucide-react";
 import { toast } from "sonner";
@@ -47,6 +47,22 @@ interface TaskForm {
 }
 
 /** Pill-shaped select, as in Multica's and Linear's issue composer. */
+const freshForm = (_open: boolean, workspaceId: string | null, projectId: string | null, defaultStatus: TaskStatus | undefined): TaskForm => ({
+  title: "",
+  description: "",
+  type: "general",
+  status: defaultStatus && START_STATUSES.includes(defaultStatus) ? defaultStatus : "todo",
+  workspaceId,
+  projectId,
+  agentId: null,
+  repoChoice: "",
+  repoUrl: "",
+  baseBranch: "",
+  priority: "none",
+  dueDate: null,
+  labels: [],
+});
+
 const PILL = "h-8 w-auto gap-1.5 rounded-full border-border/80 bg-transparent px-3 text-[13px] shadow-none hover:bg-accent/60 [&>svg:last-child]:hidden";
 
 export function TaskDialog({
@@ -84,32 +100,17 @@ export function TaskDialog({
   const [uploading, setUploading] = useState(false);
 
   // Fresh on every open; a draft (what was typed before closing or leaving) wins over it.
-  const base = useMemo<TaskForm>(
-    () => ({
-      title: "",
-      description: "",
-      type: "general",
-      status: defaultStatus && START_STATUSES.includes(defaultStatus) ? defaultStatus : "todo",
-      workspaceId: defaultWorkspaceId,
-      projectId: defaultProjectId,
-      agentId: null,
-      repoChoice: "",
-      repoUrl: "",
-      baseBranch: "",
-      priority: "none",
-      dueDate: null,
-      labels: [],
-    }),
-    // eslint-disable-next-line react-hooks/exhaustive-deps
+  const base = useMemo(
+    () => freshForm(open, defaultWorkspaceId, defaultProjectId, defaultStatus),
     [open, defaultWorkspaceId, defaultProjectId, defaultStatus],
   );
   // A part keeps its own draft (per ticket): it never turns up as a plain new task, or the other way round.
   const draftKey = parent ? `${DRAFT}:part:${parent.id}` : DRAFT;
   const [live, setForm, kept] = useDraft(open ? draftKey : undefined, base);
   // While the dialog animates out, keep showing what it had.
-  const closing = useRef(live);
-  if (open) closing.current = live;
-  const form = open ? live : closing.current;
+  const [closing, setClosing] = useState(live);
+  if (open && closing !== live) setClosing(live);
+  const form = open ? live : closing;
   const { title, description, type, status, workspaceId, agentId, repoChoice, repoUrl, baseBranch } = form;
   // Drafts saved before tickets had these fields.
   const priority = form.priority ?? "none";
@@ -128,11 +129,14 @@ export function TaskDialog({
   useEffect(() => {
     if (open) setGoalOff(false);
   }, [open]);
-  useEffect(() => {
+  const applyGoalWorkspace = useEffectEvent(() => {
     if (open && filterGoal?.workspaceId && workspaceId !== filterGoal.workspaceId) set("workspaceId", filterGoal.workspaceId);
-    // Only when the dialog opens with the goal (the human may pick another workspace afterwards).
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [open, filterGoal?.id]);
+  });
+  const filterGoalId = filterGoal?.id;
+  // Only when the dialog opens with the goal (the human may pick another workspace afterwards).
+  useEffect(() => {
+    applyGoalWorkspace();
+  }, [open, filterGoalId]);
   const goal = filterGoal && !goalOff && (!filterGoal.workspaceId || filterGoal.workspaceId === workspaceId) ? filterGoal : null;
 
   const workspace = workspaces.find((w) => w.id === workspaceId) ?? null;
diff --git a/apps/desktop/src/components/tasks/task-sheet.tsx b/apps/desktop/src/components/tasks/task-sheet.tsx
index 8894e548..a98a6c64 100644
--- a/apps/desktop/src/components/tasks/task-sheet.tsx
+++ b/apps/desktop/src/components/tasks/task-sheet.tsx
@@ -1,4 +1,4 @@
-import { useCallback, useEffect, useRef, useState, type ReactNode } from "react";
+import { useCallback, useEffect, useLayoutEffect, useRef, useState, type ReactNode } from "react";
 import { Link } from "react-router";
 import { useMutation, useMutationState, useQueryClient } from "@tanstack/react-query";
 import { format, formatDistanceToNowStrict } from "date-fns";
@@ -505,11 +505,7 @@ function TaskDetail({
 }
 
 /** Tickets this one waits for: it starts once each is delivered. Chips to remove, a picker to add (no loops: the core says). */
-function WaitsForField({ task, board, onChange }: { task: Task; board: Task[]; onChange: (ids: string[]) => void }) {
-  const { t: tr } = useTranslation("tasks");
-  const ADD = "add";
-  const ids = task.waitsFor.map((w) => w.id);
-  // Not what it is part of, nor its own parts (that would hold both), and only its workspace's tickets or global ones.
+function relatedTasks(task: Task, board: Task[]): Set<string> {
   const related = new Set<string>([task.id]);
   for (let up = task.parentId; up && !related.has(up); up = board.find((t) => t.id === up)?.parentId ?? null) related.add(up);
   const below = [task.id];
@@ -520,6 +516,15 @@ function WaitsForField({ task, board, onChange }: { task: Task; board: Task[]; o
       below.push(t.id);
     }
   }
+  return related;
+}
+
+function WaitsForField({ task, board, onChange }: { task: Task; board: Task[]; onChange: (ids: string[]) => void }) {
+  const { t: tr } = useTranslation("tasks");
+  const ADD = "add";
+  const ids = task.waitsFor.map((w) => w.id);
+  // Not what it is part of, nor its own parts (that would hold both), and only its workspace's tickets or global ones.
+  const related = relatedTasks(task, board);
   const choices = board
     .filter((t) => !related.has(t.id) && !ids.includes(t.id) && t.status !== "done" && t.status !== "cancelled" && (!t.workspaceId || t.workspaceId === task.workspaceId))
     .sort((a, b) => b.number - a.number);
@@ -885,10 +890,10 @@ function WorkPanel({
       kind === "failed" && /timed out/i.test(reason)
         ? t("work.timedOut")
         : null;
-    const restart = (label: string, icon = <RotateCcw />) =>
+    const restart = (label: string, icon?: ReactNode) =>
       task.agentId ? (
         <Button size="sm" onClick={() => onMove(task, "todo")}>
-          {icon} {label}
+          {icon ?? <RotateCcw />} {label}
         </Button>
       ) : null;
     const chat = task.conversationId ? (
@@ -1227,10 +1232,13 @@ function EditableDescription({
 
   /** The last text sent (null: the last save failed). One save at a time, the newest text waits for it. */
   const sent = useRef<string | null>(stored.trim());
+  const [sentText, setSentText] = useState<string | null>(() => stored.trim());
   const inFlight = useRef(false);
   const queued = useRef<string | null>(null);
   const live = useRef({ editing, draft, stored, mounted: true });
-  Object.assign(live.current, { editing, draft, stored });
+  useLayoutEffect(() => {
+    Object.assign(live.current, { editing, draft, stored });
+  });
 
   const push = (next: string) => {
     if (next === sent.current) return;
@@ -1239,6 +1247,7 @@ function EditableDescription({
       return;
     }
     sent.current = next;
+    setSentText(next);
     inFlight.current = true;
     setSaved(next);
     setStatus("saving");
@@ -1250,6 +1259,7 @@ function EditableDescription({
         },
         () => {
           sent.current = null;
+          setSentText(null);
           setSaved(null);
           setStatus("failed");
           const { editing, stored } = live.current;
@@ -1269,7 +1279,9 @@ function EditableDescription({
       });
   };
   const pushRef = useRef(push);
-  pushRef.current = push;
+  useLayoutEffect(() => {
+    pushRef.current = push;
+  });
 
   useEffect(() => {
     if (!editing || uploading) return;
@@ -1305,7 +1317,9 @@ function EditableDescription({
     setEditing(false);
   };
   const finishRef = useRef(finish);
-  finishRef.current = finish;
+  useLayoutEffect(() => {
+    finishRef.current = finish;
+  });
   useEffect(() => {
     if (!uploading && finishLater.current) finishRef.current();
   }, [uploading]);
@@ -1317,6 +1331,7 @@ function EditableDescription({
     setShownHeight(shown.getBoundingClientRect().height);
     setStart(value);
     sent.current = value.trim();
+    setSentText(value.trim());
     setStatus("idle");
     setEditing(true);
   };
@@ -1404,7 +1419,7 @@ function EditableDescription({
       {/* Clicks here keep the focus in the text (WebKit doesn't focus buttons), so they don't end the edit. */}
       <div className="flex items-center gap-2 border-t bg-paper-2/60 px-3 py-2 rounded-b-xl" onMouseDown={(e) => e.preventDefault()}>
         <SaveStatus
-          status={uploading ? "uploading" : status === "failed" ? status : withoutPlaceholders(draft) !== sent.current ? "saving" : status}
+          status={uploading ? "uploading" : status === "failed" ? status : withoutPlaceholders(draft) !== sentText ? "saving" : status}
           onRetry={() => push(withoutPlaceholders(draft))}
         />
         <Button type="button" size="sm" variant="secondary" className="ml-auto h-7 gap-1.5 px-3 text-xs" onClick={finish} disabled={uploading}>
diff --git a/apps/desktop/src/components/vault/camera-scanner.tsx b/apps/desktop/src/components/vault/camera-scanner.tsx
index e4fdf7a9..75a88fdf 100644
--- a/apps/desktop/src/components/vault/camera-scanner.tsx
+++ b/apps/desktop/src/components/vault/camera-scanner.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useRef, useState } from "react";
+import { useEffect, useEffectEvent, useRef, useState } from "react";
 import { AnimatePresence, motion } from "motion/react";
 import { Camera, CameraOff, CircleCheck, QrCode, RefreshCw, VideoOff } from "lucide-react";
 import { useTranslation } from "react-i18next";
@@ -35,10 +35,8 @@ export function CameraScanner({ known, onCode }: { known: Set<string>; onCode: (
   const [attempt, setAttempt] = useState(0);
   const [flash, setFlash] = useState<{ kind: "added" | "not-otp" | "duplicate"; text: string; at: number } | null>(null);
 
-  const knownRef = useRef(known);
-  knownRef.current = known;
-  const onCodeRef = useRef(onCode);
-  onCodeRef.current = onCode;
+  const isKnown = useEffectEvent((payload: string) => known.has(payload));
+  const emitCode = useEffectEvent((payload: string) => onCode(payload));
 
   useEffect(() => {
     let stream: MediaStream | null = null;
@@ -59,7 +57,7 @@ export function CameraScanner({ known, onCode }: { known: Set<string>; onCode: (
       const video = videoRef.current;
       if (!video || video.readyState < 2 || t - lastScan < SCAN_INTERVAL_MS) return;
       lastScan = t;
-      canvasRef.current ??= document.createElement("canvas");
+      if (canvasRef.current == null) canvasRef.current = document.createElement("canvas");
       const payload = scanVideoFrame(video, canvasRef.current);
       if (!payload) return;
       if (!isOtpUri(payload)) {
@@ -69,7 +67,7 @@ export function CameraScanner({ known, onCode }: { known: Set<string>; onCode: (
         }
         return;
       }
-      if (knownRef.current.has(payload)) {
+      if (isKnown(payload)) {
         if (lastIgnored !== payload) {
           lastIgnored = payload;
           setFlash({ kind: "duplicate", text: tg("vault:camera.duplicate"), at: Date.now() });
@@ -77,7 +75,7 @@ export function CameraScanner({ known, onCode }: { known: Set<string>; onCode: (
         return;
       }
       lastIgnored = payload;
-      onCodeRef.current(payload);
+      emitCode(payload);
       setFlash({ kind: "added", text: tg("vault:camera.added", { what: describe(payload) }), at: Date.now() });
     };
 
diff --git a/apps/desktop/src/components/vault/card-details-dialog.tsx b/apps/desktop/src/components/vault/card-details-dialog.tsx
index 6ba2c9d8..cd6de6cb 100644
--- a/apps/desktop/src/components/vault/card-details-dialog.tsx
+++ b/apps/desktop/src/components/vault/card-details-dialog.tsx
@@ -43,9 +43,8 @@ export function useCardDetails() {
         setOpen(true);
       } catch (e) {
         if (!isGrantCancelled(e)) toastApiError(e, tg("vault:cardDetails.showFailed"), qc);
-      } finally {
-        setRevealingId(null);
       }
+      setRevealingId(null);
     },
     [qc],
   );
diff --git a/apps/desktop/src/components/vault/card-dialog.tsx b/apps/desktop/src/components/vault/card-dialog.tsx
index e3e540df..ec4b4974 100644
--- a/apps/desktop/src/components/vault/card-dialog.tsx
+++ b/apps/desktop/src/components/vault/card-dialog.tsx
@@ -215,9 +215,8 @@ function CardForm({
       setBillingMode("edit");
     } catch (e) {
       if (!isGrantCancelled(e)) toastApiError(e, t("cardDialog.showBillingFailed"), qc);
-    } finally {
-      setRevealingBilling(false);
     }
+    setRevealingBilling(false);
   };
 
   /** What to send: the full input for a new card, only the changed fields for an existing one. */
diff --git a/apps/desktop/src/components/vault/chip-input.tsx b/apps/desktop/src/components/vault/chip-input.tsx
index 6fa30a86..c9bef376 100644
--- a/apps/desktop/src/components/vault/chip-input.tsx
+++ b/apps/desktop/src/components/vault/chip-input.tsx
@@ -4,12 +4,14 @@ import { X } from "lucide-react";
 import { useTranslation } from "react-i18next";
 import { cn } from "@/lib/utils";
 
+const trimChip = (s: string) => s.trim();
+
 /** Tag/chip input: Enter, comma, space or Tab commits; Backspace on empty removes the last chip. */
 export function ChipInput({
   value,
   onChange,
   placeholder,
-  normalize = (s) => s.trim(),
+  normalize = trimChip,
   validate,
   className,
   id,
diff --git a/apps/desktop/src/components/vault/copy-button.tsx b/apps/desktop/src/components/vault/copy-button.tsx
index 06ffd60f..1cb8ea65 100644
--- a/apps/desktop/src/components/vault/copy-button.tsx
+++ b/apps/desktop/src/components/vault/copy-button.tsx
@@ -35,13 +35,16 @@ export function CopyButton({
     setBusy(true);
     try {
       const v = value ?? (await getValue?.());
-      if (!v) return;
-      await (secret ? copySecret(v, toastLabel ?? t("actions.copied")) : copyText(v, toastLabel ?? t("actions.copied")));
-      setDone(true);
-      setTimeout(() => setDone(false), 1400);
-    } finally {
+      if (v) {
+        await (secret ? copySecret(v, toastLabel ?? t("actions.copied")) : copyText(v, toastLabel ?? t("actions.copied")));
+        setDone(true);
+        setTimeout(() => setDone(false), 1400);
+      }
+    } catch (err) {
       setBusy(false);
+      throw err;
     }
+    setBusy(false);
   };
   return (
     <Tooltip>
diff --git a/apps/desktop/src/components/vault/grant.tsx b/apps/desktop/src/components/vault/grant.tsx
index fdd958aa..6f149c13 100644
--- a/apps/desktop/src/components/vault/grant.tsx
+++ b/apps/desktop/src/components/vault/grant.tsx
@@ -126,9 +126,8 @@ export function VaultGrantDialog() {
       close(res.grant);
     } catch (err) {
       setError(errorMessage(err));
-    } finally {
-      setBusy(false);
     }
+    setBusy(false);
   };
 
   return (
diff --git a/apps/desktop/src/components/vault/password-import-dialog.tsx b/apps/desktop/src/components/vault/password-import-dialog.tsx
index 95afdfcc..41e9cac7 100644
--- a/apps/desktop/src/components/vault/password-import-dialog.tsx
+++ b/apps/desktop/src/components/vault/password-import-dialog.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useMemo, useRef, useState, type ReactNode } from "react";
+import { useEffect, useEffectEvent, useMemo, useRef, useState, type ReactNode } from "react";
 import { useMutation, useQueryClient } from "@tanstack/react-query";
 import { AnimatePresence, motion } from "motion/react";
 import { ArrowLeft, ChevronDown, FileKey, FileSpreadsheet, Lock, Search, ShieldCheck, Trash2, TriangleAlert, Upload, X } from "lucide-react";
@@ -141,8 +141,7 @@ function ImportFlow({ defaultWorkspaceId, onClose }: { defaultWorkspaceId: strin
     if (step.kind === "review") preview.mutate({ file: step.file, scope: next });
   };
 
-  const readRef = useRef(readFile);
-  readRef.current = readFile;
+  const readDropped = useEffectEvent((file: File) => readFile(file));
   useEffect(() => {
     if (step.kind !== "pick") return;
     const onDragOver = (e: DragEvent) => e.preventDefault();
@@ -150,7 +149,7 @@ function ImportFlow({ defaultWorkspaceId, onClose }: { defaultWorkspaceId: strin
       if (e.defaultPrevented) return;
       e.preventDefault();
       const file = e.dataTransfer?.files?.[0];
-      if (file) readRef.current(file);
+      if (file) readDropped(file);
     };
     // On the document: ahead of the app-wide drop guard on window.
     document.addEventListener("dragover", onDragOver);
diff --git a/apps/desktop/src/components/vault/qr-drop-zone.tsx b/apps/desktop/src/components/vault/qr-drop-zone.tsx
index 52c1f0d1..534f0a46 100644
--- a/apps/desktop/src/components/vault/qr-drop-zone.tsx
+++ b/apps/desktop/src/components/vault/qr-drop-zone.tsx
@@ -22,6 +22,11 @@ export interface QrImage {
 
 let seq = 0;
 
+const nextQrId = () => {
+  seq += 1;
+  return `qr-${seq}`;
+};
+
 /** Holds dropped/pasted screenshots and decodes each one locally. */
 export function useQrImages() {
   const [items, setItems] = useState<QrImage[]>([]);
@@ -38,7 +43,7 @@ export function useQrImages() {
   const addFiles = useCallback((files: File[] | FileList) => {
     const images = Array.from(files).filter((f) => f.type.startsWith("image/") || /\.(png|jpe?g|gif|webp|bmp|heic|avif)$/i.test(f.name));
     for (const file of images) {
-      const id = `qr-${++seq}`;
+      const id = nextQrId();
       const url = URL.createObjectURL(file);
       urls.current.add(url);
       setItems((prev) => [...prev, { id, name: file.name || tg("vault:qrDrop.pastedImage"), url, status: "decoding", found: [] }]);
diff --git a/apps/desktop/src/components/vault/strength-meter.tsx b/apps/desktop/src/components/vault/strength-meter.tsx
index 46cc11b3..5def6610 100644
--- a/apps/desktop/src/components/vault/strength-meter.tsx
+++ b/apps/desktop/src/components/vault/strength-meter.tsx
@@ -10,7 +10,7 @@ const LABEL_KEY = ["strength.tooWeak", "strength.weak", "strength.fair", "streng
 
 export function useStrength(password: string, userInputs: string[] = []): StrengthResult {
   const key = userInputs.join("\u0000");
-  return useMemo(() => estimateStrength(password, userInputs), [password, key]);
+  return useMemo(() => estimateStrength(password, key.split("\u0000")), [password, key]);
 }
 
 /** Five-segment strength bar with label, crack-time estimate and the top hint. */
diff --git a/apps/desktop/src/components/workspaces/scope-dnd.tsx b/apps/desktop/src/components/workspaces/scope-dnd.tsx
index ddfea972..d3d17412 100644
--- a/apps/desktop/src/components/workspaces/scope-dnd.tsx
+++ b/apps/desktop/src/components/workspaces/scope-dnd.tsx
@@ -419,7 +419,7 @@ function Dock({
   onInside: (inside: boolean) => void;
 }) {
   const { t } = useTranslation(["workspaces", "common"]);
-  const panel = useDroppable({ id: "dock", data: { target: null }, disabled: !dragged });
+  const { setNodeRef: panelRef } = useDroppable({ id: "dock", data: { target: null }, disabled: !dragged });
   const project = dragged?.kind === "project" ? dragged.project : null;
   const from = project ? project.workspaceId : dragged?.kind === "workspace" ? dragged.workspace.id : null;
   const others = workspaces.filter((w) => w.id !== from);
@@ -438,7 +438,7 @@ function Dock({
           className={cn("pointer-events-none fixed bottom-5 z-40 flex justify-center px-4", !at && "inset-x-0")}
         >
           <div
-            ref={panel.setNodeRef}
+            ref={panelRef}
             onPointerEnter={() => onInside(true)}
             onPointerLeave={() => onInside(false)}
             role="group"
@@ -464,13 +464,13 @@ function Dock({
 
 function NewWorkspaceTarget() {
   const { t } = useTranslation(["workspaces", "common"]);
-  const drop = useScopeDrop({ kind: "new" }, "dock:new");
+  const { ref: dropRef, state: dropState } = useScopeDrop({ kind: "new" }, "dock:new");
   return (
     <div
-      ref={drop.ref}
+      ref={dropRef}
       className={cn(
         "flex shrink-0 items-center gap-2 rounded-xl border border-dashed border-brand/40 bg-brand/5 py-1.5 pr-3 pl-1.5 text-sm font-medium text-brand-strong transition-[background-color,border-color,transform] duration-150",
-        drop.state === "valid" && "scale-[1.04] border-solid border-brand/60 bg-brand/15",
+        dropState === "valid" && "scale-[1.04] border-solid border-brand/60 bg-brand/15",
       )}
     >
       <span aria-hidden className="grid size-6 place-items-center rounded-lg bg-brand/15">
@@ -483,14 +483,14 @@ function NewWorkspaceTarget() {
 
 function DockTarget({ workspace, here }: { workspace: Workspace; here: boolean }) {
   const { t } = useTranslation(["workspaces", "common"]);
-  const drop = useScopeDrop({ kind: "workspace", workspace }, `dock:${workspace.id}`);
+  const { ref: dropRef, state: dropState } = useScopeDrop({ kind: "workspace", workspace }, `dock:${workspace.id}`);
   return (
     <div
-      ref={drop.ref}
+      ref={dropRef}
       className={cn(
         "flex shrink-0 items-center gap-1.5 rounded-xl border border-transparent px-2 py-1.5 text-sm transition-[background-color,border-color,transform] duration-150",
         here ? "text-muted-foreground opacity-50" : "text-foreground",
-        drop.state === "valid" && "scale-[1.04] border-brand/50 bg-brand/10",
+        dropState === "valid" && "scale-[1.04] border-brand/50 bg-brand/10",
       )}
     >
       <WorkspaceTile icon={workspace.icon} color={workspace.color} size="sm" className="size-5 rounded-[5px] text-[11px]" />
diff --git a/apps/desktop/src/components/workspaces/workspace-dialog.tsx b/apps/desktop/src/components/workspaces/workspace-dialog.tsx
index 6ac3988e..4dedfae6 100644
--- a/apps/desktop/src/components/workspaces/workspace-dialog.tsx
+++ b/apps/desktop/src/components/workspaces/workspace-dialog.tsx
@@ -80,11 +80,17 @@ export function WorkspaceDialog({
   const [look, setLook] = useState(randomLook);
   const newLook = useRef(false);
   // Fresh on every open; live updates (clone progress) must not reset the form.
-  const base = useMemo(() => formFrom(workspace, look), [open, workspace?.id, look]);
+  const [baseSource, setBaseSource] = useState(() => ({ open, id: workspace?.id, look, workspace }));
+  let source = baseSource;
+  if (source.open !== open || source.id !== workspace?.id || source.look !== look) {
+    source = { open, id: workspace?.id, look, workspace };
+    setBaseSource(source);
+  }
+  const base = useMemo(() => formFrom(source.workspace, source.look), [source]);
   const [live, setForm, kept] = useDraft(open ? draftKey : undefined, base);
-  const closing = useRef(live);
-  if (open) closing.current = live;
-  const form = open ? live : closing.current;
+  const [closing, setClosing] = useState(live);
+  if (open && closing !== live) setClosing(live);
+  const form = open ? live : closing;
   const { name, icon, color, description, instructions, vmId, browserProfileId, sources, autoMerge, claudeAccounts } = form;
   const set =
     <K extends keyof WorkspaceForm>(key: K) =>
diff --git a/apps/desktop/src/i18n/language.tsx b/apps/desktop/src/i18n/language.tsx
index 8a17e025..0b4fd014 100644
--- a/apps/desktop/src/i18n/language.tsx
+++ b/apps/desktop/src/i18n/language.tsx
@@ -38,6 +38,8 @@ const LanguageContext = createContext<LanguageState>({
   setTimeFormat: () => {},
 });
 
+const invokeTauri = <T,>(cmd: string, args?: Record<string, unknown>) => import("@tauri-apps/api/core").then(({ invoke }) => invoke<T>(cmd, args));
+
 const remember = (l: AppLanguage) => {
   try {
     localStorage.setItem(LANGUAGE_KEY, l);
@@ -65,8 +67,7 @@ export function LanguageProvider({ children }: { children: ReactNode }) {
   useEffect(() => {
     if (!isTauri) return;
     let cancelled = false;
-    void import("@tauri-apps/api/core")
-      .then(({ invoke }) => invoke<SystemClock>("system_clock"))
+    void invokeTauri<SystemClock>("system_clock")
       .then((c) => !cancelled && setClock(c))
       .catch(() => {});
     return () => {
@@ -86,8 +87,7 @@ export function LanguageProvider({ children }: { children: ReactNode }) {
     if (i18n.language !== resolved) void i18n.changeLanguage(resolved);
     if (!isTauri) return;
     const tr = i18n.getFixedT(resolved, "common");
-    void import("@tauri-apps/api/core")
-      .then(({ invoke }) => invoke("set_tray_labels", { open: tr("tray.open"), newChat: tr("tray.newChat"), quit: tr("tray.quit"), checkUpdates: tr("tray.checkUpdates") }))
+    void invokeTauri("set_tray_labels", { open: tr("tray.open"), newChat: tr("tray.newChat"), quit: tr("tray.quit"), checkUpdates: tr("tray.checkUpdates") })
       .catch(() => {});
   }, [resolved]);
 
diff --git a/apps/desktop/src/lib/drafts.ts b/apps/desktop/src/lib/drafts.ts
index 40554acc..43eda6c3 100644
--- a/apps/desktop/src/lib/drafts.ts
+++ b/apps/desktop/src/lib/drafts.ts
@@ -1,4 +1,4 @@
-import { useCallback, useEffect, useRef, useState, type Dispatch, type SetStateAction } from "react";
+import { useCallback, useEffect, useLayoutEffect, useRef, useState, type Dispatch, type SetStateAction } from "react";
 import { storageKey } from "./core";
 
 /**
@@ -103,7 +103,9 @@ export function useDraft<T>(key: string | undefined, initial: T, { persist = tru
   if (current !== state) setState(current);
   const value = current.value;
   const initialRef = useRef(initial);
-  initialRef.current = initial;
+  useLayoutEffect(() => {
+    initialRef.current = initial;
+  });
 
   useEffect(() => {
     if (!key) return;
diff --git a/apps/desktop/src/pages/agents/agents-page.tsx b/apps/desktop/src/pages/agents/agents-page.tsx
index a5765fe0..55f41b41 100644
--- a/apps/desktop/src/pages/agents/agents-page.tsx
+++ b/apps/desktop/src/pages/agents/agents-page.tsx
@@ -96,27 +96,24 @@ export default function AgentsPage() {
   const passesFilter = (a: Agent) =>
     filter === "running" ? isRunning(a) : filter === "needs" ? needsYou(a) : filter === "scheduled" ? (routineCounts.get(a.id) ?? 0) > 0 : filter === "disabled" ? !a.enabled : true;
 
-  const visible = useMemo(() => {
-    const q = search.trim().toLowerCase();
-    return agents
-      .filter((a) => {
-        if (!passesFilter(a)) return false;
-        if (!q) return true;
-        return `${a.name} ${a.role} ${a.description} ${a.instructions}`.toLowerCase().includes(q);
-      })
-      .sort(
-        (a, b) =>
-          Number(b.isDefault) - Number(a.isDefault) ||
-          Number(isRunning(b)) - Number(isRunning(a)) ||
-          Number(b.enabled) - Number(a.enabled) ||
-          (b.lastRunAt ?? "").localeCompare(a.lastRunAt ?? "") ||
-          a.name.localeCompare(b.name),
-      );
-  }, [agents, search, filter, routineCounts, running, missingFor]);
+  const query = search.trim().toLowerCase();
+  const visible = agents
+    .filter((a) => {
+      if (!passesFilter(a)) return false;
+      if (!query) return true;
+      return `${a.name} ${a.role} ${a.description} ${a.instructions}`.toLowerCase().includes(query);
+    })
+    .sort(
+      (a, b) =>
+        Number(b.isDefault) - Number(a.isDefault) ||
+        Number(isRunning(b)) - Number(isRunning(a)) ||
+        Number(b.enabled) - Number(a.enabled) ||
+        (b.lastRunAt ?? "").localeCompare(a.lastRunAt ?? "") ||
+        a.name.localeCompare(b.name),
+    );
 
   // The chart keeps everyone of the filter in place and dims what the search doesn't match.
-  // eslint-disable-next-line react-hooks/exhaustive-deps
-  const chartAgents = useMemo(() => agents.filter(passesFilter), [agents, filter, routineCounts, running, missingFor]);
+  const chartAgents = agents.filter(passesFilter);
   const matches = useMemo(() => (search.trim() ? new Set(visible.map((a) => a.id)) : null), [visible, search]);
 
   const stats = (list: Agent[]) => ({ working: list.filter(isRunning).length, needsYou: list.filter(needsYou).length });
diff --git a/apps/desktop/src/pages/auth/login.tsx b/apps/desktop/src/pages/auth/login.tsx
index 8950743b..e59c2f88 100644
--- a/apps/desktop/src/pages/auth/login.tsx
+++ b/apps/desktop/src/pages/auth/login.tsx
@@ -94,9 +94,8 @@ function PasswordForm() {
     } catch (err) {
       setError(loginError(err, "password"));
       void controls.start(shake);
-    } finally {
-      setBusy(false);
     }
+    setBusy(false);
   };
 
   return (
@@ -146,9 +145,8 @@ function TokenForm() {
     } catch (err) {
       setError(loginError(err, "token"));
       void controls.start(shake);
-    } finally {
-      setBusy(false);
     }
+    setBusy(false);
   };
 
   return (
diff --git a/apps/desktop/src/pages/auth/unlock.tsx b/apps/desktop/src/pages/auth/unlock.tsx
index 24554337..fa181806 100644
--- a/apps/desktop/src/pages/auth/unlock.tsx
+++ b/apps/desktop/src/pages/auth/unlock.tsx
@@ -43,9 +43,8 @@ export function UnlockPage() {
     } catch (err) {
       setError(unlockError(err));
       void controls.start(shake);
-    } finally {
-      setBusy(false);
     }
+    setBusy(false);
   };
 
   const dataDir = boot?.dataDir;
@@ -159,9 +158,8 @@ function RestoreBackupDialog({ open, onOpenChange }: { open: boolean; onOpenChan
       await qc.invalidateQueries();
     } catch (err) {
       setError(err instanceof ApiRequestError && (err.status === 400 || err.status === 401) ? t("restore.wrongPassphrase") : errorMessage(err));
-    } finally {
-      setBusy(false);
     }
+    setBusy(false);
   };
 
   return (
diff --git a/apps/desktop/src/pages/chat/archived-page.tsx b/apps/desktop/src/pages/chat/archived-page.tsx
index 5873896f..a5f7a4fc 100644
--- a/apps/desktop/src/pages/chat/archived-page.tsx
+++ b/apps/desktop/src/pages/chat/archived-page.tsx
@@ -6,6 +6,7 @@ import { Archive, ArchiveRestore, RefreshCw, Search, Trash2 } from "lucide-react
 import type { ReactNode } from "react";
 import type { Agent, Conversation } from "@godmode/shared";
 import { useTranslation } from "react-i18next";
+import type { TFunction } from "i18next";
 import { AgentAvatar, EmptyState, PageBody, PageHeader } from "@/components/common";
 import { useArchiveChat, useDeleteChat } from "@/components/chat/chat-actions";
 import { chatStatus } from "@/components/chat/chat-status";
@@ -19,12 +20,12 @@ import { errorMessage } from "@/lib/api";
 import { useAllAgents, useArchivedConversations } from "@/lib/hooks";
 import { useLiveRunsMap } from "@/stores/live";
 import { useUi } from "@/stores/ui";
-import { dateLocale, t } from "@/i18n";
+import { dateLocale } from "@/i18n";
 import { useLocale } from "@/i18n/language";
 
 const LIMIT = 200;
 
-function bucket(d: Date, now: Date): string {
+function bucket(d: Date, now: Date, t: TFunction<["chat", "common"]>): string {
   if (isToday(d)) return t("common:words.today");
   if (isYesterday(d)) return t("common:words.yesterday");
   const days = differenceInCalendarDays(now, d);
@@ -63,7 +64,7 @@ export default function ArchivedPage() {
     const out: { label: string; items: Conversation[] }[] = [];
     for (const c of list) {
       if (shown.has(c.id)) continue;
-      const label = bucket(new Date(c.lastMessageAt ?? c.createdAt), now);
+      const label = bucket(new Date(c.lastMessageAt ?? c.createdAt), now, t);
       const last = out[out.length - 1];
       if (last?.label === label) last.items.push(c);
       else out.push({ label, items: [c] });
diff --git a/apps/desktop/src/pages/chat/chat-conversation.tsx b/apps/desktop/src/pages/chat/chat-conversation.tsx
index b92765ae..f17ee779 100644
--- a/apps/desktop/src/pages/chat/chat-conversation.tsx
+++ b/apps/desktop/src/pages/chat/chat-conversation.tsx
@@ -1,4 +1,4 @@
-import { Suspense, lazy, useEffect, useMemo, useRef, useState } from "react";
+import { Suspense, lazy, useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
 import { Link, useNavigate, useParams, useSearchParams } from "react-router";
 import { useMutation, useQueryClient } from "@tanstack/react-query";
 import { AnimatePresence, motion } from "motion/react";
@@ -95,7 +95,7 @@ function ConversationView({ conversationId }: { conversationId: string }) {
   useViewing(conversationId);
   usePrivateChatLifetime(conversationId, !!conv?.private);
   const queueRef = useRef<QueueTrayHandle>(null);
-  const mountedAt = useRef(Date.now());
+  const [mountedAt] = useState(() => Date.now());
   // A profile picked mid-run applies from the next message: keep showing the browser the running agent drives.
   const [runProfile, setRunProfile] = useState<{ runId: string; profileId: string | null } | null>(null);
   if ((live?.runId ?? null) !== (runProfile?.runId ?? null)) setRunProfile(live ? { runId: live.runId, profileId: conv?.browserProfileId ?? null } : null);
@@ -197,12 +197,17 @@ function ConversationView({ conversationId }: { conversationId: string }) {
   const { pause } = usePauseActions(conversationId);
   const pausing = pause.isPending || live?.activity === "Pausing…" || live?.activity === "Asking you…";
   const answeringRef = useRef(false);
-  answeringRef.current = !!waiting;
   const busyRef = useRef(false);
-  busyRef.current = !!activeRunId;
   // While the agent works, is paused or older messages still wait, a new message joins the queue.
   const queueingRef = useRef(false);
-  queueingRef.current = !!activeRunId || !!paused || queue.length > 0;
+  const isAnswering = !!waiting;
+  const isBusy = !!activeRunId;
+  const isQueueing = !!activeRunId || !!paused || queue.length > 0;
+  useLayoutEffect(() => {
+    answeringRef.current = isAnswering;
+    busyRef.current = isBusy;
+    queueingRef.current = isQueueing;
+  }, [isAnswering, isBusy, isQueueing]);
 
   // Keep the last live turn on screen until the stored message replaces it (no flicker on finish).
   const [linger, setLinger] = useState<LiveRun | null>(null);
@@ -239,7 +244,7 @@ function ConversationView({ conversationId }: { conversationId: string }) {
     : shownLinger
       ? { live: shownLinger, startedAt: shownLinger.startedAt, runId: null }
       : conv?.activeRunId
-        ? { live: null, startedAt: mountedAt.current, runId: conv.activeRunId }
+        ? { live: null, startedAt: mountedAt, runId: conv.activeRunId }
         : null;
 
   const send = useMutation({
@@ -478,7 +483,9 @@ function ConversationView({ conversationId }: { conversationId: string }) {
 
   // Read replies aloud: a dictated message with auto-speak on. Voice mode speaks by itself.
   const settingsRef = useRef(voiceSettings);
-  settingsRef.current = voiceSettings;
+  useLayoutEffect(() => {
+    settingsRef.current = voiceSettings;
+  }, [voiceSettings]);
   useEffect(
     () =>
       onServerEvent((e) => {
diff --git a/apps/desktop/src/pages/settings/settings-page.tsx b/apps/desktop/src/pages/settings/settings-page.tsx
index 6ac5ad8f..cb9e3ffd 100644
--- a/apps/desktop/src/pages/settings/settings-page.tsx
+++ b/apps/desktop/src/pages/settings/settings-page.tsx
@@ -2,8 +2,7 @@ import { useEffect, useMemo, useRef, useState, type KeyboardEvent, type ReactNod
 import { Navigate, NavLink, useLocation, useNavigate, type To } from "react-router";
 import searchIndex from "virtual:settings-search";
 import { useTranslation } from "react-i18next";
-import type { ParseKeys } from "i18next";
-import i18n from "@/i18n";
+import type { ParseKeys, TFunction } from "i18next";
 import { AnimatePresence, motion } from "motion/react";
 import {
   Activity,
@@ -330,11 +329,11 @@ function useLabels(): Record<SectionId, string> {
   return Object.fromEntries(SECTIONS.map((s) => [s.id, t(easy ? (EASY[s.id]?.labelKey ?? EASY_ADVANCED_LABEL[s.id] ?? s.labelKey) : s.labelKey)])) as Record<SectionId, string>;
 }
 
-const searchText = (s: string) => (s.startsWith("@") ? i18n.t(s.slice(1) as never, { ns: "settings" }) : s);
+const searchText = (s: string, t: TFunction<"settings">) => (s.startsWith("@") ? t(s.slice(1) as never, { ns: "settings" }) : s);
 
 function useSearch(query: string): Hit[] {
   const labels = useLabels();
-  const { t, i18n: { language } } = useTranslation("settings");
+  const { t } = useTranslation("settings");
   return useMemo(() => {
     const words = fold(query).split(/\s+/).filter(Boolean);
     if (!words.length) return [];
@@ -344,11 +343,11 @@ function useSearch(query: string): Hit[] {
     };
     return SECTIONS.flatMap((s) => {
       const entry = searchIndex[s.id] ?? { labels: [], text: [] };
-      const settings = entry.labels.map(searchText).filter((l) => l !== labels[s.id] && matches(l));
-      const hit = matches(labels[s.id]) || matches(t(s.labelKey)) || settings.length > 0 || matches(entry.text.map(searchText).join(" "));
+      const settings = entry.labels.map((l) => searchText(l, t)).filter((l) => l !== labels[s.id] && matches(l));
+      const hit = matches(labels[s.id]) || matches(t(s.labelKey)) || settings.length > 0 || matches(entry.text.map((l) => searchText(l, t)).join(" "));
       return hit ? [{ id: s.id, label: labels[s.id], icon: s.icon, settings: settings.slice(0, 5) }] : [];
     }).sort((a, b) => Number(matches(b.label)) - Number(matches(a.label)) || b.settings.length - a.settings.length);
-  }, [query, labels, language, t]);
+  }, [query, labels, t]);
 }
 
 function SettingsSearch({ query, onQuery, onPick }: { query: string; onQuery: (q: string) => void; onPick: (id: SectionId, label: string | null) => void }) {
diff --git a/apps/desktop/src/pages/tasks/tasks-page.tsx b/apps/desktop/src/pages/tasks/tasks-page.tsx
index f67b0596..9d4c0f72 100644
--- a/apps/desktop/src/pages/tasks/tasks-page.tsx
+++ b/apps/desktop/src/pages/tasks/tasks-page.tsx
@@ -1,4 +1,4 @@
-import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { useCallback, useEffect, useEffectEvent, useMemo, useRef, useState } from "react";
 import { useSearchParams } from "react-router";
 import { useMutation, useQueryClient } from "@tanstack/react-query";
 import { Archive, FolderGit2, ListFilter, Plus, Search, SquareKanban } from "lucide-react";
@@ -134,11 +134,13 @@ export default function TasksPage() {
   const view = params.get("view") === ARCHIVED ? ARCHIVED : "board";
   // Another workspace in the sidebar: a goal picked in the last one would leave an empty board.
   const shownScope = useRef(scope);
+  const dropGoalFilter = useEffectEvent(() => {
+    if (goalFilter) setFilter("goal", null);
+  });
   useEffect(() => {
     if (scope === shownScope.current) return;
     shownScope.current = scope;
-    if (goalFilter) setFilter("goal", null);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
+    dropGoalFilter();
   }, [scope]);
   const setView = (next: string) => {
     const p = new URLSearchParams(params);
@@ -177,6 +179,7 @@ export default function TasksPage() {
     else next.delete("task");
     setParams(next, { replace: !task });
   };
+  const closeTask = useEffectEvent(() => openTask(null));
   useEffect(() => {
     if (!selectedId || !tasksQ.data || !(archivedQ.data || archivedQ.isError) || selected) return;
     // A link from a notification: the task may live in another scope.
@@ -185,8 +188,7 @@ export default function TasksPage() {
       .then((t) => {
         useUi.getState().setWorkspace(t.workspaceId ?? "global");
       })
-      .catch(() => openTask(null));
-    // eslint-disable-next-line react-hooks/exhaustive-deps
+      .catch(() => closeTask());
   }, [selectedId, tasksQ.data, archivedQ.data, archivedQ.isError, selected]);
 
   useEffect(() => {
diff --git a/apps/desktop/src/pages/vault/cards-page.tsx b/apps/desktop/src/pages/vault/cards-page.tsx
index 05bf6a44..ba18a179 100644
--- a/apps/desktop/src/pages/vault/cards-page.tsx
+++ b/apps/desktop/src/pages/vault/cards-page.tsx
@@ -75,7 +75,8 @@ export default function CardsPage() {
     },
     onError: (e) => !isGrantCancelled(e) && toastApiError(e, t("cardsPage.changeFailed"), qc),
   });
-  const toggleFreeze = useCallback((card: PaymentCard) => freeze.mutate(card), [freeze.mutate]);
+  const freezeCard = freeze.mutate;
+  const toggleFreeze = useCallback((card: PaymentCard) => freezeCard(card), [freezeCard]);
 
   const [toDelete, setToDelete] = useState<PaymentCard | null>(null);
   const del = useMutation({
diff --git a/apps/desktop/src/pages/workspaces/workspaces-page.tsx b/apps/desktop/src/pages/workspaces/workspaces-page.tsx
index 7192f86a..6504dcc8 100644
--- a/apps/desktop/src/pages/workspaces/workspaces-page.tsx
+++ b/apps/desktop/src/pages/workspaces/workspaces-page.tsx
@@ -199,9 +199,9 @@ export default function WorkspacesPage() {
     else toast.error(t("page.gone"));
   }, [newProjectIn, workspaces, params, setParams]);
   // Kept while the dialog closes, so it can animate out.
-  const lastProjectWorkspace = useRef<Workspace | undefined>(undefined);
-  const projectWorkspace = (projectDialog ? workspaces?.find((w) => w.id === projectDialog.workspaceId) : undefined) ?? (projectDialog ? undefined : lastProjectWorkspace.current);
-  if (projectDialog && projectWorkspace) lastProjectWorkspace.current = projectWorkspace;
+  const [lastProjectWorkspace, setLastProjectWorkspace] = useState<Workspace | undefined>(undefined);
+  const projectWorkspace = (projectDialog ? workspaces?.find((w) => w.id === projectDialog.workspaceId) : undefined) ?? (projectDialog ? undefined : lastProjectWorkspace);
+  if (projectDialog && projectWorkspace && projectWorkspace !== lastProjectWorkspace) setLastProjectWorkspace(projectWorkspace);
   const projectTarget = projectDialog?.projectId ? projectWorkspace?.projects.find((p) => p.id === projectDialog.projectId) : undefined;
   const addProject = (ws: Workspace) => setProjectDialog({ workspaceId: ws.id, projectId: null });
   const editProject = (ws: Workspace, project: Project) => setProjectDialog({ workspaceId: ws.id, projectId: project.id });
@@ -677,10 +677,10 @@ function ScopeCard({
     { key: "totp", label: t("page.stats.totp"), icon: <ShieldCheck /> },
     { key: "integrations", label: t("page.stats.integrations"), icon: <Plug /> },
   ];
-  const dnd = useWorkspaceDnd(workspace);
+  const { ref: dndRef, ...dnd } = useWorkspaceDnd(workspace);
   return (
     <motion.article
-      ref={dnd.ref}
+      ref={dndRef}
       {...dnd.props}
       layout
       initial={reduce ? false : { opacity: 0, y: 8 }}
@@ -859,10 +859,10 @@ function ScopeListRow({
     { label: t("page.stats.logins"), n: counts.logins, icon: <KeyRound /> },
     { label: t("page.stats.integrations"), n: counts.integrations, icon: <Plug /> },
   ];
-  const dnd = useWorkspaceDnd(workspace);
+  const { ref: dndRef, ...dnd } = useWorkspaceDnd(workspace);
   return (
     <div
-      ref={dnd.ref}
+      ref={dndRef}
       {...dnd.props}
       className={cn(
         "group relative flex items-center gap-3 border-b px-4 py-2.5 transition last:border-b-0",
@@ -960,10 +960,10 @@ function ProjectStrip({
 /** One project in a card's strip; drag it to another workspace or out into its own. */
 function ProjectChip({ project: p, current, onOpen, onEdit }: { project: Project; current: boolean; onOpen: () => void; onEdit: () => void }) {
   const { t } = useTranslation("workspaces");
-  const dnd = useProjectDnd(p);
+  const { ref: dndRef, ...dnd } = useProjectDnd(p);
   const reveal = "size-6 text-muted-foreground opacity-0 transition group-hover/project:opacity-100 focus-visible:opacity-100 data-[state=open]:opacity-100 [&_svg]:size-3.5";
   return (
-    <li ref={dnd.ref} {...dnd.props} className={cn("group/project relative flex items-center rounded-md transition hover:bg-card", dnd.isDragging && "opacity-35")}>
+    <li ref={dndRef} {...dnd.props} className={cn("group/project relative flex items-center rounded-md transition hover:bg-card", dnd.isDragging && "opacity-35")}>
       <button
         type="button"
         onClick={onOpen}
@@ -1010,10 +1010,10 @@ function ProjectListRow({
 }) {
   const { t } = useTranslation("workspaces");
   const { dateLocale } = useLocale();
-  const dnd = useProjectDnd(project, workspace);
+  const { ref: dndRef, ...dnd } = useProjectDnd(project, workspace);
   return (
     <div
-      ref={dnd.ref}
+      ref={dndRef}
       {...dnd.props}
       className={cn(
         "group relative flex items-center gap-3 border-b py-2 pr-4 pl-8 transition last:border-b-0",
diff --git a/apps/desktop/src/stores/live.ts b/apps/desktop/src/stores/live.ts
index f8b2647b..65a1746b 100644
--- a/apps/desktop/src/stores/live.ts
+++ b/apps/desktop/src/stores/live.ts
@@ -215,10 +215,11 @@ function runShape(r: LiveRun): string {
  */
 export function useLiveRunsMap(): Record<string, LiveRun> {
   const shape = useLive((s) => Object.values(s.runs).map(runShape).join("\n"));
-  return useMemo(() => {
-    void shape;
-    return useLive.getState().runs;
-  }, [shape]);
+  return useMemo(() => runsAt(shape), [shape]);
+}
+
+function runsAt(_shape: string): Record<string, LiveRun> {
+  return useLive.getState().runs;
 }
 
 export function useConversationLiveRun(conversationId: string | undefined): LiveRun | null {
@@ -229,7 +230,7 @@ export function useConversationLiveRun(conversationId: string | undefined): Live
     for (const r of Object.values(s.runs)) {
       if (r.conversationId !== conversationId) continue;
       if (r.status !== "queued") return r;
-      waiting ??= r;
+      if (waiting === null) waiting = r;
     }
     return waiting;
   });