From 375a5323d5ad900df260975214938b378bf81868 Mon Sep 17 00:00:00 2001
From: Philip Allgaier <mail@spacegaier.de>
Date: Sun, 3 Oct 2021 20:35:53 +0200
Subject: [PATCH] Prevent wrong colors in history timeline for inverted
 unavailable states (#10137)

---
 src/components/chart/state-history-chart-timeline.ts | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/components/chart/state-history-chart-timeline.ts b/src/components/chart/state-history-chart-timeline.ts
index 7fa9d4d552..6aa8c2951b 100644
--- a/src/components/chart/state-history-chart-timeline.ts
+++ b/src/components/chart/state-history-chart-timeline.ts
@@ -56,7 +56,11 @@ const getColor = (
   entityState: HassEntity,
   computedStyles: CSSStyleDeclaration
 ) => {
-  if (invertOnOff(entityState)) {
+  // Inversion is only valid for "on" or "off" state
+  if (
+    (stateString === "on" || stateString === "off") &&
+    invertOnOff(entityState)
+  ) {
     stateString = stateString === "on" ? "off" : "on";
   }
   if (stateColorMap.has(stateString)) {