Instrument Index Management with user action telemetry

x-pack/plugins/index_management/common/constants/index.js

@@ -7,3 +7,35 @@
 export { PLUGIN } from './plugin';
 export { BASE_PATH } from './base_path';
 export * from './index_statuses';
+
+export {
+  UA_APP_NAME,
+  UA_APP_LOAD,
+  USER_ACTIONS,
+  UA_UPDATE_SETTINGS,
+  UA_INDEX_CLEAR_CACHE,
+  UA_INDEX_CLEAR_CACHE_MANY,
+  UA_INDEX_CLOSE,
+  UA_INDEX_CLOSE_MANY,
+  UA_INDEX_DELETE,
+  UA_INDEX_DELETE_MANY,
+  UA_INDEX_FLUSH,
+  UA_INDEX_FLUSH_MANY,
+  UA_INDEX_FORCE_MERGE,
+  UA_INDEX_FORCE_MERGE_MANY,
+  UA_INDEX_FREEZE,
+  UA_INDEX_FREEZE_MANY,
+  UA_INDEX_OPEN,
+  UA_INDEX_OPEN_MANY,
+  UA_INDEX_REFRESH,
+  UA_INDEX_REFRESH_MANY,
+  UA_INDEX_UNFREEZE,
+  UA_INDEX_UNFREEZE_MANY,
+  UA_INDEX_SETTINGS_EDIT,
+  UA_SHOW_DETAILS_CLICK,
+  UA_DETAIL_PANEL_SUMMARY_TAB,
+  UA_DETAIL_PANEL_SETTINGS_TAB,
+  UA_DETAIL_PANEL_MAPPING_TAB,
+  UA_DETAIL_PANEL_STATS_TAB,
+  UA_DETAIL_PANEL_EDIT_SETTINGS_TAB,
+} from './user_action';

x-pack/plugins/index_management/common/constants/user_action.js

@@ -0,0 +1,65 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+export const UA_APP_NAME = 'index-management';
+
+export const UA_APP_LOAD = 'app_load';
+export const UA_UPDATE_SETTINGS = 'update_settings';
+export const UA_INDEX_CLEAR_CACHE = 'index_clear_cache';
+export const UA_INDEX_CLEAR_CACHE_MANY = 'index_clear_cache_many';
+export const UA_INDEX_CLOSE = 'index_close';
+export const UA_INDEX_CLOSE_MANY = 'index_close_many';
+export const UA_INDEX_DELETE = 'index_delete';
+export const UA_INDEX_DELETE_MANY = 'index_delete_many';
+export const UA_INDEX_FLUSH = 'index_flush';
+export const UA_INDEX_FLUSH_MANY = 'index_flush_many';
+export const UA_INDEX_FORCE_MERGE = 'index_force_merge';
+export const UA_INDEX_FORCE_MERGE_MANY = 'index_force_merge_many';
+export const UA_INDEX_FREEZE = 'index_freeze';
+export const UA_INDEX_FREEZE_MANY = 'index_freeze_many';
+export const UA_INDEX_OPEN = 'index_open';
+export const UA_INDEX_OPEN_MANY = 'index_open_many';
+export const UA_INDEX_REFRESH = 'index_refresh';
+export const UA_INDEX_REFRESH_MANY = 'index_refresh_many';
+export const UA_INDEX_SETTINGS_EDIT = 'index_settings_edit';
+export const UA_INDEX_UNFREEZE = 'index_unfreeze';
+export const UA_INDEX_UNFREEZE_MANY = 'index_unfreeze_many';
+export const UA_SHOW_DETAILS_CLICK = 'show_details_click';
+export const UA_DETAIL_PANEL_EDIT_SETTINGS_TAB = 'detail_panel_edit_settings_tab';
+export const UA_DETAIL_PANEL_MAPPING_TAB = 'detail_panel_mapping_tab';
+export const UA_DETAIL_PANEL_SETTINGS_TAB = 'detail_panel_settings_tab';
+export const UA_DETAIL_PANEL_STATS_TAB = 'detail_panel_stats_tab';
+export const UA_DETAIL_PANEL_SUMMARY_TAB = 'detail_panel_summary_tab';
+
+export const USER_ACTIONS = [
+  UA_APP_LOAD,
+  UA_UPDATE_SETTINGS,
+  UA_INDEX_CLEAR_CACHE,
+  UA_INDEX_CLEAR_CACHE_MANY,
+  UA_INDEX_CLOSE,
+  UA_INDEX_CLOSE_MANY,
+  UA_INDEX_DELETE,
+  UA_INDEX_DELETE_MANY,
+  UA_INDEX_FLUSH,
+  UA_INDEX_FLUSH_MANY,
+  UA_INDEX_FORCE_MERGE,
+  UA_INDEX_FORCE_MERGE_MANY,
+  UA_INDEX_FREEZE,
+  UA_INDEX_FREEZE_MANY,
+  UA_INDEX_OPEN,
+  UA_INDEX_OPEN_MANY,
+  UA_INDEX_REFRESH,
+  UA_INDEX_REFRESH_MANY,
+  UA_INDEX_SETTINGS_EDIT,
+  UA_INDEX_UNFREEZE,
+  UA_INDEX_UNFREEZE_MANY,
+  UA_SHOW_DETAILS_CLICK,
+  UA_DETAIL_PANEL_EDIT_SETTINGS_TAB,
+  UA_DETAIL_PANEL_MAPPING_TAB,
+  UA_DETAIL_PANEL_SETTINGS_TAB,
+  UA_DETAIL_PANEL_STATS_TAB,
+  UA_DETAIL_PANEL_SUMMARY_TAB,
+];

x-pack/plugins/index_management/index.js

@@ -5,14 +5,15 @@
  */
 
 import { resolve } from 'path';
+import { createRouter } from '../../server/lib/create_router';
 import { registerIndicesRoutes } from './server/routes/api/indices';
 import { registerMappingRoute } from './server/routes/api/mapping';
 import { registerSettingsRoutes } from './server/routes/api/settings';
 import { registerStatsRoute } from './server/routes/api/stats';
 import { registerLicenseChecker } from '../../server/lib/register_license_checker';
 import { PLUGIN } from './common/constants';
 import { addIndexManagementDataEnricher } from './index_management_data';
-import { createRouter } from '../../server/lib/create_router';
+import { registerIndexManagementUsageCollector } from './server/usage';
 
 export function indexManagement(kibana)  {
   return new kibana.Plugin({
@@ -34,6 +35,7 @@ export function indexManagement(kibana)  {
       registerSettingsRoutes(router);
       registerStatsRoute(router);
       registerMappingRoute(router);
+      registerIndexManagementUsageCollector(server);
     }
   });
 }

x-pack/plugins/index_management/public/app.js

@@ -4,17 +4,26 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import React from 'react';
+import React, { Component } from 'react';
 import { Switch, Route, Redirect } from 'react-router-dom';
-import { BASE_PATH } from '../common/constants';
+import { BASE_PATH, UA_APP_LOAD } from '../common/constants';
 import { IndexList } from './sections/index_list';
+import { trackUserAction } from './services';
 
-export const App = () => (
-  <div>
-    <Switch>
-      <Redirect exact from={`${BASE_PATH}`} to={`${BASE_PATH}indices`}/>
-      <Route exact path={`${BASE_PATH}indices`} component={IndexList} />
-      <Route path={`${BASE_PATH}indices/filter/:filter?`} component={IndexList}/>
-    </Switch>
-  </div>
-);
+export class App extends Component {
+  componentWillMount() {
+    trackUserAction(UA_APP_LOAD);
+  }
+
+  render() {
+    return (
+      <div>
+        <Switch>
+          <Redirect exact from={`${BASE_PATH}`} to={`${BASE_PATH}indices`}/>
+          <Route exact path={`${BASE_PATH}indices`} component={IndexList} />
+          <Route path={`${BASE_PATH}indices/filter/:filter?`} component={IndexList}/>
+        </Switch>
+      </div>
+    );
+  }
+}

x-pack/plugins/index_management/public/constants/detail_panel_tabs.js

@@ -0,0 +1,11 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+export const TAB_SUMMARY = 'TAB_SUMMARY';
+export const TAB_SETTINGS = 'TAB_SETTINGS';
+export const TAB_MAPPING = 'TAB_MAPPING';
+export const TAB_STATS = 'TAB_STATS';
+export const TAB_EDIT_SETTINGS = 'TAB_EDIT_SETTINGS';

x-pack/plugins/index_management/public/constants/index.js

