Skip to content

fix(sidebar): suppress collapse->expand transition flash on fresh load#5306

Merged
waleedlatif1 merged 2 commits into
stagingfrom
fix/sidebar-boot-transition-flash
Jul 1, 2026
Merged

fix(sidebar): suppress collapse->expand transition flash on fresh load#5306
waleedlatif1 merged 2 commits into
stagingfrom
fix/sidebar-boot-transition-flash

Conversation

@waleedlatif1

Copy link
Copy Markdown
Collaborator

Summary

  • Opening a fresh tab into the workspace played a sidebar collapse → expand animation on load
  • The pre-paint script already sets the correct --sidebar-width, but store rehydration re-applies it a tick later during hydration, and the always-on width/slide transitions animate that re-apply — reading as a collapse → expand flash
  • Suppress sidebar transitions during the boot/hydration window via a new html.sidebar-booting class (mirrors the existing html.sidebar-resizing pattern), lifted after the first paint via double-requestAnimationFrame
  • User-driven collapse toggles and the fullscreen slide still animate normally; the guard doesn't re-run on soft navigation and cleans up its rAFs/class on unmount

Type of Change

  • Bug fix

Testing

Tested manually — fresh load no longer flashes the rail; collapse toggle and fullscreen slide still animate.

Checklist

  • Code follows project style guidelines
  • Self-reviewed my changes
  • Tests added/updated and passing
  • No new warnings introduced
  • I confirm that I have read and agree to the terms outlined in the Contributor License Agreement (CLA)

The pre-paint script sets the correct --sidebar-width, but store
rehydration re-applies it during hydration and the always-on width/slide
transitions animate that re-apply, reading as a collapse->expand flash.
Suppress sidebar transitions during the boot window via a new
html.sidebar-booting class (mirroring html.sidebar-resizing), lifted
after the first paint via double-rAF so user toggles and the fullscreen
slide still animate.
@vercel

vercel Bot commented Jul 1, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

1 Skipped Deployment
Project Deployment Actions Updated (UTC)
docs Skipped Skipped Jul 1, 2026 1:09am

Request Review

@cursor

cursor Bot commented Jul 1, 2026

Copy link
Copy Markdown

PR Summary

Low Risk
UI-only timing/CSS guard around first paint; no auth, data, or API changes.

Overview
Fixes a sidebar collapse → expand flash on a fresh workspace load when persisted width is re-applied during Zustand rehydration a tick after the pre-paint script already set --sidebar-width.

Adds an html.sidebar-booting guard in globals.css (same idea as html.sidebar-resizing) that disables width/transform transitions on the sidebar container and chrome shells during that window. WorkspaceChrome toggles the class in a mount-only useLayoutEffect before persist.rehydrate(), then clears it after a double requestAnimationFrame so normal collapse toggles and fullscreen slide animations still run afterward; cleanup cancels pending rAFs and removes the class on unmount.

Reviewed by Cursor Bugbot for commit 54bdb1d. Configure here.

@greptile-apps

greptile-apps Bot commented Jul 1, 2026

Copy link
Copy Markdown
Contributor

Greptile Summary

This PR suppresses the fresh-load sidebar transition flash. The main changes are:

  • Adds a sidebar-booting global class that disables sidebar transitions during hydration.
  • Applies the class from WorkspaceChrome before sidebar store rehydration.
  • Removes the class after the first paint with nested animation-frame callbacks.

Confidence Score: 5/5

This looks safe to merge.

  • No blocking issues found in the changed code.

Important Files Changed

Filename Overview
apps/sim/app/_styles/globals.css Adds transition suppression for the sidebar elements while the root has sidebar-booting.
apps/sim/app/workspace/[workspaceId]/components/workspace-chrome/workspace-chrome.tsx Adds the hydration boot guard lifecycle and imports useRef for animation-frame cleanup.

Reviews (1): Last reviewed commit: "chore(sidebar): convert boot-guard comme..." | Re-trigger Greptile

@waleedlatif1 waleedlatif1 merged commit fbcdcd0 into staging Jul 1, 2026
10 checks passed
@waleedlatif1 waleedlatif1 deleted the fix/sidebar-boot-transition-flash branch July 1, 2026 01:13
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