dotCMS / dotCMS/core

Dev tools consistency: remove dark mode from velocity-playground and persist last query across query-tool, es-search, and velocity-playground

Open
#36,692 1 comment 0 reactions 1 assignee View on GitHub

@AP2300 is already working on this.

Since Jul 22, 2026.

Team : Modernization Type : Task
Dominant language
Java
Stars
970
Forks
486
Avg merge
3d 33m
Merged PRs (30d)
170

Description

Description

Two consistency gaps across the migrated dev-tool portlets — dot-query-tool, dot-es-search, and dot-velocity-playground — that should be addressed together so the three portlets behave uniformly.

1. Remove dark mode from dot-velocity-playground

Only dot-velocity-playground ships a dark theme toggle; the other two dev tools do not. This creates an inconsistent UX across otherwise-sibling portlets. Remove the dark mode from dot-velocity-playground so all three follow the platform's default theming.

2. Persist the last query per portlet — homogeneous across the three

Users lose their in-progress work when they leave and return to any of these portlets. Dev-tool queries (Lucene, ES JSON, VTL) are complex and time-consuming to recompose, so the last query should be restored when the user comes back to the portlet.

Deliver a single, shared implementation used by all three portlets, backed by localStorage. dot-velocity-playground already persists splitter ratio and history via localStorage (readJson / writeJson utilities in dot-velocity-playground.utils.ts) — extract that pattern into a shared location and reuse it across the three portlets.

Suggested approach

  • Promote the persistence utilities (or wrap them as a withPersistedQuery() SignalStore feature) into libs/data-access/ or libs/ui/ so all three portlets consume the same helper.
  • Key naming convention: dotcms.devtools.{portlet}.lastQuery (e.g. dotcms.devtools.query-tool.lastQuery).
  • Debounce writes (~300 ms) while the user is typing.
  • Load and restore the last query on portlet init.
  • Provide an explicit "Clear" action per portlet that removes the stored value.
  • Per-portlet payloads:
    • dot-query-tool: Lucene query string (+ minimal filters if any).
    • dot-es-search: ES query JSON.
    • dot-velocity-playground: VTL body — reconcile with existing history/splitter storage, do not duplicate.
Acceptance Criteria
  • Dark mode / dark theme toggle is removed from dot-velocity-playground (UI, config, and any related code paths).
  • All three portlets (dot-query-tool, dot-es-search, dot-velocity-playground) render with the same default theming; no portlet-specific theme switch remains.
  • A shared persistence helper exists in a shared lib (libs/data-access/ or libs/ui/) — not duplicated per portlet.
  • Each of the three portlets restores the last query on load from localStorage.
  • Each portlet saves the current query to localStorage on change (debounced ~300 ms).
  • Each portlet exposes a "Clear" action that removes the stored value.
  • Storage keys follow the convention dotcms.devtools.{portlet}.lastQuery.
  • dot-velocity-playground existing localStorage usage (history, splitter ratio) is reconciled with the new helper — no duplicated storage for the same data.
  • Unit tests cover: load-on-init, save-on-change (debounced), clear action, and corrupt / missing storage value handling.
  • Manual QA: reload the browser after typing a query in each portlet and confirm the query is restored.
Priority

Medium — quality-of-life fix for power users of the dev tools; not blocking.

Additional Context

Existing persistence pattern to draw from: libs/portlets/dot-velocity-playground/src/lib/dot-velocity-playground.utils.ts (readJson, writeJson, HISTORY_STORAGE_KEY, SPLITTER_STORAGE_KEY).

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.