Skip to content

feat: dashboard global filter bar (#149 D3)#156

Merged
BorisTyshkevich merged 1 commit into
mainfrom
feat/dashboard-filters-d3-152
Jul 4, 2026
Merged

feat: dashboard global filter bar (#149 D3)#156
BorisTyshkevich merged 1 commit into
mainfrom
feat/dashboard-filters-d3-152

Conversation

@BorisTyshkevich

Copy link
Copy Markdown
Collaborator

What & why

Phase D3 of the Dashboard epic (#149 §6): a global filter bar over the
{name:Type} parameters detected across every favorited tile's SQL, sharing
the same persisted state.varValues the SQL Browser workbench already uses
(#134). Changing a value re-runs only the tiles that reference it. No new
parameter syntax, no schema change.

Builds on D1 (#150) and D2 (#151, merged), which introduced the .dash-toolbar
row this phase extends into a filter bar.

What changed

  • src/core/dashboard.jsdashboardParams(favorites): the union of
    every {name:Type} param across favorites' row-returning SQL, unique by
    name, first-appearance order. Pure, 100%-covered.
  • src/net/ch-client.jsqueryJson/queryDashboardTile gain an
    optional params argument forwarding param_<name> query-string args;
    backward compatible (existing call sites omit it).
  • src/ui/app.jsrunTile substitutes state.varValues via
    paramArgs, mirroring the workbench's run().
  • src/ui/dashboard.js — the bulk of the work:
    • the filter bar itself (.dash-filters, reusing the workbench's
      var-field/var-name/var-input classes), hidden entirely when no
      favorite has a param;
    • a ~500ms debounce on typing, with Enter/blur committing immediately;
    • re-running only the tiles whose SQL references the changed param name;
    • per-tile unfilled-param gating: a tile with an empty value never calls
      runTile — it shows an "Enter a value for: …" placeholder instead
      (excluded from the "N not shown" tally);
    • a refactor from append/remove tile cards to stable per-favorite slots
      updated in place (loading/unfilled/error/chart), since a filter edit can
      flip a tile's classification repeatedly and removing/re-appending nodes
      would reorder the grid and lose identity;
    • a per-slot generation counter so a superseded in-flight response can never
      overwrite a newer edit's result;
    • every slot is marked loading immediately when a full Refresh starts
      (rather than only the tiles within TILE_CONCURRENCY's window), and a
      tile that flips chart → skip clears its old chart DOM instead of leaving
      a hidden, already-destroyed canvas around — both caught by an 8-angle
      parallel code review during this PR and fixed + regression-tested.
  • src/styles.css.dash-filters, .dash-tile-unfilled.
  • Tests extended across tests/unit/dashboard.test.js,
    tests/unit/ch-client.test.js, tests/helpers/fake-app.js.

Reconciled

Verified live

Manually verified against a real ClickHouse server (antalya, 26.3.10):
favorited 3 Library queries (two sharing {min:UInt32}, one with no param);
opened the dashboard with min unset — the two tiles showed the "Enter a
value for: min" placeholder, the unrelated tile ran immediately; filled
min=30 and blurred — only the two affected tiles re-ran (chart data shifted
to reflect the new filter), the unrelated tile was untouched; reloaded the
SQL Browser workbench and confirmed its variable strip picked up the
dashboard-set value (shared state.varValues).

Checklist

  • npm test passes (the per-file coverage gate is non-negotiable) — 1467 tests, src/core/dashboard.js at 100/100/100/100
  • Tests added/updated in the same change as the code
  • npm run build succeeds (single-file dist/sql.html)
  • Layers kept honest: pure logic in src/core/, network in src/net/ (injected fetch), DOM in src/ui/
  • No new runtime dependency
  • README / CHANGELOG.md ([Unreleased]) updated
  • Reconciled affected tracked work (roadmap Roadmap to 1.0.0 #68, the issue body, CHANGELOG)

🤖 Generated with Claude Code

https://claude.ai/code/session_01GyLqZGyUkm7mP6WhZCkodj

Add a filter bar over every {name:Type} param detected across favorited
tiles' SQL, sharing state.varValues with the SQL Browser workbench (#134).
A debounced (Enter/blur-bypassed) edit re-runs only the affected tiles;
an unfilled param blocks that tile with a placeholder instead of running.
Refactors dashboard tiles to stable per-favorite slots updated in place
(loading/unfilled/error/chart) with a per-slot generation counter, so a
filter edit can flip a tile's state repeatedly without reordering the
grid or racing a stale response. Threads an optional params arg through
ch-client.js's queryJson/queryDashboardTile (backward compatible).

Closes #152.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01GyLqZGyUkm7mP6WhZCkodj
@BorisTyshkevich BorisTyshkevich merged commit 89e62c5 into main Jul 4, 2026
6 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant