49 lines
2.2 KiB
Markdown
49 lines
2.2 KiB
Markdown
# 064 — Typing a panel's PromQL query gets clobbered by in-flight autosave responses
|
|
|
|
## Summary
|
|
|
|
In `webapp/src/components/Dashboards.tsx`, the panel query `<input>`
|
|
(`:408-411`) is bound directly to `draft.panels[...].promql` /
|
|
`updatePanel`, and `draft` is autosaved via a 600ms-debounced effect
|
|
(`AUTOSAVE_DEBOUNCE_MS = 600`, line 34; effect at `:190-214`). On save
|
|
success, `setDraft(saved)` (`:203`) unconditionally replaces the entire
|
|
local draft with the server's response — including whatever `promql`
|
|
string was in flight at request time. If the user types more characters
|
|
after the debounce fires but before the save response returns, those
|
|
keystrokes exist only in local `draft` state and get overwritten the
|
|
instant the stale `saved` response resolves, producing the reported
|
|
"characters inserted then removed" behavior. A second effect
|
|
(`Dashboards.tsx:184-188`) also resets `draft` whenever `dashboards`
|
|
changes — which the same save's `setDashboards` call triggers —
|
|
compounding the race.
|
|
|
|
## Scope
|
|
|
|
- Stop unconditionally overwriting in-flight-edited fields on autosave
|
|
response. Options (pick one, document the choice):
|
|
- Track which panel/field is actively focused/being edited and skip
|
|
overwriting that specific field when reconciling `saved` into
|
|
`draft`.
|
|
- Only merge server-assigned fields (ids, timestamps) from `saved`
|
|
into `draft` rather than replacing `draft` wholesale.
|
|
- Guard the reconciliation with a "pending edits since request was
|
|
sent" check, applying `saved` only when no newer local edit
|
|
occurred after the request was issued.
|
|
- Also fix the related staleness effect at `Dashboards.tsx:184-188` so
|
|
it doesn't clobber in-progress edits when `dashboards` changes as a
|
|
side effect of the same save.
|
|
- This does not require adopting Redux or another state library — the
|
|
fix is local to this component's save/edit reconciliation.
|
|
|
|
## Acceptance criteria
|
|
|
|
- Typing continuously in a panel's PromQL input while an autosave
|
|
round-trip is in flight never drops or reorders characters.
|
|
- Autosave still persists the query to the backend and other
|
|
server-assigned fields (ids, etc.) still get reconciled into local
|
|
state correctly.
|
|
|
|
## Depends on
|
|
|
|
None.
|