From 653aeae3d85e323bb20535f705aa711ae5aee8c6 Mon Sep 17 00:00:00 2001
From: karwosts <32912880+karwosts@users.noreply.github.com>
Date: Thu, 30 Jan 2025 22:45:37 -0800
Subject: [PATCH] Improve statistics graph axis when using
 energy_date_selection (#23974)

---
 src/components/chart/statistics-chart.ts         |  6 ++++++
 .../lovelace/cards/hui-statistics-graph-card.ts  | 16 ++++++++++++++--
 2 files changed, 20 insertions(+), 2 deletions(-)

diff --git a/src/components/chart/statistics-chart.ts b/src/components/chart/statistics-chart.ts
index 6c54e511d9..614b2bce4a 100644
--- a/src/components/chart/statistics-chart.ts
+++ b/src/components/chart/statistics-chart.ts
@@ -56,6 +56,8 @@ export class StatisticsChart extends LitElement {
 
   @property() public unit?: string;
 
+  @property({ attribute: false }) public startTime?: Date;
+
   @property({ attribute: false }) public endTime?: Date;
 
   @property({ attribute: false, type: Array })
@@ -124,6 +126,8 @@ export class StatisticsChart extends LitElement {
       changedProps.has("fitYData") ||
       changedProps.has("logarithmicScale") ||
       changedProps.has("hideLegend") ||
+      changedProps.has("startTime") ||
+      changedProps.has("endTime") ||
       changedProps.has("_legendData")
     ) {
       this._createOptions();
@@ -218,6 +222,8 @@ export class StatisticsChart extends LitElement {
           this.hass.config,
           dayDifference
         ),
+        min: this.startTime,
+        max: this.endTime,
         axisLine: {
           show: false,
         },
diff --git a/src/panels/lovelace/cards/hui-statistics-graph-card.ts b/src/panels/lovelace/cards/hui-statistics-graph-card.ts
index 1ecde26862..f94e970073 100644
--- a/src/panels/lovelace/cards/hui-statistics-graph-card.ts
+++ b/src/panels/lovelace/cards/hui-statistics-graph-card.ts
@@ -6,7 +6,10 @@ import { customElement, property, state } from "lit/decorators";
 import { classMap } from "lit/directives/class-map";
 import "../../../components/ha-card";
 import { getEnergyDataCollection } from "../../../data/energy";
-import { getSuggestedPeriod } from "./energy/common/energy-chart-options";
+import {
+  getSuggestedMax,
+  getSuggestedPeriod,
+} from "./energy/common/energy-chart-options";
 import type {
   Statistics,
   StatisticsMetaData,
@@ -274,10 +277,19 @@ export class HuiStatisticsGraphCard extends LitElement implements LovelaceCard {
             .unit=${this._unit}
             .minYAxis=${this._config.min_y_axis}
             .maxYAxis=${this._config.max_y_axis}
+            .startTime=${this._energyStart}
+            .endTime=${this._energyEnd && this._energyStart
+              ? getSuggestedMax(
+                  differenceInDays(this._energyEnd, this._energyStart),
+                  this._energyEnd
+                )
+              : undefined}
             .fitYData=${this._config.fit_y_data || false}
             .hideLegend=${this._config.hide_legend || false}
             .logarithmicScale=${this._config.logarithmic_scale || false}
-            .daysToShow=${this._config.days_to_show || DEFAULT_DAYS_TO_SHOW}
+            .daysToShow=${this._energyStart && this._energyEnd
+              ? differenceInDays(this._energyEnd, this._energyStart)
+              : this._config.days_to_show || DEFAULT_DAYS_TO_SHOW}
             .height=${this._config.grid_options?.rows ? "100%" : undefined}
           ></statistics-chart>
         </div>