fix(recommend): provide insights query parameters to recommend queries

.gitignore

@@ -30,6 +30,7 @@ scripts/*/CHANGELOG.md
 # private files
 .env
 .idea/
+.vscode/
 
 # Caches
 .eslintcache

babel.config.js

@@ -79,6 +79,9 @@ module.exports = (api) => {
             // false positive (babel doesn't know types)
             // this is actually only called on arrays
             'String.prototype.includes',
+
+            // false positive (spread)
+            'Object.getOwnPropertyDescriptors',
           ];
           if (defaultShouldInject && !exclude.includes(name)) {
             throw new Error(

bundlesize.config.json

@@ -2,35 +2,35 @@
   "files": [
     {
       "path": "packages/algoliasearch-helper/dist/algoliasearch.helper.js",
-      "maxSize": "40.25 kB"
+      "maxSize": "40.5 kB"
     },
     {
       "path": "packages/algoliasearch-helper/dist/algoliasearch.helper.min.js",
-      "maxSize": "12.75 kB"
+      "maxSize": "13 kB"
     },
     {
       "path": "./packages/instantsearch.js/dist/instantsearch.production.min.js",
-      "maxSize": "77.5 kB"
+      "maxSize": "77.75 kB"
     },
     {
       "path": "./packages/instantsearch.js/dist/instantsearch.development.js",
-      "maxSize": "170.75 kB"
+      "maxSize": "171.2 kB"
     },
     {
       "path": "packages/react-instantsearch-core/dist/umd/ReactInstantSearchCore.min.js",
-      "maxSize": "47.25 kB"
+      "maxSize": "47.5 kB"
     },
     {
       "path": "packages/react-instantsearch/dist/umd/ReactInstantSearch.min.js",
       "maxSize": "59.25 kB"
     },
     {
       "path": "packages/vue-instantsearch/vue2/umd/index.js",
-      "maxSize": "66.25 kB"
+      "maxSize": "67 kB"
     },
     {
       "path": "packages/vue-instantsearch/vue3/umd/index.js",
-      "maxSize": "66.75 kB"
+      "maxSize": "67 kB"
     },
     {
       "path": "packages/vue-instantsearch/vue2/cjs/index.js",

examples/js/getting-started/src/app.js

@@ -1,8 +1,9 @@
 import algoliasearch from 'algoliasearch/lite';
 import instantsearch from 'instantsearch.js';
+import { connectFrequentlyBoughtTogether } from 'instantsearch.js/es/connectors';
 import {
   configure,
-  hits,
+  // hits,
   pagination,
   panel,
   refinementList,
@@ -20,21 +21,19 @@ const search = instantsearch({
   insights: true,
 });
 
+const mySuperWidget = connectFrequentlyBoughtTogether(
+  ({ items, widgetParams }) => {
+    // eslint-disable-next-line no-console
+    console.log('FrequentlyBoughtTogether', { items, widgetParams });
+  }
+);
+
 search.addWidgets([
   searchBox({
     container: '#searchbox',
   }),
-  hits({
-    container: '#hits',
-    templates: {
-      item: (hit, { html, components }) => html`
-        <article>
-          <h1>${components.Highlight({ hit, attribute: 'name' })}</h1>
-          <p>${components.Highlight({ hit, attribute: 'description' })}</p>
-        </article>
-      `,
-    },
-  }),
+  mySuperWidget({ container: '#hits', objectID: '5723538' }),
+
   configure({
     hitsPerPage: 8,
   }),

packages/algoliasearch-helper/index.d.ts

@@ -16,6 +16,7 @@ import type {
   RelatedProductsQuery as RecommendRelatedProductsQuery,
   TrendingFacetsQuery as RecommendTrendingFacetsQuery,
   TrendingItemsQuery as RecommendTrendingItemsQuery,
+  RecommendQueriesResponse,
 } from '@algolia/recommend';
 
 /**
@@ -42,7 +43,7 @@ declare namespace algoliasearchHelper {
     state: SearchParameters;
     recommendState: RecommendParameters;
     lastResults: SearchResults | null;
-    lastRecommendResults: unknown | null; // TODO: Define type in dedicated PR
+    lastRecommendResults: RecommendResults | null;
     derivedHelpers: DerivedHelper[];
 
     on(
@@ -402,15 +403,15 @@ declare namespace algoliasearchHelper {
       event: 'recommend:result',
       cb: (res: {
         recommend: {
-          results: unknown | null; // TODO: Define type in dedicated PR
+          results: RecommendResults | null;
           state: RecommendParameters;
         };
       }) => void
     ): this;
     on(event: 'error', cb: (res: { error: Error }) => void): this;
 
     lastResults: SearchResults | null;
-    lastRecommendResults: unknown | null; // TODO: Define type in dedicated PR
+    lastRecommendResults: RecommendResults | null;
     detach(): void;
     getModifiedState(): SearchParameters;
     getModifiedRecommendState(): RecommendParameters;
@@ -1525,7 +1526,7 @@ declare namespace algoliasearchHelper {
   export type RecommendParametersWithId<
     T extends PlainRecommendParameters = PlainRecommendParameters
   > = T & {
-    $$id: string;
+    $$id: number;
   };
 
   export type RecommendParametersOptions = {
@@ -1553,6 +1554,20 @@ declare namespace algoliasearchHelper {
       params: RecommendParametersWithId<LookingSimilarQuery>
     ): RecommendParameters;
   }
+
+  type RecommendResponse<TObject> =
+    RecommendQueriesResponse<TObject>['results'];
+
+  type RecommendResultItem<TObject = any> = RecommendResponse<TObject>[0];
+
+  export class RecommendResults<T = any> {
+    constructor(state: RecommendParameters, results: RecommendResponse<T>);
+
+    _state: RecommendParameters;
+    _rawResults: RecommendResponse<T>;
+
+    [index: number]: RecommendResultItem<T>;
+  }
 }
 
 export = algoliasearchHelper;

packages/algoliasearch-helper/src/RecommendResults/index.js

@@ -0,0 +1,28 @@
+'use strict';
+
+/**
+ * Constructor for SearchResults
+ * @class
+ * @classdesc SearchResults contains the results of a query to Algolia using the
+ * {@link AlgoliaSearchHelper}.
+ * @param {RecommendParameters} state state that led to the response
+ * @param {Record<string,RecommendResultItem>} results the results from algolia client
+ **/
+function RecommendResults(state, results) {
+  this._state = state;
+  this._rawResults = results;
+
+  // eslint-disable-next-line consistent-this
+  var self = this;
+
+  state.params.forEach(function (param) {
+    var id = param.$$id;
+    self[id] = results[id];
+  });
+}
+
+RecommendResults.prototype = {
+  constructor: RecommendResults,
+};
+
+module.exports = RecommendResults;

