From aee13563cefd5ce555115b8e1e90882b4ce7d733 Mon Sep 17 00:00:00 2001
From: Victor Marin <36818606+mdvictor@users.noreply.github.com>
Date: Mon, 5 Sep 2022 14:11:06 +0300
Subject: [PATCH] Fix StateTimeline duration bug + add hidden tooltip option
 (#54697)

---
 .../components/uPlot/config/addTooltipSupport.ts  |  2 +-
 .../panel/state-timeline/StateTimelinePanel.tsx   | 15 ++++++++++++++-
 .../panel/status-history/StatusHistoryPanel.tsx   | 14 +++++++++++++-
 3 files changed, 28 insertions(+), 3 deletions(-)

diff --git a/packages/grafana-ui/src/components/uPlot/config/addTooltipSupport.ts b/packages/grafana-ui/src/components/uPlot/config/addTooltipSupport.ts
index 53823ce56c5..b0d47ac643a 100644
--- a/packages/grafana-ui/src/components/uPlot/config/addTooltipSupport.ts
+++ b/packages/grafana-ui/src/components/uPlot/config/addTooltipSupport.ts
@@ -104,7 +104,7 @@ export const addTooltipSupport = ({
   }
 
   config.addHook('setLegend', (u) => {
-    if (!isToolTipOpen.current) {
+    if (!isToolTipOpen.current && !tooltipInterpolator) {
       setFocusedPointIdx(u.legend.idx!);
     }
     if (u.cursor.idxs != null) {
diff --git a/public/app/plugins/panel/state-timeline/StateTimelinePanel.tsx b/public/app/plugins/panel/state-timeline/StateTimelinePanel.tsx
index 966ad8d8c22..ae0a2eb6f9a 100644
--- a/public/app/plugins/panel/state-timeline/StateTimelinePanel.tsx
+++ b/public/app/plugins/panel/state-timeline/StateTimelinePanel.tsx
@@ -1,7 +1,15 @@
 import React, { useCallback, useMemo, useRef, useState } from 'react';
 
 import { CartesianCoords2D, DataFrame, FieldType, PanelProps } from '@grafana/data';
-import { Portal, UPlotConfigBuilder, usePanelContext, useTheme2, VizTooltipContainer, ZoomPlugin } from '@grafana/ui';
+import {
+  Portal,
+  TooltipDisplayMode,
+  UPlotConfigBuilder,
+  usePanelContext,
+  useTheme2,
+  VizTooltipContainer,
+  ZoomPlugin,
+} from '@grafana/ui';
 import { HoverEvent, addTooltipSupport } from '@grafana/ui/src/components/uPlot/config/addTooltipSupport';
 import { CloseButton } from 'app/core/components/CloseButton/CloseButton';
 import { getLastStreamingDataFramePacket } from 'app/features/live/data/StreamingDataFrame';
@@ -172,6 +180,11 @@ export const StateTimelinePanel: React.FC<TimelinePanelProps> = ({
             isToolTipOpen,
           });
         }
+
+        if (options.tooltip.mode === TooltipDisplayMode.None) {
+          return null;
+        }
+
         return (
           <>
             <ZoomPlugin config={config} onZoom={onChangeTimeRange} />
diff --git a/public/app/plugins/panel/status-history/StatusHistoryPanel.tsx b/public/app/plugins/panel/status-history/StatusHistoryPanel.tsx
index fac039f47be..ddeb9a3298a 100644
--- a/public/app/plugins/panel/status-history/StatusHistoryPanel.tsx
+++ b/public/app/plugins/panel/status-history/StatusHistoryPanel.tsx
@@ -1,7 +1,14 @@
 import React, { useCallback, useMemo, useRef, useState } from 'react';
 
 import { CartesianCoords2D, DataFrame, FieldType, PanelProps } from '@grafana/data';
-import { Portal, UPlotConfigBuilder, useTheme2, VizTooltipContainer, ZoomPlugin } from '@grafana/ui';
+import {
+  Portal,
+  TooltipDisplayMode,
+  UPlotConfigBuilder,
+  useTheme2,
+  VizTooltipContainer,
+  ZoomPlugin,
+} from '@grafana/ui';
 import { HoverEvent, addTooltipSupport } from '@grafana/ui/src/components/uPlot/config/addTooltipSupport';
 import { CloseButton } from 'app/core/components/CloseButton/CloseButton';
 
@@ -174,6 +181,11 @@ export const StatusHistoryPanel: React.FC<TimelinePanelProps> = ({
             isToolTipOpen,
           });
         }
+
+        if (options.tooltip.mode === TooltipDisplayMode.None) {
+          return null;
+        }
+
         return (
           <>
             <ZoomPlugin config={config} onZoom={onChangeTimeRange} />