Polish initial loading state for task threads#2311
Draft
fercgomes wants to merge 3 commits into
Draft
Conversation
When opening an existing task with a long thread, the UI used to show a
bare 32px spinner with no copy (local), or briefly render just the initial
user prompt with no indication more is loading (cloud). Once messages
trickled in, there was no signal that the agent was still reconnecting.
Three coordinated UX changes:
- Extract a shared InitializingSplash (hedgehog + 2s reveal + heading
+ subtitle) so cloud and local share one source of truth.
- New LocalInitializingView replaces the bare local spinner with the
same polished pattern. Copy is keyed on whether we're resuming an
existing session ("Loading your conversation…") or spinning up a new
one ("Getting things ready…").
- New ConversationLoadingHint pill sits above the input and surfaces
the in-between states: "Reconnecting to your agent…" while local
logs have loaded but the agent process is still spawning, and
"Loading more messages…" while a cloud run is queued/in_progress
and the first event has arrived but more are still being polled.
Hidden during active generation since SessionFooter already covers
that.
Generated-By: PostHog Code
Task-Id: 743a524d-7374-453b-91b4-e5ab43342707
"Loading the thread" and "reconnecting to your agent" are different mechanisms but the same experience from the user's perspective: they're waiting to see their conversation. The previous splash + pill combo mentioned both concepts and felt disjointed. Replace the local initializing splash with a skeleton placeholder of message bubbles that mirrors the real conversation layout, and drop the "Reconnecting to your agent…" pill that was conflating the two states. The cloud queue/sandbox splash stays — that's genuinely different info (no thread to load yet) and the queue status is meaningful. - New MessagesSkeleton: two user bubbles + two assistant text-line groups, max-width matched to CHAT_CONTENT_MAX_WIDTH, animate-pulse. - SessionView local isInitializing branch uses MessagesSkeleton. - Remove ConversationLoadingHint and its usage in ConversationView. - Revert the isResumingExistingSession plumbing — the skeleton doesn't need that distinction. - Delete LocalInitializingView (replaced by skeleton). Generated-By: PostHog Code Task-Id: 743a524d-7374-453b-91b4-e5ab43342707
Previous skeleton lived in SessionView's isInitializing branch as a full-area replacement for the conversation+input layout, so the transition from "loading" to "loaded" swapped the entire screen. Move the skeleton into ConversationView itself, rendered when items.length === 0 inside the same absolute-positioned slot as the VirtualizedList. The surrounding chrome (input area, plan bar, footer) stays mounted the whole time — only the message slot swaps from skeleton bubbles to real messages. The existing "Connecting to agent…" overlay in the input area already handles the agent-spawn transition with its own opacity fade, so no extra indicator needed there. Cloud sessions still route through CloudInitializingView for the queued/in-progress no-events case — the queue/sandbox copy carries real information that the skeleton can't substitute for. Generated-By: PostHog Code Task-Id: 743a524d-7374-453b-91b4-e5ab43342707
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
1 participant
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
When opening an existing task with a long thread, the UI used to show a bare 32px spinner with no copy (local sessions), or briefly render just the initial user prompt with no indication more was loading (cloud sessions). Once messages trickled in, there was no signal that the agent was still reconnecting.
Three coordinated changes:
InitializingSplash— extracted fromCloudInitializingViewso cloud and local share one source of truth for the hedgehog + 2s reveal + heading/subtitle layout.LocalInitializingView— replaces the bare local spinner inSessionViewwith the same polished pattern. Copy keyed on whether we're resuming an existing session ("Loading your conversation…") or spinning up a new one ("Getting things ready…").ConversationLoadingHint— a small pill above the input that surfaces the in-between states: "Reconnecting to your agent…" while local logs have loaded but the agent process is still spawning, and "Loading more messages…" while a cloud run is queued/in_progress and only the initial event has come through. Hidden during active generation sinceSessionFooteralready covers that.Test plan
session.statusflips toconnected.in_progresswith only the initial prompt indexed — splash first, then once the prompt arrives the "Loading more messages…" pill is visible until the next event lands.pnpm --filter code typecheckclean;pnpm --filter code testforsrc/rendererpasses (930 tests).