packages/algoliasearch-helper/src/algoliasearch.helper.js

@@ -9,6 +9,7 @@ var merge = require('./functions/merge');
 var objectHasKeys = require('./functions/objectHasKeys');
 var omit = require('./functions/omit');
 var RecommendParameters = require('./RecommendParameters');
+var RecommendResults = require('./RecommendResults');
 var requestBuilder = require('./requestBuilder');
 var SearchParameters = require('./SearchParameters');
 var SearchResults = require('./SearchResults');
@@ -1577,6 +1578,9 @@ AlgoliaSearchHelper.prototype._recommend = function () {
   var recommendState = this.recommendState;
   var index = this.getIndex();
   var states = [{ state: recommendState, index: index, helper: this }];
+  var ids = recommendState.params.map(function (param) {
+    return param.$$id;
+  });
 
   this.emit('fetch', {
     recommend: {
@@ -1603,6 +1607,20 @@ AlgoliaSearchHelper.prototype._recommend = function () {
       helper: derivedHelper,
     });
 
+    ids = Array.prototype.concat.apply(
+      ids,
+      derivedState.params.map(function (param) {
+        return param.$$id;
+      })
+    );
+
+    ids = Array.prototype.concat.apply(
+      ids,
+      derivedState.params.map(function (param) {
+        return param.$$id;
+      })
+    );
+
     derivedHelper.emit('fetch', {
       recommend: {
         state: derivedState,
@@ -1613,10 +1631,16 @@ AlgoliaSearchHelper.prototype._recommend = function () {
     return derivedState._buildQueries(derivedIndex);
   });
 
-  var queries = Array.prototype.concat.apply(
-    this.recommendState._buildQueries(index),
-    derivedQueries
-  );
+  var queries = Array.prototype.concat
+    .apply(this.recommendState._buildQueries(index), derivedQueries)
+    .map(function (query) {
+      return Object.assign(query, {
+        queryParameters: Object.assign(query.queryParameters || {}, {
+          clickAnalytics: searchState.clickAnalytics,
+          userToken: searchState.userToken,
+        }),
+      });
+    });
 
   if (queries.length === 0) {
     return;
@@ -1639,7 +1663,7 @@ AlgoliaSearchHelper.prototype._recommend = function () {
   try {
     this.client
       .getRecommendations(queries)
-      .then(this._dispatchRecommendResponse.bind(this, queryId, states))
+      .then(this._dispatchRecommendResponse.bind(this, queryId, states, ids))
       .catch(this._dispatchRecommendError.bind(this, queryId));
   } catch (error) {
     // If we reach this part, we're in an internal error state
@@ -1713,6 +1737,7 @@ AlgoliaSearchHelper.prototype._dispatchAlgoliaResponse = function (
 AlgoliaSearchHelper.prototype._dispatchRecommendResponse = function (
   queryId,
   states,
+  ids,
   content
 ) {
   // @TODO remove the number of outdated queries discarded instead of just one
@@ -1728,7 +1753,11 @@ AlgoliaSearchHelper.prototype._dispatchRecommendResponse = function (
 
   if (this._currentNbRecommendQueries === 0) this.emit('recommendQueueEmpty');
 
-  var results = content.results.slice();
+  var results = {};
+  content.results.forEach(function (result, index) {
+    var id = ids[index];
+    results[id] = result;
+  });
 
   states.forEach(function (s) {
     var state = s.state;
@@ -1744,7 +1773,7 @@ AlgoliaSearchHelper.prototype._dispatchRecommendResponse = function (
       return;
     }
 
-    helper.lastRecommendResults = results;
+    helper.lastRecommendResults = new RecommendResults(state, results);
 
     // eslint-disable-next-line no-warning-comments
     // TODO: emit "result" event when events for Recommend are implemented

packages/algoliasearch-helper/test/datasets/RecommendParameters/recommend.dataset.js

@@ -152,12 +152,12 @@ function getData() {
   var recommendParams = new RecommendParameters({
     params: [
       {
-        $$id: '1',
+        $$id: 1,
         objectID: 'A0E20000000279B',
         model: 'bought-together',
       },
       {
-        $$id: '2',
+        $$id: 2,
         facetName: 'brand',
         model: 'trending-facets',
       },