diff --git a/docs/widgets/services/grafana.md b/docs/widgets/services/grafana.md
index 272cc3ba8..fe62c1925 100644
--- a/docs/widgets/services/grafana.md
+++ b/docs/widgets/services/grafana.md
@@ -5,11 +5,18 @@ description: Grafana Widget Configuration
Learn more about [Grafana](https://github.com/grafana/grafana).
+| Grafana Version | Homepage Widget Version |
+| --------------- | ----------------------- |
+| <= v10.4 | 1 (default) |
+| > v10.4 | 2 |
+
Allowed fields: `["dashboards", "datasources", "totalalerts", "alertstriggered"]`.
```yaml
widget:
type: grafana
+ version: 2 # optional, default is 1
+ alerts: alertmanager # optional, default is grafana
url: http://grafana.host.or.ip:port
username: username
password: password
diff --git a/src/utils/config/service-helpers.js b/src/utils/config/service-helpers.js
index 68de39449..a55fff70b 100644
--- a/src/utils/config/service-helpers.js
+++ b/src/utils/config/service-helpers.js
@@ -407,6 +407,9 @@ export function cleanServiceGroups(groups) {
// spoolman
spoolIds,
+
+ // grafana
+ alerts,
} = widgetData;
let fieldsList = fields;
@@ -514,7 +517,18 @@ export function cleanServiceGroups(groups) {
if (snapshotPath) widget.snapshotPath = snapshotPath;
}
if (
- ["beszel", "glances", "immich", "komga", "mealie", "pfsense", "pihole", "speedtest", "wgeasy"].includes(type)
+ [
+ "beszel",
+ "glances",
+ "immich",
+ "komga",
+ "mealie",
+ "pfsense",
+ "pihole",
+ "speedtest",
+ "wgeasy",
+ "grafana",
+ ].includes(type)
) {
if (version) widget.version = parseInt(version, 10);
}
@@ -593,6 +607,9 @@ export function cleanServiceGroups(groups) {
if (type === "jellystat") {
if (days !== undefined) widget.days = parseInt(days, 10);
}
+ if (type === "grafana") {
+ if (alerts) widget.alerts = alerts;
+ }
return widget;
});
return cleanedService;
diff --git a/src/widgets/grafana/component.jsx b/src/widgets/grafana/component.jsx
index 82d6e5c99..75724cefa 100755
--- a/src/widgets/grafana/component.jsx
+++ b/src/widgets/grafana/component.jsx
@@ -6,27 +6,51 @@ import useWidgetAPI from "utils/proxy/use-widget-api";
export default function Component({ service }) {
const { t } = useTranslation();
-
const { widget } = service;
+
+ const { version = 1, alerts = "grafana" } = widget;
+
const { data: statsData, error: statsError } = useWidgetAPI(widget, "stats");
- const { data: alertsData, error: alertsError } = useWidgetAPI(widget, "alerts");
- const { data: alertmanagerData, error: alertmanagerError } = useWidgetAPI(widget, "alertmanager");
- let alertsInt = 0;
-
- if (alertsError || !alertsData || alertsData.length === 0) {
- if (alertmanagerData) {
- alertsInt = alertmanagerData.length;
- }
- } else {
- alertsInt = alertsData.filter((a) => a.state === "alerting").length;
+ let primaryAlertsEndpoint = "alerts";
+ let secondaryAlertsEndpoint = "grafana";
+ if (version === 2) {
+ primaryAlertsEndpoint = alerts;
+ secondaryAlertsEndpoint = "";
}
- if (statsError || (alertsError && alertmanagerError)) {
+ const { data: primaryAlertsData, error: primaryAlertsError } = useWidgetAPI(widget, primaryAlertsEndpoint);
+ const { data: secondaryAlertsData, error: secondaryAlertsError } = useWidgetAPI(widget, secondaryAlertsEndpoint);
+
+ let alertsInt = 0;
+ let alertsError = null;
+ if (version === 1) {
+ if (primaryAlertsError || !primaryAlertsData || primaryAlertsData.length === 0) {
+ if (secondaryAlertsData) {
+ alertsInt = secondaryAlertsData.length;
+ }
+ } else {
+ alertsInt = primaryAlertsData.filter((a) => a.state === "alerting").length;
+ }
+
+ if (primaryAlertsError && secondaryAlertsError) {
+ alertsError = primaryAlertsError ?? secondaryAlertsError;
+ }
+ } else if (version === 2) {
+ if (primaryAlertsData) {
+ alertsInt = primaryAlertsData.length;
+ }
+
+ if (primaryAlertsError) {
+ alertsError = primaryAlertsError;
+ }
+ }
+
+ if (statsError || alertsError) {
return ;
}
- if (!statsData || (!alertsData && !alertmanagerData)) {
+ if (!statsData) {
return (
diff --git a/src/widgets/grafana/widget.js b/src/widgets/grafana/widget.js
index 2805555f8..1c013c9af 100755
--- a/src/widgets/grafana/widget.js
+++ b/src/widgets/grafana/widget.js
@@ -9,6 +9,9 @@ const widget = {
endpoint: "alerts",
},
alertmanager: {
+ endpoint: "alertmanager/alertmanager/api/v2/alerts",
+ },
+ grafana: {
endpoint: "alertmanager/grafana/api/v2/alerts",
},
stats: {