Skip to content

fix(console): single skeleton→content fade on usage logs (and other pages) - #355

Merged
caigee-cmd merged 2 commits into
mainfrom
fix/logs-skeleton-flash
Oct 22, 2026
Merged

caigee-cmd merged 2 commits into
mainfrom
fix/logs-skeleton-flash

Conversation

@caigee-cmd

Copy link
Copy Markdown
Owner

Root cause: useSkeletonSwap faded content with GSAP right after a heavy mount (whole page / 50-row table). GSAP's ticker counted the long mount frame as elapsed time, so the 280ms fade jumped to its end: content painted at opacity 0 for a frame, then popped in (flash). On top of that, the full-page skeleton hard-cut to the page shell and only the table faded, and every page/filter refetch swapped the table back to the skeleton and replayed the same flash.

Fix:

  • useSkeletonSwap uses WAAPI (timeline starts at first painted frame) for the height + fade; only elements that actually showed a skeleton are animated.
  • New useSkeletonExit: page root fades in exactly once when a full-page skeleton gives way (Logs, Overview, System, Keys, Providers, Access, Accounts).
  • Logs: refetches keep current rows dimmed (opacity-60 transition) instead of returning to the skeleton; skeleton only when the list is empty.

Verified with Playwright + mocked /api (900ms delay): initial load = one 260ms 0→1 fade of whole page (h2 and table in sync); paging = 1→0.6→1 dim, no skeleton, no flash.
Lint/tsc/build/sync, changelog validate OK.

@caigee-cmd
caigee-cmd merged commit 8d6879a into main Oct 22, 2026
6 checks passed
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