feat: v2.6.1 — dashboard grid-lost indicator (issue #36)

v2.6.0 plumbed the optional grid_available sensor into the card config but did
not surface it. Add a compact "Grid lost" warning pill in the hero pill-row,
shown only when grid_available reads explicitly off.

- _gridAvailable() mirrors the backend is_grid_available tri-state: null when
  unmapped or unavailable/unknown (pill hidden — no false alarm at boot),
  true/false only on a real on/off.
- _renderGridLostPill() renders only on explicit false; independent of the hero
  banner so it coexists with Force/Boost/Night/Charging. Added to the structural
  key (gl) so it appears/disappears via one rebuild.
- New i18n key hero.grid_lost (EN/IT/NL) + .grid-lost-pill CSS (reduced-motion
  safe).

Frontend-only; no schema/entity/config change, counts unchanged. VERSION 2.6.1.

Author: Antonio ...

CLAUDE.md

@@ -757,6 +757,31 @@ async def _set_amperage(self, target_amperage: int):
 
 ## Version History
 
+### v2.6.1 (2026-06-06)
+**Dashboard: grid-lost indicator for issue #36 (frontend-only)**
+
+v2.6.0 plumbed the optional `grid_available` sensor through to the card config
+but did not surface it visually. v2.6.1 adds a compact **"Grid lost" warning
+pill** in the hero pill-row (next to the priority / forecast pills), shown
+**only** when `grid_available` reads explicitly off.
+
+- New frontend helper `_gridAvailable()` mirrors the backend
+  `ChargingModel.is_grid_available` tri-state: `null` when the sensor is unmapped
+  OR its state is `unavailable`/`unknown` (→ pill hidden, no false alarm at boot),
+  `true`/`false` only on a real on/off. `_renderGridLostPill()` renders the pill
+  only on an explicit `false`.
+- Rendered as an independent pill (not folded into the single hero banner), so it
+  coexists with the Force / Boost / Night / Charging banners instead of hiding
+  them. Added to `_computeStructuralKey` (`gl`) so it appears/disappears via one
+  rebuild. New i18n key `hero.grid_lost` (EN/IT/NL), new `.grid-lost-pill` CSS
+  (system-red, reduced-motion safe).
+
+Frontend-only — no schema/entity/config change, counts unchanged (69 / 55). The
+`?v=`+content-hash cache-buster picks up the new bundle on the next reload.
+`VERSION = "2.6.1"`.
+
+---
+
 ### v2.6.0 (2026-06-06)
 **Mass bug-fixing & improvement release — 7 issues (#36–#42)**
 

custom_components/ev_smart_charger/const.py

@@ -2,7 +2,7 @@
 
 # ========== INTEGRATION METADATA ==========
 DOMAIN = "ev_smart_charger"
-VERSION = "2.6.0"
+VERSION = "2.6.1"
 DEFAULT_NAME = "EV Smart Charger"
 FRONTEND_URL_BASE = "/api/ev_smart_charger/frontend"
 FRONTEND_CARD_FILENAME = "ev-smart-charger-dashboard.js"

custom_components/ev_smart_charger/frontend/ev-smart-charger-dashboard.js

@@ -581,6 +581,7 @@ const FRONTEND_LOCALES = {
     "hero.banner.night_charge": "Night Smart Charge Active",
     "hero.banner.charging": "EV Charging",
     "hero.forecast_tomorrow": "Tomorrow Forecast",
+    "hero.grid_lost": "⚠ Grid lost",
     "toast.boost.target_reached": "Boost can't start: EV at {ev}% (≥ target {target}%). Raise the target or wait for the battery to drain.",
     "toast.boost.missing_soc": "Boost can't start: EV SOC sensor unavailable. Check the mapped sensor.",
     "toast.dismiss_aria": "Dismiss notification",
@@ -729,6 +730,7 @@ const FRONTEND_LOCALES = {
     "hero.banner.night_charge": "Night Smart Charge in corso",
     "hero.banner.charging": "EV in ricarica",
     "hero.forecast_tomorrow": "Forecast Domani",
+    "hero.grid_lost": "⚠ Rete assente",
     "toast.boost.target_reached": "Boost non può partire: EV al {ev}% (≥ target {target}%). Alza il target o aspetta che la batteria scenda.",
     "toast.boost.missing_soc": "Boost non può partire: sensore SOC EV non disponibile. Controlla la mappatura.",
     "toast.dismiss_aria": "Chiudi notifica",
@@ -877,6 +879,7 @@ const FRONTEND_LOCALES = {
     "hero.banner.night_charge": "Slim nachtelijk laden actief",
     "hero.banner.charging": "EV aan het laden",
     "hero.forecast_tomorrow": "Verwachting morgen",
+    "hero.grid_lost": "⚠ Net weg",
     "toast.boost.target_reached": "Boost kan niet starten: EV op {ev}% (≥ doel {target}%). Verhoog het doel of wacht tot de batterij zakt.",
     "toast.boost.missing_soc": "Boost kan niet starten: EV SOC-sensor niet beschikbaar. Controleer de mapping.",
     "toast.dismiss_aria": "Melding sluiten",
@@ -1862,6 +1865,35 @@ class EvSmartChargerDashboard extends HTMLElement {
     return `<span class="priority-pill state-${modifier}">${label}</span>`;
   }
 
+  /**
+   * v2.6.0 (issue #36): tri-state read of the optional grid_available
+   * binary_sensor, mirroring the backend ChargingModel.is_grid_available.
+   * Returns true (present) / false (lost) / null (unmapped or unavailable/
+   * unknown → "don't know", never a false alarm).
+   */
+  _gridAvailable() {
+    const entityId = this._config?.grid_available_entity;
+    if (!entityId) return null;
+    const raw = this._stateObj(entityId)?.state;
+    if (raw === undefined || raw === null || raw === "unavailable" || raw === "unknown") {
+      return null;
+    }
+    return ["on", "true", "1", "yes", "home", "present"].includes(
+      String(raw).toLowerCase()
+    );
+  }
+
+  /**
+   * v2.6.0 (issue #36): render a compact "Grid lost" warning pill next to the
+   * priority / forecast pills, shown ONLY when grid_available is explicitly
+   * off. Empty string otherwise (unmapped / present / unknown) — so existing
+   * dashboards and a boot-time `unavailable` never surface a false alarm.
+   */
+  _renderGridLostPill() {
+    if (this._gridAvailable() !== false) return "";
+    return `<span class="grid-lost-pill" role="status" aria-live="polite">${this._t("hero.grid_lost")}</span>`;
+  }
+
   /**
    * v1.11.8: Render the next-day PV forecast as an orange chip placed
    * next to the priority pill. Returns an empty string when the
@@ -2594,6 +2626,7 @@ class EvSmartChargerDashboard extends HTMLElement {
                 <div class="hero-pill-row">
                   ${this._renderPriorityPill(priorityState)}
                   ${this._renderForecastPill()}
+                  ${this._renderGridLostPill()}
                 </div>
                 <h1>${this._config.title || this._t("title.default")}</h1>
                 <div class="evsc-metric-row">
@@ -2841,6 +2874,9 @@ class EvSmartChargerDashboard extends HTMLElement {
     // left the banner stale in three-phase — Risk #5), and a power-only signal
     // (no status entity mapped) still rebuilds.
     const chargingOnForKey = this._isDrawingNow();
+    // v2.6.0 (issue #36): the grid-lost pill appears/disappears, so it is
+    // structural — include it so a transition triggers exactly one rebuild.
+    const gridLost = this._gridAvailable() === false;
 
     return JSON.stringify({
       view: this._view,
@@ -2855,6 +2891,7 @@ class EvSmartChargerDashboard extends HTMLElement {
       bo: boostOn,
       ni: nightOn,
       ch: chargingOnForKey,
+      gl: gridLost,
     });
   }
 
@@ -3972,6 +4009,27 @@ class EvSmartChargerDashboard extends HTMLElement {
           box-shadow: 0 0 10px currentColor;
           animation: evsc-pulse-slow 3.2s ease-in-out infinite;
         }
+        /* v2.6.0 (issue #36): grid-lost warning pill — shown only when the
+           optional grid_available sensor reads explicitly off. */
+        .grid-lost-pill {
+          display: inline-flex; align-items: center; gap: 8px;
+          padding: 6px 12px;
+          border-radius: var(--evsc-radius-pill);
+          font-size: 0.85rem;
+          font-weight: 600;
+          color: #fff;
+          background: var(--evsc-sys-red);
+          box-shadow: 0 0 14px 1px var(--evsc-sys-red);
+        }
+        .grid-lost-pill::before {
+          content: ""; width: 7px; height: 7px; border-radius: 50%;
+          background: #fff;
+          box-shadow: 0 0 10px #fff;
+          animation: evsc-pulse-slow 1.8s ease-in-out infinite;
+        }
+        @media (prefers-reduced-motion: reduce) {
+          .grid-lost-pill::before { animation: none; }
+        }
         @keyframes evsc-pulse-slow {
           0%, 100% { opacity: 1; box-shadow: 0 0 10px currentColor; }
           50%      { opacity: 0.55; box-shadow: 0 0 16px currentColor; }

custom_components/ev_smart_charger/manifest.json

@@ -11,5 +11,5 @@
   "iot_class": "local_push",
   "issue_tracker": "https://github.com/antbald/ha-ev-smart-charger/issues",
   "requirements": [],
-  "version": "2.6.0"
+  "version": "2.6.1"
 }