🤖 feat: add auto-hide sidebar setting#3367
Open
Neppkun wants to merge 1 commit into
Open
Conversation
Adds an 'Automatically hide sidebar' toggle under Settings -> General -> Appearance. When enabled, the left sidebar renders collapsed by default and expands on hover (reusing the existing transition-[width] duration-200 animation). When disabled, behavior reverts to the user-toggled sidebarCollapsed state. The setting is persisted to ~/.mux/config.json end-to-end, mirroring the chatTranscriptFullWidth flow.
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.
Summary
Adds an Automatically hide sidebar toggle in Settings → General → Appearance, directly below Theme. When enabled, the left sidebar renders collapsed by default and only expands while the cursor is over it, reusing the existing
transition-[width] duration-200animation. When disabled, behavior reverts to the current user-toggledsidebarCollapsedstate. The preference is persisted to~/.mux/config.jsonend-to-end — backend reader/writer, oRPCgetConfig+ dedicatedupdateAutoHideSidebarroute,onConfigChangedfan-out, and a localStorage mirror for flash-free synchronous reads at boot — mirroring thechatTranscriptFullWidthflow exactly.Background
The left sidebar is a useful workspace navigator but takes up screen real-estate that some users (especially on smaller displays or when focused on a single workspace) would rather reclaim while keeping the sidebar one mouse-flick away. The existing manual collapse hotkey/toggle is per-window state; this adds a persistent "auto" mode so users don't have to remember to expand/collapse it on every context switch.
Patterned after #3350 (full-width chat transcript) so the persistence/sync model is identical and easy to review.
Implementation
appConfigOnDisk.ts,common/types/project.ts): new optionalautoHideSidebar?: boolean.node/config.ts): reader parses the new key viaparseOptionalBoolean; writer follows the "only persist when true" convention so disabling the toggle removes the key from disk entirely.common/orpc/schemas/api.ts,node/orpc/router.ts):getConfigechoesautoHideSidebar; newupdateAutoHideSidebarroute uses the sharedbooleanToggleRouteschema.onConfigChangedfan-out covers cross-window sync generically.browser/hooks/useAutoHideSidebar.ts): verbatim mirror ofuseChatTranscriptFullWidth— seeds from localStorage to avoid a flash on boot, refreshes viagetConfig, subscribes toonConfigChanged, and uses afetchVersionnonce so Settings writes can't be clobbered by an in-flightgetConfig.browser/App.tsx): the persistedsidebarCollapsedis intentionally not overwritten while auto-hide is on. Instead,App.tsxcomputeseffectiveSidebarCollapsed = autoHideSidebar ? !sidebarHovered : sidebarCollapsedand passes that to<LeftSidebar>. This way the user's manual collapse preference is preserved for when auto-hide is later turned off.browser/components/LeftSidebar/LeftSidebar.tsx): new optionalautoHideEnabled+onHoverChangeprops attachonMouseEnter/onMouseLeaveto the outer sidebardivonly when auto-hide is on. The existingtransition-[width] duration-200animates the resulting width change for free — no JS animation needed.features/Settings/Sections/GeneralSection.tsx): new Switch row directly below Theme, with its own load-nonce + serialized update chain, exactly matching the chat-transcript pattern already in this file.Edge cases
onMouseEnter/Leavedon't fire on touch, so the toggle is effectively a no-op on mobile — mobile already auto-collapses via the existingisMobileseed and overlay backdrop.getConfigresolves.Validation
make typecheck✅make lint✅make static-check✅ (exit 0)src/common/config/schemas/appConfigOnDisk.test.ts(new flag happy-path + string-rejection)src/node/config.test.ts(round-trip persist ontrue, drop key onfalse, ignore invalid)src/node/orpc/router.test.ts(updateAutoHideSidebar+getConfig+ on-disk loader)src/browser/hooks/useAutoHideSidebar.test.tsx(8 cases mirroringuseChatTranscriptFullWidth)src/browser/features/Settings/Sections/GeneralSection.test.tsx(loads + persists the new toggle)~/.mux/config.json;autoHideSidebar: trueappears in the JSON when enabled and is removed when disabled.Risks
Low.
parseOptionalBoolean, writer usespassthrough-friendly partial object).autoHideEnabled, so when the feature is off the<LeftSidebar>tree is byte-identical to today.sidebarCollapsedvalue is deliberately preserved while auto-hide is on, so disabling the toggle returns the user to exactly the manual collapse state they had before.Generated with
mux• Model:anthropic:claude-opus-4-7• Thinking:high• Cost:$9.51