@@ -5,3 +5,11 @@
  */
 
 export { REFRESH_RATE_INDEX_LIST } from './refresh_intervals';
+
+export {
+  TAB_SUMMARY,
+  TAB_SETTINGS,
+  TAB_MAPPING,
+  TAB_STATS,
+  TAB_EDIT_SETTINGS,
+} from './detail_panel_tabs';

x-pack/plugins/index_management/public/sections/index_list/components/detail_panel/detail_panel.js

@@ -5,12 +5,8 @@
  */
 
 import React, { Component, Fragment } from 'react';
-import { FormattedMessage } from '@kbn/i18n/react';
 import { Route } from 'react-router-dom';
-import { ShowJson } from './show_json';
-import { Summary } from './summary';
-import { EditSettingsJson } from './edit_settings_json';
-import { renderBadges } from '../../../../lib/render_badges';
+import { FormattedMessage } from '@kbn/i18n/react';
 import {
   EuiCallOut,
   EuiFlexGroup,
@@ -24,14 +20,61 @@ import {
   EuiTab,
   EuiTitle,
 } from '@elastic/eui';
-import { IndexActionsContextMenu } from '../../components';
+import { renderBadges } from '../../../../lib/render_badges';
 import { INDEX_OPEN } from '../../../../../common/constants';
+import {
+  TAB_SUMMARY,
+  TAB_SETTINGS,
+  TAB_MAPPING,
+  TAB_STATS,
+  TAB_EDIT_SETTINGS,
+} from '../../../../constants';
+import { IndexActionsContextMenu } from '../../components';
+import { ShowJson } from './show_json';
+import { Summary } from './summary';
+import { EditSettingsJson } from './edit_settings_json';
 
-function capitalizeFirstLetter(string) {
-  return string.charAt(0).toUpperCase() + string.slice(1);
-}
+const tabToHumanizedMap = {
+  [TAB_SUMMARY]: (
+    <FormattedMessage
+      id="xpack.idxMgmt.detailPanel.tabSummaryLabel"
+      defaultMessage="Summary"
+    />
+  ),
+  [TAB_SETTINGS]: (
+    <FormattedMessage
+      id="xpack.idxMgmt.detailPanel.tabSettingsLabel"
+      defaultMessage="Settings"
+    />
+  ),
+  [TAB_MAPPING]: (
+    <FormattedMessage
+      id="xpack.idxMgmt.detailPanel.tabMappingLabel"
+      defaultMessage="Mapping"
+    />
+  ),
+  [TAB_STATS]: (
+    <FormattedMessage
+      id="xpack.idxMgmt.detailPanel.tabStatsLabel"
+      defaultMessage="Stats"
+    />
+  ),
+  [TAB_EDIT_SETTINGS]: (
+    <FormattedMessage
+      id="xpack.idxMgmt.detailPanel.tabEditSettingsLabel"
+      defaultMessage="Edit settings"
+    />
+  ),
+};
+
+const tabs = [
+  TAB_SUMMARY,
+  TAB_SETTINGS,
+  TAB_MAPPING,
+  TAB_STATS,
+  TAB_EDIT_SETTINGS,
+];
 
-const tabs = ['Summary', 'Settings', 'Mapping', 'Stats', 'Edit settings'];
 export class DetailPanel extends Component {
   renderTabs() {
     const { panelType, indexName, index, openDetailPanel } = this.props;
@@ -42,10 +85,10 @@ export class DetailPanel extends Component {
           onClick={() => openDetailPanel({ panelType: tab, indexName })}
           isSelected={isSelected}
           data-test-subj={`detailPanelTab${isSelected ? 'Selected' : ''}`}
-          disabled={tab === 'Stats' && index.status !== INDEX_OPEN}
+          disabled={tab === TAB_STATS && index.status !== INDEX_OPEN}
           key={i}
         >
-          {capitalizeFirstLetter(tab)}
+          {tabToHumanizedMap[tab]}
         </EuiTab>
       );
     });
@@ -57,12 +100,12 @@ export class DetailPanel extends Component {
     }
     let component = null;
     switch (panelType) {
-      case 'Edit settings':
+      case TAB_EDIT_SETTINGS:
         component = <EditSettingsJson />;
         break;
-      case 'Mapping':
-      case 'Settings':
-      case 'Stats':
+      case TAB_MAPPING:
+      case TAB_SETTINGS:
+      case TAB_STATS:
         component = <ShowJson />;
         break;
       default:

x-pack/plugins/index_management/public/sections/index_list/components/detail_panel/edit_settings_json/edit_settings_json.js

@@ -18,6 +18,7 @@ import {
   EuiTextColor,
   EuiTitle,
 } from '@elastic/eui';
+import { TAB_SETTINGS } from '../../../../../constants';
 import {
   settingsToDisplay,
   readOnlySettings
@@ -57,7 +58,7 @@ export class EditSettingsJson extends React.PureComponent {
   }
   componentWillMount() {
     const { indexName } = this.props;
-    this.props.loadIndexData({ dataType: 'Settings', indexName });
+    this.props.loadIndexData({ dataType: TAB_SETTINGS, indexName });
   }
   componentDidUpdate() {
     const { data, indexStatus } = this.props;

x-pack/plugins/index_management/public/sections/index_list/components/index_actions_context_menu/index_actions_context_menu.container.js

@@ -6,6 +6,12 @@
 
 import { connect } from 'react-redux';
 import { IndexActionsContextMenu as PresentationComponent } from './index_actions_context_menu';
+import {
+  TAB_SETTINGS,
+  TAB_MAPPING,
+  TAB_STATS,
+  TAB_EDIT_SETTINGS,
+} from '../../../../constants';
 import {
   clearCacheIndices,
   closeIndices,
@@ -69,18 +75,18 @@ const mapDispatchToProps = (dispatch, { indexNames }) => {
       dispatch(forcemergeIndices({ indexNames, maxNumSegments }));
     },
     showSettings: () => {
-      dispatch(openDetailPanel({ indexName: indexNames[0], panelType: 'Settings' }));
+      dispatch(openDetailPanel({ indexName: indexNames[0], panelType: TAB_SETTINGS }));
     },
     showMapping: () => {
-      dispatch(openDetailPanel({ indexName: indexNames[0], panelType: 'Mapping' }));
+      dispatch(openDetailPanel({ indexName: indexNames[0], panelType: TAB_MAPPING }));
     },
     showStats: () => {
-      dispatch(openDetailPanel({ indexName: indexNames[0], panelType: 'Stats' }));
+      dispatch(openDetailPanel({ indexName: indexNames[0], panelType: TAB_STATS }));
     },
     editIndex: () => {
       const indexName = indexNames ? indexNames[0] : null;
       if (indexName) {
-        dispatch(openDetailPanel({ indexName, panelType: 'Edit settings' }));
+        dispatch(openDetailPanel({ indexName, panelType: TAB_EDIT_SETTINGS }));
       }
     },
     deleteIndices: () => {

x-pack/plugins/index_management/public/sections/index_list/components/index_table/index_table.js

@@ -8,9 +8,6 @@ import React, { Component, Fragment } from 'react';
 import { i18n } from '@kbn/i18n';
 import { FormattedMessage, injectI18n } from '@kbn/i18n/react';
 import { Route } from 'react-router-dom';
-import { NoMatch } from '../../../no_match';
-import { healthToColor } from '../../../../services';
-import { REFRESH_RATE_INDEX_LIST } from '../../../../constants';
 
 import {
   EuiButton,
@@ -38,13 +35,17 @@ import {
   EuiPageContent,
 } from '@elastic/eui';
 
-import { IndexActionsContextMenu } from '../../components';
+import { UA_SHOW_DETAILS_CLICK } from '../../../../../common/constants';
+import { REFRESH_RATE_INDEX_LIST } from '../../../../constants';
+import { healthToColor, trackUserAction } from '../../../../services';
 import {
   getBannerExtensions,
   getFilterExtensions,
   getToggleExtensions,
 } from '../../../../index_management_extensions';
 import { renderBadges } from '../../../../lib/render_badges';
+import { NoMatch } from '../../../no_match';
+import { IndexActionsContextMenu } from '../../components';
 
 const HEADERS = {
   name: i18n.translate('xpack.idxMgmt.indexTable.headers.nameHeader', {
@@ -223,6 +224,7 @@ export class IndexTableUi extends Component {
             className="indTable__link"
             data-test-subj="indexTableIndexNameLink"
             onClick={() => {
+              trackUserAction(UA_SHOW_DETAILS_CLICK);
               openDetailPanel(value);
             }}
           >