feat: ✨ add generator functionality for power outage

README.md

@@ -264,6 +264,7 @@ This feature allows you to configure how the card handles a Grid Power Outage sc
 | Name        | Type     | Description                                                                                       |
 | ----------- | -------- | ------------------------------------------------------------------------------------------------- |
 | entity| `string` required | Entity ID providing a state that changes when there is a Power Outage. (eg: `binary_sensor.grid_connection_status`). Doesn't need to be a binary_sensor. |
+| entity_generator | `string` | Entity ID providing the power of a Generator. (eg: `sensor.generator_power`). This is optional, meaning if you don't use this, the card will assume the grid is the only source of power. | 
 | state_alert | `string` | The state the provided entity is at when there is a power outage. Default is `on`, meaning if the entity's state is `on` the card will assume there is a power outage. |
 | icon_alert | `string` |  An icon path to be override the grid icon when there is a power outage. Default is `mdi:transmission-tower-off`. |
 | label_alert | `string` | A text that will be displayed below the icon when there is a power outage. |

src/localize/languages/de.json

@@ -6,6 +6,7 @@
         }
     },
     "editor": {
+        "entity_generator": "Generator",
         "combined": "Kombinierte Entität (Eine Entität mit positiven und negativen Werten)",
         "separated": "Getrennte Entitäten (Eine Entität für den Verbrauch und eine für die Produktion)",
         "custom_colors": "Benutzerdefinierte Farben",

src/localize/languages/dk.json

@@ -6,6 +6,7 @@
         }
     },
     "editor": {
+        "entity_generator": "Generator",
         "combined": "Kombineret enhed (Én enhed med positive og negative værdier)",
         "separated": "Adskilte enheder (én enhed til forbrug og én til produktion)",
         "custom_colors": "Brugerdefinerede farver",
@@ -69,4 +70,4 @@
         "transparency": "Transparens",
         "grey_color": "Grå Farve"
     }
-}
+}

src/localize/languages/en.json

@@ -6,6 +6,7 @@
         }
     },
     "editor": {
+        "entity_generator": "Generator",
         "combined": "Combined Entity (One entity with positive and negative values)",
         "separated": "Separated Entities (One entity for consumption and one for production)",
         "custom_colors": "Custom Colors",

src/localize/languages/es.json

@@ -6,6 +6,7 @@
         }
     },
     "editor": {
+        "entity_generator": "Generador",
         "combined": "Entidad combinada (una entidad con valores positivos y negativos)",
         "separated": "Entidades separadas (una entidad de consumo y otra de producción)",
         "custom_colors": "Colores personalizados",

src/localize/languages/fi.json

@@ -6,6 +6,7 @@
         }
     },
     "editor": {
+        "entity_generator": "Generaattori",
         "combined": "Yhdistetty kokonaisuus (yksi kokonaisuus positiivisilla ja negatiivisilla arvoilla)",
         "separated": "Erotetut kokonaisuudet (yksi kulutukseen ja yksi tuotantoon)",
         "custom_colors": "Mukautetut värit",

src/localize/languages/fr.json

@@ -6,6 +6,7 @@
         }
     },
     "editor": {
+        "entity_generator": "Générateur",
         "combined": "Entité combinée (une entité avec des valeurs positives et négatives)",
         "separated": "Entités séparées (une entité pour la consommation et une pour la production)",
         "custom_colors": "Couleurs personnalisées",

src/localize/languages/it.json

@@ -6,6 +6,7 @@
         }
     },
     "editor": {
+        "entity_generator": "Generatore",
         "combined": "Entità combinata (un'entità con valori positivi e negativi)",
         "separated": "Entità separate (Un'entità per il consumo e una per la produzione)",
         "custom_colors": "Colori personalizzati",

src/localize/languages/nl.json

@@ -6,6 +6,7 @@
         }
     },
     "editor": {
+        "entity_generator": "Generator",
         "combined": "Gecombineerde entiteit (één entiteit met positieve en negatieve waarden)",
         "separated": "Gescheiden entiteiten (één entiteit voor consumptie en één voor productie)",
         "custom_colors": "Aangepaste kleuren",

src/localize/languages/pl.json

@@ -6,6 +6,7 @@
         }
     },
     "editor": {
+        "entity_generator": "Generator",
         "combined": "Jednostka połączona (jedna jednostka z wartościami dodatnimi i ujemnymi)",
         "separated": "Oddzielne podmioty (jeden podmiot do konsumpcji i jeden do produkcji)",
         "custom_colors": "Kolory niestandardowe",

src/localize/languages/pt-BR.json

@@ -6,6 +6,7 @@
         }
     },
     "editor": {
+        "entity_generator": "Gerador",
         "combined": "Entidade combinada (uma entidade com valores positivos e negativos)",
         "separated": "Entidades Separadas (Uma entidade para consumo e outra para produção)",
         "custom_colors": "Cores personalizadas",

src/localize/languages/pt-PT.json

@@ -6,6 +6,7 @@
         }
     },
     "editor": {
+        "entity_generator": "Gerador",
         "combined": "Entidade combinada (uma entidade com valores positivos e negativos)",
         "separated": "Entidades Separadas (Uma entidade para consumo e outra para produção)",
         "custom_colors": "Cores personalizadas",

src/localize/languages/ru.json

@@ -6,6 +6,7 @@
         }
     },
     "editor": {
+        "entity_generator": "Генератор",
         "combined": "Комбинированный объект (один объект с положительными и отрицательными значениями)",
         "separated": "Отдельные объекты (один объект для потребления и один для производства)",
         "custom_colors": "Пользовательские цвета",

src/localize/languages/sk.json

@@ -6,6 +6,7 @@
         }
     },
     "editor": {
+        "entity_generator": "Generátor",
         "combined": "Kombinovaná entita (jedna entita s kladnými a zápornými hodnotami)",
         "separated": "Oddelené subjekty (jeden subjekt pre spotrebu a jeden pre výrobu)",
         "custom_colors": "Vlastné farby",
@@ -69,4 +70,4 @@
         "transparency": "Transparentnosť",
         "grey_color": "Šedá farba"
     }
