Add energy distribution card to auto lovelace if energy configured (#9675)

* Add energy distribution card to auto lovelace if energy configured

* Add import

Co-authored-by: Bram Kragten <mail@bramkragten.nl>

src/panels/lovelace/cards/energy/hui-energy-distribution-card.ts

@@ -11,6 +11,7 @@ import { css, html, LitElement, svg } from "lit";
 import { customElement, property, state } from "lit/decorators";
 import { classMap } from "lit/directives/class-map";
 import { ifDefined } from "lit/directives/if-defined";
+import "@material/mwc-button";
 import { formatNumber } from "../../../../common/string/format_number";
 import "../../../../components/ha-card";
 import "../../../../components/ha-svg-icon";
@@ -401,6 +402,15 @@ class HuiEnergyDistrubutionCard
             </svg>
           </div>
         </div>
+        ${this._config.linkDashboard
+          ? html`
+              <div class="card-actions">
+                <a href="/energy"
+                  ><mwc-button> Go to the energy dashboard </mwc-button></a
+                >
+              </div>
+            `
+          : ""}
       </ha-card>
     `;
   }
@@ -556,6 +566,9 @@ class HuiEnergyDistrubutionCard
         stroke-dasharray: 238.76104;
       }
     }
+    .card-actions a {
+      text-decoration: none;
+    }
   `;
 }
 

src/panels/lovelace/cards/types.ts

@@ -98,6 +98,7 @@ export interface EnergySummaryCardConfig extends LovelaceCardConfig {
 export interface EnergyDistributionCardConfig extends LovelaceCardConfig {
   type: "energy-distribution";
   title?: string;
+  linkDashboard?: boolean;
   collection_key?: string;
 }
 export interface EnergyUsageGraphCardConfig extends LovelaceCardConfig {

src/panels/lovelace/common/generate-lovelace-config.ts

@@ -7,6 +7,10 @@ import { compare } from "../../../common/string/compare";
 import { LocalizeFunc } from "../../../common/translations/localize";
 import type { AreaRegistryEntry } from "../../../data/area_registry";
 import type { DeviceRegistryEntry } from "../../../data/device_registry";
+import {
+  EnergyPreferences,
+  GridSourceTypeEnergyPreference,
+} from "../../../data/energy";
 import type { EntityRegistryEntry } from "../../../data/entity_registry";
 import { domainToName } from "../../../data/integration";
 import { LovelaceCardConfig, LovelaceViewConfig } from "../../../data/lovelace";
@@ -292,7 +296,8 @@ export const generateDefaultViewConfig = (
   deviceEntries: DeviceRegistryEntry[],
   entityEntries: EntityRegistryEntry[],
   entities: HassEntities,
-  localize: LocalizeFunc
+  localize: LocalizeFunc,
+  energyPrefs?: EnergyPreferences
 ): LovelaceViewConfig => {
   const states = computeDefaultViewStates(entities, entityEntries);
   const path = "default_view";
@@ -337,6 +342,21 @@ export const generateDefaultViewConfig = (
     );
   });
 
+  if (energyPrefs) {
+    // Distribution card requires the grid to be configured
+    const grid = energyPrefs.energy_sources.find(
+      (source) => source.type === "grid"
+    ) as GridSourceTypeEnergyPreference | undefined;
+
+    if (grid && grid.flow_from.length > 0) {
+      areaCards.push({
+        title: "Energy distribution",
+        type: "energy-distribution",
+        linkDashboard: true,
+      });
+    }
+  }
+
   config.cards!.unshift(...areaCards);
 
   return config;

src/panels/lovelace/strategies/original-states-strategy.ts

@@ -2,6 +2,7 @@ import { STATE_NOT_RUNNING } from "home-assistant-js-websocket";
 import { subscribeOne } from "../../../common/util/subscribe-one";
 import { subscribeAreaRegistry } from "../../../data/area_registry";
 import { subscribeDeviceRegistry } from "../../../data/device_registry";
+import { getEnergyPreferences } from "../../../data/energy";
 import { subscribeEntityRegistry } from "../../../data/entity_registry";
 import { generateDefaultViewConfig } from "../common/generate-lovelace-config";
 import {
@@ -37,12 +38,14 @@ export class OriginalStatesStrategy {
       subscribeEntityRegistry(hass.connection, () => undefined);
     }
 
-    const [areaEntries, deviceEntries, entityEntries, localize] =
+    const [areaEntries, deviceEntries, entityEntries, localize, energyPrefs] =
       await Promise.all([
         subscribeOne(hass.connection, subscribeAreaRegistry),
         subscribeOne(hass.connection, subscribeDeviceRegistry),
         subscribeOne(hass.connection, subscribeEntityRegistry),
         hass.loadBackendTranslation("title"),
+        // It raises if not configured, just swallow that.
+        getEnergyPreferences(hass).catch(() => undefined),
       ]);
 
     // User can override default view. If they didn't, we will add one
@@ -52,7 +55,8 @@ export class OriginalStatesStrategy {
       deviceEntries,
       entityEntries,
       hass.states,
-      localize
+      localize,
+      energyPrefs
     );
 
     // Add map of geo locations to default view if loaded