Analytics: add experimentview events (#44120)

* Analytics: add experimentview event

* remove ref to feature-highlights

* Experimentview -> ExperimentView

packages/grafana-runtime/src/index.ts

@@ -7,7 +7,7 @@ export * from './services';
 export * from './config';
 export * from './types';
 export { loadPluginCss, SystemJS, PluginCssOptions } from './utils/plugin';
-export { reportMetaAnalytics, reportInteraction, reportPageview } from './utils/analytics';
+export { reportMetaAnalytics, reportInteraction, reportPageview, reportExperimentView } from './utils/analytics';
 export { featureEnabled } from './utils/licensing';
 export { logInfo, logDebug, logWarning, logError } from './utils/logging';
 export {

packages/grafana-runtime/src/services/EchoSrv.ts

@@ -81,6 +81,7 @@ export enum EchoEventType {
   Sentry = 'sentry',
   Pageview = 'pageview',
   Interaction = 'interaction',
+  ExperimentView = 'experimentview',
 }
 
 /**

packages/grafana-runtime/src/types/analytics.ts

@@ -104,6 +104,24 @@ export interface InteractionEchoEventPayload {
  */
 export type InteractionEchoEvent = EchoEvent<EchoEventType.Interaction, InteractionEchoEventPayload>;
 
+/**
+ * Describes the payload of an experimentview event.
+ *
+ * @public
+ */
+export interface ExperimentViewEchoEventPayload {
+  experimentId: string;
+  experimentGroup: string;
+  experimentVariant: string;
+}
+
+/**
+ * Describes experimentview event with predefined {@link EchoEventType.EchoEventType} type.
+ *
+ * @public
+ */
+export type ExperimentViewEchoEvent = EchoEvent<EchoEventType.ExperimentView, ExperimentViewEchoEventPayload>;
+
 /**
  * Pageview event typeguard.
  *
@@ -121,3 +139,12 @@ export const isPageviewEvent = (event: EchoEvent): event is PageviewEchoEvent =>
 export const isInteractionEvent = (event: EchoEvent): event is InteractionEchoEvent => {
   return Boolean(event.payload.interactionName);
 };
+
+/**
+ * Experimentview event typeguard.
+ *
+ * @public
+ */
+export const isExperimentViewEvent = (event: EchoEvent): event is ExperimentViewEchoEvent => {
+  return Boolean(event.payload.experimentId);
+};

packages/grafana-runtime/src/utils/analytics.ts

@@ -1,5 +1,6 @@
 import { getEchoSrv, EchoEventType } from '../services/EchoSrv';
 import {
+  ExperimentViewEchoEvent,
   InteractionEchoEvent,
   MetaAnalyticsEvent,
   MetaAnalyticsEventPayload,
@@ -50,3 +51,19 @@ export const reportInteraction = (interactionName: string, properties?: Record<s
     },
   });
 };
+
+/**
+ * Helper function to report experimentview events to the {@link EchoSrv}.
+ *
+ * @public
+ */
+export const reportExperimentView = (id: string, group: string, variant: string) => {
+  getEchoSrv().addEvent<ExperimentViewEchoEvent>({
+    type: EchoEventType.ExperimentView,
+    payload: {
+      experimentId: id,
+      experimentGroup: group,
+      experimentVariant: variant,
+    },
+  });
+};

public/app/core/services/echo/backends/analytics/RudderstackBackend.ts

@@ -1,5 +1,12 @@
 import $ from 'jquery';
-import { EchoBackend, EchoEventType, isInteractionEvent, isPageviewEvent, PageviewEchoEvent } from '@grafana/runtime';
+import {
+  EchoBackend,
+  EchoEventType,
+  isExperimentViewEvent,
+  isInteractionEvent,
+  isPageviewEvent,
+  PageviewEchoEvent,
+} from '@grafana/runtime';
 import { User } from '../sentry/types';
 
 export interface RudderstackBackendOptions {
@@ -11,7 +18,7 @@ export interface RudderstackBackendOptions {
 }
 
 export class RudderstackBackend implements EchoBackend<PageviewEchoEvent, RudderstackBackendOptions> {
-  supportedEvents = [EchoEventType.Pageview, EchoEventType.Interaction];
+  supportedEvents = [EchoEventType.Pageview, EchoEventType.Interaction, EchoEventType.ExperimentView];
 
   constructor(public options: RudderstackBackendOptions) {
     const url = options.sdkUrl || `https://cdn.rudderlabs.com/v1/rudder-analytics.min.js`;
@@ -69,6 +76,14 @@ export class RudderstackBackend implements EchoBackend<PageviewEchoEvent, Rudder
     if (isInteractionEvent(e)) {
       (window as any).rudderanalytics.track(e.payload.interactionName, e.payload.properties);
     }
+
+    if (isExperimentViewEvent(e)) {
+      (window as any).rudderanalytics.track('experiment_viewed', {
+        experiment_id: e.payload.experimentId,
+        experiment_group: e.payload.experimentGroup,
+        experiment_variant: e.payload.experimentVariant,
+      });
+    }
   };
 
   // Not using Echo buffering, addEvent above sends events to GA as soon as they appear