From 09e496acfd0f63d3ac09b25067991bf2af343a81 Mon Sep 17 00:00:00 2001
From: Haris Rozajac <58232930+harisrozajac@users.noreply.github.com>
Date: Fri, 27 Oct 2023 07:19:43 -0600
Subject: [PATCH] Explore TraceView: Remove 'Scroll to top' button (#77158)

* Remove button from Explore but keep in plugins

* Remove topOfViewRef from trace view container
---
 public/app/features/explore/Explore.tsx            |  1 -
 .../app/features/explore/TraceView/TraceView.tsx   |  4 ++--
 .../explore/TraceView/TraceViewContainer.test.tsx  | 11 ++---------
 .../explore/TraceView/TraceViewContainer.tsx       |  8 ++------
 .../VirtualizedTraceView.test.tsx                  |  4 ++--
 .../TraceTimelineViewer/VirtualizedTraceView.tsx   | 14 ++++++++------
 6 files changed, 16 insertions(+), 26 deletions(-)

diff --git a/public/app/features/explore/Explore.tsx b/public/app/features/explore/Explore.tsx
index c41cbde0c0c..4121b2f8d2c 100644
--- a/public/app/features/explore/Explore.tsx
+++ b/public/app/features/explore/Explore.tsx
@@ -501,7 +501,6 @@ export class Explore extends React.PureComponent<Props, ExploreState> {
             splitOpenFn={this.onSplitOpen('traceView')}
             scrollElement={this.scrollElement}
             queryResponse={queryResponse}
-            topOfViewRef={this.topOfViewRef}
           />
         </ContentOutlineItem>
       )
diff --git a/public/app/features/explore/TraceView/TraceView.tsx b/public/app/features/explore/TraceView/TraceView.tsx
index bbe96d1b37c..1b5e8d29414 100644
--- a/public/app/features/explore/TraceView/TraceView.tsx
+++ b/public/app/features/explore/TraceView/TraceView.tsx
@@ -64,8 +64,8 @@ type Props = {
   traceProp: Trace;
   queryResponse: PanelData;
   datasource: DataSourceApi<DataQuery, DataSourceJsonData, {}> | undefined;
-  topOfViewRef: RefObject<HTMLDivElement>;
-  topOfViewRefType: TopOfViewRefType;
+  topOfViewRef?: RefObject<HTMLDivElement>;
+  topOfViewRefType?: TopOfViewRefType;
   createSpanLink?: SpanLinkFunc;
 };
 
diff --git a/public/app/features/explore/TraceView/TraceViewContainer.test.tsx b/public/app/features/explore/TraceView/TraceViewContainer.test.tsx
index da155cec531..b9d5cf46755 100644
--- a/public/app/features/explore/TraceView/TraceViewContainer.test.tsx
+++ b/public/app/features/explore/TraceView/TraceViewContainer.test.tsx
@@ -1,6 +1,6 @@
 import { render, screen, waitFor } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
-import React, { createRef } from 'react';
+import React from 'react';
 import { Provider } from 'react-redux';
 
 import { getDefaultTimeRange, LoadingState } from '@grafana/data';
@@ -24,17 +24,10 @@ function renderTraceViewContainer(frames = [frameOld]) {
     series: [],
     timeRange: getDefaultTimeRange(),
   };
-  const topOfViewRef = createRef<HTMLDivElement>();
 
   const { container, baseElement } = render(
     <Provider store={store}>
-      <TraceViewContainer
-        exploreId="left"
-        dataFrames={frames}
-        splitOpenFn={() => {}}
-        queryResponse={mockPanelData}
-        topOfViewRef={topOfViewRef}
-      />
+      <TraceViewContainer exploreId="left" dataFrames={frames} splitOpenFn={() => {}} queryResponse={mockPanelData} />
     </Provider>
   );
   return {
diff --git a/public/app/features/explore/TraceView/TraceViewContainer.tsx b/public/app/features/explore/TraceView/TraceViewContainer.tsx
index 2f37c70d31b..42e4d1fa1de 100644
--- a/public/app/features/explore/TraceView/TraceViewContainer.tsx
+++ b/public/app/features/explore/TraceView/TraceViewContainer.tsx
@@ -1,11 +1,10 @@
-import React, { RefObject, useMemo } from 'react';
+import React, { useMemo } from 'react';
 
 import { DataFrame, SplitOpen, PanelData } from '@grafana/data';
 import { PanelChrome } from '@grafana/ui/src/components/PanelChrome/PanelChrome';
 import { StoreState, useSelector } from 'app/types';
 
 import { TraceView } from './TraceView';
-import { TopOfViewRefType } from './components/TraceTimelineViewer/VirtualizedTraceView';
 import { transformDataFrames } from './utils/transform';
 
 interface Props {
@@ -14,13 +13,12 @@ interface Props {
   exploreId: string;
   scrollElement?: Element;
   queryResponse: PanelData;
-  topOfViewRef: RefObject<HTMLDivElement>;
 }
 
 export function TraceViewContainer(props: Props) {
   // At this point we only show single trace
   const frame = props.dataFrames[0];
-  const { dataFrames, splitOpenFn, exploreId, scrollElement, topOfViewRef, queryResponse } = props;
+  const { dataFrames, splitOpenFn, exploreId, scrollElement, queryResponse } = props;
   const traceProp = useMemo(() => transformDataFrames(frame), [frame]);
   const datasource = useSelector(
     (state: StoreState) => state.explore.panes[props.exploreId]?.datasourceInstance ?? undefined
@@ -40,8 +38,6 @@ export function TraceViewContainer(props: Props) {
         traceProp={traceProp}
         queryResponse={queryResponse}
         datasource={datasource}
-        topOfViewRef={topOfViewRef}
-        topOfViewRefType={TopOfViewRefType.Explore}
       />
     </PanelChrome>
   );
diff --git a/public/app/features/explore/TraceView/components/TraceTimelineViewer/VirtualizedTraceView.test.tsx b/public/app/features/explore/TraceView/components/TraceTimelineViewer/VirtualizedTraceView.test.tsx
index 2ceddbfb0c6..cf81e80bbd4 100644
--- a/public/app/features/explore/TraceView/components/TraceTimelineViewer/VirtualizedTraceView.test.tsx
+++ b/public/app/features/explore/TraceView/components/TraceTimelineViewer/VirtualizedTraceView.test.tsx
@@ -25,7 +25,7 @@ import VirtualizedTraceView, { VirtualizedTraceViewProps } from './VirtualizedTr
 jest.mock('./SpanTreeOffset');
 
 const trace = transformTraceData(traceGenerator.trace({ numberOfSpans: 2 }))!;
-const topOfExploreViewRef = jest.fn();
+
 let props = {
   childrenHiddenIDs: new Set(),
   childrenToggle: jest.fn(),
@@ -41,7 +41,7 @@ let props = {
   spanNameColumnWidth: 0.5,
   trace,
   uiFind: 'uiFind',
-  topOfExploreViewRef,
+  topOfViewRef: jest.fn(),
 } as unknown as VirtualizedTraceViewProps;
 
 describe('<VirtualizedTraceViewImpl>', () => {
diff --git a/public/app/features/explore/TraceView/components/TraceTimelineViewer/VirtualizedTraceView.tsx b/public/app/features/explore/TraceView/components/TraceTimelineViewer/VirtualizedTraceView.tsx
index 1c7af44fe83..392075699ea 100644
--- a/public/app/features/explore/TraceView/components/TraceTimelineViewer/VirtualizedTraceView.tsx
+++ b/public/app/features/explore/TraceView/components/TraceTimelineViewer/VirtualizedTraceView.tsx
@@ -566,12 +566,14 @@ export class UnthemedVirtualizedTraceView extends React.Component<VirtualizedTra
           windowScroller={false}
           scrollElement={scrollElement}
         />
-        <ToolbarButton
-          className={styles.scrollToTopButton}
-          onClick={this.scrollToTop}
-          title="Scroll to top"
-          icon="arrow-up"
-        ></ToolbarButton>
+        {this.props.topOfViewRef && (
+          <ToolbarButton
+            className={styles.scrollToTopButton}
+            onClick={this.scrollToTop}
+            title="Scroll to top"
+            icon="arrow-up"
+          ></ToolbarButton>
+        )}
       </>
     );
   }