fix(6482): remove show-graph-subquery button (#6525)

Author: wiedld

src/dataExplorer/components/Results.tsx

@@ -6,11 +6,9 @@ import {
   FlexBox,
   FlexDirection,
   IconFont,
-  Overlay,
   SelectGroup,
   SpinnerContainer,
   TechnoSpinner,
-  TextArea,
 } from '@influxdata/clockface'
 
 // Components
@@ -39,7 +37,6 @@ import {RemoteDataState, SimpleTableViewProperties} from 'src/types'
 
 // Utils
 import {bytesFormatter} from 'src/shared/copy/notifications'
-import {sqlAsFlux} from 'src/shared/contexts/query/preprocessing'
 
 import './Results.scss'
 import {LanguageType} from './resources'
@@ -161,22 +158,6 @@ const TableResults: FC<{search: string}> = ({search}) => {
   )
 }
 
-const GraphSubQueryOverlay: FC<{text: string; onClose: () => void}> = ({
-  text,
-  onClose,
-}) => (
-  <Overlay.Container maxWidth={600}>
-    <Overlay.Header title="Subquery for graph data:" onDismiss={onClose} />
-    <Overlay.Body>
-      <TextArea
-        testID="data-explorer-results--graph-subquery"
-        value={text}
-        readOnly
-      />
-    </Overlay.Body>
-  </Overlay.Container>
-)
-
 const GraphResults: FC = () => {
   const {view} = useContext(ResultsViewContext)
   const {result, status} = useContext(ChildResultsContext)
@@ -198,19 +179,12 @@ const GraphResults: FC = () => {
 }
 
 const WrappedOptions: FC = () => {
-  const [showOverlay, setShowOverlay] = useState(false)
-  const {result, queryModifers} = useContext(ChildResultsContext)
+  const {result} = useContext(ChildResultsContext)
   const {view, setView, selectViewOptions, viewOptions, selectedViewOptions} =
     useContext(ResultsViewContext)
-  const {resource, query: text, selection} = useContext(PersistanceContext)
+  const {resource} = useContext(PersistanceContext)
   const dataExists = !!result?.parsed
 
-  const subquery = useMemo(
-    () => sqlAsFlux(text, selection?.bucket, queryModifers),
-    [text, selection?.bucket, queryModifers]
-  )
-  const seeGraphSubquery = () => setShowOverlay(true)
-
   const updateChildResults = update => {
     setView({
       ...view,
@@ -232,18 +206,11 @@ const WrappedOptions: FC = () => {
         selectViewOptions={selectViewOptions}
         allViewOptions={viewOptions}
         selectedViewOptions={selectedViewOptions}
-        seeSubquery={selection?.bucket ? seeGraphSubquery : null}
       />
     ) : null
 
   return (
     <>
-      <Overlay visible={showOverlay}>
-        <GraphSubQueryOverlay
-          text={subquery}
-          onClose={() => setShowOverlay(false)}
-        />
-      </Overlay>
       {subQueryOptions}
       <ViewOptions
         properties={view.properties}

src/dataExplorer/components/SqlViewOptions.scss

@@ -14,10 +14,4 @@
     height: $cf-form-lg-height;
     justify-content: space-between;
   }
-  .sql-view-options--see-query {
-    padding-top: $cf-form-xs-height;
-    display: flex;
-    justify-content: center;
-    overflow: hidden;
-  }
 }

src/dataExplorer/components/SqlViewOptions.tsx

@@ -1,8 +1,6 @@
 import React, {FC} from 'react'
 import {
-  Button,
   Columns,
-  ComponentStatus,
   FlexBox,
   Grid,
   RangeSlider,
@@ -20,14 +18,12 @@ interface SqlViewOptionsT {
   selectViewOptions: (_: RecursivePartial<ViewOptions>) => void
   allViewOptions: ViewOptions
   selectedViewOptions: ViewOptions
-  seeSubquery: () => void
 }
 
 export const SqlViewOptions: FC<SqlViewOptionsT> = ({
   selectViewOptions,
   allViewOptions,
   selectedViewOptions,
-  seeSubquery,
 }) => {
   const handleSelectedListItem = (propKey, value) => {
     if ((selectedViewOptions[propKey] ?? []).includes(value)) {
@@ -141,18 +137,6 @@ export const SqlViewOptions: FC<SqlViewOptionsT> = ({
               labelPrefix="retained "
               labelSuffix="%"
             />
-            <div className="sql-view-options--see-query">
-              <Button
-                testID="sql-view-options--see-query"
-                text="View graph subquery"
-                status={
-                  !seeSubquery
-                    ? ComponentStatus.Disabled
-                    : ComponentStatus.Valid
-                }
-                onClick={seeSubquery}
-              />
-            </div>
           </Grid.Column>
         </Grid.Row>
       </Grid>