Repository navigation
feat(app): peek the closed sidebar on hover - #58156
Conversation
![opencode-agent[bot]](https://avatars.githubusercontent.com/in/1549082?s=60&v=4){kind=small}
There was a problem hiding this comment.
Looks good. I ran the app dev server for both base and this branch with Playwright against a local backend, using Side tabs. On base, hovering the closed toggle only shows its tooltip. With this change there's no peek at 250ms, then at about 850ms the sidebar opens as a floating card and the layout doesn't move. It stays open when the pointer moves into it and closes when the pointer moves well away. The closed toggle shows the hamburger icon. I didn't exercise the unread dot, menus, drag, typing, focus-out, Escape or RTL. typecheck and the src/shell unit tests pass.
Public API: unchanged. This is app-only UI: a local experiment switch, one i18n string and some internal data-slot attributes.
One small issue: turning the experiment off doesn't end an open peek. See the inline comment.
| createEffect(on(input.open, (open) => open && end(), { defer: true })) | ||
|
|
||
| createEffect(() => { | ||
| if (!sidebarPeekEnabled()) end() |
There was a problem hiding this comment.
sidebarPeekEnabled() returns a plain knob field, not a signal. So this effect runs once on creation and never again, and turning the experiment off while a peek is open won't call end(). sidebar-toggle.tsx handles this with motionTuning.subscribe. You could do the same here, e.g. onCleanup(motionTuning.subscribe(() => !sidebarPeekEnabled() && end())), or drop the effect.
Issue for this PR
Closes #
Type of change
What does this PR do?
With the left sidebar closed, resting on its toggle shows the sidebar as a floating panel over the app. The layout doesn't move. It uses the real sidebar, so every control in it works. It's behind a new Peekable sidebar toggle in the Experiments tab, on by default.
pointermove,wheel,scroll, when the pointer leaves the window, and every 150ms. After the pointer leaves the box, the panel waits 100ms before closing, so a short overshoot doesn't close it. An open menu, a held pointer button or drag, and typing in a sidebar field all keep it open. Escape closes it, and so does keyboard focus moving out. Docking ends the peek.--v2-elevation-floatingand slides in from the start edge on a 0.15s spring with no bounce. With reduced motion it appears instantly.menu(hamburger) icon, cross-fading withlayout-left-full. Its tooltip is off while the sidebar is closed so it doesn't cover the peek. If any sidebar session other than the current one would show its unread dot, the icon gets an accent dot. The vertical tab strip already tracks per-row unread state, and it now reports that to the toggle. The aria-label then reads "Toggle sidebar, unread sessions".Known gaps:
How did you verify your code works?
Playwright against the web app on an OpenCode Drive server, with vertical tabs. Checked: the hover delay, moving into the panel keeps it open, closing on a jump out or past the 15px slack (but not on a short overshoot), Escape, click-to-dock, and that the main area doesn't shift. James also tried it in the web app.
Screenshots / recordings
None attached.
Checklist