grafana/grafana

Alerting UI

The unified alerting frontend lives in public/app/features/alerting/unified/ and is one of the largest features in the repo. It carries its own AGENTS.md with squad-specific patterns.

Scope

The UI covers everything ngalert exposes:

Alert rule list & detail — including state, last evaluation, last result.
Rule editor — query builder with preview, condition, and provisioning state.
Contact points — CRUD for receivers (email, Slack, PagerDuty, …).
Notification policies — the routing tree.
Mute timings and silences.
Templates — receiver message templates.
History — alert state changes over time (when Loki history is enabled).
Recording rules — pre-aggregated metrics rules.
Settings — alertmanager selection, external alert managers.

Layout

public/app/features/alerting/unified/
├── api/                     # RTK Query: alertRuleApi, contactPointsApi, ...
├── components/              # Shared alerting components
├── pages/                   # Top-level pages per route
├── hooks/                   # useFolders, useFilteredRules, ...
├── reducers/                # Slices for filters, drafts
├── search/                  # Search + filter parsing
├── rule-list/               # The rule list view
├── rule-editor/             # Rule create / edit
├── contact-points/
├── notification-policies/
├── silences/
├── templates/
├── home/                    # Dashboard / overview
├── insights/                # Aggregate insights view
├── utils/
└── ...

This is one of the few features where the breadth of subdomains matters — read the per-folder AGENTS.md and squad docs in public/app/features/alerting/unified/AGENTS.md before refactoring.

Data sources

The frontend talks to multiple alerting APIs and unifies them in api/:

/api/v1/provisioning/* — Grafana-native CRUD.
/api/ruler/* — Prometheus-compatible rule CRUD.
/api/alertmanager/* — Alertmanager API.
/api/v1/eval — preview a condition.
/api/prometheus/grafana/api/v1/... — Prometheus-compatible read API.

Each has an RTK Query slice. Most pages query several at once; the slices share tag types so cache invalidation propagates.

public/app/features/alerting/unified/mockGrafanaNotifiers.ts is the largest TypeScript file in the repo (~3,700 lines) — it exhaustively enumerates every contact-point type's options for use by tests and the receivers UI. It exists because the receiver schema is complex and slow-changing; treat it as a living fixture.

Provenance

Every entity surfaced in the UI carries a "provenance" flag from the backend (api, file, etc.) that determines whether the UI shows edit affordances. This is enforced both server-side (provisioning service) and client-side (read-only UI for file provenance unless disable_provenance: true).

Mimir / Cortex / Loki integration

In addition to Grafana-native rules, the UI also lets you manage rules in compatible external systems (Mimir, Cortex, Loki rules). The Ruler API endpoints abstract this — the UI shows the data source's "kind" and switches behavior accordingly.

Key source files

File	Purpose
`public/app/features/alerting/unified/api/alertRuleApi.ts`	Ruler API client
`public/app/features/alerting/unified/api/grafanaApi.ts`	Grafana provisioning API client
`public/app/features/alerting/unified/rule-editor/`	Rule editor
`public/app/features/alerting/unified/contact-points/`	Contact-point CRUD
`public/app/features/alerting/unified/notification-policies/`	Notification policy tree
`public/app/features/alerting/unified/AGENTS.md`	Squad-specific patterns