From 431a53594b9876d326db78b13818d64bcec5bc82 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Torkel=20=C3=96degaard?= <torkel@grafana.org>
Date: Wed, 9 Sep 2020 08:47:18 +0200
Subject: [PATCH] Inspect: Fixed missing rows issue in inspect data (#27422)

---
 .../components/Inspector/InspectDataTab.tsx   | 50 +++++++++----------
 1 file changed, 23 insertions(+), 27 deletions(-)

diff --git a/public/app/features/dashboard/components/Inspector/InspectDataTab.tsx b/public/app/features/dashboard/components/Inspector/InspectDataTab.tsx
index eed27f4f838..4fe27e03650 100644
--- a/public/app/features/dashboard/components/Inspector/InspectDataTab.tsx
+++ b/public/app/features/dashboard/components/Inspector/InspectDataTab.tsx
@@ -45,9 +45,9 @@ export class InspectDataTab extends PureComponent<Props, State> {
     super(props);
 
     this.state = {
-      selectedDataFrame: DataTransformerID.seriesToColumns,
+      selectedDataFrame: 0,
       dataFrameIndex: 0,
-      transformId: DataTransformerID.seriesToColumns,
+      transformId: DataTransformerID.noop,
       transformationOptions: buildTransformationOptions(),
     };
   }
@@ -141,28 +141,28 @@ export class InspectDataTab extends PureComponent<Props, State> {
       return activeString;
     }
 
+    const parts: string[] = [];
+
     if (selectedDataFrame === DataTransformerID.seriesToColumns) {
-      activeString = 'series joined by time';
-    } else {
-      activeString = getFrameDisplayName(data[selectedDataFrame as number]);
+      parts.push('Series joined by time');
+    } else if (data.length > 1) {
+      parts.push(getFrameDisplayName(data[selectedDataFrame as number]));
     }
 
     if (options.withTransforms || options.withFieldConfig) {
-      activeString += ' - applied ';
       if (options.withTransforms) {
-        activeString += 'panel transformations ';
+        parts.push('Panel transforms');
       }
 
       if (options.withTransforms && options.withFieldConfig) {
-        activeString += 'and  ';
       }
 
       if (options.withFieldConfig) {
-        activeString += 'formatted data';
+        parts.push('Formatted data');
       }
     }
 
-    return activeString;
+    return parts.join(', ');
   }
 
   renderDataOptions(dataFrames: DataFrame[]) {
@@ -197,28 +197,24 @@ export class InspectDataTab extends PureComponent<Props, State> {
 
     return (
       <QueryOperationRow
-        id="Table data options"
+        id="Data options"
         index={0}
-        title="Table data options"
+        title="Data options"
         headerElement={<DetailText>{this.getActiveString()}</DetailText>}
         isOpen={false}
       >
         <div className={styles.options}>
-          <VerticalGroup spacing="lg">
-            <Field
-              label="Show data frame"
-              className={css`
-                margin-bottom: 0;
-              `}
-              disabled={data!.length < 2}
-            >
-              <Select
-                options={selectableOptions}
-                value={selectedDataFrame}
-                onChange={this.onDataFrameChange}
-                width={30}
-              />
-            </Field>
+          <VerticalGroup spacing="none">
+            {data!.length > 1 && (
+              <Field label="Show data frame">
+                <Select
+                  options={selectableOptions}
+                  value={selectedDataFrame}
+                  onChange={this.onDataFrameChange}
+                  width={30}
+                />
+              </Field>
+            )}
 
             <HorizontalGroup>
               {showPanelTransformationsOption && (