Add Ui Metric for Discover 2.0 (#8345)

Signed-off-by: Suchit Sahoo <[email protected]>

src/plugins/data/public/ui/index_pattern_select/index_pattern_select.test.tsx

@@ -49,7 +49,7 @@ describe('IndexPatternSelect', () => {
 
     bulkGetMock.mockResolvedValue({ savedObjects: [{ attributes: { title: 'test1' } }] });
     compInstance.debouncedFetch('');
-    await new Promise((resolve) => setTimeout(resolve, 300));
+    await new Promise((resolve) => setTimeout(resolve, 600));
     await nextTick();
     expect(bulkGetMock).toBeCalledWith([{ id: 'testDataSourceId', type: 'data-source' }]);
   });

src/plugins/data_explorer/opensearch_dashboards.json

@@ -8,7 +8,8 @@
     "data",
     "navigation",
     "embeddable",
-    "expressions"
+    "expressions",
+    "usageCollection"
   ],
   "optionalPlugins": [],
   "requiredBundles": [

src/plugins/data_explorer/public/components/app_container.tsx

@@ -3,7 +3,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import React, { memo, useRef } from 'react';
+import React, { memo, useEffect, useRef } from 'react';
 import {
   EuiFlexGroup,
   EuiFlexItem,
@@ -23,6 +23,13 @@ import './app_container.scss';
 import { useOpenSearchDashboards } from '../../../opensearch_dashboards_react/public';
 import { IDataPluginServices } from '../../../data/public';
 import { QUERY_ENHANCEMENT_ENABLED_SETTING } from './constants';
+import {
+  DISCOVER_LOAD_EVENT,
+  NEW_DISCOVER_LOAD_EVENT,
+  NEW_DISCOVER_OPT_IN,
+  NEW_DISCOVER_OPT_OUT,
+  trackUiMetric,
+} from '../ui_metric';
 
 export const AppContainer = React.memo(
   ({ view, params }: { view?: View; params: AppMountParameters }) => {
@@ -35,10 +42,16 @@ export const AppContainer = React.memo(
 
     const topLinkRef = useRef<HTMLDivElement>(null);
     const datePickerRef = useRef<HTMLDivElement>(null);
+
     if (!view) {
       return <NoView />;
     }
 
+    trackUiMetric(DISCOVER_LOAD_EVENT);
+    if (isEnhancementsEnabled) {
+      trackUiMetric(NEW_DISCOVER_LOAD_EVENT);
+    }
+
     const { Canvas, Panel, Context } = view;
 
     const MemoizedPanel = memo(Panel);

src/plugins/data_explorer/public/plugin.ts

@@ -31,6 +31,7 @@ import {
 } from '../../opensearch_dashboards_utils/public';
 import { getPreloadedStore } from './utils/state_management';
 import { opensearchFilters } from '../../data/public';
+import { setUsageCollector } from './services';
 
 export class DataExplorerPlugin
   implements
@@ -47,10 +48,11 @@ export class DataExplorerPlugin
 
   public setup(
     core: CoreSetup<DataExplorerPluginStartDependencies, DataExplorerPluginStart>,
-    { data }: DataExplorerPluginSetupDependencies
+    { data, usageCollection }: DataExplorerPluginSetupDependencies
   ): DataExplorerPluginSetup {
     const viewService = this.viewService;
 
+    setUsageCollector(usageCollection);
     const { appMounted, appUnMounted, stop: stopUrlTracker } = createOsdUrlTracker({
       baseUrl: core.http.basePath.prepend(`/app/${PLUGIN_ID}`),
       defaultSubUrl: '#/',

src/plugins/data_explorer/public/services.ts

@@ -0,0 +1,10 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+import { createGetterSetter } from '../../opensearch_dashboards_utils/public';
+import { UsageCollectionSetup } from '../../usage_collection/public';
+
+export const [getUsageCollector, setUsageCollector] = createGetterSetter<UsageCollectionSetup>(
+  'UsageCollector'
+);

src/plugins/data_explorer/public/types.ts

@@ -10,6 +10,7 @@ import { ViewServiceStart, ViewServiceSetup } from './services/view_service';
 import { IOsdUrlStateStorage } from '../../opensearch_dashboards_utils/public';
 import { DataPublicPluginSetup, DataPublicPluginStart } from '../../data/public';
 import { Store } from './utils/state_management';
+import { UsageCollectionSetup } from '../../usage_collection/public';
 
 export type DataExplorerPluginSetup = ViewServiceSetup;
 
@@ -18,6 +19,7 @@ export interface DataExplorerPluginStart {}
 
 export interface DataExplorerPluginSetupDependencies {
   data: DataPublicPluginSetup;
+  usageCollection: UsageCollectionSetup;
 }
 
 export interface DataExplorerPluginStartDependencies {

src/plugins/data_explorer/public/ui_metric/constants.ts

@@ -0,0 +1,8 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+export const NEW_DISCOVER_LOAD_EVENT = 'new_discover_load_count';
+export const DISCOVER_LOAD_EVENT = 'discover_load_count';
+export const NEW_DISCOVER_APP_NAME = 'New_Discover';

src/plugins/data_explorer/public/ui_metric/index.ts

@@ -0,0 +1,7 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+export * from './constants';
+export * from './report_ui_metric';

src/plugins/data_explorer/public/ui_metric/report_ui_metric.ts

@@ -0,0 +1,23 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { UiStatsMetricType } from 'packages/osd-analytics/target/types';
+import { METRIC_TYPE } from '../../../usage_collection/public';
+import { NEW_DISCOVER_APP_NAME } from './constants';
+import { getUsageCollector } from '../services';
+
+export const trackUiMetric = (
+  eventName: string,
+  appName: string = NEW_DISCOVER_APP_NAME,
+  metricType: UiStatsMetricType = METRIC_TYPE.COUNT
+) => {
+  try {
+    const usageCollector = getUsageCollector();
+    usageCollector.reportUiStats(appName, metricType, eventName);
+  } catch (error) {
+    // eslint-disable-next-line no-console
+    console.error(error);
+  }
+};

src/plugins/discover/opensearch_dashboards.json

@@ -13,7 +13,8 @@
     "urlForwarding",
     "navigation",
     "uiActions",
-    "visualizations"
+    "visualizations",
+    "usageCollection"
   ],
   "optionalPlugins": ["home", "share"],
   "requiredBundles": [

src/plugins/discover/public/application/view_components/utils/use_search.ts

@@ -8,7 +8,7 @@ import { BehaviorSubject, Subject, merge } from 'rxjs';
 import { debounceTime } from 'rxjs/operators';
 import { i18n } from '@osd/i18n';
 import { useEffect } from 'react';
-import { cloneDeep } from 'lodash';
+import { cloneDeep, isEqual } from 'lodash';
 import { useLocation } from 'react-router-dom';
 import { RequestAdapter } from '../../../../../inspector/public';
 import { DiscoverViewServices } from '../../../build_services';
@@ -33,6 +33,7 @@ import {
 } from '../../../opensearch_dashboards_services';
 import { SEARCH_ON_PAGE_LOAD_SETTING } from '../../../../common';
 import { syncQueryStateWithUrl } from '../../../../../data/public';
+import { trackQueryMetric } from '../../../ui_metric';
 
 export enum ResultStatus {
   UNINITIALIZED = 'uninitialized',
@@ -184,6 +185,12 @@ export const useSearch = (services: DiscoverViewServices) => {
         inspectorRequest.json(body);
       });
 
+      // Track the dataset type and language used
+      const query = searchSource.getField('query');
+      if (query && query.dataset?.type && query.language) {
+        trackQueryMetric(query);
+      }
+
       // Execute the search
       const fetchResp = await searchSource.fetch({
         abortSignal: fetchStateRef.current.abortController.signal,

src/plugins/discover/public/opensearch_dashboards_services.ts

@@ -37,6 +37,7 @@ import { createGetterSetter } from '../../opensearch_dashboards_utils/public';
 import { search } from '../../data/public';
 import { DocViewsRegistry } from './application/doc_views/doc_views_registry';
 import { DocViewsLinksRegistry } from './application/doc_views_links/doc_views_links_registry';
+import { UsageCollectionSetup } from '../../usage_collection/public';
 
 let services: DiscoverServices | null = null;
 let uiActions: UiActionsStart;
@@ -67,6 +68,10 @@ export const [getDocViewsLinksRegistry, setDocViewsLinksRegistry] = createGetter
   DocViewsLinksRegistry
 >('DocViewsLinksRegistry');
 
+export const [getUsageCollector, setUsageCollector] = createGetterSetter<UsageCollectionSetup>(
+  'UsageCollector'
+);
+
 /**
  * Makes sure discover and context are using one instance of history.
  */

src/plugins/discover/public/plugin.ts

@@ -51,6 +51,7 @@ import {
   setScopedHistory,
   syncHistoryLocations,
   getServices,
+  setUsageCollector,
 } from './opensearch_dashboards_services';
 import { createSavedSearchesLoader } from './saved_searches';
 import { buildServices } from './build_services';
@@ -75,6 +76,7 @@ declare module '../../share/public' {
     [DISCOVER_APP_URL_GENERATOR]: UrlGeneratorState<DiscoverUrlGeneratorState>;
   }
 }
+import { UsageCollectionSetup } from '../../usage_collection/public';
 
 /**
  * @public
@@ -128,6 +130,7 @@ export interface DiscoverSetupPlugins {
   visualizations: VisualizationsSetup;
   data: DataPublicPluginSetup;
   dataExplorer: DataExplorerPluginSetup;
+  usageCollection: UsageCollectionSetup;
 }
 
 /**
@@ -174,6 +177,7 @@ export class DiscoverPlugin
       );
     }
 
+    setUsageCollector(plugins.usageCollection);
     this.docViewsRegistry = new DocViewsRegistry();
     setDocViewsRegistry(this.docViewsRegistry);
     this.docViewsRegistry.addDocView({

src/plugins/discover/public/ui_metric/constants.ts

@@ -0,0 +1,8 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+export const DATASET_METRIC_SUFFIX = 'dataset_queries_count';
+export const LANGUAGE_METRIC_SUFFIX = 'language_queries_count';
+export const NEW_DISCOVER_APP_NAME = 'New_Discover';

src/plugins/discover/public/ui_metric/index.ts

@@ -0,0 +1,7 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+export * from './constants';
+export * from './report_ui_metric';

src/plugins/discover/public/ui_metric/report_ui_metric.ts

@@ -0,0 +1,37 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { UiStatsMetricType } from 'packages/osd-analytics/target/types';
+import { METRIC_TYPE } from '../../../usage_collection/public';
+import { DATASET_METRIC_SUFFIX, LANGUAGE_METRIC_SUFFIX, NEW_DISCOVER_APP_NAME } from './constants';
+import { getUsageCollector } from '../opensearch_dashboards_services';
+import { Query } from '../../../data/public';
+
+export const getDatasetTypeMetricEventName = (datasource: string) => {
+  return `${datasource}_${DATASET_METRIC_SUFFIX}`;
+};
+
+export const getLanguageMetricEventName = (language: string) => {
+  return `${language}_${LANGUAGE_METRIC_SUFFIX}`;
+};
+
+export const trackUiMetric = (
+  eventName: string,
+  appName: string = NEW_DISCOVER_APP_NAME,
+  metricType: UiStatsMetricType = METRIC_TYPE.COUNT
+) => {
+  try {
+    const usageCollector = getUsageCollector();
+    usageCollector.reportUiStats(appName, metricType, eventName);
+  } catch (error) {
+    // eslint-disable-next-line no-console
+    console.error(error);
+  }
+};
+
+export const trackQueryMetric = (query: Query) => {
+  trackUiMetric(getDatasetTypeMetricEventName(query.dataset?.type!));
+  trackUiMetric(getLanguageMetricEventName(query.language));
+};