diff --git a/docs/widgets/services/pihole.md b/docs/widgets/services/pihole.md
index a12f57a86..8079d1b1f 100644
--- a/docs/widgets/services/pihole.md
+++ b/docs/widgets/services/pihole.md
@@ -9,6 +9,8 @@ As of v2022.12 [PiHole requires the use of an API key](https://pi-hole.net/blog/
Allowed fields: `["queries", "blocked", "blocked_percent", "gravity"]`.
+Note: by default the "blocked" and "blocked_percent" fields are merged e.g. "1,234 (15%)" but explicitly including the "blocked_percent" field will change them to display separately.
+
```yaml
widget:
type: pihole
@@ -16,4 +18,4 @@ widget:
key: yourpiholeapikey # optional
```
-_Added in v0.1.0, updated in v0.6.18_
+_Added in v0.1.0, updated in v0.8.9_
diff --git a/src/widgets/pihole/component.jsx b/src/widgets/pihole/component.jsx
index c9b036107..a36071a1b 100644
--- a/src/widgets/pihole/component.jsx
+++ b/src/widgets/pihole/component.jsx
@@ -15,6 +15,10 @@ export default function Component({ service }) {
return ;
}
+ if (!widget.fields) {
+ widget.fields = ["queries", "blocked", "gravity"];
+ }
+
if (!piholeData) {
return (
@@ -26,10 +30,15 @@ export default function Component({ service }) {
);
}
+ let blockedValue = `${t("common.number", { value: parseInt(piholeData.ads_blocked_today, 10) })}`;
+ if (!widget.fields.includes("blocked_percent")) {
+ blockedValue += ` (${t("common.percent", { value: parseFloat(piholeData.ads_percentage_today.toPrecision(3)) })})`;
+ }
+
return (
-
+