UI: doc count in DB dropdown and overview only updates on full page refresh #18

New issue

Closed

opened 2026-04-27 13:15:16 +00:00 by rawan · 1 comment

rawan commented

2026-04-27 13:15:16 +00:00

Member

Bug

In the hero_indexer dashboard, the document count shown in:

the DATABASES dropdown (e.g. mydb (3 docs)), and
the Database Overview panel (Documents, Size, Segments)

only updates after a full page refresh. Adding documents via the UI updates the SERVER STATS widget (Total Docs) on its 5-second interval, but the dropdown label and the overview pane stay stale until the page is reloaded.

Expected

Both the dropdown labels and the overview pane should reflect the current state on the same auto-refresh cadence as SERVER STATS.

Root cause

In crates/hero_indexer_ui/static/index.html, only updateServerStatus and refreshStats are on the 5s setInterval. loadDatabases() (which renders the (N docs) labels) and the inline overview-render block (inside the db-selector change handler) are never re-invoked after the initial load.

Affected file

crates/hero_indexer_ui/static/index.html

## Bug In the hero_indexer dashboard, the document count shown in: - the **DATABASES** dropdown (e.g. `mydb (3 docs)`), and - the **Database Overview** panel (`Documents`, `Size`, `Segments`) only updates after a full page refresh. Adding documents via the UI updates the **SERVER STATS** widget (`Total Docs`) on its 5-second interval, but the dropdown label and the overview pane stay stale until the page is reloaded. ## Expected Both the dropdown labels and the overview pane should reflect the current state on the same auto-refresh cadence as `SERVER STATS`. ## Root cause In `crates/hero_indexer_ui/static/index.html`, only `updateServerStatus` and `refreshStats` are on the 5s `setInterval`. `loadDatabases()` (which renders the `(N docs)` labels) and the inline overview-render block (inside the `db-selector` change handler) are never re-invoked after the initial load. ## Affected file - `crates/hero_indexer_ui/static/index.html`

rawan self-assigned this

2026-04-27 13:15:39 +00:00

rawan commented

2026-04-27 13:16:00 +00:00

Author

Member

Fix

Applied to crates/hero_indexer_ui/static/index.html:

Extracted the DB overview render out of the anonymous db-selector change handler into a named function loadDatabaseOverview(db) so it can be reused by the auto-refresh interval. The change handler now just calls await loadDatabaseOverview(db).
Added a third 5s interval in the DOMContentLoaded initializer that:
- calls loadDatabases() — the existing implementation already preserves the user's current selection (prev = selector.value) while re-rendering each option's (N docs) label, so the dropdown updates without dropping the selection;
- if a database is currently selected, calls loadDatabaseOverview(currentDb) to refresh the right-pane Documents / Size / Segments numbers and the schema table.

setInterval(() => {
    loadDatabases();
    const db = document.getElementById("db-selector").value;
    if (db) loadDatabaseOverview(db);
}, 5000);

Why this approach

Keeps the existing 5s cadence already used by updateServerStatus and refreshStats, so all dashboard widgets stay consistent.
loadDatabases() was already selection-safe; no extra state needed.
Extracting loadDatabaseOverview removes the duplication that previously made it impossible to refresh the overview without simulating a selector change event.

Verification

cargo check -p hero_indexer_ui passes.
After adding documents via the UI, the dropdown's (N docs) and the overview's Documents count both update within 5s without a page reload.

## Fix Applied to `crates/hero_indexer_ui/static/index.html`: 1. **Extracted the DB overview render** out of the anonymous `db-selector` `change` handler into a named function `loadDatabaseOverview(db)` so it can be reused by the auto-refresh interval. The change handler now just calls `await loadDatabaseOverview(db)`. 2. **Added a third 5s interval** in the `DOMContentLoaded` initializer that: - calls `loadDatabases()` — the existing implementation already preserves the user's current selection (`prev = selector.value`) while re-rendering each option's `(N docs)` label, so the dropdown updates without dropping the selection; - if a database is currently selected, calls `loadDatabaseOverview(currentDb)` to refresh the right-pane `Documents` / `Size` / `Segments` numbers and the schema table. ```js setInterval(() => { loadDatabases(); const db = document.getElementById("db-selector").value; if (db) loadDatabaseOverview(db); }, 5000); ``` ### Why this approach - Keeps the existing 5s cadence already used by `updateServerStatus` and `refreshStats`, so all dashboard widgets stay consistent. - `loadDatabases()` was already selection-safe; no extra state needed. - Extracting `loadDatabaseOverview` removes the duplication that previously made it impossible to refresh the overview without simulating a selector change event. ### Verification - `cargo check -p hero_indexer_ui` passes. - After adding documents via the UI, the dropdown's `(N docs)` and the overview's `Documents` count both update within 5s without a page reload.

rawan referenced this issue

2026-04-27 13:24:48 +00:00

fix: hot reloading for documents count #19

rawan closed this issue

2026-04-27 13:54:34 +00:00