From 38e64be3af9120ef95e80dd9b0cc88367c0c5d1f Mon Sep 17 00:00:00 2001
From: Iris Scholten <ischolten.is@gmail.com>
Date: Thu, 21 Jun 2018 13:43:11 -0700
Subject: [PATCH] Ensure hoverTime is a valid time range for the dygraph

---
 ui/src/shared/components/Crosshair.tsx | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/ui/src/shared/components/Crosshair.tsx b/ui/src/shared/components/Crosshair.tsx
index 79b63af286..7104056908 100644
--- a/ui/src/shared/components/Crosshair.tsx
+++ b/ui/src/shared/components/Crosshair.tsx
@@ -34,9 +34,17 @@ class Crosshair extends PureComponent<Props> {
   }
 
   private get isVisible() {
-    const {hoverTime} = this.props
+    const {dygraph, hoverTime} = this.props
+    const timeRanges = dygraph.xAxisRange()
 
-    return hoverTime !== 0 && _.isFinite(hoverTime)
+    const minTimeRange = timeRanges[0]
+    const isBeforeMinTimeRange = hoverTime < minTimeRange
+
+    const maxTimeRange = timeRanges[1]
+    const isPastMaxTimeRange = hoverTime > maxTimeRange
+
+    const isValidHoverTime = !isBeforeMinTimeRange && !isPastMaxTimeRange
+    return hoverTime !== 0 && _.isFinite(hoverTime) && isValidHoverTime
   }
 
   private get crosshairLeft(): number {