fix(console/agent-sessions): keep prior data during refetch (no flash)#24
Merged
Conversation
The three Agent Session list hooks (`useAgentSessions`, `useAgentSessionDetail`, `useSessionTurns`) were missing the `placeholderData: (prev) => prev` setting that every other list hook in the app uses (`useAgentTurns`, `useLlmCalls`, `useHttpExchanges`, `useMetrics`, etc.). Without it, every auto-refresh tick / toolbar key change wipes the query cache to undefined before the new response lands — react-query renders the loading skeleton, then the new data — and the user sees a full-page flash on every refresh while other list pages do a frame-perfect swap. Setting `placeholderData: (prev) => prev` keeps the last-known data visible while a background refetch is in flight. New data drops in when the response arrives; no skeleton, no blanked-out list. Caught by user: "Agent Session 界面每次刷新都会重刷整个页面, 而不是像其他页面一样看上去重刷幅度很小". Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
There was a problem hiding this comment.
Summary
This PR adds placeholderData: (prev) => prev to three Agent Session hooks (useAgentSessions, useAgentSessionDetail, useSessionTurns) to eliminate a UI flash during auto-refresh. The fix matches the pattern used in all other list hooks (useAgentTurns, useLlmCalls, useHttpExchanges, useMetrics) and correctly addresses the reported issue. The implementation is correct and follows established patterns. APPROVE
Verified
- Pattern consistency: Confirmed that
useAgentTurns:44,useLlmCalls:57,useHttpExchanges:72,useMetrics:15all useplaceholderData: (prev) => prev— the three hooks in this PR now match this pattern - Infinite query behavior: For
useAgentSessionsanduseSessionTurns, thequeryKeyincludesstart/endfrom toolbar store. When auto-refresh updates the preset (viauseAutoRefresh→setPreset), these values change, causing a key transition. WithoutplaceholderData, this would clear cached pages → render loading skeleton → flash; with it, prior pages stay visible until new data arrives - Detail hook appropriateness:
useAgentSessionDetaildoesn't subscribe tostart/end, but navigation between sessions (same source, different session_id) would benefit from showing the prior session until the new one loads - Caller compatibility: Checked
agent-sessions.tsx:54andagent-session-detail.tsx:11,19— the hooks are consumed correctly, and the loading-state predicates (isLoading && items.length === 0,loadingDetail && !detail) already handle theplaceholderDatacase properly (they check for data presence, not just loading state) - No other hooks missed: Grepped for all
useQuery/useInfiniteQueryhooks — all list/timeseries queries now haveplaceholderData, detail queries (useAgentTurnDetail,useAgentTurnCalls,useLlmCallDetail,useHttpExchange) correctly omit it as they lack time-range dependencies
🤖 Reviewed by vivi • workflow run
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Add
placeholderData: (prev) => prevto the three Agent Session list hooks so the Sessions page does an in-place swap on refetch — same behavior as Agent Turns / LLM Calls / Metrics / every other list page.Why
User report: "Agent Session 界面每次刷新都会重刷整个页面,而不是像其他页面一样看上去重刷幅度很小".
Every other list hook in the app sets
placeholderData: (prev) => prev. The Agent Session hooks didn't — so every auto-refresh tick / toolbar key change wiped the cache toundefined, the page rendered its loading skeleton, then the new data dropped in. The user saw a full-page flash where every other page did a smooth swap.Files
console/src/hooks/use-agent-sessions.ts— three hooks (useAgentSessions,useAgentSessionDetail,useSessionTurns) each get the same one-liner.Test plan
bun test— 111 passbun run build— clean🤖 Generated with Claude Code