From bb06d0fc287d6d9ced4b441aa111e68bc0546674 Mon Sep 17 00:00:00 2001
From: Tim Roes <mail@timroes.de>
Date: Thu, 5 Jul 2018 08:59:50 +0200
Subject: [PATCH] Inspector enhancements (#20452)

* Rename trigger button to Inspect

* Change default page size to 20

* Change request description layout

* Fix functional tests

* Fix functional test

* Fix more functional tests
---
 .../inspector_views/public/data/data_table.js |  7 +++-
 .../public/requests/details/index.js          |  1 -
 .../details/req_details_description.js        | 40 -------------------
 .../public/requests/request_details.js        |  2 -
 .../public/requests/requests_view.js          |  6 +++
 .../get_inspector_panel_action.js             |  2 +-
 .../kibana/public/visualize/editor/editor.js  |  2 +-
 .../apps/visualize/_heatmap_chart.js          | 12 +++++-
 .../{_spy_panel.js => _inspector.js}          |  0
 test/functional/apps/visualize/_tile_map.js   | 12 +++++-
 .../apps/visualize/_vertical_bar_chart.js     | 10 +++++
 test/functional/apps/visualize/index.js       |  2 +-
 .../functional/page_objects/visualize_page.js |  2 +-
 13 files changed, 48 insertions(+), 50 deletions(-)
 delete mode 100644 src/core_plugins/inspector_views/public/requests/details/req_details_description.js
 rename test/functional/apps/visualize/{_spy_panel.js => _inspector.js} (100%)

diff --git a/src/core_plugins/inspector_views/public/data/data_table.js b/src/core_plugins/inspector_views/public/data/data_table.js
index 3f871213dae6a..2a607d9cc9d50 100644
--- a/src/core_plugins/inspector_views/public/data/data_table.js
+++ b/src/core_plugins/inspector_views/public/data/data_table.js
@@ -108,6 +108,11 @@ class DataTableFormat extends Component {
   render() {
     const { columns, rows } = this.state;
 
+    const pagination = {
+      pageSizeOptions: [10, 20, 50],
+      initialPageSize: 20,
+    };
+
     return (
       <React.Fragment>
         <EuiFlexGroup>
@@ -127,7 +132,7 @@ class DataTableFormat extends Component {
           columns={columns}
           items={rows}
           sorting={true}
-          pagination={true}
+          pagination={pagination}
           compressed={true}
         />
       </React.Fragment>
diff --git a/src/core_plugins/inspector_views/public/requests/details/index.js b/src/core_plugins/inspector_views/public/requests/details/index.js
index 34234e4911e02..f183c4923693d 100644
--- a/src/core_plugins/inspector_views/public/requests/details/index.js
+++ b/src/core_plugins/inspector_views/public/requests/details/index.js
@@ -17,7 +17,6 @@
  * under the License.
  */
 
-export * from './req_details_description';
 export * from './req_details_request';
 export * from './req_details_response';
 export * from './req_details_stats';
diff --git a/src/core_plugins/inspector_views/public/requests/details/req_details_description.js b/src/core_plugins/inspector_views/public/requests/details/req_details_description.js
deleted file mode 100644
index f292e938ac4f6..0000000000000
--- a/src/core_plugins/inspector_views/public/requests/details/req_details_description.js
+++ /dev/null
@@ -1,40 +0,0 @@
-/*
- * Licensed to Elasticsearch B.V. under one or more contributor
- * license agreements. See the NOTICE file distributed with
- * this work for additional information regarding copyright
- * ownership. Elasticsearch B.V. licenses this file to you under
- * the Apache License, Version 2.0 (the "License"); you may
- * not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied.  See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import React from 'react';
-import PropTypes from 'prop-types';
-import {
-  EuiText,
-} from '@elastic/eui';
-
-function RequestDetailsDescription(props) {
-  return (
-    <EuiText className="requests-details__description">
-      { props.request.description }
-    </EuiText>
-  );
-}
-
-RequestDetailsDescription.shouldShow = (request) => !!request.description;
-
-RequestDetailsDescription.propTypes = {
-  request: PropTypes.object.isRequired,
-};
-
-export { RequestDetailsDescription };
diff --git a/src/core_plugins/inspector_views/public/requests/request_details.js b/src/core_plugins/inspector_views/public/requests/request_details.js
index e8621334f999c..1ffbb69e54a9d 100644
--- a/src/core_plugins/inspector_views/public/requests/request_details.js
+++ b/src/core_plugins/inspector_views/public/requests/request_details.js
@@ -25,14 +25,12 @@ import {
 } from '@elastic/eui';
 
 import {
-  RequestDetailsDescription,
   RequestDetailsRequest,
   RequestDetailsResponse,
   RequestDetailsStats,
 } from './details';
 
 const DETAILS = [
-  { name: 'Description', component: RequestDetailsDescription },
   { name: 'Statistics', component: RequestDetailsStats },
   { name: 'Request', component: RequestDetailsRequest },
   { name: 'Response', component: RequestDetailsResponse },
diff --git a/src/core_plugins/inspector_views/public/requests/requests_view.js b/src/core_plugins/inspector_views/public/requests/requests_view.js
index c8459510fde7c..ba08b0ea6afba 100644
--- a/src/core_plugins/inspector_views/public/requests/requests_view.js
+++ b/src/core_plugins/inspector_views/public/requests/requests_view.js
@@ -118,6 +118,12 @@ class RequestsViewComponent extends Component {
           selectedRequest={this.state.request}
           onRequestChanged={this.selectRequest}
         />
+        <EuiSpacer size="xs"/>
+        { this.state.request && this.state.request.description  &&
+          <EuiText size="xs">
+            <p>{this.state.request.description}</p>
+          </EuiText>
+        }
         <EuiSpacer size="m" />
         { this.state.request &&
           <RequestDetails
diff --git a/src/core_plugins/kibana/public/dashboard/panel/panel_header/panel_actions/get_inspector_panel_action.js b/src/core_plugins/kibana/public/dashboard/panel/panel_header/panel_actions/get_inspector_panel_action.js
index d37fc00276b9b..25f039a715eea 100644
--- a/src/core_plugins/kibana/public/dashboard/panel/panel_header/panel_actions/get_inspector_panel_action.js
+++ b/src/core_plugins/kibana/public/dashboard/panel/panel_header/panel_actions/get_inspector_panel_action.js
@@ -37,7 +37,7 @@ export function getInspectorPanelAction({ closeContextMenu, panelTitle }) {
   return new DashboardPanelAction(
     {
       id: 'openInspector',
-      displayName: 'Inspector',
+      displayName: 'Inspect',
       parentPanelId: 'mainMenu',
     },
     {
diff --git a/src/core_plugins/kibana/public/visualize/editor/editor.js b/src/core_plugins/kibana/public/visualize/editor/editor.js
index b0afb15197916..60a3977ec3c0c 100644
--- a/src/core_plugins/kibana/public/visualize/editor/editor.js
+++ b/src/core_plugins/kibana/public/visualize/editor/editor.js
@@ -144,7 +144,7 @@ function VisEditor(
     template: require('plugins/kibana/visualize/editor/panels/share.html'),
     testId: 'visualizeShareButton',
   }, {
-    key: 'inspector',
+    key: 'inspect',
     description: 'Open Inspector for visualization',
     testId: 'openInspectorButton',
     disableButton() {
diff --git a/test/functional/apps/visualize/_heatmap_chart.js b/test/functional/apps/visualize/_heatmap_chart.js
index 3d9a4e0301942..02031e9319339 100644
--- a/test/functional/apps/visualize/_heatmap_chart.js
+++ b/test/functional/apps/visualize/_heatmap_chart.js
@@ -85,7 +85,17 @@ export default function ({ getService, getPageObjects }) {
         ['2015-09-20 18:00', '188'],
         ['2015-09-20 21:00', '31'],
         ['2015-09-21 00:00', '42'],
-        ['2015-09-21 03:00', '202']
+        ['2015-09-21 03:00', '202'],
+        ['2015-09-21 06:00', '683'],
+        ['2015-09-21 09:00', '1,361'],
+        ['2015-09-21 12:00', '1,415'],
+        ['2015-09-21 15:00', '707'],
+        ['2015-09-21 18:00', '177'],
+        ['2015-09-21 21:00', '27'],
+        ['2015-09-22 00:00', '32'],
+        ['2015-09-22 03:00', '175'],
+        ['2015-09-22 06:00', '707'],
+        ['2015-09-22 09:00', '1,408'],
       ];
 
 
diff --git a/test/functional/apps/visualize/_spy_panel.js b/test/functional/apps/visualize/_inspector.js
similarity index 100%
rename from test/functional/apps/visualize/_spy_panel.js
rename to test/functional/apps/visualize/_inspector.js
diff --git a/test/functional/apps/visualize/_tile_map.js b/test/functional/apps/visualize/_tile_map.js
index f1fe1b3562b58..53df7170d418d 100644
--- a/test/functional/apps/visualize/_tile_map.js
+++ b/test/functional/apps/visualize/_tile_map.js
@@ -178,7 +178,17 @@ export default function ({ getService, getPageObjects }) {
             ['-', '9v', '938', { 'lat': 31, 'lon': -96 }],
             ['-', '9q', '722', { 'lat': 36, 'lon': -120 }],
             ['-', '9w', '475', { 'lat': 36, 'lon': -107 }],
-            ['-', 'cb', '457', { 'lat': 46, 'lon': -96 }]
+            ['-', 'cb', '457', { 'lat': 46, 'lon': -96 }],
+            [ '-', 'c2', '453', { lat: 47, lon: -120 } ],
+            [ '-', '9x', '420', { lat: 41, lon: -107 } ],
+            [ '-', 'dq', '399', { lat: 37, lon: -78 } ],
+            [ '-', '9r', '396', { lat: 41, lon: -120 } ],
+            [ '-', '9t', '274', { lat: 32, lon: -107 } ],
+            [ '-', 'c8', '271', { lat: 47, lon: -107 } ],
+            [ '-', 'dh', '214', { lat: 26, lon: -82 } ],
+            [ '-', 'b6', '207', { lat: 60, lon: -162 } ],
+            [ '-', 'bd', '206', { lat: 59, lon: -153 } ],
+            [ '-', 'b7', '167', { lat: 64, lon: -163 } ],
           ];
 
           await PageObjects.visualize.clickMapFitDataBounds();
diff --git a/test/functional/apps/visualize/_vertical_bar_chart.js b/test/functional/apps/visualize/_vertical_bar_chart.js
index 0bb9d28a135d1..3ce28900dd341 100644
--- a/test/functional/apps/visualize/_vertical_bar_chart.js
+++ b/test/functional/apps/visualize/_vertical_bar_chart.js
@@ -97,6 +97,16 @@ export default function ({ getService, getPageObjects }) {
         ['2015-09-20 21:00', '31'],
         ['2015-09-21 00:00', '42'],
         ['2015-09-21 03:00', '202'],
+        [ '2015-09-21 06:00', '683' ],
+        [ '2015-09-21 09:00', '1,361' ],
+        [ '2015-09-21 12:00', '1,415' ],
+        [ '2015-09-21 15:00', '707' ],
+        [ '2015-09-21 18:00', '177' ],
+        [ '2015-09-21 21:00', '27' ],
+        [ '2015-09-22 00:00', '32' ],
+        [ '2015-09-22 03:00', '175' ],
+        [ '2015-09-22 06:00', '707' ],
+        [ '2015-09-22 09:00', '1,408' ],
       ];
 
       await PageObjects.visualize.openInspector();
diff --git a/test/functional/apps/visualize/index.js b/test/functional/apps/visualize/index.js
index 60dde1880615a..3fcbb55229623 100644
--- a/test/functional/apps/visualize/index.js
+++ b/test/functional/apps/visualize/index.js
@@ -32,7 +32,7 @@ export default function ({ getService, loadTestFile }) {
       await kibanaServer.uiSettings.replace({ 'dateFormat:tz': 'UTC', 'defaultIndex': 'logstash-*' });
     });
 
-    loadTestFile(require.resolve('./_spy_panel'));
+    loadTestFile(require.resolve('./_inspector'));
     loadTestFile(require.resolve('./_chart_types'));
     loadTestFile(require.resolve('./_experimental_vis'));
     loadTestFile(require.resolve('./_gauge_chart'));
diff --git a/test/functional/page_objects/visualize_page.js b/test/functional/page_objects/visualize_page.js
index 159588d7eb112..4b2c4296578d5 100644
--- a/test/functional/page_objects/visualize_page.js
+++ b/test/functional/page_objects/visualize_page.js
@@ -363,7 +363,7 @@ export function VisualizePageProvider({ getService, getPageObjects }) {
 
     async setInspectorTablePageSize(size) {
       const panel = await testSubjects.find('inspectorPanel');
-      await find.clickByButtonText('Rows per page: 10', panel);
+      await find.clickByButtonText('Rows per page: 20', panel);
       await find.clickByButtonText(`${size} rows`, panel);
     }