refactor: remove insightsClient prop (#6462)

The `insightsClient` prop is a remnant of an older implementation of insights, and no longer is needed. In this PR it's removed.

BREAKING CHANGE: use `insights` prop of instantsearch instead of `insightsClient`

Author: Haroenv

packages/instantsearch-core/src/__tests__/instantsearch.test.tsx

@@ -157,25 +157,6 @@ See: https://www.algolia.com/doc/guides/building-search-ui/going-further/backend
     });
   });
 
-  it('throws if insightsClient is not a function', () => {
-    const warn = jest.spyOn(global.console, 'warn');
-    warn.mockImplementation(() => {});
-
-    expect(() => {
-      // eslint-disable-next-line no-new
-      new InstantSearch({
-        indexName: 'indexName',
-        searchClient: createSearchClient(),
-        // @ts-expect-error
-        insightsClient: 'insights',
-      });
-    }).toThrowErrorMatchingInlineSnapshot(`
-"The \`insightsClient\` option should be a function.
-
-See documentation: https://www.algolia.com/doc/api-reference/widgets/instantsearch/js/"
-`);
-  });
-
   it('throws if addWidgets is called with a single widget', () => {
     expect(() => {
       const search = new InstantSearch({
@@ -311,27 +292,6 @@ See documentation: https://www.algolia.com/doc/api-reference/widgets/instantsear
     }).not.toWarnDev();
   });
 
-  it('warns dev when insightsClient is given', () => {
-    const searchClient = createSearchClient({
-      addAlgoliaAgent: jest.fn(),
-    });
-    const warn = jest.spyOn(global.console, 'warn');
-    warn.mockImplementation(() => {});
-
-    expect(() => {
-      // eslint-disable-next-line no-new
-      new InstantSearch({
-        indexName: 'indexName',
-        searchClient,
-        insightsClient: () => {},
-      });
-    }).toWarnDev(
-      `[InstantSearch]: \`insightsClient\` property has been deprecated. It is still supported in 4.x releases, but not further. It is replaced by the \`insights\` middleware.
-
-For more information, visit https://www.algolia.com/doc/guides/getting-insights-and-analytics/search-analytics/click-through-and-conversions/how-to/send-click-and-conversion-events-with-instantsearch/js/`
-    );
-  });
-
   it('accepts middleware with partial methods', () => {
     const search = new InstantSearch({
       indexName: 'indexName',
@@ -415,17 +375,6 @@ search.addWidgets([
 See https://www.algolia.com/doc/api-reference/widgets/configure/js/`);
   });
 
-  it('does store insightsClient on the instance', () => {
-    const insightsClient = () => {};
-    const search = new InstantSearch({
-      indexName: 'indexName',
-      searchClient: createSearchClient(),
-      insightsClient,
-    });
-
-    expect(search.insightsClient).toBe(insightsClient);
-  });
-
   it("exposes helper's last results", async () => {
     const searchClient = createSearchClient();
 

packages/instantsearch-core/src/instantsearch.ts

@@ -24,7 +24,6 @@ import version from './version';
 import { index } from './widgets/index-widget';
 
 import type {
-  InsightsClient as AlgoliaInsightsClient,
   SearchClient,
   Widget,
   IndexWidget,
@@ -67,7 +66,6 @@ export class InstantSearch<
 > extends EventEmitter {
   client: InstantSearchOptions['searchClient'];
   indexName: string;
-  insightsClient: AlgoliaInsightsClient | null;
   onStateChange: InstantSearchOptions<TUiState>['onStateChange'] | null = null;
   future: NonNullable<InstantSearchOptions<TUiState>['future']>;
   helper: AlgoliaSearchHelper | null;
@@ -114,7 +112,6 @@ export class InstantSearch<
       searchFunction,
       stalledSearchDelay = 200,
       searchClient = null,
-      insightsClient = null,
       onStateChange = null,
       future = {
         ...INSTANTSEARCH_FUTURE_DEFAULTS,
@@ -138,19 +135,6 @@ See: https://www.algolia.com/doc/guides/building-search-ui/going-further/backend
       searchClient.addAlgoliaAgent(`instantsearch-core (${version})`);
     }
 
-    warning(
-      insightsClient === null,
-      `\`insightsClient\` property has been deprecated. It is still supported in 4.x releases, but not further. It is replaced by the \`insights\` middleware.
-
-For more information, visit https://www.algolia.com/doc/guides/getting-insights-and-analytics/search-analytics/click-through-and-conversions/how-to/send-click-and-conversion-events-with-instantsearch/js/`
-    );
-
-    if (insightsClient && typeof insightsClient !== 'function') {
-      throw new Error(
-        withUsage('The `insightsClient` option should be a function.')
-      );
-    }
-
     warning(
       !(options as any).searchParameters,
       `The \`searchParameters\` option is deprecated and will not be supported in InstantSearch.js 4.x.
@@ -183,7 +167,6 @@ See documentation: ${createDocumentationLink({
 
     this.client = searchClient;
     this.future = future;
-    this.insightsClient = insightsClient;
     this.indexName = indexName;
     this.helper = null;
     this.mainHelper = null;

packages/instantsearch-core/src/types/instantsearch.ts

@@ -1,8 +1,5 @@
 import type { SearchClient } from './algoliasearch';
-import type {
-  InsightsClient as AlgoliaInsightsClient,
-  InsightsProps,
-} from './insights';
+import type { InsightsProps } from './insights';
 import type { RouterProps } from './router';
 import type { UiState } from './ui-state';
 import type { AlgoliaSearchHelper } from 'algoliasearch-helper';
@@ -93,13 +90,6 @@ export type InstantSearchOptions<
    * @default false
    */
   insights?: InsightsProps | boolean;
-  /**
-   * the instance of search-insights to use for sending insights events inside
-   * widgets like `hits`.
-   *
-   * @deprecated This property will be still supported in 4.x releases, but not further. It is replaced by the `insights` middleware. For more information, visit https://www.algolia.com/doc/guides/getting-insights-and-analytics/search-analytics/click-through-and-conversions/how-to/send-click-and-conversion-events-with-instantsearch/js/
-   */
-  insightsClient?: AlgoliaInsightsClient;
   future?: {
     /**
      * Changes the way `dispose` is used in InstantSearch lifecycle.

packages/instantsearch-core/test/createInstantSearch.ts

@@ -28,7 +28,6 @@ export const createInstantSearch = (
     },
     refresh: jest.fn(),
     helper: mainHelper, // @TODO: use the Helper from the index once the RoutingManger uses the index
-    insightsClient: null,
     middleware: [],
     renderState: {},
     scheduleStalledRender: defer(jest.fn()),

packages/instantsearch.js/stories/hits.stories.ts

@@ -1,15 +1,7 @@
-import { action } from '@storybook/addon-actions';
 import { storiesOf } from '@storybook/html';
 
 import { withHits } from '../.storybook/decorators';
 
-import type { InsightsClient } from '../src/types';
-
-const fakeInsightsClient: InsightsClient = (method, ...payloads) => {
-  const [payload] = payloads;
-  action(`[InsightsClient] sent ${method} with payload`)(payload);
-};
-
 storiesOf('Results/Hits', module)
   .add(
     'default',
@@ -138,33 +130,28 @@ storiesOf('Results/Hits', module)
   )
   .add(
     'with insights function',
-    withHits(
-      ({ search, container, instantsearch }) => {
-        search.addWidgets([
-          instantsearch.widgets.configure({
-            attributesToSnippet: ['name', 'description'],
-            clickAnalytics: true,
-          }),
-        ]);
+    withHits(({ search, container, instantsearch }) => {
+      search.addWidgets([
+        instantsearch.widgets.configure({
+          attributesToSnippet: ['name', 'description'],
+          clickAnalytics: true,
+        }),
+      ]);
 
-        search.addWidgets([
-          instantsearch.widgets.hits({
-            container,
-            templates: {
-              item: (item, { html, sendEvent }) => html`
-                <h4>${item.name}</h4>
-                <button
-                  onClick=${() => sendEvent('click', [item], 'Add to cart')}
-                >
-                  Add to cart
-                </button>
-              `,
-            },
-          }),
-        ]);
-      },
-      {
-        insightsClient: fakeInsightsClient,
-      }
-    )
+      search.addWidgets([
+        instantsearch.widgets.hits({
+          container,
+          templates: {
+            item: (item, { html, sendEvent }) => html`
+              <h4>${item.name}</h4>
+              <button
+                onClick=${() => sendEvent('click', [item], 'Add to cart')}
+              >
+                Add to cart
+              </button>
+            `,
+          },
+        }),
+      ]);
+    })
   );

packages/instantsearch.js/stories/infinite-hits.stories.ts

@@ -1,16 +1,8 @@
-import { action } from '@storybook/addon-actions';
 import { storiesOf } from '@storybook/html';
 
 import { withHits } from '../.storybook/decorators';
 import { createInfiniteHitsSessionStorageCache } from '../src/lib/infiniteHitsCache';
 
-import type { InsightsClient } from '../src/types';
-
-const fakeInsightsClient: InsightsClient = (method, ...payloads) => {
-  const [payload] = payloads;
-  action(`[InsightsClient] sent ${method} with payload`)(payload);
-};
-
 storiesOf('Results/InfiniteHits', module)
   .add(
     'default',
@@ -59,40 +51,35 @@ storiesOf('Results/InfiniteHits', module)
   )
   .add(
     'with insights helper',
-    withHits(
-      ({ search, container, instantsearch }) => {
-        search.addWidgets([
-          instantsearch.widgets.configure({
-            attributesToSnippet: ['name', 'description'],
-            clickAnalytics: true,
-          }),
-        ]);
+    withHits(({ search, container, instantsearch }) => {
+      search.addWidgets([
+        instantsearch.widgets.configure({
+          attributesToSnippet: ['name', 'description'],
+          clickAnalytics: true,
+        }),
+      ]);
 
-        search.addWidgets([
-          instantsearch.widgets.infiniteHits({
-            container,
-            templates: {
-              item: (item, { html, sendEvent }) => html`
-                <h4>${item.name}</h4>
-                <button
-                  onClick=${() =>
-                    sendEvent(
-                      'clickedObjectIDsAfterSearch',
-                      [item],
-                      'Add to cart'
-                    )}
-                >
-                  Add to cart
-                </button>
-              `,
-            },
-          }),
-        ]);
-      },
-      {
-        insightsClient: fakeInsightsClient,
-      }
-    )
+      search.addWidgets([
+        instantsearch.widgets.infiniteHits({
+          container,
+          templates: {
+            item: (item, { html, sendEvent }) => html`
+              <h4>${item.name}</h4>
+              <button
+                onClick=${() =>
+                  sendEvent(
+                    'clickedObjectIDsAfterSearch',
+                    [item],
+                    'Add to cart'
+                  )}
+              >
+                Add to cart
+              </button>
+            `,
+          },
+        }),
+      ]);
+    })
   )
   .add(
     'with previous button enabled',

packages/instantsearch.js/test/createInstantSearch.ts

@@ -30,7 +30,6 @@ export const createInstantSearch = (
     },
     refresh: jest.fn(),
     helper: mainHelper, // @TODO: use the Helper from the index once the RoutingManger uses the index
-    insightsClient: null,
     middleware: [],
     renderState: {},
     scheduleStalledRender: defer(jest.fn()),

packages/vue-instantsearch/.storybook/addons.js

@@ -1,3 +1,2 @@
 import '@storybook/addon-knobs/register';
 import '@storybook/addon-options/register';
-import '@storybook/addon-actions/register';

packages/vue-instantsearch/src/components/InstantSearch.js

@@ -16,10 +16,6 @@ export default createInstantSearchComponent({
       type: Object,
       required: true,
     },
-    insightsClient: {
-      type: Function,
-      default: undefined,
-    },
     indexName: {
       type: String,
       required: true,
@@ -98,7 +94,6 @@ export default createInstantSearchComponent({
     return {
       instantSearchInstance: instantsearch({
         searchClient: this.searchClient,
-        insightsClient: this.insightsClient,
         insights: this.insights,
         indexName: this.indexName,
         routing: this.routing,

packages/vue-instantsearch/src/components/__tests__/InstantSearch.js

@@ -42,7 +42,6 @@ beforeEach(() => {
 
 it('passes props to InstantSearch.js', () => {
   const searchClient = createSearchClient();
-  const insightsClient = jest.fn();
   const searchFunction = (helper) => helper.search();
   const routing = {
     router: historyRouter(),
@@ -52,7 +51,6 @@ it('passes props to InstantSearch.js', () => {
   mount(InstantSearch, {
     propsData: {
       searchClient,
-      insightsClient,
       indexName: 'something',
       routing,
       stalledSearchDelay: 250,
@@ -64,7 +62,6 @@ it('passes props to InstantSearch.js', () => {
     indexName: 'something',
     routing,
     searchClient,
-    insightsClient,
     searchFunction,
     stalledSearchDelay: 250,
   });