Commit aced302b638608042c8a1d30b6fc91dc5661657a | the-knife

author	Julius Marminge <julius0216@outlook.com> 2026-03-01 16:09:46-08:00
committer	Julius Marminge <jmarminge@gmail.com> 2026-03-01 22:36:35-08:00
log	aced302b638608042c8a1d30b6fc91dc5661657a
tree	f9ea9b5323db371b7072c652341aff2a7a99a9a0
parent	0b8dfee17beb957a8855f5c1382a110fc57de88a

Address PR review feedback for draft model/error/persistence handling

Co-authored-by: codex <codex@users.noreply.github.com>

2 files changed, 112 insertions(+), 26 deletions(-)

apps
- web
  - src
    components
    ChatView.tsx
    composerDraftStore.ts

apps/web/src/components/ChatView.tsx+101-23

 @@ -17,6 +17,7 @@ import {
   type ProviderApprovalDecision,
   type ThreadId,
   type TurnId,
+  normalizeModelSlug,
   resolveModelSlug,
 } from "@t3tools/contracts";
 import { memo, useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
 @@ -197,6 +198,7 @@ function buildLocalDraftThread(
   threadId: ThreadId,
   draftThread: DraftThreadState,
   fallbackModel: string,
+  error: string | null,
 ): Thread {
   return {
     id: threadId,
 @@ -218,7 +220,7 @@ function buildLocalDraftThread(
     activeTerminalGroupId: `group-${DEFAULT_THREAD_TERMINAL_ID}`,
     session: null,
     messages: [],
-    error: null,
+    error,
     createdAt: draftThread.createdAt,
     latestTurn: null,
     lastVisitedAt: draftThread.createdAt,
 @@ -229,6 +231,25 @@ function buildLocalDraftThread(
   };
 }
+function revokeBlobPreviewUrl(previewUrl: string | undefined): void {
+  if (!previewUrl || typeof URL === "undefined" || !previewUrl.startsWith("blob:")) {
+    return;
+  }
+  URL.revokeObjectURL(previewUrl);
+}
+function revokeUserMessagePreviewUrls(message: ChatMessage): void {
+  if (message.role !== "user" || !message.attachments) {
+    return;
+  }
+  for (const attachment of message.attachments) {
+    if (attachment.type !== "image") {
+      continue;
+    }
+    revokeBlobPreviewUrl(attachment.previewUrl);
+  }
+}
 type ComposerCommandItem =
   | {
       id: string;
 @@ -449,6 +470,9 @@ export default function ChatView({ threadId }: ChatViewProps) {
   const [isDragOverComposer, setIsDragOverComposer] = useState(false);
   const [expandedImage, setExpandedImage] = useState<ExpandedImagePreview | null>(null);
   const [optimisticUserMessages, setOptimisticUserMessages] = useState<ChatMessage[]>([]);
+  const [localDraftErrorsByThreadId, setLocalDraftErrorsByThreadId] = useState<
+    Record<ThreadId, string | null>
+  >({});
   const [sendPhase, setSendPhase] = useState<SendPhase>("idle");
   const [isConnecting, _setIsConnecting] = useState(false);
   const [isRevertingCheckpoint, setIsRevertingCheckpoint] = useState(false);
 @@ -504,12 +528,18 @@ export default function ChatView({ threadId }: ChatViewProps) {
   const serverThread = state.threads.find((t) => t.id === threadId);
   const fallbackDraftProject = state.projects.find((project) => project.id === draftThread?.projectId);
+  const localDraftError = localDraftErrorsByThreadId[threadId] ?? null;
   const localDraftThread = useMemo(
     () =>
       draftThread
-        ? buildLocalDraftThread(threadId, draftThread, fallbackDraftProject?.model ?? DEFAULT_MODEL)
+        ? buildLocalDraftThread(
+            threadId,
+            draftThread,
+            fallbackDraftProject?.model ?? DEFAULT_MODEL,
+            localDraftError,
+          )
         : undefined,
-    [draftThread, fallbackDraftProject?.model, threadId],
+    [draftThread, fallbackDraftProject?.model, localDraftError, threadId],
   );
   const activeThread = serverThread ?? localDraftThread;
   const isServerThread = serverThread !== undefined;
 @@ -524,6 +554,19 @@ export default function ChatView({ threadId }: ChatViewProps) {
   const latestTurnSettled = isLatestTurnSettled(activeLatestTurn, activeThread?.session ?? null);
   const activeProject = state.projects.find((p) => p.id === activeThread?.projectId);
+  useEffect(() => {
+    if (!serverThread) {
+      return;
+    }
+    setLocalDraftErrorsByThreadId((existing) => {
+      if (!(threadId in existing)) {
+        return existing;
+      }
+      const { [threadId]: _removed, ...rest } = existing;
+      return rest as Record<ThreadId, string | null>;
+    });
+  }, [serverThread, threadId]);
   useEffect(() => {
     if (!activeThread?.id) return;
     if (!latestTurnSettled) return;
 @@ -545,9 +588,8 @@ export default function ChatView({ threadId }: ChatViewProps) {
     dispatch,
   ]);
-  const selectedModel = resolveModelSlug(
+  const baseThreadModel = resolveModelSlug(activeThread?.model ?? activeProject?.model ?? DEFAULT_MODEL);
-    composerDraft.model ?? activeThread?.model ?? activeProject?.model ?? DEFAULT_MODEL,
+  const selectedModel = resolveModelSlug(composerDraft.model ?? baseThreadModel);
-  );
   const selectedEffort = composerDraft.effort ?? DEFAULT_REASONING;
   const modelOptions = useMemo(
     () => getAppModelOptions(settings.customCodexModels, selectedModel),
 @@ -1184,7 +1226,12 @@ export default function ChatView({ threadId }: ChatViewProps) {
   useEffect(() => {
     if (!activeThread?.id) {
-      setOptimisticUserMessages([]);
+      setOptimisticUserMessages((existing) => {
+        for (const message of existing) {
+          revokeUserMessagePreviewUrls(message);
+        }
+        return [];
+      });
       return;
     }
     if (activeThread.messages.length === 0) {
 @@ -1192,6 +1239,10 @@ export default function ChatView({ threadId }: ChatViewProps) {
     }
     const serverIds = new Set(activeThread.messages.map((message) => message.id));
     setOptimisticUserMessages((existing) => {
+      const removed = existing.filter((message) => serverIds.has(message.id));
+      for (const message of removed) {
+        revokeUserMessagePreviewUrls(message);
+      }
       const next = existing.filter((message) => !serverIds.has(message.id));
       return next.length === existing.length ? existing : next;
     });
 @@ -1202,7 +1253,12 @@ export default function ChatView({ threadId }: ChatViewProps) {
   }, [prompt]);
   useEffect(() => {
-    setOptimisticUserMessages([]);
+    setOptimisticUserMessages((existing) => {
+      for (const message of existing) {
+        revokeUserMessagePreviewUrls(message);
+      }
+      return [];
+    });
     setSendPhase("idle");
     setComposerHighlightedItemId(null);
     dragDepthRef.current = 0;
 @@ -1224,7 +1280,6 @@ export default function ChatView({ threadId }: ChatViewProps) {
           currentPersistedAttachments.map((attachment) => [attachment.id, attachment]),
         );
         const stagedAttachmentById = new Map<string, PersistedComposerImageAttachment>();
-        const serializationFailedImageIds: string[] = [];
         await Promise.all(
           composerImages.map(async (image) => {
             try {
 @@ -1240,8 +1295,6 @@ export default function ChatView({ threadId }: ChatViewProps) {
               const existingPersisted = existingPersistedById.get(image.id);
               if (existingPersisted) {
                 stagedAttachmentById.set(image.id, existingPersisted);
-              } else {
-                serializationFailedImageIds.push(image.id);
               }
             }
           }),
 @@ -1468,13 +1521,25 @@ export default function ChatView({ threadId }: ChatViewProps) {
   const setThreadError = useCallback(
     (threadId: ThreadId | null, error: string | null) => {
       if (!threadId) return;
-      dispatch({
+      if (state.threads.some((thread) => thread.id === threadId)) {
-        type: "SET_ERROR",
+        dispatch({
-        threadId,
+          type: "SET_ERROR",
-        error,
+          threadId,
+          error,
+        });
+        return;
+      }
+      setLocalDraftErrorsByThreadId((existing) => {
+        if ((existing[threadId] ?? null) === error) {
+          return existing;
+        }
+        return {
+          ...existing,
+          [threadId]: error,
+        };
       });
     },
-    [dispatch],
+    [dispatch, state.threads],
   );
   const addComposerImages = (files: File[]) => {
 @@ -1805,9 +1870,14 @@ export default function ChatView({ threadId }: ChatViewProps) {
         promptRef.current.length === 0 &&
         composerImagesRef.current.length === 0
       ) {
-        setOptimisticUserMessages((existing) =>
+        setOptimisticUserMessages((existing) => {
-          existing.filter((message) => message.id !== messageIdForSend),
+          const removed = existing.filter((message) => message.id === messageIdForSend);
-        );
+          for (const message of removed) {
+            revokeUserMessagePreviewUrls(message);
+          }
+          const next = existing.filter((message) => message.id !== messageIdForSend);
+          return next.length === existing.length ? existing : next;
+        });
         promptRef.current = trimmed;
         setPrompt(trimmed);
         addComposerImagesToDraft(composerImagesSnapshot.map(cloneComposerImageForRetry));
 @@ -1866,20 +1936,28 @@ export default function ChatView({ threadId }: ChatViewProps) {
   const onModelSelect = useCallback(
     (model: string) => {
-      const normalizedModel = resolveModelSlug(model);
+      const normalizedModel = normalizeModelSlug(model);
-      setComposerDraftModel(threadId, normalizedModel);
+      const resolvedModel = normalizedModel ?? baseThreadModel;
+      setComposerDraftModel(threadId, resolvedModel === baseThreadModel ? null : resolvedModel);
       const api = readNativeApi();
       if (api && isServerThread && activeThread) {
         void api.orchestration.dispatchCommand({
           type: "thread.meta.update",
           commandId: newCommandId(),
           threadId: activeThread.id,
-          model: normalizedModel,
+          model: resolvedModel,
         });
       }
       scheduleComposerFocus();
     },
-    [activeThread, isServerThread, scheduleComposerFocus, setComposerDraftModel, threadId],
+    [
+      activeThread,
+      baseThreadModel,
+      isServerThread,
+      scheduleComposerFocus,
+      setComposerDraftModel,
+      threadId,
+    ],
   );
   const onEffortSelect = useCallback(
     (effort: ReasoningEffort) => {

apps/web/src/composerDraftStore.ts+11-3

...	@@ -1,4 +1,5 @@	...	@@ -1,4 +1,5 @@
1	import {	1	import {
		2	DEFAULT_MODEL,
2	DEFAULT_REASONING,	3	DEFAULT_REASONING,
3	ProjectId,	4	ProjectId,
4	REASONING_OPTIONS,	5	REASONING_OPTIONS,
...	@@ -119,7 +120,10 @@ const EMPTY_PERSISTED_DRAFT_STORE_STATE: PersistedComposerDraftStoreState = {	...	@@ -119,7 +120,10 @@ const EMPTY_PERSISTED_DRAFT_STORE_STATE: PersistedComposerDraftStoreState = {
119	const EMPTY_IMAGES: ComposerImageAttachment[] = [];	120	const EMPTY_IMAGES: ComposerImageAttachment[] = [];
120	const EMPTY_IDS: string[] = [];	121	const EMPTY_IDS: string[] = [];
121	const EMPTY_PERSISTED_ATTACHMENTS: PersistedComposerImageAttachment[] = [];	122	const EMPTY_PERSISTED_ATTACHMENTS: PersistedComposerImageAttachment[] = [];
122	const EMPTY_THREAD_DRAFT: ComposerThreadDraftState = {	123	Object.freeze(EMPTY_IMAGES);
		124	Object.freeze(EMPTY_IDS);
		125	Object.freeze(EMPTY_PERSISTED_ATTACHMENTS);
		126	const EMPTY_THREAD_DRAFT = Object.freeze({
123	prompt: "",	127	prompt: "",
124	cursor: 0,	128	cursor: 0,
125	images: EMPTY_IMAGES,	129	images: EMPTY_IMAGES,
...	@@ -127,7 +131,7 @@ const EMPTY_THREAD_DRAFT: ComposerThreadDraftState = {	...	@@ -127,7 +131,7 @@ const EMPTY_THREAD_DRAFT: ComposerThreadDraftState = {
127	persistedAttachments: EMPTY_PERSISTED_ATTACHMENTS,	131	persistedAttachments: EMPTY_PERSISTED_ATTACHMENTS,
128	model: null,	132	model: null,
129	effort: null,	133	effort: null,
130	};	134	}) as ComposerThreadDraftState;
131		135
132	const REASONING_EFFORT_VALUES = new Set<ReasoningEffort>(REASONING_OPTIONS);	136	const REASONING_EFFORT_VALUES = new Set<ReasoningEffort>(REASONING_OPTIONS);
133		137
...	@@ -667,7 +671,11 @@ export const useComposerDraftStore = create<ComposerDraftStoreState>()(	...	@@ -667,7 +671,11 @@ export const useComposerDraftStore = create<ComposerDraftStoreState>()(
667	if (threadId.length === 0) {	671	if (threadId.length === 0) {
668	return;	672	return;
669	}	673	}
670	const normalizedModel = normalizeModelSlug(model) ?? null;	674	const normalizedModelCandidate = normalizeModelSlug(model);
		675	const normalizedModel =
		676	normalizedModelCandidate && normalizedModelCandidate !== DEFAULT_MODEL
		677	? normalizedModelCandidate
		678	: null;
671	set((state) => {	679	set((state) => {
672	const existing = state.draftsByThreadId[threadId];	680	const existing = state.draftsByThreadId[threadId];
673	if (!existing && normalizedModel === null) {	681	if (!existing && normalizedModel === null) {