alex/manage
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(widgets): expose unit/scale options in the frontend widget registry

Browse Source 
The config dialog reads each widget kind's schema from the static frontend
SERVICE_REGISTRY (registry.ts), not the backend pydantic schema. The previous
commit added unit/scale to the backend configs but not to the frontend mirror,
so the options never appeared in the dialog — the Prometheus "chart" binding
still listed only promql/window and the qBittorrent "speed" binding had an
empty configSchema.

Add a shared AXIS_FORMAT_PROPERTIES fragment (unit + scale enums) and spread
it into the prometheus chart and qbittorrent speed bindings, with matching
defaultConfig (chart: none/auto; speed: bytes_per_sec/auto). Combined with the
enum <Select> rendering already added to WidgetConfigDialog, the options now
show up as dropdowns when editing those widgets.

Test: registry exposes unit/scale enums on chart + speed; speed defaults to
bytes_per_sec. 180/180 frontend tests pass; tsc + ESLint clean.
This commit is contained in:
Developer
2026-07-12 12:00:11 +00:00
parent b7019b33ac
commit 7e4222ef00
4 changed files with 56 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/integrations/registry.ts
+33 -3
View File
@@ -48,6 +48,31 @@ export interface ServiceBinding {
widgets: ServiceWidgetBinding[];
}
/** Shared Y-axis format options mirrored on every graph widget kind. */
const UNIT_VALUES = [
"none",
"bytes",
"bytes_per_sec",
"bits_per_sec",
"bits",
"percent",
"seconds",
];
const SCALE_VALUES = ["auto", "k", "m", "g", "t"];
const AXIS_FORMAT_PROPERTIES = {
unit: {
type: "string",
enum: UNIT_VALUES,
description:
"Display unit; auto-scales the Y axis + tooltip (kB/MB/GB, kbps/Mbps, …)",
},
scale: {
type: "string",
enum: SCALE_VALUES,
description: "auto picks a prefix from the data; k/M/G/T force one",
},
};
export const SERVICE_REGISTRY: Record<string, ServiceBinding> = {
alertmanager: {
serviceType: "alertmanager",
@@ -94,7 +119,7 @@ export const SERVICE_REGISTRY: Record<string, ServiceBinding> = {
name: "Chart",
description: "Multi-series line chart from a PromQL range query.",
refreshIntervalMs: 60_000,
defaultConfig: { promql: "", window: "1h" },
defaultConfig: { promql: "", window: "1h", unit: "none", scale: "auto" },
configSchema: {
type: "object",
properties: {
@@ -106,6 +131,7 @@ export const SERVICE_REGISTRY: Record<string, ServiceBinding> = {
type: "string",
description: "Time window preset (1h, 6h, 24h, 7d)",
},
...AXIS_FORMAT_PROPERTIES,
},
required: ["promql"],
},
@@ -188,8 +214,12 @@ export const SERVICE_REGISTRY: Record<string, ServiceBinding> = {
name: "Speed chart",
description: "Live download/upload speed over a short window.",
refreshIntervalMs: 5_000,
defaultConfig: {},
configSchema: { type: "object", properties: {}, required: [] },
defaultConfig: { unit: "bytes_per_sec", scale: "auto" },
configSchema: {
type: "object",
properties: { ...AXIS_FORMAT_PROPERTIES },
required: [],
},
component: QbittorrentSpeedWidget,
},
],