andoncloud-prometheus-widget 1.3.17 → 1.3.19

package/README.md

@@ -1,8 +1,6 @@
 # andoncloud-prometheus-widget
 
-> Made with create-react-library
-
-[![NPM](https://img.shields.io/npm/v/prometheus-widget.svg)](https://www.npmjs.com/package/prometheus-widget) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)
+PromQL chart widget for the AndonCloud Dashboard.
 
 ## Install
 
@@ -15,3 +13,38 @@ npm install --save andoncloud-prometheus-widget
 ```tsx
 import { Widget, permissions } from 'andoncloud-prometheus-widget';
 ```
+
+## Settings
+
+| Field | Required | Notes |
+|---|---|---|
+| Endpoint URL | yes | Prometheus HTTP API base (e.g. `https://prometheus.example.com`) |
+| Username | no | Optional — fill only if your Prometheus requires HTTP Basic Auth |
+| Password | no | Optional — paired with Username; left empty for anonymous Prometheus |
+| Period | yes | Current shift / Previous shift |
+| Queries | ≥1 | PromQL expressions with display names |
+| Displayed query parameters | optional | Labels to include in dataset names |
+| X-axis unit, Y-axis unit | yes | Axis titles |
+
+When **both** Username and Password are filled, the widget sends `Authorization: Basic <base64(user:pass)>` on every Prometheus request. When either is empty, the request is anonymous.
+
+If the Endpoint URL uses `http://` (not `https://`) and credentials are filled, the settings dialog shows a non-blocking warning that credentials will be sent over an unencrypted channel.
+
+## Error states
+
+The widget body distinguishes three failure modes:
+
+- **401** — `Could not authenticate to Prometheus. Check the username and password in widget settings.`
+- **403** — `Authenticated, but the Prometheus user has no permission to read these metrics.`
+- network / DNS / TLS / 5xx — `Could not reach Prometheus at the configured URL.`
+
+## Development
+
+```bash
+npm start                                   # build:watch + preview
+npm run build                               # production build
+./scripts/cypress_run_prod.sh               # component tests (Docker)
+./scripts/cypress_run_prod.sh --e2e         # E2E tests (Docker)
+```
+
+See `specs/projects/dashboard/widgets/prometheus-widget/spec.md` for the full project specification.

package/dist/assets/thumbnail.svg

@@ -0,0 +1,42 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 180" fill="none">
+  <!-- Grid lines (rgba 255,255,255,0.1) -->
+  <line x1="40" y1="20" x2="304" y2="20" stroke="#ffffff1a" stroke-width="1"/>
+  <line x1="40" y1="50" x2="304" y2="50" stroke="#ffffff1a" stroke-width="1"/>
+  <line x1="40" y1="80" x2="304" y2="80" stroke="#ffffff1a" stroke-width="1"/>
+  <line x1="40" y1="110" x2="304" y2="110" stroke="#ffffff1a" stroke-width="1"/>
+  <line x1="40" y1="140" x2="304" y2="140" stroke="#ffffff1a" stroke-width="1"/>
+
+  <!-- Area fills -->
+  <defs>
+    <linearGradient id="g1" x1="0" y1="0" x2="0" y2="1">
+      <stop offset="0%" stop-color="#36A2EB" stop-opacity="0.3"/>
+      <stop offset="100%" stop-color="#36A2EB" stop-opacity="0"/>
+    </linearGradient>
+    <linearGradient id="g2" x1="0" y1="0" x2="0" y2="1">
+      <stop offset="0%" stop-color="#FF6384" stop-opacity="0.3"/>
+      <stop offset="100%" stop-color="#FF6384" stop-opacity="0"/>
+    </linearGradient>
+  </defs>
+
+  <!-- Line 1: Uptime (higher values) -->
+  <path d="M40,75 C70,55 100,65 140,40 C180,18 220,45 260,30 L304,36 L304,140 L40,140 Z" fill="url(#g1)"/>
+  <path d="M40,75 C70,55 100,65 140,40 C180,18 220,45 260,30 L304,36" stroke="#36A2EB" stroke-width="3" fill="none"/>
+
+  <!-- Line 2: Downtime (lower values, inverse) -->
+  <path d="M40,105 C70,90 100,100 140,80 C180,70 220,85 260,65 L304,70 L304,140 L40,140 Z" fill="url(#g2)"/>
+  <path d="M40,105 C70,90 100,100 140,80 C180,70 220,85 260,65 L304,70" stroke="#FF6384" stroke-width="3" fill="none"/>
+
+  <!-- Line 3: removed -->
+
+  <!-- X-axis time labels -->
+  <text x="60" y="155" text-anchor="middle" font-size="8" font-family="Inter, system-ui" fill="#A7ADB6">06:00</text>
+  <text x="126" y="155" text-anchor="middle" font-size="8" font-family="Inter, system-ui" fill="#A7ADB6">08:00</text>
+  <text x="192" y="155" text-anchor="middle" font-size="8" font-family="Inter, system-ui" fill="#A7ADB6">10:00</text>
+  <text x="258" y="155" text-anchor="middle" font-size="8" font-family="Inter, system-ui" fill="#A7ADB6">12:00</text>
+
+  <!-- Legend -->
+  <line x1="44" y1="10" x2="58" y2="10" stroke="#36A2EB" stroke-width="2"/>
+  <text x="62" y="13" font-size="9" font-family="Inter, system-ui" fill="#A7ADB6">Uptime</text>
+  <line x1="120" y1="10" x2="134" y2="10" stroke="#FF6384" stroke-width="2"/>
+  <text x="138" y="13" font-size="9" font-family="Inter, system-ui" fill="#A7ADB6">Downtime</text>
+</svg>

package/dist/index.d.ts

@@ -1,3 +1,4 @@
+import { t as thumbnail_default } from "./thumbnail-B_DBfYD0.js";
 import { BaseWidgetData, BaseWidgetSettings, FilterValues, ListShifts_Shift, WidgetProps } from "andoncloud-dashboard-toolkit";
 //#region src/types.d.ts
 interface WidgetSettingsData {
@@ -11,6 +12,8 @@ interface PrometheusQuery {
 interface WidgetSettings extends BaseWidgetSettings {
   customTitle: string;
   endpointUrl: string;
+  username?: string;
+  password?: string;
   queriesPeriod: QueriesPeriod;
   prometheusQueries: PrometheusQuery[];
   displayedQueryParams: string[];
@@ -30,12 +33,11 @@ declare const getDisplayName: (lang: string) => string;
 declare const getTitle: (_data: WidgetData | undefined, settings: WidgetSettings | undefined, _filters: FilterValues | undefined, lang: string) => string;
 //#endregion
 //#region src/version.d.ts
-declare const LIBRARY_VERSION = "1.3.17";
+declare const LIBRARY_VERSION = "1.3.19";
 //#endregion
 //#region src/index.d.ts
-declare const thumbnail: string | undefined;
 declare const requiredFeatures: string[];
 declare const extraPermissions: string[];
 //#endregion
-export { Widget, extraPermissions, getDisplayName, getTitle, requiredFeatures, thumbnail, LIBRARY_VERSION as version };
+export { Widget, extraPermissions, getDisplayName, getTitle, requiredFeatures, thumbnail_default as thumbnail, LIBRARY_VERSION as version };
 //# sourceMappingURL=index.d.ts.map