From f43c40f5d64708f6938ac2843b62b212c4885eff Mon Sep 17 00:00:00 2001 From: Emmanuel Krebs Date: Tue, 18 Feb 2025 16:00:36 +0100 Subject: [PATCH] feat: make events default implementation compatible with composition API (#6569) * feat: get index from results if it exists * chore: update implementations dependant on createSendEventForHits * chore: update tests * fix: bundle size * chore: use createSearchClient in test * Update packages/instantsearch.js/src/connectors/rating-menu/connectRatingMenu.ts Co-authored-by: Haroen Viaene --------- Co-authored-by: Haroen Viaene --- bundlesize.config.json | 2 +- .../__tests__/connectAutocomplete-test.ts | 4 ++-- .../autocomplete/connectAutocomplete.ts | 2 +- .../connectFrequentlyBoughtTogether.ts | 2 +- .../connectors/geo-search/connectGeoSearch.ts | 2 +- .../src/connectors/hits/connectHits.ts | 4 ++-- .../infinite-hits/connectInfiniteHits.ts | 4 ++-- .../looking-similar/connectLookingSimilar.ts | 2 +- .../rating-menu/connectRatingMenu.ts | 2 +- .../connectRelatedProducts.ts | 2 +- .../connectToggleRefinement.ts | 2 +- .../trending-items/connectTrendingItems.ts | 2 +- .../__tests__/insights-listener-test.tsx | 8 ++++--- .../__tests__/createSendEventForHits-test.ts | 4 ++-- .../src/lib/utils/createSendEventForFacet.ts | 2 +- .../src/lib/utils/createSendEventForHits.ts | 23 ++++++++++--------- 16 files changed, 35 insertions(+), 32 deletions(-) diff --git a/bundlesize.config.json b/bundlesize.config.json index 44e6577dc1..afd98b07e4 100644 --- a/bundlesize.config.json +++ b/bundlesize.config.json @@ -10,7 +10,7 @@ }, { "path": "./packages/instantsearch.js/dist/instantsearch.production.min.js", - "maxSize": "84 kB" + "maxSize": "84.25 kB" }, { "path": "./packages/instantsearch.js/dist/instantsearch.development.js", diff --git a/packages/instantsearch.js/src/connectors/autocomplete/__tests__/connectAutocomplete-test.ts b/packages/instantsearch.js/src/connectors/autocomplete/__tests__/connectAutocomplete-test.ts index a0287ce795..f71ea2c8eb 100644 --- a/packages/instantsearch.js/src/connectors/autocomplete/__tests__/connectAutocomplete-test.ts +++ b/packages/instantsearch.js/src/connectors/autocomplete/__tests__/connectAutocomplete-test.ts @@ -752,7 +752,7 @@ search.addWidgets([ hits: firstIndexHits, }), ]), - helper, + helper: algoliasearchHelper(searchClient, 'indexName0'), }, { indexId: 'indexId1', @@ -762,7 +762,7 @@ search.addWidgets([ hits: secondIndexHits, }), ]), - helper, + helper: algoliasearchHelper(searchClient, 'indexName1'), }, ]; diff --git a/packages/instantsearch.js/src/connectors/autocomplete/connectAutocomplete.ts b/packages/instantsearch.js/src/connectors/autocomplete/connectAutocomplete.ts index 095600b86a..341d2cb54f 100644 --- a/packages/instantsearch.js/src/connectors/autocomplete/connectAutocomplete.ts +++ b/packages/instantsearch.js/src/connectors/autocomplete/connectAutocomplete.ts @@ -191,7 +191,7 @@ search.addWidgets([ const sendEvent = createSendEventForHits({ instantSearchInstance, - getIndex: () => scopedResult.results?.index || '', + helper: scopedResult.helper, widgetType: this.$$type, }); diff --git a/packages/instantsearch.js/src/connectors/frequently-bought-together/connectFrequentlyBoughtTogether.ts b/packages/instantsearch.js/src/connectors/frequently-bought-together/connectFrequentlyBoughtTogether.ts index 9861fd375e..cccfba2aa3 100644 --- a/packages/instantsearch.js/src/connectors/frequently-bought-together/connectFrequentlyBoughtTogether.ts +++ b/packages/instantsearch.js/src/connectors/frequently-bought-together/connectFrequentlyBoughtTogether.ts @@ -164,7 +164,7 @@ export default (function connectFrequentlyBoughtTogether< if (!sendEvent) { sendEvent = createSendEventForHits({ instantSearchInstance, - getIndex: () => helper.getIndex(), + helper, widgetType: this.$$type, }); } diff --git a/packages/instantsearch.js/src/connectors/geo-search/connectGeoSearch.ts b/packages/instantsearch.js/src/connectors/geo-search/connectGeoSearch.ts index 42c42b6b08..3cbf150695 100644 --- a/packages/instantsearch.js/src/connectors/geo-search/connectGeoSearch.ts +++ b/packages/instantsearch.js/src/connectors/geo-search/connectGeoSearch.ts @@ -352,7 +352,7 @@ export default (function connectGeoSearch< if (!sendEvent) { sendEvent = createSendEventForHits({ instantSearchInstance, - getIndex: () => helper.getIndex(), + helper, widgetType: $$type, }); } diff --git a/packages/instantsearch.js/src/connectors/hits/connectHits.ts b/packages/instantsearch.js/src/connectors/hits/connectHits.ts index ee1ece4e12..e3f79074b3 100644 --- a/packages/instantsearch.js/src/connectors/hits/connectHits.ts +++ b/packages/instantsearch.js/src/connectors/hits/connectHits.ts @@ -148,14 +148,14 @@ export default (function connectHits( if (!sendEvent) { sendEvent = createSendEventForHits({ instantSearchInstance, - getIndex: () => helper.getIndex(), + helper, widgetType: this.$$type, }); } if (!bindEvent) { bindEvent = createBindEventForHits({ - getIndex: () => helper.getIndex(), + helper, widgetType: this.$$type, instantSearchInstance, }); diff --git a/packages/instantsearch.js/src/connectors/infinite-hits/connectInfiniteHits.ts b/packages/instantsearch.js/src/connectors/infinite-hits/connectInfiniteHits.ts index 2656199140..b02d8573b2 100644 --- a/packages/instantsearch.js/src/connectors/infinite-hits/connectInfiniteHits.ts +++ b/packages/instantsearch.js/src/connectors/infinite-hits/connectInfiniteHits.ts @@ -355,11 +355,11 @@ export default (function connectInfiniteHits< showMore = getShowMore(helper); sendEvent = createSendEventForHits({ instantSearchInstance, - getIndex: () => helper.getIndex(), + helper, widgetType: this.$$type, }); bindEvent = createBindEventForHits({ - getIndex: () => helper.getIndex(), + helper, widgetType: this.$$type, instantSearchInstance, }); diff --git a/packages/instantsearch.js/src/connectors/looking-similar/connectLookingSimilar.ts b/packages/instantsearch.js/src/connectors/looking-similar/connectLookingSimilar.ts index f3feb39edd..e6e22d3644 100644 --- a/packages/instantsearch.js/src/connectors/looking-similar/connectLookingSimilar.ts +++ b/packages/instantsearch.js/src/connectors/looking-similar/connectLookingSimilar.ts @@ -166,7 +166,7 @@ export default (function connectLookingSimilar< if (!sendEvent) { sendEvent = createSendEventForHits({ instantSearchInstance, - getIndex: () => helper.getIndex(), + helper, widgetType: this.$$type, }); } diff --git a/packages/instantsearch.js/src/connectors/rating-menu/connectRatingMenu.ts b/packages/instantsearch.js/src/connectors/rating-menu/connectRatingMenu.ts index 1d7d5c0627..85c4b1407d 100644 --- a/packages/instantsearch.js/src/connectors/rating-menu/connectRatingMenu.ts +++ b/packages/instantsearch.js/src/connectors/rating-menu/connectRatingMenu.ts @@ -63,7 +63,7 @@ const createSendEvent: CreateSendEvent = eventModifier, payload: { eventName, - index: helper.getIndex(), + index: helper.lastResults?.index || helper.state.index, filters: [`${attribute}>=${facetValue}`], }, attribute, diff --git a/packages/instantsearch.js/src/connectors/related-products/connectRelatedProducts.ts b/packages/instantsearch.js/src/connectors/related-products/connectRelatedProducts.ts index a8ac1aa5df..17219540e5 100644 --- a/packages/instantsearch.js/src/connectors/related-products/connectRelatedProducts.ts +++ b/packages/instantsearch.js/src/connectors/related-products/connectRelatedProducts.ts @@ -167,7 +167,7 @@ export default (function connectRelatedProducts< if (!sendEvent) { sendEvent = createSendEventForHits({ instantSearchInstance, - getIndex: () => helper.getIndex(), + helper, widgetType: this.$$type, }); } diff --git a/packages/instantsearch.js/src/connectors/toggle-refinement/connectToggleRefinement.ts b/packages/instantsearch.js/src/connectors/toggle-refinement/connectToggleRefinement.ts index bbc2799fe3..fccc3373ff 100644 --- a/packages/instantsearch.js/src/connectors/toggle-refinement/connectToggleRefinement.ts +++ b/packages/instantsearch.js/src/connectors/toggle-refinement/connectToggleRefinement.ts @@ -72,7 +72,7 @@ const createSendEvent = ({ eventModifier, payload: { eventName, - index: helper.getIndex(), + index: helper.lastResults?.index || helper.state.index, filters: on.map((value) => `${attribute}:${value}`), }, attribute, diff --git a/packages/instantsearch.js/src/connectors/trending-items/connectTrendingItems.ts b/packages/instantsearch.js/src/connectors/trending-items/connectTrendingItems.ts index 8f1b1e76bc..35e069edb1 100644 --- a/packages/instantsearch.js/src/connectors/trending-items/connectTrendingItems.ts +++ b/packages/instantsearch.js/src/connectors/trending-items/connectTrendingItems.ts @@ -187,7 +187,7 @@ export default (function connectTrendingItems< if (!sendEvent) { sendEvent = createSendEventForHits({ instantSearchInstance, - getIndex: () => helper.getIndex(), + helper, widgetType: this.$$type, }); } diff --git a/packages/instantsearch.js/src/lib/insights/__tests__/insights-listener-test.tsx b/packages/instantsearch.js/src/lib/insights/__tests__/insights-listener-test.tsx index d6682cba28..4b42f44268 100644 --- a/packages/instantsearch.js/src/lib/insights/__tests__/insights-listener-test.tsx +++ b/packages/instantsearch.js/src/lib/insights/__tests__/insights-listener-test.tsx @@ -3,7 +3,9 @@ */ /** @jsx h */ +import { createSearchClient } from '@instantsearch/mocks'; import { render, fireEvent } from '@testing-library/preact'; +import algoliasearchHelper from 'algoliasearch-helper'; import { h } from 'preact'; import { createInstantSearch } from '../../../../test/createInstantSearch'; @@ -128,7 +130,7 @@ describe('createInsightsEventHandler', () => { const payload = serializePayload( _buildEventPayloadsForHits({ widgetType: 'ais.hits', - getIndex: () => 'instant_search', + helper: algoliasearchHelper(createSearchClient(), 'instant_search'), instantSearchInstance: createInstantSearch(), methodName: 'bindEvent', args: ['click', { objectID: '1', __position: 1 }, 'Hit Clicked'], @@ -172,7 +174,7 @@ describe('createInsightsEventHandler', () => { const payload = serializePayload( _buildEventPayloadsForHits({ widgetType: 'ais.hits', - getIndex: () => 'instant_search', + helper: algoliasearchHelper(createSearchClient(), 'instant_search'), instantSearchInstance: createInstantSearch(), methodName: 'bindEvent', args: ['click', { objectID: '1', __position: 1 }, 'Hit Clicked'], @@ -246,7 +248,7 @@ describe('createInsightsEventHandler', () => { const modernPayload = serializePayload( _buildEventPayloadsForHits({ widgetType: 'ais.hits', - getIndex: () => 'instant_search', + helper: algoliasearchHelper(createSearchClient(), 'instant_search'), instantSearchInstance: createInstantSearch(), methodName: 'bindEvent', args: ['click', { objectID: '1', __position: 1 }, 'Product Clicked'], diff --git a/packages/instantsearch.js/src/lib/utils/__tests__/createSendEventForHits-test.ts b/packages/instantsearch.js/src/lib/utils/__tests__/createSendEventForHits-test.ts index a08002c996..ff3271aa08 100644 --- a/packages/instantsearch.js/src/lib/utils/__tests__/createSendEventForHits-test.ts +++ b/packages/instantsearch.js/src/lib/utils/__tests__/createSendEventForHits-test.ts @@ -38,11 +38,11 @@ const createTestEnvironment = ({ }; const sendEvent = createSendEventForHits({ instantSearchInstance, - getIndex: () => helper.getIndex(), + helper, widgetType, }); const bindEvent = createBindEventForHits({ - getIndex: () => helper.getIndex(), + helper, widgetType, instantSearchInstance, }); diff --git a/packages/instantsearch.js/src/lib/utils/createSendEventForFacet.ts b/packages/instantsearch.js/src/lib/utils/createSendEventForFacet.ts index 2a8652c9b1..952afbac1e 100644 --- a/packages/instantsearch.js/src/lib/utils/createSendEventForFacet.ts +++ b/packages/instantsearch.js/src/lib/utils/createSendEventForFacet.ts @@ -45,7 +45,7 @@ export function createSendEventForFacet({ eventModifier, payload: { eventName, - index: helper.getIndex(), + index: helper.lastResults?.index || helper.state.index, filters: [`${attribute}:${facetValue}`], ...additionalData, }, diff --git a/packages/instantsearch.js/src/lib/utils/createSendEventForHits.ts b/packages/instantsearch.js/src/lib/utils/createSendEventForHits.ts index 8b62d505be..adf5fcca9b 100644 --- a/packages/instantsearch.js/src/lib/utils/createSendEventForHits.ts +++ b/packages/instantsearch.js/src/lib/utils/createSendEventForHits.ts @@ -2,6 +2,7 @@ import { serializePayload } from './serializer'; import type { InsightsEvent } from '../../middlewares/createInsightsMiddleware'; import type { InstantSearch, Hit, EscapedHits } from '../../types'; +import type { AlgoliaSearchHelper } from 'algoliasearch-helper'; type BuiltInSendEventForHits = ( eventType: string, @@ -30,14 +31,14 @@ function chunk(arr: TItem[], chunkSize: number = 20): TItem[][] { } export function _buildEventPayloadsForHits({ - getIndex, + helper, widgetType, methodName, args, instantSearchInstance, }: { widgetType: string; - getIndex: () => string; + helper: AlgoliaSearchHelper; methodName: 'sendEvent' | 'bindEvent'; args: any[]; instantSearchInstance: InstantSearch; @@ -101,7 +102,7 @@ export function _buildEventPayloadsForHits({ eventType, payload: { eventName: eventName || 'Hits Viewed', - index: getIndex(), + index: helper.lastResults?.index || helper.state.index, objectIDs: objectIDsByChunk[i], ...additionalData, }, @@ -117,7 +118,7 @@ export function _buildEventPayloadsForHits({ eventType, payload: { eventName: eventName || 'Hit Clicked', - index: getIndex(), + index: helper.lastResults?.index || helper.state.index, queryID, objectIDs: objectIDsByChunk[i], positions: positionsByChunk[i], @@ -135,7 +136,7 @@ export function _buildEventPayloadsForHits({ eventType, payload: { eventName: eventName || 'Hit Converted', - index: getIndex(), + index: helper.lastResults?.index || helper.state.index, queryID, objectIDs: objectIDsByChunk[i], ...additionalData, @@ -155,11 +156,11 @@ export function _buildEventPayloadsForHits({ export function createSendEventForHits({ instantSearchInstance, - getIndex, + helper, widgetType, }: { instantSearchInstance: InstantSearch; - getIndex: () => string; + helper: AlgoliaSearchHelper; widgetType: string; }): SendEventForHits { let sentEvents: Record = {}; @@ -168,7 +169,7 @@ export function createSendEventForHits({ const sendEventForHits: SendEventForHits = (...args: any[]) => { const payloads = _buildEventPayloadsForHits({ widgetType, - getIndex, + helper, methodName: 'sendEvent', args, instantSearchInstance, @@ -196,18 +197,18 @@ export function createSendEventForHits({ } export function createBindEventForHits({ - getIndex, + helper, widgetType, instantSearchInstance, }: { - getIndex: () => string; + helper: AlgoliaSearchHelper; widgetType: string; instantSearchInstance: InstantSearch; }): BindEventForHits { const bindEventForHits: BindEventForHits = (...args: any[]) => { const payloads = _buildEventPayloadsForHits({ widgetType, - getIndex, + helper, methodName: 'bindEvent', args, instantSearchInstance,