lablup / lablup/backend.ai-webui

Visualize Prometheus metrics in WebUI

Open
#8,523 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
133
Forks
81
Avg merge
1d 11h
Merged PRs (30d)
344

Description

## Goal

Leverage the Prometheus metrics pipeline (Manager 26.4.2+, Strawberry GraphQL `prometheusQueryPreset*` APIs) to visually surface operational metrics in the WebUI.

## Background

- The backend already scrapes Prometheus metrics per model-service deployment (service discovery registers every healthy inference route as a scrape target, labeled with `deployment_id`, `endpoint_id`, `route_id`, etc.).
- Query presets are exposed via GraphQL to **any authenticated user** (`prometheusQueryPresets`, `prometheusQueryPresetResult`), so regular users can already query them — the WebUI just doesn't render them yet.
- The WebUI currently consumes presets only for auto-scaling rule configuration (`AutoScalingRuleEditorModal`, `DeploymentAutoScalingCard`) and has an admin-only preset editor (`PrometheusPresetTab`). No metric **charts** exist anywhere.

## Strategy

**Frontend-first**: implement what is possible with the existing backend APIs instead of waiting for further backend work. Backend gaps discovered along the way should be filed as separate backend issues with `TODO(needs-backend)` markers.

## Candidate scope (child issues)

- Show vLLM inference metrics on the deployment detail page (first child issue)
- Time-series chart component reusable across preset categories
- Additional preset categories/panels as they are seeded by the backend

JIRA Issue: FR-3433

Contributor guide

No contributing guide indexed for this repository

Research direction

First confirm which child scope is being taken, since this issue lists deployment charts, a reusable time-series component, and future preset panels rather than one concrete change. Read AutoScalingRuleEditorModal, DeploymentAutoScalingCard, and PrometheusPresetTab, then trace the prometheusQueryPresets and prometheusQueryPresetResult APIs. Done should mean an agreed WebUI metric-visualization scope is implemented against the existing APIs, with backend gaps separated as TODO(needs-backend) issues.

Written by the indexing model from the issue text.

Assessment

Tech stack
graphql, prometheus, typescript
Domain
data-visualization, frontend, observability-sre
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Quiet
Clarity
Needs clarification
Newbie friendliness
38/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.