-}
+}

src/power-flow-card-plus-config.ts

@@ -1,5 +1,5 @@
 import { LovelaceCardConfig } from "custom-card-helpers";
-import { ComboEntity, IndividualDeviceType, SecondaryInfoType, baseConfigEntity, gridPowerOutage } from "./type.js";
+import { ComboEntity, GridPowerOutage, IndividualDeviceType, SecondaryInfoType, baseConfigEntity } from "./type.js";
 
 interface mainConfigOptions {
   dashboard_link?: string;
@@ -36,7 +36,7 @@ export interface PowerFlowCardPlusConfig extends LovelaceCardConfig, mainConfigO
       color?: ComboEntity;
     };
     grid?: baseConfigEntity & {
-      power_outage: gridPowerOutage;
+      power_outage: GridPowerOutage;
       secondary_info?: SecondaryInfoType;
       color_circle: boolean | "production" | "consumption";
       color?: ComboEntity;

src/power-flow-card-plus.ts

@@ -314,6 +314,7 @@ export class PowerFlowCardPlus extends LitElement {
           (entities.grid && this.hass.states[entities.grid.power_outage?.entity]?.state) === (entities.grid?.power_outage?.state_alert ?? "on"),
         icon: entities.grid?.power_outage?.icon_alert || "mdi:transmission-tower-off",
         name: entities.grid?.power_outage?.label_alert ?? html`Power<br />Outage`,
+        entityGenerator: entities.grid?.power_outage?.entity_generator,
       },
       icon: this.computeFieldIcon(entities.grid, "mdi:transmission-tower"),
       name: this.computeFieldName(entities.grid, this.hass.localize("ui.panel.lovelace.cards.energy.energy_distribution.grid")) as
@@ -475,12 +476,6 @@ export class PowerFlowCardPlus extends LitElement {
       },
     };
 
