Always collapsable sidebar. More space in the window

[thetanav]

What Changed

Made the sidebar collapsable, also in settings page, make the message compoenent, like the assistant message with copy button outside the div, and also reduced the spacing in chat header button that looks neat.

Why

This are ui changes and below is the screenshots of changes

UI Changes

New

Old

Checklist

• This PR is small and focused
• I explained what changed and why
• I included before/after screenshots for any UI changes
• I included a video for animation/interaction changes

---

Note

Low Risk
UI-only changes to sidebar toggling and chat message/header controls; low risk aside from potential layout/regression across breakpoints (mobile vs desktop) due to new useSidebar()-based visibility logic.

Overview
Makes the sidebar consistently collapsible by standardizing SidebarTrigger styling/behavior and removing breakpoint-only visibility, while updating headers (chat, settings, no-active-thread, sidebar chrome) to show the toggle only when the sidebar is currently closed.

Tweaks chat UI: reduces header action spacing, adjusts primary project-script button sizing, and repositions user-message actions (copy/revert) below the bubble with hover/focus fade-in; copy buttons default to ghost styling. Mostly formatting-only cleanup elsewhere (e.g. timestampFormat.ts, MessagesTimeline.tsx).

^{Reviewed by Cursor Bugbot for commit 7431783. Bugbot is set up for automated code reviews on this repo. Configure here.}

Note

Make sidebar collapsable at all breakpoints and show trigger only when sidebar is closed

• The SidebarTrigger is now always visible in the sidebar header (not just on mobile), and toggles between left/right panel icons based on open state.
• In the chat header, settings layout, and no-active-thread state, the trigger is rendered only when the sidebar is closed, replacing breakpoint-based (md:hidden) visibility logic.
• User message action buttons (copy, revert) are moved outside the message bubble, use ghost styling, and reveal on row hover/focus; timestamps are smaller and lower contrast.
• The MessageCopyButton default variant changes from outline to ghost.

^{Macroscope summarized 7431783.}

[coderabbitai]

Important

Review skipped

Auto reviews are disabled on this repository. Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro

Run ID: fe1d89a5-d6ad-41d8-807c-afabe2098007

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

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

[macroscopeapp]

Approvability

Verdict: Approved

UI polish changes making the sidebar collapsible on all screen sizes (not just mobile) with minor styling tweaks. Most of the diff is code formatting. The open review comment identifies a minor visual inconsistency but no functional issues.

^{You can customize Macroscope's approvability policy. Learn more.}

[cursor]

Cursor Bugbot has reviewed your changes and found 1 potential issue.

^{❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.}

^{Reviewed by Cursor Bugbot for commit 7431783. Configure here.}

[cursor]

Button group height mismatch after size change

Medium Severity

The primary script button's size changed from "xs" to "sm", but the adjacent dropdown trigger in the same Group still uses size="icon-xs". Previously both had matching heights (xs: h-7/sm:h-6, icon-xs: size-7/sm:size-6). Now "sm" renders at h-8 (sm:h-7) while "icon-xs" remains at size-7 (sm:size-6), creating a visible height mismatch within the button group. The other header action buttons (terminal and diff toggles) also still use size="xs", making the script button visually inconsistent with its neighbors.

 

^{Reviewed by Cursor Bugbot for commit 7431783. Configure here.}

[thetanav]

this is a really cool pr pls take a look @juliusmarminge