Developer
447775048c
The iframe-based 'panel' widget didn't work: the browser couldn't
authenticate against the OIDC-protected Grafana (Authentik), and
iframes can't carry Bearer tokens or share cross-origin session
cookies. Result: blank iframe or login redirect.
Replace it with a 'chart' widget that queries Grafana's datasource
API server-side:
Backend (GrafanaWidgetSource): POSTs to /api/ds/query with the stored
api_key (which bypasses OIDC), using the widget's configured PromQL
query, datasource_uid, time range, and resolution. Normalizes Grafana's
frame-based response into a simple {series: [{label, points: [{t, v}]}]}
shape. The api_key is never exposed to the browser.
Frontend (GrafanaChartWidget): renders the series data as a recharts
LineChart with dark-mode-aware colors (Tailwind --chart-* tokens),
responsive container, custom tooltip, and per-series lines. Loading
skeleton, error Alert, and empty state. recharts ^3.9.2 added.
The 'link' widget kind (deep-link URL) is unchanged. The 'panel' kind
and GrafanaPanelWidget are fully removed.
Backend: 279 tests pass (+1 net: -2 panel + 3 chart). Frontend: 127
tests pass (net 0: -3 panel + 3 chart). Lint/build green both sides.
58 lines
1.6 KiB
JSON
58 lines
1.6 KiB
JSON
{
|
|
"name": "frontend",
|
|
"private": true,
|
|
"version": "0.1.0",
|
|
"type": "module",
|
|
"scripts": {
|
|
"dev": "vite",
|
|
"build": "tsc -b && vite build",
|
|
"lint": "eslint .",
|
|
"preview": "vite preview",
|
|
"test": "vitest run",
|
|
"test:watch": "vitest",
|
|
"test:node": "node --test tests/*.test.mjs"
|
|
},
|
|
"dependencies": {
|
|
"@fontsource-variable/geist": "^5.2.8",
|
|
"@tanstack/react-query": "^5.100.6",
|
|
"@tanstack/react-table": "^8.21.3",
|
|
"class-variance-authority": "^0.7.1",
|
|
"clsx": "^2.1.1",
|
|
"lucide-react": "^1.14.0",
|
|
"oidc-client-ts": "^3.5.0",
|
|
"radix-ui": "^1.4.3",
|
|
"react": "^19.2.5",
|
|
"react-dom": "^19.2.5",
|
|
"react-oidc-context": "^3.3.1",
|
|
"react-router-dom": "^7.14.2",
|
|
"recharts": "^3.9.2",
|
|
"shadcn": "^4.7.0",
|
|
"tailwind-merge": "^3.6.0",
|
|
"tw-animate-css": "^1.4.0"
|
|
},
|
|
"devDependencies": {
|
|
"@eslint/js": "^10.0.1",
|
|
"@tailwindcss/postcss": "^4.3.0",
|
|
"@tailwindcss/vite": "^4.3.0",
|
|
"@testing-library/jest-dom": "^6.9.1",
|
|
"@testing-library/react": "^16.3.2",
|
|
"@testing-library/user-event": "^14.6.1",
|
|
"@types/node": "^24.13.2",
|
|
"@types/react": "^19.2.14",
|
|
"@types/react-dom": "^19.2.3",
|
|
"@vitejs/plugin-react": "^6.0.1",
|
|
"autoprefixer": "^10.5.0",
|
|
"eslint": "^10.2.1",
|
|
"eslint-plugin-react-hooks": "^7.1.1",
|
|
"eslint-plugin-react-refresh": "^0.5.2",
|
|
"globals": "^17.5.0",
|
|
"jsdom": "^29.1.1",
|
|
"postcss": "^8.5.14",
|
|
"tailwindcss": "^4.3.0",
|
|
"typescript": "~6.0.2",
|
|
"typescript-eslint": "^8.58.2",
|
|
"vite": "^8.0.10",
|
|
"vitest": "^4.1.9"
|
|
}
|
|
}
|