-    if (grid.powerOutage.isOutage) {
-      grid.state.fromGrid = 0;
-      grid.state.toGrid = 0;
-      grid.icon = grid.powerOutage.icon;
-    }
-
     if (grid.has) {
       if (typeof entities.grid!.entity === "string") {
         if (this.entityInverted("grid")) {
@@ -824,6 +819,17 @@ export class PowerFlowCardPlus extends LitElement {
     nonFossil.hasPercentage =
       (entities.fossil_fuel_percentage?.entity !== undefined && entities.fossil_fuel_percentage?.display_zero === true) || nonFossil.has;
 
+    if (grid.powerOutage.isOutage) {
+      grid.state.fromGrid = grid.powerOutage.entityGenerator ? Math.max(this.getEntityStateWatts(grid.powerOutage.entityGenerator), 0) : 0;
+      grid.state.toHome = Math.max(grid.state.fromGrid - (grid.state.toBattery ?? 0), 0);
+      grid.state.toGrid = 0;
+      battery.state.toGrid = 0;
+      solar.state.toGrid = 0;
+      grid.icon = grid.powerOutage.icon;
+      nonFossil.has = false;
+      nonFossil.hasPercentage = false;
+    }
+
     const totalLines =
       grid.state.toHome +
       (solar.state.toHome ?? 0) +
@@ -1357,17 +1363,20 @@ export class PowerFlowCardPlus extends LitElement {
                           ${this.displayValue(grid.state.toGrid)}
                         </span>`
                       : null}
-                    ${(entities.grid?.display_state === "two_way" ||
+                    ${((entities.grid?.display_state === "two_way" ||
                       entities.grid?.display_state === undefined ||
                       (entities.grid?.display_state === "one_way_no_zero" && grid.state.fromGrid > 0) ||
                       (entities.grid?.display_state === "one_way" && (grid.state.toGrid === null || grid.state.toGrid === 0))) &&
-                    grid.state.fromGrid !== null &&
-                    !grid.powerOutage.isOutage
+                      grid.state.fromGrid !== null &&
+                      !grid.powerOutage.isOutage) ||
+                    (grid.powerOutage.isOutage && !!grid.powerOutage.entityGenerator)
                       ? html` <span class="consumption">
                           <ha-icon class="small" .icon=${"mdi:arrow-right"}></ha-icon>${this.displayValue(grid.state.fromGrid)}
                         </span>`
                       : ""}
-                    ${grid.powerOutage.isOutage ? html`<span class="grid power-outage"> ${grid.powerOutage.name} </span>` : ""}
+                    ${grid.powerOutage.isOutage && !grid.powerOutage.entityGenerator
+                      ? html`<span class="grid power-outage">${grid.powerOutage.name}</span>`
+                      : ""}
                   </div>
                   <span class="label">${grid.name}</span>
                 </div>`
@@ -1491,7 +1500,9 @@ export class PowerFlowCardPlus extends LitElement {
                           .icon=${battery.icon}
                           style=${entities.battery?.display_state === "two_way"
                             ? "padding-top: 0px; padding-bottom: 2px;"
-                            : entities.battery?.display_state === "one_way_no_zero" && battery.state.toBattery === 0 && battery.state.fromBattery === 0
+                            : entities.battery?.display_state === "one_way_no_zero" &&
+                              battery.state.toBattery === 0 &&
+                              battery.state.fromBattery === 0
                             ? "padding-top: 2px; padding-bottom: 0px;"
                             : "padding-top: 2px; padding-bottom: 2px;"}
                           @click=${(e: { stopPropagation: () => void }) => {

src/type.ts

@@ -30,11 +30,12 @@ export interface baseConfigEntity {
   invert_state?: boolean;
 }
 
-export type gridPowerOutage = {
+export type GridPowerOutage = {
   entity: string;
   state_alert?: string;
   label_alert?: string;
   icon_alert?: string;
+  entity_generator?: string;
 };
 
 export type IndividualDeviceType = baseConfigEntity & {

src/ui-editor/schema/grid.ts

@@ -26,14 +26,12 @@ const mainSchema = {
 };
 
 const powerOutageGridSchema = [
-  {
-    name: "entity",
-    selector: { entity: {} },
-  },
   {
     type: "grid",
     column_min_width: "200px",
     schema: [
+      { name: "entity", selector: { entity: {} } },
+      { name: "entity_generator", label: "Generator Entity", selector: { entity: {} } },
       { name: "label_alert", label: "Outage Label", selector: { text: {} } },
       { name: "icon_alert", label: "Outage Icon", selector: { icon: {} } },
       { name: "state_alert", label: "Outage State", selector: { text: {} } },