From 0c352ba1dce52da65c59eb206da51d9de11ea838 Mon Sep 17 00:00:00 2001 From: Philip Allgaier Date: Sun, 3 Jan 2021 00:32:07 +0100 Subject: [PATCH 1/2] Correctly handle "hours to show" for footer graph --- .../header-footer/hui-graph-header-footer.ts | 23 +++++++++++++++---- 1 file changed, 19 insertions(+), 4 deletions(-) diff --git a/src/panels/lovelace/header-footer/hui-graph-header-footer.ts b/src/panels/lovelace/header-footer/hui-graph-header-footer.ts index 9c3cc406d3a7..4d622eab4078 100644 --- a/src/panels/lovelace/header-footer/hui-graph-header-footer.ts +++ b/src/panels/lovelace/header-footer/hui-graph-header-footer.ts @@ -21,7 +21,7 @@ import { LovelaceHeaderFooter, LovelaceHeaderFooterEditor } from "../types"; import { GraphHeaderFooterConfig } from "./types"; const MINUTE = 60000; -const DAY = 86400000; +const HOUR = MINUTE * 60; @customElement("hui-graph-header-footer") export class HuiGraphHeaderFooter extends LitElement @@ -162,10 +162,25 @@ export class HuiGraphHeaderFooter extends LitElement : this._date; if (this._stateHistory!.length) { - this._stateHistory = this._stateHistory!.filter( - (entity) => - endTime.getTime() - new Date(entity.last_changed).getTime() <= DAY + const inHoursToShow: HassEntity[] = []; + const outHoursToShow: HassEntity[] = []; + // Split into inside and outside of "hours to show". + this._stateHistory!.forEach((entity) => + (endTime.getTime() - new Date(entity.last_changed).getTime() <= + this._config!.hours_to_show! * HOUR + ? inHoursToShow + : outHoursToShow + ).push(entity) ); + this._stateHistory = []; + + if (outHoursToShow.length) { + // If we have values that are now outside of "hours to show", re-add the last entry. This could e.g. be + // the "initial state" from the history backend. Without it, it would look like there is no history data + // at the start at all in the database = graph would start suddenly instead of on the left side of the card. + this._stateHistory.push(outHoursToShow[outHoursToShow.length - 1]); + } + this._stateHistory = this._stateHistory.concat(inHoursToShow); } const stateHistory = await fetchRecent( From 343ff4d1bcc544bf511e46a38e3b3725c3dd8349 Mon Sep 17 00:00:00 2001 From: Philip Allgaier Date: Mon, 4 Jan 2021 10:34:57 +0100 Subject: [PATCH 2/2] Apply suggestions from code review Co-authored-by: Bram Kragten --- src/panels/lovelace/header-footer/hui-graph-header-footer.ts | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/src/panels/lovelace/header-footer/hui-graph-header-footer.ts b/src/panels/lovelace/header-footer/hui-graph-header-footer.ts index 4d622eab4078..6085f22e6975 100644 --- a/src/panels/lovelace/header-footer/hui-graph-header-footer.ts +++ b/src/panels/lovelace/header-footer/hui-graph-header-footer.ts @@ -172,15 +172,14 @@ export class HuiGraphHeaderFooter extends LitElement : outHoursToShow ).push(entity) ); - this._stateHistory = []; if (outHoursToShow.length) { // If we have values that are now outside of "hours to show", re-add the last entry. This could e.g. be // the "initial state" from the history backend. Without it, it would look like there is no history data // at the start at all in the database = graph would start suddenly instead of on the left side of the card. - this._stateHistory.push(outHoursToShow[outHoursToShow.length - 1]); + inHoursToShow.push(outHoursToShow[outHoursToShow.length - 1]); } - this._stateHistory = this._stateHistory.concat(inHoursToShow); + this._stateHistory = inHoursToShow; } const stateHistory = await fetchRecent(