feat(preset-algolia): attach algolia credentials on hits (#1117)

Co-authored-by: Haroen Viaene <hello@haroen.me>
algolia · Apr 24, 2023 · 8bcd680 · 8bcd680
1 parent 63dd995
commit 8bcd680
Show file tree

Hide file tree

Showing 9 changed files with 110 additions and 16 deletions.
diff --git a/bundlesize.config.json b/bundlesize.config.json
@@ -6,11 +6,11 @@
     },
     {
       "path": "packages/autocomplete-js/dist/umd/index.production.js",
-      "maxSize": "18.75 kB"
+      "maxSize": "19 kB"
     },
     {
       "path": "packages/autocomplete-preset-algolia/dist/umd/index.production.js",
-      "maxSize": "2.25 kB"
+      "maxSize": "2.5 kB"
     },
     {
       "path": "packages/autocomplete-plugin-algolia-insights/dist/umd/index.production.js",
@@ -26,7 +26,7 @@
     },
     {
       "path": "packages/autocomplete-plugin-query-suggestions/dist/umd/index.production.js",
-      "maxSize": "3.25 kB"
+      "maxSize": "3.5 kB"
     },
     {
       "path": "packages/autocomplete-plugin-tags/dist/umd/index.production.js",

diff --git a/packages/autocomplete-js/src/__tests__/requester.test.ts b/packages/autocomplete-js/src/__tests__/requester.test.ts
@@ -265,7 +265,7 @@ describe('requester', () => {
           .map((node) => node.textContent)
       ).toMatchInlineSnapshot(`
         Array [
-          "{\\"objectID\\":\\"1\\",\\"label\\":\\"Hit 1\\",\\"__autocomplete_id\\":0}",
+          "{\\"objectID\\":\\"1\\",\\"label\\":\\"Hit 1\\",\\"__autocomplete_algoliaCredentials\\":{\\"appId\\":\\"algoliaAppId\\",\\"apiKey\\":\\"algoliaApiKey\\"},\\"__autocomplete_id\\":0}",
         ]
       `);
 
@@ -304,7 +304,7 @@ describe('requester', () => {
           .map((node) => node.textContent)
       ).toMatchInlineSnapshot(`
         Array [
-          "{\\"objectID\\":\\"7\\",\\"label\\":\\"Hit 7\\",\\"__autocomplete_id\\":4}",
+          "{\\"objectID\\":\\"7\\",\\"label\\":\\"Hit 7\\",\\"__autocomplete_algoliaCredentials\\":{\\"appId\\":\\"algoliaAppId\\",\\"apiKey\\":\\"algoliaApiKey\\"},\\"__autocomplete_id\\":4}",
         ]
       `);
 
@@ -316,8 +316,8 @@ describe('requester', () => {
           .map((node) => node.textContent)
       ).toMatchInlineSnapshot(`
         Array [
-          "{\\"objectID\\":\\"3\\",\\"label\\":\\"Hit 3\\",\\"__autocomplete_id\\":5}",
-          "{\\"objectID\\":\\"4\\",\\"label\\":\\"Hit 4\\",\\"__autocomplete_id\\":6}",
+          "{\\"objectID\\":\\"3\\",\\"label\\":\\"Hit 3\\",\\"__autocomplete_algoliaCredentials\\":{\\"appId\\":\\"algoliaAppId\\",\\"apiKey\\":\\"algoliaApiKey\\"},\\"__autocomplete_id\\":5}",
+          "{\\"objectID\\":\\"4\\",\\"label\\":\\"Hit 4\\",\\"__autocomplete_algoliaCredentials\\":{\\"appId\\":\\"algoliaAppId\\",\\"apiKey\\":\\"algoliaApiKey\\"},\\"__autocomplete_id\\":6}",
         ]
       `);
 
@@ -331,7 +331,7 @@ describe('requester', () => {
           .map((node) => node.textContent)
       ).toMatchInlineSnapshot(`
         Array [
-          "{\\"objectID\\":\\"5\\",\\"label\\":\\"Hit 5\\",\\"__autocomplete_id\\":7}",
+          "{\\"objectID\\":\\"5\\",\\"label\\":\\"Hit 5\\",\\"__autocomplete_algoliaCredentials\\":{\\"appId\\":\\"algoliaAppId\\",\\"apiKey\\":\\"algoliaApiKey\\"},\\"__autocomplete_id\\":7}",
         ]
       `);
 
@@ -561,7 +561,7 @@ describe('requester', () => {
           .map((node) => node.textContent)
       ).toMatchInlineSnapshot(`
         Array [
-          "{\\"0\\":{\\"objectID\\":\\"1\\",\\"label\\":\\"Hit 1\\"},\\"hitsPerPage\\":20,\\"__autocomplete_id\\":0}",
+          "{\\"0\\":{\\"objectID\\":\\"1\\",\\"label\\":\\"Hit 1\\",\\"__autocomplete_algoliaCredentials\\":{\\"appId\\":\\"algoliaAppId\\",\\"apiKey\\":\\"algoliaApiKey\\"}},\\"hitsPerPage\\":20,\\"__autocomplete_id\\":0}",
         ]
       `);
 
@@ -675,7 +675,7 @@ describe('requester', () => {
           .map((node) => node.textContent)
       ).toMatchInlineSnapshot(`
         Array [
-          "{\\"0\\":{\\"objectID\\":\\"1\\",\\"label\\":\\"Hit 1\\"},\\"results\\":[{\\"page\\":0,\\"hitsPerPage\\":20,\\"nbHits\\":1,\\"nbPages\\":1,\\"processingTimeMS\\":0,\\"hits\\":[{\\"objectID\\":\\"1\\",\\"label\\":\\"Hit 1\\"}],\\"query\\":\\"\\",\\"params\\":\\"\\",\\"exhaustiveNbHits\\":true,\\"exhaustiveFacetsCount\\":true}],\\"facetHits\\":[],\\"__autocomplete_id\\":0}",
+          "{\\"0\\":{\\"objectID\\":\\"1\\",\\"label\\":\\"Hit 1\\",\\"__autocomplete_algoliaCredentials\\":{\\"appId\\":\\"algoliaAppId\\",\\"apiKey\\":\\"algoliaApiKey\\"}},\\"results\\":[{\\"page\\":0,\\"hitsPerPage\\":20,\\"nbHits\\":1,\\"nbPages\\":1,\\"processingTimeMS\\":0,\\"hits\\":[{\\"objectID\\":\\"1\\",\\"label\\":\\"Hit 1\\",\\"__autocomplete_algoliaCredentials\\":{\\"appId\\":\\"algoliaAppId\\",\\"apiKey\\":\\"algoliaApiKey\\"}}],\\"query\\":\\"\\",\\"params\\":\\"\\",\\"exhaustiveNbHits\\":true,\\"exhaustiveFacetsCount\\":true}],\\"facetHits\\":[],\\"__autocomplete_id\\":0}",
         ]
       `);
 

diff --git a/packages/autocomplete-plugin-algolia-insights/src/types/AlgoliaInsightsHit.ts b/packages/autocomplete-plugin-algolia-insights/src/types/AlgoliaInsightsHit.ts
@@ -2,4 +2,8 @@ export type AlgoliaInsightsHit = {
   objectID: string;
   __autocomplete_indexName: string;
   __autocomplete_queryID: string;
+  __autocomplete_algoliaCredentials: {
+    appId: string;
+    apiKey: string;
+  };
 };
diff --git a/packages/autocomplete-preset-algolia/src/search/__tests__/fetchAlgoliaResults.test.ts b/packages/autocomplete-preset-algolia/src/search/__tests__/fetchAlgoliaResults.test.ts
@@ -65,8 +65,30 @@ describe('fetchAlgoliaResults', () => {
       },
     ]);
     expect(results).toEqual([
-      expect.objectContaining({ hits: [{ objectID: '1', label: 'Hit 1' }] }),
-      expect.objectContaining({ hits: [{ objectID: '2', label: 'Hit 2' }] }),
+      expect.objectContaining({
+        hits: [
+          {
+            objectID: '1',
+            label: 'Hit 1',
+            __autocomplete_algoliaCredentials: {
+              appId: 'algoliaAppId',
+              apiKey: 'algoliaApiKey',
+            },
+          },
+        ],
+      }),
+      expect.objectContaining({
+        hits: [
+          {
+            objectID: '2',
+            label: 'Hit 2',
+            __autocomplete_algoliaCredentials: {
+              appId: 'algoliaAppId',
+              apiKey: 'algoliaApiKey',
+            },
+          },
+        ],
+      }),
     ]);
   });
 
@@ -103,8 +125,30 @@ describe('fetchAlgoliaResults', () => {
       },
     ]);
     expect(results).toEqual([
-      expect.objectContaining({ hits: [{ objectID: '1', label: 'Hit 1' }] }),
-      expect.objectContaining({ hits: [{ objectID: '2', label: 'Hit 2' }] }),
+      expect.objectContaining({
+        hits: [
+          {
+            objectID: '1',
+            label: 'Hit 1',
+            __autocomplete_algoliaCredentials: {
+              appId: 'algoliaAppId',
+              apiKey: 'algoliaApiKey',
+            },
+          },
+        ],
+      }),
+      expect.objectContaining({
+        hits: [
+          {
+            objectID: '2',
+            label: 'Hit 2',
+            __autocomplete_algoliaCredentials: {
+              appId: 'algoliaAppId',
+              apiKey: 'algoliaApiKey',
+            },
+          },
+        ],
+      }),
     ]);
   });
 

diff --git a/packages/autocomplete-preset-algolia/src/search/fetchAlgoliaResults.ts b/packages/autocomplete-preset-algolia/src/search/fetchAlgoliaResults.ts
@@ -10,6 +10,7 @@ import type {
   SearchResponse,
   SearchClient,
 } from '../types';
+import { getAppIdAndApiKey } from '../utils';
 
 export interface SearchParams {
   /**
@@ -43,6 +44,8 @@ export function fetchAlgoliaResults<TRecord>({
     });
   }
 
+  const { appId, apiKey } = getAppIdAndApiKey(searchClient);
+
   return searchClient
     .search<TRecord>(
       queries.map((searchParameters) => {
@@ -60,6 +63,15 @@ export function fetchAlgoliaResults<TRecord>({
       })
     )
     .then((response) => {
-      return response.results;
+      return response.results.map((result) => ({
+        ...result,
+        hits: result.hits?.map((hit) => ({
+          ...hit,
+          __autocomplete_algoliaCredentials: {
+            appId,
+            apiKey,
+          },
+        })),
+      }));
     });
 }
diff --git a/packages/autocomplete-preset-algolia/src/utils/__tests__/getAppIdAndApiKey.test.ts b/packages/autocomplete-preset-algolia/src/utils/__tests__/getAppIdAndApiKey.test.ts
@@ -0,0 +1,15 @@
+import algoliasearchV4 from 'algoliasearch';
+
+import { getAppIdAndApiKey } from '../getAppIdAndApiKey';
+
+const APP_ID = 'myAppId';
+const API_KEY = 'myApiKey';
+
+describe('getAppIdAndApiKey', () => {
+  it('gets appId and apiKey from searchClient', () => {
+    const searchClient = algoliasearchV4(APP_ID, API_KEY);
+    const { appId, apiKey } = getAppIdAndApiKey(searchClient);
+    expect(appId).toEqual(APP_ID);
+    expect(apiKey).toEqual(API_KEY);
+  });
+});
diff --git a/packages/autocomplete-preset-algolia/src/utils/getAppIdAndApiKey.ts b/packages/autocomplete-preset-algolia/src/utils/getAppIdAndApiKey.ts
@@ -0,0 +1,13 @@
+import type { SearchClient } from '../types';
+
+export function getAppIdAndApiKey(searchClient: SearchClient): {
+  appId: string;
+  apiKey: string;
+} {
+  const { headers, queryParameters } = searchClient.transporter;
+  const APP_ID = 'x-algolia-application-id';
+  const API_KEY = 'x-algolia-api-key';
+  const appId = headers[APP_ID] || queryParameters[APP_ID];
+  const apiKey = headers[API_KEY] || queryParameters[API_KEY];
+  return { appId, apiKey };
+}
diff --git a/packages/autocomplete-preset-algolia/src/utils/index.ts b/packages/autocomplete-preset-algolia/src/utils/index.ts
@@ -0,0 +1 @@
+export * from './getAppIdAndApiKey';
diff --git a/test/utils/createSearchClient.ts b/test/utils/createSearchClient.ts
@@ -15,7 +15,12 @@ export function createSearchClient(
     addAlgoliaAgent: jest.fn(),
     clearCache: jest.fn(),
     initIndex: jest.fn(),
-    transporter: {} as any,
+    transporter: {
+      headers: {
+        'x-algolia-application-id': 'algoliaAppId',
+        'x-algolia-api-key': 'algoliaApiKey',
+      },
+    } as any,
     search: jest.fn((requests) =>
       Promise.resolve(
         createMultiSearchResponse(