refactor(web): give Skeleton shape and tone props

[juliusmarminge]

A skeleton's width and height are its content, so those stay on className
(layout, which the lint allows). Its radius and tint are not: expose
shape="block|rounded|card|pill" and tone="subtle" and migrate the 25 sites.
The one status-dot placeholder drops its background ring; it is a loading
placeholder and does not need to mimic the dot's outline.

Lowers the no-restyle ceiling from 1004 to 978.

Part of the components/ui className cleanup (audit and guardrail: #12982). Each layer of stack #12993 lowers the shadcn/no-restyle ceiling; CI fails if the count rises.

Written by Claude Fable 5 in Claude Code.

🤖 Generated with Claude Code

Summary by CodeRabbit

• UI Improvements
  • Updated loading placeholders across diff panels, user profiles, cloud environments, source control, and usage pages for more consistent shapes and tones.
  • Standardized square, rounded, card, and pill-shaped placeholders while preserving existing layouts and dimensions.
  • Improved visual consistency across loading states without changing displayed content or functionality.
• Chores
  • Updated styling checks to reflect the latest baseline.

[github-actions]

Thread transfer impact

✅ Thread transfer remains within every enforced ceiling.

ℹ️ No successful main baseline artifact is available yet. This run establishes the initial measurement.

Provider	Metric	Main baseline	This PR	Impact	PR ceiling
Codex	Total thread wire	—	13.5 KiB	—	15.1 KiB	✅
Codex	Thread snapshot wire	—	7.1 KiB	—	7.3 KiB	✅
Codex	Live turn WebSocket wire	—	6.5 KiB	—	7.8 KiB	✅
Codex	Live turn WebSocket decoded	—	56.3 KiB	—	66.4 KiB	✅
Codex	Live turn messages	—	10	—	21	✅
Claude	Total thread wire	—	13.5 KiB	—	15.1 KiB	✅
Claude	Thread snapshot wire	—	7.1 KiB	—	7.3 KiB	✅
Claude	Live turn WebSocket wire	—	6.4 KiB	—	7.8 KiB	✅
Claude	Live turn WebSocket decoded	—	57.0 KiB	—	66.4 KiB	✅
Claude	Live turn messages	—	9	—	21	✅

Baseline: unavailable · PR result: dfee61d · Source CI: success

Scenario and decoded snapshot size

10 historical turns, 5 command tools per turn, 878.9 KiB retained MCP result per historical turn, and a 1.05 MiB retained result in the measured turn.

• Codex decoded thread snapshot: 114.0 KiB
• Claude decoded thread snapshot: 114.6 KiB

Updated in place by a trusted workflow. PR artifacts are strictly validated and never executed.

[coderabbitai]

Navigate logical layers of code changes, visualize relationships, and explore their blast radius.

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Repository: pingdotgg/t3code/.coderabbit.yaml

Review profile: CHILL

Plan: Team

Run ID: 7d41fccc-f011-42a9-80dc-39c7d63da08a

📥 Commits

Reviewing files that changed from the base of the PR and between 7e7dcbd and 8b52648.

📒 Files selected for processing (1)

• scripts/lint-restyle-ceiling.ts

Limit details: You’ve used all 10 included reviews currently available.

---

📝 Walkthrough

Walkthrough

The shared Skeleton component now supports shape and tone variants. Loading skeleton consumers use these variants instead of local rounding and background classes. The lint finding ceiling decreases from 1005 to 979.

Changes

Skeleton variants and consumers

Layer / File(s)	Summary
Skeleton variant contract apps/web/src/components/ui/skeleton.tsx	Adds CVA-based shape and tone variants. Skeleton accepts both props.
Loading skeleton migration apps/web/src/components/DiffPanelShell.tsx, apps/web/src/components/clerk/MobileClientsUserProfilePage.tsx, apps/web/src/components/cloud/CloudEnvironmentConnectList.tsx, apps/web/src/components/settings/SourceControlSettings.tsx, apps/web/src/components/usage/UsagePage.tsx	Loading skeletons use shared shape and tone props while preserving existing dimensions and layout.

Lint threshold update

Layer / File(s)	Summary
Lint finding ceiling scripts/lint-restyle-ceiling.ts	Reduces RESTYLE_CEILING from 1005 to 979.

Priority: ⬇️ Low

Estimated code review effort: 2 (Simple) | ~10 minutes

Change: Refactor

Merge Risk: ⚪ Minimal · up to 8b526

This styling refactor presents no evidenced user-facing, data, security, or runtime risk and is ready to merge with normal checks.

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 12.50% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 8 functions across 7 files.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Title check	✅ Passed	The title clearly and concisely describes the main change: adding shape and tone props to the web Skeleton component.
Description check	✅ Passed	The description clearly explains the Skeleton refactor, migration scope, rationale, and lint-ceiling change. It does not use the template headings, checklist, or provide UI screenshots, but the core i…

• Fix all pre-merge checks with AI

✨ Finishing Touches 💡 1

📝 Generate docstrings 💡

• Commit to this branch
• Create a new PR

🧪 Generate unit tests (beta)

• Commit to this branch
• Create a new PR

---

_{Comment @coderabbitai help to get the list of available commands.}

[macroscopeapp]

Approvability

Verdict: Approved at 8b52648

Macroscope's review found this PR approvable — This is a bounded Skeleton styling refactor that preserves existing defaults and changes only loading-placeholder appearance across a few UI states. The accompanying CI ceiling is tightened rather than weakened, with no production, schema, authentication, billing, or infrastructure impact.

No code changes detected at dfee61d. Prior analysis still applies.

^{You can add or adjust custom eligibility rules. Learn more.}

[juliusmarminge]

Superseded by the reworked stack (#12993 v2). After review feedback the layers were rebuilt to add fewer props and take more opinions in the base; see the new stack for the replacement.