POC: Add telemetry

schema.js

@@ -0,0 +1,102 @@
+'use strict'; // code generated by pbf v3.2.1
+
+var WidgetType = (exports.WidgetType = {
+  'ais.custom': 0,
+  'ais.instantSearch': 1,
+  'ais.autocomplete': 2,
+  'ais.breadcrumb': 3,
+  'ais.clearRefinements': 4,
+  'ais.configure': 5,
+  'ais.configureRelatedItems': 6,
+  'ais.currentRefinements': 7,
+  'ais.geoSearch': 8,
+  'ais.hierarchicalMenu': 9,
+  'ais.hits': 10,
+  'ais.hitsPerPage': 11,
+  'ais.index': 12,
+  'ais.infiniteHits': 13,
+  'ais.menu': 14,
+  'ais.numericMenu': 15,
+  'ais.pagination': 16,
+  'ais.places': 17,
+  'ais.poweredBy': 18,
+  'ais.queryRules': 19,
+  'ais.queryRuleCustomData': 20,
+  'ais.queryRuleContext': 21,
+  'ais.range': 22,
+  'ais.rangeInput': 23,
+  'ais.rangeSlider': 24,
+  'ais.ratingMenu': 25,
+  'ais.refinementList': 26,
+  'ais.searchBox': 27,
+  'ais.sortBy': 28,
+  'ais.stats': 29,
+  'ais.toggleRefinement': 30,
+  'ais.voiceSearch': 31,
+});
+
+var WidgetParams = (exports.WidgetParams = {
+  indexName: 1000,
+  searchClient: 1001,
+  numberLocale: 1002,
+  searchFunction: 1003,
+  initialUiState: 1004,
+  onStateChange: 1005,
+  stalledSearchDelay: 1006,
+  routing: 1007,
+  insightsClient: 1008,
+  container: 1009,
+  placeholder: 1010,
+  autofocus: 1011,
+  searchAsYouType: 1012,
+  showReset: 1013,
+  showSubmit: 1014,
+  showLoadingIndicator: 1015,
+  queryHook: 1016,
+  templates: 1017,
+  cssClasses: 1018,
+  escapeHTML: 1019,
+  transformItems: 1020,
+  attributes: 1021,
+  showMore: 1022,
+  attribute: 1023,
+  escapeFacetValues: 1024,
+  searchParameters: 1025,
+  on: 1026,
+  items: 1027,
+  padding: 1028,
+  precision: 1029,
+  max: 1030,
+  searchable: 1031,
+  searchablePlaceholder: 1032,
+  searchableShowReset: 1033,
+  attributesToSnippet: 1034,
+  snippetEllipsisText: 1035,
+  removeWordsIfNoResults: 1036,
+  scrollTo: 1037,
+  showFirst: 1038,
+  showLast: 1039,
+  pips: 1040,
+  tooltips: 1041,
+});
+
+// Widget ========================================
+
+var Widget = (exports.Widget = {});
+
+Widget.write = function(obj, pbf) {
+  if (obj.type) pbf.writeVarintField(600, obj.type);
+  if (obj.params) pbf.writePackedVarint(601, obj.params);
+  if (obj.useConnector) pbf.writeBooleanField(602, obj.useConnector);
+};
+
+// Schema ========================================
+
+var Schema = (exports.Schema = {});
+
+Schema.write = function(obj, pbf) {
+  if (obj.widgets)
+    for (var i = 0; i < obj.widgets.length; i++)
+      pbf.writeMessage(501, Widget.write, obj.widgets[i]);
+  if (obj.oversize) pbf.writeVarintField(502, obj.oversize);
+};

schema.proto

@@ -0,0 +1,92 @@
+syntax = "proto3";
+
+enum WidgetType {
+  ais.custom = 0;
+  ais.instantSearch = 1;
+  ais.autocomplete = 2;
+  ais.breadcrumb = 3;
+  ais.clearRefinements = 4;
+  ais.configure = 5;
+  ais.configureRelatedItems = 6;
+  ais.currentRefinements = 7;
+  ais.geoSearch = 8;
+  ais.hierarchicalMenu = 9;
+  ais.hits = 10;
+  ais.hitsPerPage = 11;
+  ais.index = 12;
+  ais.infiniteHits = 13;
+  ais.menu = 14;
+  ais.numericMenu = 15;
+  ais.pagination = 16;
+  ais.places = 17;
+  ais.poweredBy = 18;
+  ais.queryRules = 19;
+  ais.queryRuleCustomData = 20;
+  ais.queryRuleContext = 21;
+  ais.range = 22;
+  ais.rangeInput = 23;
+  ais.rangeSlider = 24;
+  ais.ratingMenu = 25;
+  ais.refinementList = 26;
+  ais.searchBox = 27;
+  ais.sortBy = 28;
+  ais.stats = 29;
+  ais.toggleRefinement = 30;
+  ais.voiceSearch = 31;
+}
+
+enum WidgetParams {
+  indexName = 1000;
+  searchClient = 1001;
+  numberLocale = 1002;
+  searchFunction = 1003;
+  initialUiState = 1004;
+  onStateChange = 1005;
+  stalledSearchDelay = 1006;
+  routing = 1007;
+  insightsClient = 1008;
+  container = 1009;
+  placeholder = 1010;
+  autofocus = 1011;
+  searchAsYouType = 1012;
+  showReset = 1013;
+  showSubmit = 1014;
+  showLoadingIndicator = 1015;
+  queryHook = 1016;
+  templates = 1017;
+  cssClasses = 1018;
+  escapeHTML = 1019;
+  transformItems = 1020;
+  attributes = 1021;
+  showMore = 1022;
+  attribute = 1023;
+  escapeFacetValues = 1024;
+  searchParameters = 1025;
+  on = 1026;
+  items = 1027;
+  padding = 1028;
+  precision = 1029;
+  max = 1030;
+  searchable = 1031;
+  searchablePlaceholder = 1032;
+  searchableShowReset = 1033;
+  attributesToSnippet = 1034;
+  snippetEllipsisText = 1035;
+  removeWordsIfNoResults = 1036;
+  scrollTo = 1037;
+  showFirst = 1038;
+  showLast = 1039;
+  pips = 1040;
+  tooltips = 1041;
+}
+
+message Widget {
+  WidgetType type = 600 [default = UNKNOWN];
+  repeated WidgetParams params = 601;
+  bool useConnector = 602 [default = false];
+}
+
+message Schema {
+  repeated Widget widgets = 501;
+  int32 oversize = 502;
+}

src/lib/InstantSearch.ts

@@ -22,6 +22,73 @@ import hasDetectedInsightsClient from './utils/detect-insights-client';
 import { Middleware, MiddlewareDefinition } from '../middleware';
 import { createRouter, RouterProps } from '../middleware/createRouter';
 
+type TelemetryWidget = {
+  type: number;
+  params: number[];
+  useConnector: boolean;
+};
+
+function telemetryClient() {
+  const payload: { widgets: TelemetryWidget[] } = {
+    widgets: [],
+  };
+
+  return {
+    updatePayload({ type, params, useConnector }: TelemetryWidget) {
+      const existingWidget = payload.widgets.find(
+        payloadWidget => payloadWidget.type === type
+      );
+      if (existingWidget) {
+        existingWidget.params = [
+          ...new Set([...existingWidget.params, ...params]),
+        ];
+        existingWidget.useConnector =
+          existingWidget.useConnector || useConnector;
+      } else {
+        payload.widgets.push({ type, params, useConnector });
+      }
+    },
+    // updatePayload(widget: TelemetryWidget) {
+    //   if (!widget.params) {
+    //     console.log(`No params for ${widget.type}`, widget);
+    //   }
+    //   const type = WidgetType[widget.type]
+    //     ? WidgetType[widget.type].value
+    //     : WidgetType['ais.custom'].value;
+    //   const widgetParamsKeys = widget.params ? Object.keys(widget.params) : [];
+    //   const params = widgetParamsKeys
+    //     .filter(key => {
+    //       if (widget.params![key] === undefined) {
+    //         return false;
+    //       }
+    //       if (WidgetParams[key] === undefined) {
+    //         console.error(`${key} is missing in props list`);
+    //         return false;
+    //       }
+    //       return true;
+    //     })
+    //     .map(key => WidgetParams[key].value);
+    //   const useConnector = !widget.params;
+
+    //   const existingWidget = payload.widgets.find(
+    //     payloadWidget => payloadWidget.type === type
+    //   );
+    //   if (existingWidget) {
+    //     existingWidget.params = [
+    //       ...new Set([...(existingWidget.params || []), ...params]),
+    //     ];
+    //     existingWidget.useConnector =
+    //       existingWidget.useConnector || useConnector;
+    //   } else {
+    //     payload.widgets.push({ type, params, useConnector });
+    //   }
+    // },
+    getPayload() {
+      return payload;
+    },
+  };
+}
+
 const withUsage = createDocumentationMessageGenerator({
   name: 'instantsearch',
 });
@@ -213,7 +280,7 @@ See ${createDocumentationLink({
 
     this.client = searchClient;
     this.insightsClient = insightsClient;
-
+    this.telemetry = telemetryClient();
     this.indexName = indexName;
     this.helper = null;
     this.mainHelper = null;

src/widgets/analytics/analytics.ts

@@ -212,6 +212,9 @@ const analytics: AnalyticsWidget = function analytics(widgetParams) {
   };
 
   return {
+    $$type: 'ais.analytics',
+    $$params: widgetParams,
+
     init() {
       if (triggerOnUIInteraction === true) {
         document.addEventListener('click', onClick);

src/widgets/breadcrumb/breadcrumb.tsx

@@ -163,7 +163,10 @@ const breadcrumb: BreadcrumbWidget = function breadcrumb(widgetOptions) {
     render(null, containerNode)
   );
 
-  return makeBreadcrumb({ attributes, separator, rootPath, transformItems });
+  return {
+    ...makeBreadcrumb({ attributes, separator, rootPath, transformItems }),
+    $$params: widgetOptions,
+  };
 };
 
 export default breadcrumb;

src/widgets/clear-refinements/clear-refinements.tsx

@@ -126,11 +126,14 @@ const clearRefinements: ClearRefinementsWidget = widgetOptions => {
     render(null, containerNode)
   );
 
-  return makeWidget({
-    includedAttributes,
-    excludedAttributes,
-    transformItems,
-  });
+  return {
+    ...makeWidget({
+      includedAttributes,
+      excludedAttributes,
+      transformItems,
+    }),
+    $$params: widgetOptions,
+  };
 };
 
 export default clearRefinements;

src/widgets/configure-related-items/configure-related-items.ts

@@ -14,7 +14,10 @@ const configureRelatedItems: ConfigureRelatedItemsWidget = function configureRel
 ) {
   const makeWidget = connectConfigureRelatedItems(noop);
 
-  return makeWidget(widgetParams);
+  return {
+    ...makeWidget(widgetParams),
+    $$parms: widgetParams,
+  };
 };
 
 export default configureRelatedItems;

src/widgets/configure/configure.ts

@@ -16,7 +16,10 @@ const configure: ConfigureWidget = function configure(widgetParams) {
   // noop render and unmount functions.
   const makeWidget = connectConfigure(noop);
 
-  return makeWidget({ searchParameters: widgetParams });
+  return {
+    ...makeWidget({ searchParameters: widgetParams }),
+    $$params: widgetParams,
+  };
 };
 
 export default configure;

src/widgets/current-refinements/current-refinements.tsx

@@ -119,13 +119,16 @@ const currentRefinements: CurrentRefinementsWidget = function currentRefinements
     () => render(null, containerNode)
   );
 
-  return makeWidget({
-    container: containerNode,
-    cssClasses,
-    includedAttributes,
-    excludedAttributes,
-    transformItems,
-  });
+  return {
+    ...makeWidget({
+      container: containerNode,
+      cssClasses,
+      includedAttributes,
+      excludedAttributes,
+      transformItems,
+    }),
+    $$params: widgetParams,
+  };
 };
 
 export default currentRefinements;