Skip to content

M2: Replace spinners with ChatLoadingSkeleton#14902

Merged
tkheyfets merged 3 commits into
feature/thread-skeleton-loadingfrom
swarm/thread-skeleton-load/task-2
Mar 10, 2026
Merged

M2: Replace spinners with ChatLoadingSkeleton#14902
tkheyfets merged 3 commits into
feature/thread-skeleton-loadingfrom
swarm/thread-skeleton-load/task-2

Conversation

@tkheyfets
Copy link
Copy Markdown
Contributor

@tkheyfets tkheyfets commented Mar 10, 2026

Replace ProgressView/VLoadingIndicator spinners with ChatLoadingSkeleton skeleton pattern in three locations: ChatView history loading, DaemonLoadingChatSkeleton, and ChatBootstrapLoadingView. Part of #14888.


Open with Devin

Co-Authored-By: Claude <noreply@anthropic.com>
@tkheyfets tkheyfets self-assigned this Mar 10, 2026
devin-ai-integration[bot]

This comment was marked as resolved.

chatgpt-codex-connector[bot]

This comment was marked as resolved.

@tkheyfets
Copy link
Copy Markdown
Contributor Author

@codex review this PR again — the previous issues have been fixed in commit 6dd5295

@tkheyfets
Copy link
Copy Markdown
Contributor Author

@devin review this PR again — the previous issues have been fixed in commit 6dd5295

@tkheyfets
Copy link
Copy Markdown
Contributor Author

@codex review this PR again — the previous issues have been fixed in commit 42abb3d

@tkheyfets
Copy link
Copy Markdown
Contributor Author

@devin review this PR again — the previous issues have been fixed in commit 42abb3d

@chatgpt-codex-connector
Copy link
Copy Markdown

Codex Review: Didn't find any major issues. Keep it up!

ℹ️ About Codex in GitHub

Codex has been enabled to automatically review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review".

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".

@tkheyfets tkheyfets merged commit 6339738 into feature/thread-skeleton-loading Mar 10, 2026
1 check passed
@tkheyfets tkheyfets deleted the swarm/thread-skeleton-load/task-2 branch March 10, 2026 20:42
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>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant