M1: Add ChatLoadingSkeleton component#14893
Merged
tkheyfets merged 4 commits intoMar 10, 2026
Merged
Conversation
Co-Authored-By: Claude <noreply@anthropic.com>
Contributor
Author
Contributor
Author
Contributor
Author
Contributor
Author
|
Codex Review: Didn't find any major issues. Delightful! ℹ️ About Codex in GitHubCodex has been enabled to automatically review pull requests in this repo. Reviews are triggered when you
If Codex has suggestions, it will comment; otherwise it will react with 👍. When you sign up for Codex through ChatGPT, Codex can also answer questions or update the PR, like "@codex address that feedback". |
5 tasks
tkheyfets
added a commit
that referenced
this pull request
Mar 10, 2026
* M1: Add ChatLoadingSkeleton component (#14893) * Add ChatLoadingSkeleton component with skeleton message bubbles Co-Authored-By: Claude <noreply@anthropic.com> * Remove unused avatarReserve property and add #if DEBUG guard to preview * Use adaptive maxWidth for skeleton bones to handle narrow containers * Use VRadius.pill instead of hardcoded radius for avatar circle --------- Co-authored-by: Claude <noreply@anthropic.com> * M2: Replace spinners with ChatLoadingSkeleton (#14902) * Replace loading spinners with ChatLoadingSkeleton in chat area Co-Authored-By: Claude <noreply@anthropic.com> * Update stale docstring on DaemonLoadingChatSkeleton * Add accessibility labels for VoiceOver on skeleton loading states --------- Co-authored-by: Claude <noreply@anthropic.com> * fix: remove accessibilityHidden from ChatLoadingSkeleton The skeleton itself should not unconditionally hide from VoiceOver. Each usage site already controls accessibility appropriately: - DaemonLoadingOverlay hides the ZStack (decorative) - ChatView loading states use accessibilityElement + accessibilityLabel Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * fix: rewrite skeleton to match real chat bubble layout - User message: right-aligned bubble with two short text lines, matching real ChatBubble user styling (fill, padding, corner radius) - Assistant message: left-aligned with 28pt avatar placeholder and six varying-width text lines, using the same overlay/offset pattern as real ChatBubble (avatar at -(28+sm), content padded .leading 36pt) - Spacing uses VSpacing.md between messages (matching LazyVStack) - Constrained to chatColumnMaxWidth for proper centering Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * fix: align skeleton to top, use real avatar, add assistant bubble - Start from top of chat area instead of vertically centered - Use real assistant avatar (AvatarAppearanceManager) instead of skeleton bone for the avatar circle - Add subtle bubble background to assistant message block - Add Spacer at bottom of skeleton to push content to top Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * fix: darker skeleton bones with subtler shimmer, wider user bubble - Use darker bone fill (surfaceBorder 0.7) instead of default 0.5 - Use surfaceBorder as shimmer highlight instead of bright surface color - Widen user message bones (280/200pt) for more realistic proportions Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * fix: make user skeleton bubble full chatBubbleMaxWidth User skeleton bubble now spans the same width as the assistant block (680pt) instead of shrink-wrapping around short bones. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * fix: use textMuted for skeleton bones so they're visible in light mode surfaceBorder is Moss._100 in light mode — same as background, making bones invisible. Switch to textMuted (Stone._600 light / Moss._500 dark) which contrasts well against the background in both color schemes. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * fix: narrow user skeleton bubble to 65% of chatBubbleMaxWidth User messages are typically shorter than assistant responses. The skeleton now reflects this with a 65% width bubble. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * fix: remove bubble backgrounds from skeleton to match real chat Real ChatBubble uses Color.clear for assistant messages and the skeleton doesn't need bubble chrome — just bare bones matching the layout. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * fix: add VColor.userBubble to skeleton user message User messages have a visible bubble in both dark and light modes (Moss._950 / Moss._200). Skeleton now uses the real userBubble color with proper padding and corner radius matching ChatBubble. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> --------- Co-authored-by: Claude <noreply@anthropic.com>
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.
Create a new ChatLoadingSkeleton view that shows shimmer-animated skeleton message bubbles mimicking the chat layout. Shows 4 alternating assistant/user placeholder rows with avatar circles and text bones. Part of #14888.