From 01f9232da161a0ee06bbc6bd0b21f1a4321189dc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tobias=20K=C3=BCndig?= <tobias@offline.swiss>
Date: Sun, 11 Oct 2020 15:12:56 +0200
Subject: [PATCH 1/4] Added entity_id to history graph tooltip

---
 src/components/entity/ha-chart-base.js         | 11 +++++++++++
 src/components/state-history-chart-timeline.js | 11 ++++++++++-
 2 files changed, 21 insertions(+), 1 deletion(-)

diff --git a/src/components/entity/ha-chart-base.js b/src/components/entity/ha-chart-base.js
index 7df570747c20..cd5fdb2443e4 100644
--- a/src/components/entity/ha-chart-base.js
+++ b/src/components/entity/ha-chart-base.js
@@ -79,6 +79,10 @@ class HaChartBase extends mixinBehaviors(
           text-align: center;
           font-weight: 500;
         }
+        .chartTooltip .beforeBody {
+          text-align: center;
+          font-weight: 300;
+        }
         .chartLegend li {
           display: inline-block;
           padding: 0 6px;
@@ -133,6 +137,9 @@ class HaChartBase extends mixinBehaviors(
           style$="opacity:[[tooltip.opacity]]; top:[[tooltip.top]]; left:[[tooltip.left]]; padding:[[tooltip.yPadding]]px [[tooltip.xPadding]]px"
         >
           <div class="title">[[tooltip.title]]</div>
+          <template is="dom-if" if="[[tooltip.beforeBody]]">
+            <div class="beforeBody">[[tooltip.beforeBody]]</div>
+          </template>
           <div>
             <ul>
               <template is="dom-repeat" items="[[tooltip.lines]]">
@@ -264,6 +271,10 @@ class HaChartBase extends mixinBehaviors(
     const title = tooltip.title ? tooltip.title[0] || "" : "";
     this.set(["tooltip", "title"], title);
 
+    if (tooltip.beforeBody) {
+        this.set(["tooltip", "beforeBody"], tooltip.beforeBody.join("\n"));
+    }
+
     const bodyLines = tooltip.body.map((n) => n.lines);
 
     // Set Text
diff --git a/src/components/state-history-chart-timeline.js b/src/components/state-history-chart-timeline.js
index 3bbd6054ceb5..5786953d7100 100644
--- a/src/components/state-history-chart-timeline.js
+++ b/src/components/state-history-chart-timeline.js
@@ -159,7 +159,7 @@ class StateHistoryChartTimeline extends LocalizeMixin(PolymerElement) {
       if (prevState !== null) {
         dataRow.push([prevLastChanged, endTime, locState, prevState]);
       }
-      datasets.push({ data: dataRow });
+      datasets.push({ data: dataRow, entity_id: stateInfo.entity_id });
       labels.push(entityDisplay);
     });
 
@@ -172,6 +172,14 @@ class StateHistoryChartTimeline extends LocalizeMixin(PolymerElement) {
 
       return [state, start, end];
     };
+    
+    const formatTooltipBeforeBody = (item, data) => {
+      if (!item[0]) {
+        return '';
+      }
+      const values = data.datasets[item[0].datasetIndex];
+      return values.entity_id || '';
+    };
 
     const chartOptions = {
       type: "timeline",
@@ -179,6 +187,7 @@ class StateHistoryChartTimeline extends LocalizeMixin(PolymerElement) {
         tooltips: {
           callbacks: {
             label: formatTooltipLabel,
+            beforeBody: formatTooltipBeforeBody,
           },
         },
         scales: {

From 3645ec2e7c51705566ecff2db4fadb6a8b765f6e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tobias=20K=C3=BCndig?= <tobias@offline.swiss>
Date: Sun, 11 Oct 2020 15:21:04 +0200
Subject: [PATCH 2/4] Added comment

---
 src/components/state-history-chart-timeline.js | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/components/state-history-chart-timeline.js b/src/components/state-history-chart-timeline.js
index 5786953d7100..124c9b141ed0 100644
--- a/src/components/state-history-chart-timeline.js
+++ b/src/components/state-history-chart-timeline.js
@@ -172,13 +172,14 @@ class StateHistoryChartTimeline extends LocalizeMixin(PolymerElement) {
 
       return [state, start, end];
     };
-    
+
     const formatTooltipBeforeBody = (item, data) => {
       if (!item[0]) {
-        return '';
+        return "";
       }
+      // Extract the entity ID from the dataset.
       const values = data.datasets[item[0].datasetIndex];
-      return values.entity_id || '';
+      return values.entity_id || "";
     };
 
     const chartOptions = {

From 667e7aaf5b6f5401bc7cc374dd049167ace8c290 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tobias=20K=C3=BCndig?= <tobias@offline.swiss>
Date: Mon, 12 Oct 2020 11:55:31 +0200
Subject: [PATCH 3/4] Only display entity_id if advanced mode is enabled

---
 src/components/state-history-chart-timeline.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/state-history-chart-timeline.js b/src/components/state-history-chart-timeline.js
index 124c9b141ed0..55166992d20f 100644
--- a/src/components/state-history-chart-timeline.js
+++ b/src/components/state-history-chart-timeline.js
@@ -174,7 +174,7 @@ class StateHistoryChartTimeline extends LocalizeMixin(PolymerElement) {
     };
 
     const formatTooltipBeforeBody = (item, data) => {
-      if (!item[0]) {
+      if (!this.hass.userData?.showAdvanced || !item[0]) {
         return "";
       }
       // Extract the entity ID from the dataset.

From 492195a0d86917e4ce79f53bacf69416bb1d9a25 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tobias=20K=C3=BCndig?= <tobias@offline.ch>
Date: Mon, 12 Oct 2020 13:12:01 +0200
Subject: [PATCH 4/4] Update src/components/state-history-chart-timeline.js

Co-authored-by: Bram Kragten <mail@bramkragten.nl>
---
 src/components/state-history-chart-timeline.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/state-history-chart-timeline.js b/src/components/state-history-chart-timeline.js
index 55166992d20f..50c234f35fef 100644
--- a/src/components/state-history-chart-timeline.js
+++ b/src/components/state-history-chart-timeline.js
@@ -174,7 +174,7 @@ class StateHistoryChartTimeline extends LocalizeMixin(PolymerElement) {
     };
 
     const formatTooltipBeforeBody = (item, data) => {
-      if (!this.hass.userData?.showAdvanced || !item[0]) {
+      if (!this.hass.userData || !this.hass.userData.showAdvanced || !item[0]) {
         return "";
       }
       // Extract the entity ID from the dataset.