Skip to content

Persist changed-files expansion state per thread #37

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
Marve10s wants to merge 3 commits into
base: main
Choose a base branch
from
Open

Persist changed-files expansion state per thread #37

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
c8f302a
persist changed-files expansion per thread
Marve10s Apr 20, 2026
92cace6
Merge remote-tracking branch 'origin/main' into codex/persist-changed…
Marve10s Apr 20, 2026
a0aa9d3
ci: retrigger runners
Marve10s Apr 23, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
20 changes: 20 additions & 0 deletions apps/web/src/components/ChatView.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -338,6 +338,7 @@ const EMPTY_KEYBINDINGS: ResolvedKeybindingsConfig = [];
const EMPTY_PROJECT_ENTRIES: ProjectEntry[] = [];
const EMPTY_PROVIDER_NATIVE_COMMANDS: ProviderNativeCommandDescriptor[] = [];
const EMPTY_PROVIDER_SKILLS: ProviderSkillDescriptor[] = [];
const EMPTY_CHANGED_FILES_EXPANDED_BY_TURN_ID: Record<string, boolean> = {};
function eventTargetsComposer(
event: globalThis.KeyboardEvent,
composerForm: HTMLFormElement | null,
Expand Down Expand Up @@ -659,6 +660,9 @@ export default function ChatView({
const syncServerReadModel = useStore((store) => store.syncServerReadModel);
const setStoreThreadError = useStore((store) => store.setError);
const setStoreThreadWorkspace = useStore((store) => store.setThreadWorkspace);
const setStoreThreadChangedFilesExpanded = useStore(
(store) => store.setThreadChangedFilesExpanded,
);
const { settings } = useAppSettings();
const setStickyComposerModelSelection = useComposerDraftStore(
(store) => store.setStickyModelSelection,
Expand Down Expand Up @@ -762,6 +766,14 @@ export default function ChatView({
const fallbackDraftProject = useStore(
useMemo(() => createProjectSelector(fallbackDraftProjectId), [fallbackDraftProjectId]),
);
const changedFilesExpandedByTurnId = useStore(
useMemo(
() => (store) =>
store.threadChangedFilesExpandedByTurnId?.[threadId] ??
EMPTY_CHANGED_FILES_EXPANDED_BY_TURN_ID,
[threadId],
),
);
const promptRef = useRef(prompt);
const [isDragOverComposer, setIsDragOverComposer] = useState(false);
const [expandedImage, setExpandedImage] = useState<ExpandedImagePreview | null>(null);
Expand Down Expand Up @@ -6149,6 +6161,12 @@ export default function ChatView({
[groupId]: !existing[groupId],
}));
}, []);
const onSetChangedFilesExpanded = useCallback(
(turnId: TurnId, expanded: boolean) => {
setStoreThreadChangedFilesExpanded(threadId, turnId, expanded);
},
[setStoreThreadChangedFilesExpanded, threadId],
);
const onExpandTimelineImage = useCallback((preview: ExpandedImagePreview) => {
setExpandedImage(preview);
}, []);
Expand Down Expand Up @@ -7032,7 +7050,9 @@ export default function ChatView({
completionDividerBeforeEntryId={completionDividerBeforeEntryId}
completionSummary={completionSummary}
turnDiffSummaryByAssistantMessageId={turnDiffSummaryByAssistantMessageId}
changedFilesExpandedByTurnId={changedFilesExpandedByTurnId}
expandedWorkGroups={expandedWorkGroups}
onSetChangedFilesExpanded={onSetChangedFilesExpanded}
onToggleWorkGroup={onToggleWorkGroup}
onOpenTurnDiff={onOpenTurnDiff}
onOpenThread={onNavigateToThread}
Expand Down
9 changes: 9 additions & 0 deletions apps/web/src/components/chat/ChatTranscriptPane.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,11 +20,15 @@ import { type ExpandedImagePreview } from "./ExpandedImagePreview";
import { ChatEmptyStateHero } from "./ChatEmptyStateHero";
import { MessagesTimeline } from "./MessagesTimeline";

const EMPTY_CHANGED_FILES_EXPANDED_BY_TURN_ID: Record<string, boolean> = {};
const NOOP_SET_CHANGED_FILES_EXPANDED = () => {};

interface ChatTranscriptPaneProps {
activeThreadId: string;
activeTurnInProgress: boolean;
activeTurnStartedAt: string | null;
chatFontSizePx: number;
changedFilesExpandedByTurnId?: Record<string, boolean>;
completionDividerBeforeEntryId: string | null;
completionSummary: string | null;
emptyStateProjectName: string | undefined;
Expand All @@ -50,6 +54,7 @@ interface ChatTranscriptPaneProps {
onOpenThread: (threadId: ThreadId) => void;
onRevertUserMessage: (messageId: MessageId) => void;
onScrollToBottom: () => void;
onSetChangedFilesExpanded?: (turnId: TurnId, expanded: boolean) => void;
onLiveContentHeightChange: () => void;
onToggleWorkGroup: (groupId: string) => void;
resolvedTheme: "light" | "dark";
Expand All @@ -69,6 +74,7 @@ export const ChatTranscriptPane = memo(function ChatTranscriptPane({
activeTurnInProgress,
activeTurnStartedAt,
chatFontSizePx,
changedFilesExpandedByTurnId = EMPTY_CHANGED_FILES_EXPANDED_BY_TURN_ID,
completionDividerBeforeEntryId,
completionSummary,
emptyStateProjectName,
Expand All @@ -94,6 +100,7 @@ export const ChatTranscriptPane = memo(function ChatTranscriptPane({
onOpenThread,
onRevertUserMessage,
onScrollToBottom,
onSetChangedFilesExpanded = NOOP_SET_CHANGED_FILES_EXPANDED,
onLiveContentHeightChange,
onToggleWorkGroup,
resolvedTheme,
Expand Down Expand Up @@ -142,7 +149,9 @@ export const ChatTranscriptPane = memo(function ChatTranscriptPane({
completionDividerBeforeEntryId={completionDividerBeforeEntryId}
completionSummary={completionSummary}
turnDiffSummaryByAssistantMessageId={turnDiffSummaryByAssistantMessageId}
changedFilesExpandedByTurnId={changedFilesExpandedByTurnId}
expandedWorkGroups={expandedWorkGroups}
onSetChangedFilesExpanded={onSetChangedFilesExpanded}
onToggleWorkGroup={onToggleWorkGroup}
onOpenTurnDiff={onOpenTurnDiff}
onOpenThread={onOpenThread}
Expand Down
68 changes: 68 additions & 0 deletions apps/web/src/components/chat/MessagesTimeline.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1509,6 +1509,74 @@ describe("MessagesTimeline", () => {
expect(markup).toContain("+2");
});

it("renders changed-files cards from controlled thread-scoped expansion state", async () => {
const { MessagesTimeline } = await import("./MessagesTimeline");
const assistantMessageId = MessageId.makeUnsafe("message-assistant-collapsed-files");
const turnId = TurnId.makeUnsafe("turn-collapsed-files");
const markup = renderToStaticMarkup(
<MessagesTimeline
hasMessages
isWorking={false}
activeTurnInProgress={false}
activeTurnStartedAt={null}
changedFilesExpandedByTurnId={{ [turnId]: false }}
scrollContainer={null}
timelineEntries={[
{
id: "entry-assistant-collapsed-files",
kind: "message",
createdAt: "2026-03-17T19:12:29.000Z",
message: {
id: assistantMessageId,
role: "assistant",
text: "done",
createdAt: "2026-03-17T19:12:29.000Z",
completedAt: "2026-03-17T19:12:30.000Z",
streaming: false,
},
},
]}
completionDividerBeforeEntryId={null}
completionSummary={null}
turnDiffSummaryByAssistantMessageId={
new Map([
[
assistantMessageId,
{
turnId,
completedAt: "2026-03-17T19:12:30.000Z",
assistantMessageId,
files: [
{
path: "apps/web/src/components/chat/MessagesTimeline.tsx",
additions: 2,
deletions: 0,
},
],
},
],
])
}
nowIso="2026-03-17T19:12:30.000Z"
expandedWorkGroups={{}}
onToggleWorkGroup={() => {}}
onOpenTurnDiff={() => {}}
revertTurnCountByUserMessageId={new Map()}
onRevertUserMessage={() => {}}
isRevertingCheckpoint={false}
onImageExpand={() => {}}
markdownCwd={undefined}
resolvedTheme="dark"
timestampFormat="locale"
workspaceRoot={undefined}
/>,
);

expect(markup).toContain('aria-expanded="false"');
expect(markup).toContain("Expand changed files list");
expect(markup).toContain("grid-rows-[0fr] opacity-0");
});

it("renders inline edited rows from the turn summary when the file-change tool call has no filenames", async () => {
const { MessagesTimeline } = await import("./MessagesTimeline");
const assistantMessageId = MessageId.makeUnsafe("message-assistant-inline-summary-fallback");
Expand Down
26 changes: 14 additions & 12 deletions apps/web/src/components/chat/MessagesTimeline.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -184,13 +184,15 @@ interface MessagesTimelineProps {
activeTurnStartedAt: string | null;
followLiveOutput?: boolean;
emptyStateContent?: ReactNode;
changedFilesExpandedByTurnId?: Record<string, boolean>;
scrollContainer: HTMLDivElement | null;
timelineEntries: ReturnType<typeof deriveTimelineEntries>;
completionDividerBeforeEntryId: string | null;
completionSummary: string | null;
turnDiffSummaryByAssistantMessageId: Map<MessageId, TurnDiffSummary>;
nowIso?: string;
expandedWorkGroups: Record<string, boolean>;
onSetChangedFilesExpanded?: (turnId: TurnId, expanded: boolean) => void;
onToggleWorkGroup: (groupId: string) => void;
onOpenTurnDiff: (turnId: TurnId, filePath?: string) => void;
onOpenThread?: (threadId: ThreadId) => void;
Expand All @@ -211,6 +213,7 @@ export const MessagesTimeline = memo(function MessagesTimeline({
isWorking,
activeTurnInProgress,
activeTurnStartedAt,
changedFilesExpandedByTurnId = {},
followLiveOutput = false,
scrollContainer,
timelineEntries,
Expand All @@ -219,6 +222,7 @@ export const MessagesTimeline = memo(function MessagesTimeline({
turnDiffSummaryByAssistantMessageId,
nowIso,
expandedWorkGroups,
onSetChangedFilesExpanded,
onToggleWorkGroup,
onOpenTurnDiff,
onOpenThread,
Expand All @@ -245,9 +249,6 @@ export const MessagesTimeline = memo(function MessagesTimeline({
);
const timelineRootRef = useRef<HTMLDivElement | null>(null);
const [timelineWidthPx, setTimelineWidthPx] = useState<number | null>(null);
const [expandedFileChangesByMessageId, setExpandedFileChangesByMessageId] = useState<
Record<string, boolean>
>({});
const [expandedUserMessagesById, setExpandedUserMessagesById] = useState<Record<string, boolean>>(
{},
);
Expand Down Expand Up @@ -498,7 +499,7 @@ export const MessagesTimeline = memo(function MessagesTimeline({
scheduleVirtualizerMeasure();
}, [
expandedWorkGroups,
expandedFileChangesByMessageId,
changedFilesExpandedByTurnId,
allDirectoriesExpandedByTurnId,
normalizedChatFontSizePx,
scheduleVirtualizerMeasure,
Expand Down Expand Up @@ -531,12 +532,13 @@ export const MessagesTimeline = memo(function MessagesTimeline({

const virtualRows = shouldUseSimpleList ? [] : rowVirtualizer.getVirtualItems();
const nonVirtualizedRows = shouldUseSimpleList ? rows : rows.slice(virtualizedRowCount);
const toggleFileChangesExpanded = useCallback((messageId: MessageId) => {
setExpandedFileChangesByMessageId((current) => ({
...current,
[messageId]: !(current[messageId] ?? true),
}));
}, []);
const toggleFileChangesExpanded = useCallback(
(turnId: TurnId) => {
const currentExpanded = changedFilesExpandedByTurnId[turnId] ?? true;
onSetChangedFilesExpanded?.(turnId, !currentExpanded);
},
[changedFilesExpandedByTurnId, onSetChangedFilesExpanded],
);

const renderRowContent = (row: MessagesTimelineRow) => (
<div
Expand Down Expand Up @@ -924,7 +926,7 @@ export const MessagesTimeline = memo(function MessagesTimeline({
const checkpointFiles = turnSummary.files;
if (checkpointFiles.length === 0) return null;
const fileChangesExpanded =
expandedFileChangesByMessageId[row.message.id] ?? true;
changedFilesExpandedByTurnId[turnSummary.turnId] ?? true;
const correspondingUserMessageId = userMessageIdByAssistantMessageId.get(
row.message.id,
);
Expand Down Expand Up @@ -952,7 +954,7 @@ export const MessagesTimeline = memo(function MessagesTimeline({
? "Collapse changed files list"
: "Expand changed files list"
}
onClick={() => toggleFileChangesExpanded(row.message.id)}
onClick={() => toggleFileChangesExpanded(turnSummary.turnId)}
>
<DisclosureChevron
open={fileChangesExpanded}
Expand Down
92 changes: 92 additions & 0 deletions apps/web/src/store.test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@ import {
renameProjectLocally,
reorderProjects,
setThreadWorkspace,
setThreadChangedFilesExpanded,
setAllProjectsExpanded,
syncServerReadModel,
syncServerThreadDetailHotPath,
Expand Down Expand Up @@ -1844,6 +1845,97 @@ describe("store read model sync", () => {
}
});

it("stores only collapsed changed-files overrides and clears them when re-expanded", () => {
const threadId = ThreadId.makeUnsafe("thread-1");
const turnId = TurnId.makeUnsafe("turn-1");
const collapsed = setThreadChangedFilesExpanded(
makeState(makeThread()),
threadId,
turnId,
false,
);

expect(collapsed.threadChangedFilesExpandedByTurnId).toEqual({
[threadId]: {
[turnId]: false,
},
});

const expanded = setThreadChangedFilesExpanded(collapsed, threadId, turnId, true);

expect(expanded.threadChangedFilesExpandedByTurnId).toEqual({});
});

it("prunes persisted changed-files overrides when a thread disappears from the read model", () => {
const threadId = ThreadId.makeUnsafe("thread-1");
const turnId = TurnId.makeUnsafe("turn-1");
const otherThreadId = ThreadId.makeUnsafe("thread-2");
const otherTurnId = TurnId.makeUnsafe("turn-2");
const initialState = {
...makeState(makeThread({ id: threadId })),
threads: [makeThread({ id: threadId }), makeThread({ id: otherThreadId })],
threadChangedFilesExpandedByTurnId: {
[threadId]: { [turnId]: false },
[otherThreadId]: { [otherTurnId]: false },
},
} satisfies AppState;

const next = syncServerReadModel(
initialState,
makeReadModel(makeReadModelThread({ id: threadId, updatedAt: "2026-02-28T00:00:00.000Z" })),
);

expect(next.threadChangedFilesExpandedByTurnId).toEqual({
[threadId]: { [turnId]: false },
});
});

it("hydrates persisted changed-files overrides and ignores non-collapsed values", async () => {
const storage = new Map<string, string>();
const fakeWindow = {
localStorage: {
getItem: (key: string) => storage.get(key) ?? null,
setItem: (key: string, value: string) => {
storage.set(key, value);
},
removeItem: (key: string) => {
storage.delete(key);
},
clear: () => {
storage.clear();
},
},
addEventListener: vi.fn(),
};
storage.set(
"t3code:renderer-state:v8",
JSON.stringify({
threadChangedFilesExpandedByTurnId: {
"thread-1": {
"turn-collapsed": false,
"turn-expanded": true,
},
"thread-empty": {},
},
}),
);

vi.stubGlobal("window", fakeWindow);
try {
vi.resetModules();

const freshStore = await import("./store");

expect(freshStore.useStore.getState().threadChangedFilesExpandedByTurnId).toEqual({
[ThreadId.makeUnsafe("thread-1")]: {
[TurnId.makeUnsafe("turn-collapsed")]: false,
},
});
} finally {
vi.unstubAllGlobals();
}
});

it("reuses normalized thread objects when the incoming snapshot is unchanged", () => {
const readModel = {
snapshotSequence: 1,
Expand Down
Loading