Toolbars: sm-toolbar and icon-toolbar are now one 34px box with 10px
padding, per-page overrides are gone, and controls sit 8px apart across
Logs, Metrics and Traces.
Contrast: darken the default primary to #5A64DB so white labels pass
4.5:1, use primary-700 for active tabs, raise label and muted text, log
punctuation and dark pagination, and replace opacity on text with tokens.
Components: 28px table footer and row actions, matching button and input
borders, stat tile padding, one-row Alerts tiles with stacked labels,
centred header checkbox, and aligned Settings fields.
## What this is
Database Monitoring: an aggregation and presentation layer over
telemetry OpenObserve already ingests. It reads three vantages — client
spans, server-vantage logs, and collector metrics — and turns them into
per-statement, per-instance and per-database views.
No new storage engine and no new ingest path. Statements are normalized
and rolled up into a stats stream, and the read API queries that stream
through the existing search path.
## Shape of the change
| | |
|---|---|
| Read endpoints | 17 |
| UI pages | 8 (plus a shell) |
| Commits | 141 |
**Backend** — `src/core/src/db_monitoring/` holds the non-HTTP half
(normalization, rollup, server-vantage parsing). The read API lives in
`src/api/management/src/request/db_monitoring/` as a handler / models /
service trio; the service layer is split one file per feature.
**Frontend** — `web/src/views/DatabaseMonitoring/`, with shared logic in
`web/src/composables/dbm/`.
## Feature availability
Databases, queries, query detail and history, endpoints, samples,
activity, insights, plans, server metrics, server queries, server
samples, instances, instance metrics, badges — is available in OSS.
## Reviewing this
It is a large diff, and most of it is additive: 327 files, and the two
largest non-test files are the shared service module and the deadlocks
service. Suggested order:
1. `src/api/management/src/request/db_monitoring/handler.rs` — the 17
entry points and their gating
2. `src/api/management/src/request/db_monitoring/service/common.rs` —
auth, SQL building, the shared read path
3. `src/core/src/db_monitoring/rollup.rs` — how the stats stream is
produced
4. `web/src/views/DatabaseMonitoring/` — the pages
Time semantics are the subtlest part. Rollup rows are stamped at the
window **end**, so reads are exclusive at both edges; `stats_read_range`
carries the reasoning and a test pins it.
## Known follow-ups
- **The server-vantage stream named as `_o2_dbm_server`.**
## Testing
- Rust: unit tests across the DBM core and read service, including
SQL-building, auth-gating and normalizer cases
- Web: unit tests across the DBM pages and composables
- Playwright: DBM suite covering the pages and cross-page navigation
Verified before opening: OSS and enterprise builds both compile
warning-free, `cargo fmt` clean, `vue-tsc` clean, and the full web unit
suite passes (44,704 tests).
## Summary
- add annotation queue and dataset storage, management APIs, and review
workflows
- add discovery, dataset, queue, and review user interfaces
- add RBAC synchronization, super-cluster support, tags, version
history, and review progress
## Validation
- CI should pair this branch with the identically named Enterprise
branch for cumulative compilation testing
## Migration note
This is an additional cumulative PR created from the committed ud/ebb3
tip. The existing SPR pull requests and branches are intentionally left
unchanged.
---------
Co-authored-by: sai nikhil kethe <nikhil@openobserve.ai>
Continues the "Calm Signal" colour language shipped on the Alerts list:
a calm neutral canvas, with saturated colour spent only on the one
signal each screen exists to surface. These three pages were picked from
a ranked audit of the remaining list screens.
## Streams — `web/src/views/LogStream.vue`
Signal: **ingestion liveness**.
- **Last Ingested** column — relative time from `stats.doc_time_max`,
with a dot on streams taking data within the hour.
- **Liveness row rail** — green (ingested today) / amber (was ingesting,
quiet for over a day) / grey (never ingested). Grey rather than amber
for "never": a brand-new or schema-only stream is legitimately empty, so
amber there would cry wolf on every fresh stream. No full-row wash — a
stream list has no outright failure state, and washing "quiet" or
"empty" would tint most rows in a normal org.
- **Compression** column from ingested/compressed size, coloured only
when it drops below 1x (the compressed copy is *larger* than the raw
data — compression is doing nothing for that stream).
- **Org footprint strip** in `OPageLayout`'s `#subnav`, deliberately
**outside** the table: the list is server-paginated and these totals
cover every stream type, so in the table's `#subheader` they would read
as a summary of the visible rows. Same figures, labels, icons and
formatters as the Home → Usage tiles.
**Bug fixed along the way:** `compressed_size` / `index_size` were
declared outside the row `map`, so a stream without `stats` inherited
the previous row's numbers. Rows now carry raw per-row values and render
`—` when a stat is absent, instead of a misleading `0 MB`.
## Pipelines — `web/src/components/pipeline/PipelinesList.vue`
Signal: **operational state**.
- **State** column (Errored / Paused / Active) built the same way as the
Alerts reference, plus a selectable state strip and a matching row rail.
Errored rows also show when they last failed — recency on the exception
only.
- The state facet is orthogonal to the existing type toggle group, so
the two never express the same filter.
- "Errored" is driven by `last_error`, which the backend expires via
`ZO_PIPELINE_ERROR_RETENTION_MINS` (default 60 min), so the state clears
itself and cannot get stuck.
## Cluster Nodes — `web/src/components/settings/Nodes.vue`
Signal: **health**.
- Health strip doubling as the status facet, **Status** chips, and a new
**Role** column via a `nodeRole` badge group (roles were filterable but
never displayed).
- Node health previously relied on `status-row` / `status-*` row classes
that **exist nowhere in the repo**, so status rendered no colour at all.
Replaced with a real rail plus an exception tint.
- CPU/memory bars now go amber at 70% and red at 85%, and a hardcoded
literal colour (`bg-[lightgrey]`) is gone.
- Replaced the fake `#` data column (a real, draggable, resizable column
whose numbers stopped matching the rows once sorted or filtered) with
`OTable`'s `show-index` gutter, and the positional `columns.splice(2,
1)` with a filter by column id.
## Shared
- `OStatCard`: the **value no longer truncates** — a clipped `499.51…`
is a useless number, so the label absorbs the squeeze instead.
`OStatStrip` wraps a tile earlier so a five-tile strip stops squeezing
on a laptop.
- `formatEventCount` moved out of `UsageTab.vue` into
`utils/formatters.ts`, so Home and Streams cannot disagree about the
same number (`2.9B` vs `2,900,000,000`).
- Streams list endpoint: `stream_comparator` gains `doc_time_max` and
`compression` sort arms, with unit tests.
## Note on the two new sorts
`Last Ingested` and `Compression` are intentionally **not sortable in
the UI yet**. The table is `sorting="server"`, and an unknown sort key
falls through to `_ => name` with no error — a sort control would
silently order by name. Sorting them client-side isn't possible either:
server pagination means the page holds 20 of N rows. The backend arms
ship in this PR; enabling the columns is flipping `sortable: false` →
`true` once a build carrying them is deployed (the column ids already
match the keys).
## Testing
- `npm run lint`, `lint:design:strict`, `lint:tokens`,
`lint:token-purity`, `lint:styles`, `type-check` — all pass.
- 285 unit tests across LogStream, PipelinesList, Nodes, UsageTab,
formatters and badgeGroups pass.
- The Rust arms and their tests have **not been compiled locally** (no
cargo toolchain on the dev machine) — first real compile is CI.
- Cluster Nodes needs an enterprise build **and** the meta org to be
reachable (Settings → Nodes is gated `isEnterprise && isMetaOrg`).
---------
Co-authored-by: ktx-vaidehi <vaidehi.akhani@kiara.tech>
Co-authored-by: ktx-vaidehi <134508096+ktx-vaidehi@users.noreply.github.com>
Applies the **Calm Signal** colour language and summary stat strips
across the monitoring + AI-evaluation pages.
- Colourful summary stat strips (`OStatStrip`) with selectable filter
tiles + left row rails / exception washes on **Alerts, Incidents, Eval
Jobs, Scorers, Score Configs**.
- Tile tones match their `OTag` chip colours; critical-first (left)
ordering; re-click a tile to clear the filter.
- AI Observability: consistent section headers, detail drawer, and
per-session signals.
- Migrate `ScorerTypeDialog` to the standard `ODialog`; token-compliance
+ vertical separators on the eval form pages.
- Table perf: lazy tooltips, delegated row shortcuts, virtualization.
chore: update package.json scripts for improved type-checking
fix: adjust frontmatter regex to handle BOM characters
refactor: streamline error handling in dashboard data conversion
style: clean up comments and formatting in various files
# Design System Unification — one visual language, enforced end-to-end
Establishes **one source of truth for every visual decision**, wires the
whole app to it, and **locks it in with CI** so it can't drift back.
### Foundations
- **Design-token system ("one knob per decision").** Every colour, text
size, spacing, corner radius, and shadow is a named token defined in
exactly one place — change the token, every screen updates. Collapsed
hundreds of near-duplicate definitions and removed "fake" duplicates
that pretended to be different but weren't.
- **Shared component library (O2).** Buttons, tables, dialogs, drawers,
form fields, badges, etc. already know the correct colours, spacing, and
dark-mode behaviour; new screens compose them instead of hand-styling.
Added new primitives on this branch (`OContent`, `KpiCard`) and
standardized existing ones.
- **One page structure everywhere** (`PageLayout` / `AppPageHeader` /
`AppPage` / `OContent`) — titles, breadcrumbs, spacing, and content
edges line up identically across every screen.
- **One table implementation** — all tabular data uses the same table
(sorting, density, sticky headers, empty states).
- **Styling consolidated onto Tailwind; old systems removed** —
hand-written CSS driven to the practical minimum, the legacy **Quasar**
framework fully removed, surviving stylesheets required to justify
themselves.
- **Two-tier corner radius** — a tight **4px** for controls and a soft
**12px** for surfaces (dialogs, cards, the app shell), plus a
full-circle option — replacing five radius names that all secretly meant
the same thing.
### Detailed improvements across screens
**Page structure & alignment** — unified page shell rolled across ~40+
screens (IAM, Settings, Alerts, Dashboards, Functions, Pipelines, RUM,
Metrics, Synthetics, Billing, editors, lists); one header height; one
page-edge grid driving headers, tables, rails, and tabs; unified
side-rail widths; inset rail selection/hover pills; every tab strip on
the grid line; tightened title/subtitle spacing.
**Tables (cross-screen)** — action columns consistently centered (incl.
Organizations); unified row-number column with no "#" truncation;
non-standard tables restyled to match; loading skeletons made
geometrically identical to the loaded table; symmetric edge inset; IAM
first-column grid alignment fixed.
**Traces** — flame graph + span-detail correlation panel fixes;
correlated logs/metrics placeholder fit; sticky headers; removed a
double scrollbar + a 1px sliver; aligned table fonts/badges; polished
the service detail drawer; stream-selector + correlation alignment;
aligned loading spinners; floating overlay arrows for the
disabled-services strip.
**Logs** — field-list controls aligned (focus ring no longer clipped);
detail-drawer spacing + metrics-tab overflow fixed; Run Query toolbar
tidied; listing sizing + stray border fixed.
**Metrics** — search added to the "Type" facet rail and aligned with the
other rails; proper empty states for the explorer and facet rail.
**Dashboards** — removed inconsistent card shadows; tightened
borders/resizers/field-list spacing; aligned View Dashboard chrome to
the grid; chart colours via the token helper.
**Home** — redesigned the Usage tab; added reusable KPI stat cards so
summary strips stop drifting.
**Dark mode** — new theme-switch animation; fixed a 1px content shift on
toggle and a white flash on load; fixed AI-chat text and assorted
light/dark mismatches; completed the token-driven dark migration.
**Empty states, controls & small polish** — restored 3 broken
empty-state animations; adopted the standard empty state; added the
sliding indicator to the toggle control; fixed the Quality-page inset +
drawer badge; refreshed Search History / Schedulers; fixed the
alert-history drawer scrollbar + timeline hover; removed a stray
menu-bar border.
### Dead code & cruft removal
- **Deleted the entire legacy `utilities.css`** global stylesheet (well
over a thousand lines) — evacuated in waves, roughly half of it dead
once traced.
- **Removed Quasar entirely**, including dead `.q-*` styles and ~25
phantom `--q-*` variables that were silently breaking bits of the UI.
- Stripped hundreds of **dead CSS classes and tokens that compiled to
nothing** — e.g. 46 uses of a colour class with no backing token, a
no-op shadow class on 51 elements, dead layout/utility classes, a
leftover `card-container` block, a dead table-actions token, and a
mis-registered gradient that rendered nothing.
- Cut **unused keyframe animations (19 → 3)** and removed **unused
components** + a stray build artifact.
- Net effect: a much smaller, leaner styling surface — less to maintain,
fewer dead ends to copy.
## Safety & verification
Large but low-risk: this is overwhelmingly a **styling and structure**
change, not product behaviour or data. Guarded by the
design-token/consistency/type checks above plus the existing test suite,
and reviewed screen-by-screen.
---------
Co-authored-by: Kirtan Thakkar <kirtan@kiara.tech>
Co-authored-by: Claude Fable 5 <noreply@anthropic.com>
Co-authored-by: ktx-mihir <mihir.patel@kiara.tech>
Kirtan Thakkar
Bhargavandgithub-actions[bot]
ktx-vaidehi
Ashish Kolheandgithub-actions[bot]
BenzizaandHengfei Yang
Omkar Kesarkhane
Abhay PadamaniandClaude Opus 4.8
