Skip to content

Refactor config editor UI; add cross-tab sync and batch plot download/preview#22

Open
afffe18 wants to merge 1 commit intocodex/2026-04-28_17-08-46-fix-dark-mode-inconsistenciesfrom
codex/2026-04-28_21-31-27-implement-ui-changes-for-plot-creation
Open

Refactor config editor UI; add cross-tab sync and batch plot download/preview#22
afffe18 wants to merge 1 commit intocodex/2026-04-28_17-08-46-fix-dark-mode-inconsistenciesfrom
codex/2026-04-28_21-31-27-implement-ui-changes-for-plot-creation

Conversation

@afffe18
Copy link
Copy Markdown
Collaborator

@afffe18 afffe18 commented Apr 28, 2026

Motivation

  • Improve the editor layout and controls for axis/layer selection and whitelist handling to match requested left/right grouping and inline toggles.
  • Make frame title editing multilingual by expanding other-language inputs when focusing the active title.
  • Prevent UI issues (darkmode grey panels, growing preview images) and add robust preview/create workflows and download options.
  • Keep a single shared config across browser tabs and make resolution/tab-name behavior more predictable.

Description

  • Reworked the multi-select component and usage so axis columns and layer whitelist lists show a header row with Select all / Deselect all, Expand / Collapse controls, and (for whitelist) a mode toggle inline; removed the old helper placeholder lines under those selectors, and applied the same header layout to axis controls. (edits in src/App.tsx)
  • Reorganized layer card layout to group key settings (name/linewidth/alpha) and moved whitelist keyword management to its own block with expand/select controls and a mode toggle, and added per-layer expanded state. (edits in src/App.tsx)
  • When the active-frame title input is focused the UI now expands to show title inputs for all other configured plot languages. (edits in src/App.tsx)
  • Persist plot config to localStorage and listen for storage events so multiple tabs on the same device share and synchronize the same config; added loading of cached config on startup. (edits in src/App.tsx and src/utils/configIo.ts)
  • Tightened resolution input handling to accept svg or a clamped integer between 30 and 999, and treat an empty numeric input as 0; fixed auto-tab-name collisions by escaping the dynamic regex prefix. (edits in src/App.tsx)
  • Removed grey translucent backgrounds in dark mode for primary config sections to avoid visual artifacts by switching to transparent dark backgrounds. (edits in src/App.tsx, small CSS adjustments)
  • Overhauled plot preview/download flow: top-level header buttons now trigger explicit preview current or create all actions, plot batching shows x of y Plots created progress, added a refresh button, and moved/added a single “Download all (.zip)” action in the Backend preview panel. (edits in src/App.tsx, src/components/PlotPage.tsx)
  • Stabilized preview image sizing to avoid progressive width growth by using h-auto max-w-full, and removed redundant per-panel create/preview buttons. (edits in src/components/PlotPage.tsx)
  • Implemented backend /api/download-plots which renders requested plots server-side and returns a ZIP archive of images, honoring export_file_name when present. (edits in backend/app.py)

Testing

  • Ran lint with npm run lint, which completed successfully.
  • Built the frontend with npm run build, which completed successfully.
  • npm run test:frontend did not run to completion in this environment due to the Node runtime not supporting the repository's --test-isolation=none flag.
  • npm run test:backend did not run in this environment because the test script expects a Windows virtualenv path that is not available here.

Codex Task

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant