Replace WinBox with native Vue scratchbook component#22095
Draft
dannon wants to merge 13 commits intogalaxyproject:devfrom
Draft
Replace WinBox with native Vue scratchbook component#22095dannon wants to merge 13 commits intogalaxyproject:devfrom
dannon wants to merge 13 commits intogalaxyproject:devfrom
Conversation
WindowManager now tracks open windows in a Map and serializes their metadata (title, url, position, size) to localStorage. On app startup, restore() reopens any previously saved windows at their last position/size. Saves are debounced to avoid thrashing during drag/resize. The original URL is stored before _build_url mangles it so hide_panels/hide_masthead params don't double-accumulate on restore.
Four Playwright/Selenium tests covering restore-after-reload, multiple windows, closed-not-restored, and partial-close scenarios.
Scratchbook iframes load the full Galaxy app with hide_masthead=true, which was triggering restore() inside the iframe, opening nested windows that would recurse infinitely. Only restore in the top-level app where the masthead is visible.
One progressive test instead of four separate ones, each doing their own uploads. Also adds debounce waits before reloads to fix the CI timing failures where saves hadn't flushed yet.
Replaces the plain JS WindowManager class with a reactive Pinia store that tracks window state, handles persistence to localStorage (ported from the persistent-scratchbook branch), and provides the same public interface (active, add, toggle, beforeUnload) so Galaxy.frame compat is straightforward.
Draggable, resizable floating window rendered with position:fixed and scoped styles matching the GModal aesthetic (rounded corners, white header, soft layered shadow, clean typography). Drag is delta-based via mousedown/mousemove on the header; resize via a bottom-right handle. Focus management uses an iframe overlay that passes through pointer events on the focused window.
App.vue now uses useWindowManagerStore and renders ScratchbookWindow components directly instead of delegating to the WinBox-based WindowManager class. Galaxy.frame still points to the store for backward compat with router-push, ContentItem, and ChatGXY. Masthead test updated to use a plain windowTab object instead of importing the old WindowManager.
Drop the winbox npm package, delete window-manager.js and windows.scss, remove the SCSS import from base.scss. Update navigation YAML selectors and Selenium test helpers to use the new .scratchbook-window class names. The core.windows.yaml tour still references #winbox-1 which will need a follow-up update.
Scratchbook iframes load Galaxy with hide_masthead=true. Without this guard, the inner App.vue would call restore(), read the parent's saved windows from localStorage, and create windows inside itself recursively. Gate both the store setup and window rendering on showMasthead.
Minimized windows collapse to just their title bar and stack horizontally along the bottom edge, matching WinBox's minimize behavior. Clicking a minimized window's header restores it.
Prevents windows from being dragged off-screen or resized beyond the viewport edges, matching WinBox's default boundary behavior.
The old #winbox-1 ID no longer exists now that WinBox has been replaced with a native Vue component.
github-actions
bot
added
area/UI-UX
area/testing
area/testing/selenium
area/client
labels
guerler
reviewed
Mar 15, 2026
| } | ||
|
|
||
| &.scratchbook-window-close:hover { | ||
| background: var(--color-red-100, #fee2e2); |
Contributor
There was a problem hiding this comment.
The color default should be in the theme imo.
guerler
reviewed
Mar 15, 2026
| </template> | ||
|
|
||
| <style scoped lang="scss"> | ||
| .scratchbook-window { |
Contributor
There was a problem hiding this comment.
We should probably use WindowManager consistently instead of Scratchbook. Over the past years me and others referred to this feature as the window manager, which fits better.
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
2 participants
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
ScratchbookWindowcomponent and Pinia storeDepends on #22088 — should be merged after that PR lands.
Still WIP, more polish and testing to come.