feat: implement cleanup for temporary files in chat composer and event hooks

This commit is contained in:
Gerard-Devlin 2026-06-11 01:03:36 +08:00
parent b57a0b0d23
commit 140ec1c5bb
3 changed files with 90 additions and 15 deletions

View file

@ -32,7 +32,7 @@ import {
ListEndIcon,
} from "lucide-react";
import { getCurrentWebview } from "@tauri-apps/api/webview";
import { writeFile, mkdir, exists } from "@tauri-apps/plugin-fs";
import { writeFile, mkdir, exists, remove } from "@tauri-apps/plugin-fs";
import { join, tempDir } from "@tauri-apps/api/path";
import { invoke } from "@tauri-apps/api/core";
import {
@ -87,6 +87,7 @@ interface PinnedContext {
filePath: string;
selectedText: string;
imageDataUrl?: string; // thumbnail for captured images
isTemporary?: boolean;
}
function pastedFileExtension(file: File) {
@ -113,6 +114,33 @@ function readFileAsDataUrl(file: File) {
});
}
function temporaryFilePaths(contexts: PinnedContext[]) {
return contexts
.filter((context) => context.isTemporary)
.map((context) => context.filePath);
}
async function cleanupTemporaryFilePaths(paths: string[] | undefined) {
if (!paths?.length) return;
await Promise.all(
paths.map(async (path) => {
try {
await remove(path);
} catch (err) {
log.warn("Failed to remove temporary pasted file", {
path,
error: String(err),
});
}
}),
);
}
function cleanupTemporaryPinnedContext(context: PinnedContext) {
if (!context.isTemporary) return;
void cleanupTemporaryFilePaths([context.filePath]);
}
function getFileIcon(file: ProjectFile) {
if (file.type === "image")
return <ImageIcon className="size-3.5 shrink-0 text-muted-foreground" />;
@ -813,6 +841,7 @@ export const ChatComposer: FC<{ isOpen?: boolean }> = ({ isOpen }) => {
"Use this image file as visual context for the user's message.",
].join("\n"),
imageDataUrl: await readFileAsDataUrl(file),
isTemporary: true,
});
} catch (err) {
log.error("Failed to save pasted image", {
@ -946,6 +975,7 @@ export const ChatComposer: FC<{ isOpen?: boolean }> = ({ isOpen }) => {
label: combinedLabel,
filePath: pinnedContexts[0].filePath,
selectedText: combinedText,
temporaryFilePaths: temporaryFilePaths(pinnedContexts),
};
}
@ -960,7 +990,8 @@ export const ChatComposer: FC<{ isOpen?: boolean }> = ({ isOpen }) => {
if (textareaRef.current) {
textareaRef.current.style.height = "auto";
}
// Clear pinned contexts after send
// Clear pinned contexts after send. Temporary files are removed by the
// completion event once the provider has finished with them.
setPinnedContexts([]);
}, [
activeTabId,
@ -1655,9 +1686,12 @@ export const ChatComposer: FC<{ isOpen?: boolean }> = ({ isOpen }) => {
type="button"
aria-label="Remove queued guidance"
className="flex size-6 shrink-0 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-red-500/10 hover:text-red-600 dark:hover:bg-red-500/15 dark:hover:text-red-400"
onClick={() =>
removeQueuedGuidance(activeTabId, guidance.id)
}
onClick={() => {
void cleanupTemporaryFilePaths(
guidance.contextOverride?.temporaryFilePaths,
);
removeQueuedGuidance(activeTabId, guidance.id);
}}
>
<Trash2Icon className="size-3" />
</button>
@ -1683,11 +1717,12 @@ export const ChatComposer: FC<{ isOpen?: boolean }> = ({ isOpen }) => {
/>
<button
aria-label="Remove attachment"
onClick={() =>
onClick={() => {
void cleanupTemporaryPinnedContext(ctx);
setPinnedContexts((prev) =>
prev.filter((_, idx) => idx !== i),
)
}
);
}}
className="absolute top-0.5 right-0.5 rounded-full bg-background/80 p-0.5 opacity-0 transition-opacity group-hover:opacity-100"
>
<XIcon className="size-3" />
@ -1701,11 +1736,12 @@ export const ChatComposer: FC<{ isOpen?: boolean }> = ({ isOpen }) => {
{ctx.label}
<button
aria-label="Remove context"
onClick={() =>
onClick={() => {
void cleanupTemporaryPinnedContext(ctx);
setPinnedContexts((prev) =>
prev.filter((_, idx) => idx !== i),
)
}
);
}}
className="ml-0.5 rounded-sm p-0.5 transition-colors hover:bg-muted-foreground/20"
>
<XIcon className="size-3" />

View file

@ -1,6 +1,7 @@
import { useEffect, useRef } from "react";
import { listen, type UnlistenFn } from "@tauri-apps/api/event";
import { invoke } from "@tauri-apps/api/core";
import { remove } from "@tauri-apps/plugin-fs";
import {
CLAUDE_CODE_PROVIDER_ID,
useClaudeChatStore,
@ -20,6 +21,21 @@ import { createLogger } from "@/lib/debug/logger";
const log = createLogger("claude-event");
async function cleanupTemporaryFiles(paths: string[]) {
await Promise.all(
paths.map(async (path) => {
try {
await remove(path);
} catch (err) {
log.warn("failed to remove temporary chat file", {
path,
error: String(err),
});
}
}),
);
}
/** Backend event payload shapes (include tab_id for routing) */
interface ClaudeOutputPayload {
tab_id: string;
@ -388,6 +404,7 @@ export function useClaudeEvents() {
const completedSessionId = tab.sessionId;
chatStore._setStreaming(tabId, false);
void cleanupTemporaryFiles(chatStore.consumeTemporaryFilePaths(tabId));
const forceQueuedGuidance = tab.forceQueuedGuidanceOnComplete === true;
if (forceQueuedGuidance) {

View file

@ -97,6 +97,7 @@ export interface TabDraft {
filePath: string;
selectedText: string;
imageDataUrl?: string;
isTemporary?: boolean;
}[];
}
@ -104,6 +105,7 @@ export interface PromptContextOverride {
label: string;
filePath: string;
selectedText: string;
temporaryFilePaths?: string[];
}
export interface QueuedGuidance {
@ -128,6 +130,7 @@ export interface TabState {
queuedGuidance?: QueuedGuidance[];
forceQueuedGuidanceOnComplete?: boolean;
forcedQueuedGuidanceId?: string | null;
pendingTemporaryFilePaths?: string[];
}
/** Fields that are projected from the active tab to top-level state */
@ -155,6 +158,7 @@ function makeDefaultTab(id: string): TabState {
queuedGuidance: [],
forceQueuedGuidanceOnComplete: false,
forcedQueuedGuidanceId: null,
pendingTemporaryFilePaths: [],
};
}
@ -530,6 +534,7 @@ interface ClaudeChatState {
) => string | null;
removeQueuedGuidance: (tabId: string, guidanceId: string) => void;
clearQueuedGuidance: (tabId: string) => void;
consumeTemporaryFilePaths: (tabId: string) => string[];
forceQueuedGuidanceNow: (tabId: string, guidanceId?: string) => Promise<void>;
cancelExecution: () => Promise<void>;
clearMessages: () => void;
@ -717,15 +722,20 @@ export const useClaudeChatStore = create<ClaudeChatState>()((set, get) => ({
: undefined;
set((s) => {
const currentTab = s.tabs.find((t) => t.id === activeTabId);
const temporaryFilePaths = Array.from(
new Set([
...(currentTab?.pendingTemporaryFilePaths ?? []),
...(contextOverride?.temporaryFilePaths ?? []),
]),
);
const tabUpdates: Partial<TabState> = {
messages: [
...(s.tabs.find((t) => t.id === activeTabId)?.messages ?? []),
userMessage,
],
messages: [...(currentTab?.messages ?? []), userMessage],
sessionId: resumeSessionId,
providerKey: requestProviderKey,
isStreaming: true,
error: null,
pendingTemporaryFilePaths: temporaryFilePaths,
};
if (tabTitle) tabUpdates.title = tabTitle;
return {
@ -936,6 +946,18 @@ export const useClaudeChatStore = create<ClaudeChatState>()((set, get) => ({
);
},
consumeTemporaryFilePaths: (tabId) => {
const paths =
get().tabs.find((tab) => tab.id === tabId)?.pendingTemporaryFilePaths ??
[];
if (paths.length > 0) {
set((state) =>
applyTabUpdate(state, tabId, { pendingTemporaryFilePaths: [] }),
);
}
return paths;
},
forceQueuedGuidanceNow: async (tabId, guidanceId) => {
const tab = get().tabs.find((t) => t.id === tabId);
if (!tab?.isStreaming || !(tab.queuedGuidance?.length ?? 0)) return;