Kuadrant / Kuadrant/kuadrant-console-plugin
TLSPolicy View: Metrics Tab with Perses Panels
- Dominant language
- TypeScript
- Stars
- 10
- Forks
- 65
- Avg merge
- 2d 8h
- Merged PRs (30d)
- 44
Description
## Context
Add a Metrics tab to the TLSPolicy details page showing TLS certificate lifecycle metrics using embedded Perses panels. This answers: "Are my certificates valid? When do they expire? Are renewals on track?"
Depends on the shared Perses infrastructure established in #220.
## Requirements
### New Metrics tab
Add a `console.tab/horizontalNav` on `TLSPolicy` (`kuadrant.io/v1`):
- Tab name: "Metrics"
- Tab href: `metrics`
**Panels:**
| Panel | Metric | Panel Type |
|-------|--------|-----------|
| Certificate Ready Status | `certmanager_certificate_ready_status{namespace="", condition="True"}` scoped to certificates owned by this policy | StatChart (ready/not ready) |
| Time Until Expiry | `certmanager_certificate_expiration_timestamp_seconds{namespace="", name=""} - time()` | GaugeChart (days remaining) |
| Renewal Timeline | `certmanager_certificate_renewal_timestamp_seconds{namespace="", name=""}` | StatChart (next renewal date) |
| Certificate Validity Window | `certmanager_certificate_not_before_timestamp_seconds` and `certmanager_certificate_expiration_timestamp_seconds` | TimeSeriesChart (validity range) |
| Issuer Ready | `certmanager_issuer_ready_status{namespace="", condition="True"}` or `certmanager_clusterissuer_ready_status{condition="True"}` | StatChart |
| ACME Challenge Status | `certmanager_certificate_challenge_status{namespace=""}` | TimeSeriesChart by status |
**Controls:**
- Time range selector: 15m, 1h, 6h, 24h, 7d (default: 1h)
### Certificate scoping
TLSPolicy creates Certificate resources via cert-manager. The mapping from TLSPolicy to its owned Certificate resources (by `name` and `namespace` labels) needs to be resolved. Cert-manager metrics also include `issuer_name`, `issuer_kind`, and `issuer_group` labels for filtering.
### Empty states
- No TLS data: "No TLS metrics available. Metrics will appear once certificates are managed by this policy."
- Prometheus unavailable: shared `EmptyMetricsState` component from #220
## Notes
- Requires React 18 upgrade (OCP 4.22+ only)
- cert-manager serves metrics on port 9402 `/metrics`; ensure Prometheus is scraping cert-manager
Contributor guide
Research direction
Start at the TLSPolicy details page and inspect the console.tab/horizontalNav entry point, the shared Perses infrastructure from #220, and the EmptyMetricsState component. Trace how TLSPolicy-owned Certificates are identified, then verify the six panels, time-range controls, empty states, and cert-manager Prometheus scraping requirements are covered.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- prometheus, react, typescript
- Domain
- frontend, observability
- Issue type
- Feature
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Quiet
- Clarity
- Mostly clear
- Newbie friendliness
- 38/100