Rework the Library popover: usable default size, search auto-expand, drag-resizable height - #247
Open
OmarB97 wants to merge 11 commits into
Open
Rework the Library popover: usable default size, search auto-expand, drag-resizable height#247OmarB97 wants to merge 11 commits into
OmarB97 wants to merge 11 commits into
Conversation
Rigged models (from the rigging extensions, or any GLB with clips) render frozen in bind pose today: the viewer loads the glTF but never creates an AnimationMixer, so the clips it just parsed never run. That reads as a failed rig rather than a missing feature. Create a mixer for models that carry clips, tick it from useFrame, and dispose it with the model. When a file carries more than one clip, offer a small picker so each motion can be reviewed without leaving the app. Co-Authored-By: Claude Fable 5 <[email protected]>
Asset rows now render their pre-rendered <name>.thumb.png beside the filename instead of showing bare text, falling back to the existing text-only row when no thumbnail exists. The Library panel can also be resized by dragging its edge, with the chosen width persisted across restarts.
…' into feat/desktop-ergonomics
npm ci fails on main because the committed lockfile is stale against package.json; npm install (what upstream CI itself falls back to) brings it back in sync. Committing the result so ci is usable again on this branch. Co-Authored-By: Claude Fable 5 <[email protected]>
Ctrl/Cmd with +, -, or 0 now scales the whole window like a browser, clamped to [-2, 4] and persisted to <userData>/ui-zoom.json so it survives restarts. This extends the existing before-input-event handler (where the macOS quit shortcut already lives) and calls webContents.setZoomLevel directly, deliberately not CSS zoom: a CSS transform scales the rendered pixels without telling the 3D viewport, so pointer math there (raycasting, gizmo dragging) goes wrong as soon as the page is scaled. Co-Authored-By: Claude Fable 5 <[email protected]>
The panel's resize handle was a 1px strip with no resting affordance — easy to miss entirely. Widen it to 2px with a visible resting tint plus a stronger hover/active highlight, mark it up as a proper separator (role, aria-orientation, title) matching the Library panel's handle, raise the width cap from 520 to 900 so wide parameter forms have room, and persist the chosen width to localStorage (modly-panel-width) the same way the Library panel already remembers its own width. Co-Authored-By: Claude Fable 5 <[email protected]>
- Parameter labels used a truncating 5rem column that clipped anything longer than a couple of words; widen it to 8rem and let it wrap. - The prompt textarea was a fixed 3-row, non-resizable box; make it 14 rows by default and user-resizable (resize-y, 14rem min-height). - Say plainly which Generate inputs are required vs optional: "Your sketch or photo -- required" and "Extra details -- optional". - Add a text param type (a plain input, unlike the existing string type folder picker) so free-text fields like the exporter new name, project, and tags params render as usable text boxes instead of falling through to a numeric input. - Render clickable tag-suggestion pills beneath any tags param: slugified words from that node typed name/project fields, plus a small fixed game-asset vocabulary, deduped and capped at 10. Clicking a pill toggles it in the comma-separated value; no network calls. Co-Authored-By: Claude Fable 5 <[email protected]>
The clip picker was a raw select mounted via drei Html at the model origin, recreating the whole AnimationMixer every time the clip changed (a hard cut, not a blend) and easy to lose behind the scene. Replace it with a proper bottom-left overlay component (MotionBar), matching the existing ViewerToolbar/stats-overlay idiom: - The mixer and active AnimationAction now live for as long as the model does; switching clips fades the old action out and the new one in over 0.25s instead of recreating anything. - GltfMeshModel reports its clip list up to Viewer3D (the same onStats/onObject callback pattern already used here), which owns the active index and renders MotionBar as a plain sibling of the Canvas. - Zero clips renders nothing, exactly one clip shows its name read-only, more than one gets a labelled dropdown plus a Next button that cycles with a cross-fade. All playback loops. Co-Authored-By: Claude Fable 5 <[email protected]>
The built-in exporter named every file export-<epoch-ms>.glb, so a folder of work told you nothing. Add three optional params: model_name (used to slug the file name, falling back to a dated model-YYYY-MM-DD-HHMM name), project (files land under Exports/<project-slug>/ so a game groups together instead of one long list), and tags. Output is always <slug>-<4-char-unique>.<ext> so re-exports never collide. Tags are the operator typed list plus what the file itself can tell: rigged (has skins), animated plus clip-<name> per animation, textured, and one of low-poly/mid-poly/high-poly by triangle count, plus the project slug. Tags are written both as a <file>.tags.json sidecar and embedded under the glTF asset extras (extras.modly), so they travel with the file either way. Ported from the already-working implementation at /mnt/tank/modly/app/extracted/resources/builtin-extensions/mesh-exporter on the operator machine. Co-Authored-By: Claude Fable 5 <[email protected]>
The agent had no idea what was actually on screen beyond a mesh path and triangle count -- it couldn't tell you which clip was playing, what the model was named, or what game it belonged to. Extend both ends of that pipeline: - ChatPanel now mirrors the viewer's selected clip and full clip list (Viewer3D reports them into appStore alongside the existing meshStats/meshSelected pattern) into the /agent/chat context, so requests like "make the stroll slower" resolve without re-asking. - agent.py resolves the current mesh's name/project/tags from its .tags.json sidecar, falling back to the GLB's own embedded extras.modly when no sidecar exists, and renders them into the system prompt in the same style as the existing scene-context lines. Lineage: when mesh-exporter's input traces back to an existing workspace asset, record derived_from in the sidecar -- the source's workspace- relative path plus its name if it had one. The workflow runner threads a sourceAssetPath through NodeOutput/ProcessInput from wherever a mesh first resolves (the Load 3D Mesh node) down to whichever node eventually exports, so multi-step chains still carry it. Re-deriving from an already -derived asset keeps just the immediate parent plus the chain's root (read from the parent's own derived_from, if any) instead of growing an unbounded list. Surfaced in the chat context alongside name/project/tags. Also fixes an open question: the rig-and-animate extension's "Describe the movement" param sets multiline: true, a flag ParamField never checked -- it fell into the plain "string" case and rendered as a single -line input with a stray folder-browse button. ParamField now renders any multiline-flagged param as a resizable textarea (matching the existing "Extra details" box), independent of its base type. Co-Authored-By: Claude Fable 5 <[email protected]>
Search now force-expands every section that contains a match instead of requiring a manual Show click per group, and clearing the query falls straight back to whatever was collapsed before (collapsedSectionKeys is never mutated by the search itself). The listing area now flexes to fill a resizable popup instead of being capped at max-h-64 (roughly 3-4 rows) - a new bottom-edge drag handle mirrors the existing width handle, with its own clamp/persist pair so the height survives restarts the same way the width already does. Also fixes the search input rendering as an oversized box with the placeholder vertically centered in the middle of it - a known Chromium input[type=search] quirk, fixed with appearance-none like the rest of the app's inputs effectively already assume.
This was referenced Jul 28, 2026
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.
Builds on feat/chat-context-lineage (PR #246, still open), which itself builds on feat/desktop-ergonomics (PR #245) -- same head-branch-per-PR-against-main pattern as #242/#243/#244/#246. Scoped entirely to the Library popover in the Generate area; doesn't touch anything #246 changed.
Problem
The Library popover from #243/#245 works, but the operator flagged it as unusable in real sessions:
max-h-64(256px) -- with the 80px thumbnail tiles from Add Library thumbnail previews and a resizable panel #243, that's only 2-3 visible rows, in a popup that itself doesn't grow past its content.<input type="search">renders as a tall box with the placeholder vertically centered in the middle of it, instead of a normal single-line field -- a Chromiuminput[type=search]quirk this codebase never worked around (every other input in this file istype="number"/type="text"-shaped and unaffected).Changes
isAssetLibrarySectionExpanded(collapsedSectionKeys, sectionKey, hasActiveSearch)inassetLibraryUi.tsrenders a section expanded when either the user left it expanded or a search is active.collapsedSectionKeysitself is never touched by searching, so clearing the query falls straight back to whatever was collapsed before -- no extra state to keep in sync. The per-section Show/Hide toggle is disabled while a search is active (every visible group already only contains matches, so toggling it would be a dead click that silently changes post-clear state).flex-1 min-h-0 overflow-y-auto overflow-x-hiddeninside a popup with an explicitheight(from state), rather than a fixedmax-h-64inside a content-sized popup. The three loading/empty/no-match placeholder states get the sameflex-1treatment so the popup doesn't collapse to a sliver when there's nothing to show.cursor-row-resize, bottom edge) plusclampAssetLibraryPanelHeight/getStoredAssetLibraryPanelHeight/storeAssetLibraryPanelHeightinassetLibraryUi.ts, same shape as the width triple, under its ownmodly-library-panel-heightlocalStorage key. Min/max/default: 280/1000/860.py-2->py-1.5. With 80px tiles, even an 860px-tall popup (near the practical ceiling for a 1080p window before it risks running off-screen) only fits ~4 rows -- nowhere near "a dozen." Shrinking the tile is the only way to reconcile "keep thumbnail tiles" with "usable default size"; everything else about the tile (rounding, border,object-contain) is unchanged. At the new size the default popup shows 8-9 full rows before scrolling.appearance-noneto thetype="search"field, matching the plain box model every other input in this file already gets natively.truncate/shrink-0pairing with its capability badge, so a long filename could overflow the row width and force the scroll container intooverflow-x: auto(a real single-row case reproduced a visible horizontal scrollbar during verification, sitting right below the intended vertical-only scrollbar). Addedtruncateto the name andshrink-0to the badge, plus explicitoverflow-x-hiddenon the list container as a backstop.Files changed
src/areas/generate/assetLibraryUi.ts--isAssetLibrarySectionExpanded; height clamp/get/store triple + constants.src/areas/generate/GeneratePage.tsx-- popup height state/effect/drag handler; search-aware expand + disabled toggle wiring; flex-based list region; smaller thumbnail/tighter row padding;appearance-noneon the search input; truncate/shrink-0 on the row text row.src/areas/generate/assetLibraryUi.test.ts-- tests for the new height helpers andisAssetLibrarySectionExpanded(searching forces expansion; clearing falls back to the untouched collapsed-key list).Verification
Built, packaged (
npm run package, AppImage target), and installed the same way the currently-running build was installed (asar extracted intoresources/app, original parked asapp.asar.orig), replacing the running app on the operator's desktop.localStorage(first-run state), opened the popup and expanded Workflows > Mesh: all 9 entries in that group render fully visible with no scrolling, plus the next group's header peeking in -- up from 2-3 clipped rows before this change.npm run lintandnpm test(23 Python + 40 Node, including the 3 new assetLibraryUi tests) both pass.Test plan
npm run lintnpm testnpm run buildnpm run package(AppImage) + real install + manual verification on the desktop app