Add telemetry to vis_type_xy plugin (#86751)

* Add telemetry for detailedTooltip and fittingFunction

* Fixed type problems

Co-authored-by: nickofthyme <nick.ryan.partridge@gmail.com>
Co-authored-by: Ryan Keairns <rkeairns@chef.io>
Co-authored-by: gchaps <33642766+gchaps@users.noreply.github.com>
Co-authored-by: Joe Reuter <email@johannes-reuter.de>
Co-authored-by: Stratoula Kalafateli <stratoula1@gmail.com>

src/plugins/vis_type_xy/kibana.json

@@ -3,6 +3,6 @@
   "version": "kibana",
   "server": true,
   "ui": true,
-  "requiredPlugins": ["charts", "data", "expressions", "visualizations"],
+  "requiredPlugins": ["charts", "data", "expressions", "visualizations", "usageCollection"],
   "requiredBundles": ["kibanaUtils", "visDefaultEditor"]
 }

src/plugins/vis_type_xy/public/editor/components/options/point_series/elastic_charts_options.tsx

@@ -20,14 +20,17 @@
 import React from 'react';
 
 import { i18n } from '@kbn/i18n';
+import { METRIC_TYPE } from '@kbn/analytics';
 
 import { SelectOption, SwitchOption } from '../../../../../../vis_default_editor/public';
 
 import { ChartType } from '../../../../../common';
 import { VisParams } from '../../../../types';
 import { ValidationVisOptionsProps } from '../../common';
+import { getTrackUiMetric } from '../../../../services';
 
 export function ElasticChartsOptions(props: ValidationVisOptionsProps<VisParams>) {
+  const trackUiMetric = getTrackUiMetric();
   const { stateParams, setValue, vis, aggs } = props;
 
   const hasLineChart = stateParams.seriesParams.some(
@@ -49,7 +52,12 @@ export function ElasticChartsOptions(props: ValidationVisOptionsProps<VisParams>
         })}
         paramName="detailedTooltip"
         value={stateParams.detailedTooltip}
-        setValue={setValue}
+        setValue={(paramName, value) => {
+          if (trackUiMetric) {
+            trackUiMetric(METRIC_TYPE.CLICK, 'detailed_tooltip_switched');
+          }
+          setValue(paramName, value);
+        }}
       />
 
       {hasLineChart && (
@@ -61,7 +69,12 @@ export function ElasticChartsOptions(props: ValidationVisOptionsProps<VisParams>
           options={vis.type.editorConfig.collections.fittingFunctions}
           paramName="fittingFunction"
           value={stateParams.fittingFunction}
-          setValue={setValue}
+          setValue={(paramName, value) => {
+            if (trackUiMetric) {
+              trackUiMetric(METRIC_TYPE.CLICK, 'fitting_function_selected');
+            }
+            setValue(paramName, value);
+          }}
         />
       )}
     </>

src/plugins/vis_type_xy/public/plugin.ts

@@ -22,6 +22,7 @@ import { Plugin as ExpressionsPublicPlugin } from '../../expressions/public';
 import { VisualizationsSetup, VisualizationsStart } from '../../visualizations/public';
 import { ChartsPluginSetup } from '../../charts/public';
 import { DataPublicPluginStart } from '../../data/public';
+import { UsageCollectionSetup } from '../../usage_collection/public';
 
 import { createVisTypeXyVisFn } from './xy_vis_fn';
 import {
@@ -32,6 +33,7 @@ import {
   setTimefilter,
   setUISettings,
   setDocLinks,
+  setTrackUiMetric,
 } from './services';
 import { visTypesDefinitions } from './vis_types';
 import { LEGACY_CHARTS_LIBRARY } from '../common';
@@ -47,6 +49,7 @@ export interface VisTypeXyPluginSetupDependencies {
   expressions: ReturnType<ExpressionsPublicPlugin['setup']>;
   visualizations: VisualizationsSetup;
   charts: ChartsPluginSetup;
+  usageCollection: UsageCollectionSetup;
 }
 
 /** @internal */
@@ -69,7 +72,7 @@ export class VisTypeXyPlugin
     > {
   public async setup(
     core: VisTypeXyCoreSetup,
-    { expressions, visualizations, charts }: VisTypeXyPluginSetupDependencies
+    { expressions, visualizations, charts, usageCollection }: VisTypeXyPluginSetupDependencies
   ) {
     if (!core.uiSettings.get(LEGACY_CHARTS_LIBRARY, false)) {
       setUISettings(core.uiSettings);
@@ -81,6 +84,8 @@ export class VisTypeXyPlugin
       visTypesDefinitions.forEach(visualizations.createBaseVisualization);
     }
 
+    setTrackUiMetric(usageCollection?.reportUiCounter.bind(usageCollection, 'vis_type_xy'));
+
     return {};
   }
 

src/plugins/vis_type_xy/public/services.ts

@@ -17,6 +17,7 @@
  * under the License.
  */
 
+import { UiCounterMetricType } from '@kbn/analytics';
 import { CoreSetup, DocLinksStart } from '../../../core/public';
 import { createGetterSetter } from '../../kibana_utils/public';
 import { DataPublicPluginStart } from '../../data/public';
@@ -47,3 +48,7 @@ export const [getColorsService, setColorsService] = createGetterSetter<
 >('xy charts.color');
 
 export const [getDocLinks, setDocLinks] = createGetterSetter<DocLinksStart>('DocLinks');
+
+export const [getTrackUiMetric, setTrackUiMetric] = createGetterSetter<
+  (metricType: UiCounterMetricType, eventName: string | string[]) => void
+>('trackUiMetric');