docs(examples): enable insights in all examples (#1125)

Haroenv · Haroenv · commit 266c528606f0 · 2023-04-24T11:46:10.000+02:00
FX-2311
diff --git a/examples/html-templates/app.js b/examples/html-templates/app.js
@@ -10,6 +10,7 @@ const searchClient = algoliasearch(appId, apiKey);
 autocomplete({
   container: '#autocomplete',
   placeholder: 'Search',
+  insights: true,
   getSources({ query }) {
     return [
       {
diff --git a/examples/instantsearch/src/autocomplete.tsx b/examples/instantsearch/src/autocomplete.tsx
@@ -260,6 +260,7 @@ export function startAutocomplete(searchInstance: InstantSearch) {
   const { setQuery } = autocomplete({
     container: '#autocomplete',
     placeholder: 'Search for products',
+    insights: true,
     openOnFocus: true,
     plugins: [
       recentSearchesPlugin,
diff --git a/examples/multiple-datasets-with-headers/app.tsx b/examples/multiple-datasets-with-headers/app.tsx
@@ -66,5 +66,6 @@ autocomplete({
   container: '#autocomplete',
   placeholder: 'Search',
   openOnFocus: true,
+  insights: true,
   plugins: [recentSearchesPlugin, querySuggestionsPlugin, categoriesPlugin],
 });
diff --git a/examples/panel-placement/app.tsx b/examples/panel-placement/app.tsx
@@ -60,18 +60,21 @@ const search = autocomplete<AutocompleteItem>({
   container: '#autocomplete',
   placeholder: 'Search',
   getSources,
+  insights: true,
 });
 
 const searchLeft = autocomplete<AutocompleteItem>({
   container: '#autocomplete-left',
   placeholder: 'Search',
   getSources,
+  insights: true,
 });
 
 const searchRight = autocomplete<AutocompleteItem>({
   container: '#autocomplete-right',
   placeholder: 'Search',
   getSources,
+  insights: true,
 });
 
 type ProductItemProps = {
diff --git a/examples/playground/app.tsx b/examples/playground/app.tsx
@@ -4,16 +4,12 @@ import {
   autocomplete,
   AutocompleteComponents,
   getAlgoliaResults,
-} from '@algolia/autocomplete-js';
-import {
   AutocompleteInsightsApi,
-  createAlgoliaInsightsPlugin,
-} from '@algolia/autocomplete-plugin-algolia-insights';
+} from '@algolia/autocomplete-js';
 import { createQuerySuggestionsPlugin } from '@algolia/autocomplete-plugin-query-suggestions';
 import { createLocalStorageRecentSearchesPlugin } from '@algolia/autocomplete-plugin-recent-searches';
 import algoliasearch from 'algoliasearch/lite';
 import { h, Fragment } from 'preact';
-import insightsClient from 'search-insights';
 
 import '@algolia/autocomplete-theme-classic';
 
@@ -25,10 +21,6 @@ const appId = 'latency';
 const apiKey = '6be0576ff61c053d5f9a3225e2a90f76';
 const searchClient = algoliasearch(appId, apiKey);
 
-// @ts-expect-error type error in search-insights
-insightsClient('init', { appId, apiKey });
-
-const algoliaInsightsPlugin = createAlgoliaInsightsPlugin({ insightsClient });
 const recentSearchesPlugin = createLocalStorageRecentSearchesPlugin({
   key: 'search',
   limit: 3,
@@ -56,9 +48,9 @@ autocomplete<ProductHit>({
   placeholder: 'Search',
   debug: true,
   openOnFocus: true,
+  insights: true,
   plugins: [
     shortcutsPlugin,
-    algoliaInsightsPlugin,
     recentSearchesPlugin,
     querySuggestionsPlugin,
     categoriesPlugin,
diff --git a/examples/playground/package.json b/examples/playground/package.json
@@ -10,7 +10,6 @@
   },
   "dependencies": {
     "@algolia/autocomplete-js": "1.8.3",
-    "@algolia/autocomplete-plugin-algolia-insights": "1.8.3",
     "@algolia/autocomplete-plugin-query-suggestions": "1.8.3",
     "@algolia/autocomplete-plugin-recent-searches": "1.8.3",
     "@algolia/autocomplete-preset-algolia": "1.8.3",
diff --git a/examples/preview-panel-in-modal/app.tsx b/examples/preview-panel-in-modal/app.tsx
@@ -15,6 +15,7 @@ autocomplete({
   container: '#autocomplete',
   detachedMediaQuery: '',
   defaultActiveItemId: 0,
+  insights: true,
   getSources() {
     return [
       {
diff --git a/examples/query-suggestions-with-categories/app.tsx b/examples/query-suggestions-with-categories/app.tsx
@@ -30,5 +30,6 @@ autocomplete({
   container: '#autocomplete',
   placeholder: 'Search',
   openOnFocus: true,
+  insights: true,
   plugins: [querySuggestionsPlugin],
 });
diff --git a/examples/query-suggestions-with-hits/app.tsx b/examples/query-suggestions-with-hits/app.tsx
@@ -4,15 +4,11 @@ import {
   autocomplete,
   AutocompleteComponents,
   getAlgoliaResults,
-} from '@algolia/autocomplete-js';
-import {
   AutocompleteInsightsApi,
-  createAlgoliaInsightsPlugin,
-} from '@algolia/autocomplete-plugin-algolia-insights';
+} from '@algolia/autocomplete-js';
 import { createQuerySuggestionsPlugin } from '@algolia/autocomplete-plugin-query-suggestions';
 import algoliasearch from 'algoliasearch/lite';
 import { h, Fragment } from 'preact';
-import insightsClient from 'search-insights';
 
 import '@algolia/autocomplete-theme-classic';
 
@@ -22,11 +18,6 @@ const appId = 'latency';
 const apiKey = '6be0576ff61c053d5f9a3225e2a90f76';
 const searchClient = algoliasearch(appId, apiKey);
 
-// @ts-expect-error type error in search-insights
-insightsClient('init', { appId, apiKey });
-
-const algoliaInsightsPlugin = createAlgoliaInsightsPlugin({ insightsClient });
-
 const querySuggestionsPlugin = createQuerySuggestionsPlugin({
   searchClient,
   indexName: 'instant_search_demo_query_suggestions',
@@ -41,7 +32,8 @@ autocomplete<ProductHit>({
   container: '#autocomplete',
   placeholder: 'Search',
   openOnFocus: true,
-  plugins: [algoliaInsightsPlugin, querySuggestionsPlugin],
+  insights: true,
+  plugins: [querySuggestionsPlugin],
   getSources({ query, state }) {
     if (!query) {
       return [];
diff --git a/examples/query-suggestions-with-inline-categories/app.tsx b/examples/query-suggestions-with-inline-categories/app.tsx
@@ -92,5 +92,6 @@ autocomplete({
   container: '#autocomplete',
   placeholder: 'Search',
   openOnFocus: true,
+  insights: true,
   plugins: [querySuggestionsPlugin],
 });
diff --git a/examples/query-suggestions-with-recent-searches-and-categories/app.tsx b/examples/query-suggestions-with-recent-searches-and-categories/app.tsx
@@ -34,5 +34,6 @@ autocomplete({
   container: '#autocomplete',
   placeholder: 'Search',
   openOnFocus: true,
+  insights: true,
   plugins: [recentSearchesPlugin, querySuggestionsPlugin],
 });
diff --git a/examples/query-suggestions-with-recent-searches/app.tsx b/examples/query-suggestions-with-recent-searches/app.tsx
@@ -70,5 +70,6 @@ autocomplete({
   container: '#autocomplete',
   placeholder: 'Search',
   openOnFocus: true,
+  insights: true,
   plugins: [recentSearchesPlugin, querySuggestionsPlugin],
 });
diff --git a/examples/query-suggestions/app.tsx b/examples/query-suggestions/app.tsx
@@ -22,5 +22,6 @@ autocomplete({
   container: '#autocomplete',
   placeholder: 'Search',
   openOnFocus: true,
+  insights: true,
   plugins: [querySuggestionsPlugin],
 });
diff --git a/examples/react-18/src/App.tsx b/examples/react-18/src/App.tsx
@@ -38,6 +38,7 @@ export default function App() {
     const search = autocomplete<ProductHit>({
       container: containerRef.current,
       placeholder: 'Search',
+      insights: true,
       getSources({ query }) {
         return [
           {
diff --git a/examples/react-instantsearch-hooks/src/components/Autocomplete.tsx b/examples/react-instantsearch-hooks/src/components/Autocomplete.tsx
@@ -212,6 +212,7 @@ export function Autocomplete({
       ...autocompleteProps,
       container: autocompleteContainer.current,
       initialState: { query },
+      insights: true,
       plugins,
       onReset() {
         setInstantSearchUiState({ query: '', category: currentCategory });
diff --git a/examples/react-instantsearch/src/App.js b/examples/react-instantsearch/src/App.js
@@ -275,6 +275,7 @@ export function App() {
               onSubmit={onSubmit}
               onReset={onReset}
               plugins={plugins}
+              insights
             />
           </div>
         </header>
diff --git a/examples/react-renderer/src/Autocomplete.tsx b/examples/react-renderer/src/Autocomplete.tsx
@@ -51,6 +51,7 @@ export function Autocomplete(
         onStateChange({ state }) {
           setAutocompleteState(state);
         },
+        insights: true,
         getSources() {
           return [
             {
diff --git a/examples/recently-viewed-items/app.tsx b/examples/recently-viewed-items/app.tsx
@@ -26,6 +26,7 @@ autocomplete<ProductHit>({
   container: '#autocomplete',
   placeholder: 'Search',
   openOnFocus: true,
+  insights: true,
   plugins: [recentlyViewedItems],
   getSources({ query }) {
     if (!query) {
diff --git a/examples/redirect-url/app.tsx b/examples/redirect-url/app.tsx
@@ -12,6 +12,7 @@ autocomplete<{ name: string }>({
   container: '#autocomplete',
   placeholder: 'Search',
   openOnFocus: true,
+  insights: true,
   plugins: [createRedirectUrlPlugin()],
   getSources({ query }) {
     return [
diff --git a/examples/reshape/app.tsx b/examples/reshape/app.tsx
@@ -57,6 +57,7 @@ autocomplete({
   placeholder: 'Search',
   debug: true,
   openOnFocus: true,
+  insights: true,
   plugins: [recentSearchesPlugin, querySuggestionsPlugin, productsPlugin],
   reshape({ sourcesBySourceId }) {
     const { recentSearchesPlugin, querySuggestionsPlugin, products, ...rest } =
diff --git a/examples/slack-with-emojis-and-commands/src/Autocomplete.tsx b/examples/slack-with-emojis-and-commands/src/Autocomplete.tsx
@@ -38,6 +38,7 @@ export function Autocomplete(
     defaultActiveItemId: 0,
     placeholder: 'Jot something down',
     autoFocus: true,
+    insights: true,
     getSources({ query }) {
       const cursorPosition = inputRef.current?.selectionEnd || 0;
       const activeToken = getActiveToken(query, cursorPosition);
diff --git a/examples/starter-algolia/app.tsx b/examples/starter-algolia/app.tsx
@@ -26,6 +26,7 @@ type AutocompleteItem = Hit<{
 autocomplete<AutocompleteItem>({
   container: '#autocomplete',
   placeholder: 'Search',
+  insights: true,
   getSources({ query }) {
     return [
       {
diff --git a/examples/tags-in-searchbox/app.tsx b/examples/tags-in-searchbox/app.tsx
@@ -5,16 +5,12 @@ import {
   AutocompleteComponents,
   getAlgoliaResults,
   getAlgoliaFacets,
-} from '@algolia/autocomplete-js';
-import {
   AutocompleteInsightsApi,
-  createAlgoliaInsightsPlugin,
-} from '@algolia/autocomplete-plugin-algolia-insights';
+} from '@algolia/autocomplete-js';
 import { createTagsPlugin, Tag } from '@algolia/autocomplete-plugin-tags';
 import algoliasearch from 'algoliasearch/lite';
 import { h, Fragment, render } from 'preact';
 import groupBy from 'ramda/src/groupBy';
-import insightsClient from 'search-insights';
 
 import '@algolia/autocomplete-theme-classic';
 
@@ -24,11 +20,6 @@ const appId = 'latency';
 const apiKey = '6be0576ff61c053d5f9a3225e2a90f76';
 const searchClient = algoliasearch(appId, apiKey);
 
-// @ts-expect-error type error in search-insights
-insightsClient('init', { appId, apiKey });
-
-const algoliaInsightsPlugin = createAlgoliaInsightsPlugin({ insightsClient });
-
 const tagsPlugin = createTagsPlugin<TagExtraData>({
   getTagsSubscribers() {
     return [
@@ -106,7 +97,8 @@ autocomplete<ProductHit | Tag<TagExtraData>>({
   container: '#autocomplete',
   placeholder: 'Search',
   openOnFocus: true,
-  plugins: [algoliaInsightsPlugin, tagsPlugin],
+  insights: true,
+  plugins: [tagsPlugin],
   detachedMediaQuery: 'none',
   getSources({ query, state }) {
     const tagsByFacet = groupBy<Tag<TagExtraData>>(
@@ -310,7 +302,7 @@ function ProductItem({ hit, insights, components }: ProductItemProps) {
             insights.convertedObjectIDsAfterSearch({
               eventName: 'Added to cart',
               index: hit.__autocomplete_indexName,
-              objectIDs: [hit.objectID],
+              items: [hit],
               queryID: hit.__autocomplete_queryID,
             });
           }}
diff --git a/examples/tags-in-searchbox/package.json b/examples/tags-in-searchbox/package.json
@@ -10,7 +10,6 @@
   },
   "dependencies": {
     "@algolia/autocomplete-js": "1.8.3",
-    "@algolia/autocomplete-plugin-algolia-insights": "1.8.3",
     "@algolia/autocomplete-plugin-tags": "1.8.3",
     "@algolia/autocomplete-theme-classic": "1.8.3",
     "@algolia/client-search": "4.16.0",
diff --git a/examples/tags-in-searchbox/types/ProductHit.ts b/examples/tags-in-searchbox/types/ProductHit.ts
@@ -1,3 +1,4 @@
+import { AlgoliaInsightsHit } from '@algolia/autocomplete-js';
 import { Hit } from '@algolia/client-search';
 
 type ProductRecord = {
@@ -11,9 +12,4 @@ type ProductRecord = {
   url: string;
 };
 
-type WithAutocompleteAnalytics<THit> = THit & {
-  __autocomplete_indexName: string;
-  __autocomplete_queryID: string;
-};
-
-export type ProductHit = WithAutocompleteAnalytics<Hit<ProductRecord>>;
+export type ProductHit = AlgoliaInsightsHit & Hit<ProductRecord>;
diff --git a/examples/tags-with-hits/app.tsx b/examples/tags-with-hits/app.tsx
@@ -5,16 +5,12 @@ import {
   AutocompleteComponents,
   getAlgoliaResults,
   getAlgoliaFacets,
-} from '@algolia/autocomplete-js';
-import {
   AutocompleteInsightsApi,
-  createAlgoliaInsightsPlugin,
-} from '@algolia/autocomplete-plugin-algolia-insights';
+} from '@algolia/autocomplete-js';
 import { createTagsPlugin, Tag } from '@algolia/autocomplete-plugin-tags';
 import algoliasearch from 'algoliasearch/lite';
 import { h, Fragment } from 'preact';
 import groupBy from 'ramda/src/groupBy';
-import insightsClient from 'search-insights';
 
 import '@algolia/autocomplete-theme-classic';
 import '@algolia/autocomplete-plugin-tags/dist/theme.min.css';
@@ -25,11 +21,6 @@ const appId = 'latency';
 const apiKey = '6be0576ff61c053d5f9a3225e2a90f76';
 const searchClient = algoliasearch(appId, apiKey);
 
-// @ts-expect-error type error in search-insights
-insightsClient('init', { appId, apiKey });
-
-const algoliaInsightsPlugin = createAlgoliaInsightsPlugin({ insightsClient });
-
 const tagsPlugin = createTagsPlugin<any, TagExtraData>({
   getTagsSubscribers() {
     return [
@@ -57,7 +48,8 @@ autocomplete<ProductHit | Tag<TagExtraData>>({
   container: '#autocomplete',
   placeholder: 'Search',
   openOnFocus: true,
-  plugins: [algoliaInsightsPlugin, tagsPlugin],
+  insights: true,
+  plugins: [tagsPlugin],
   detachedMediaQuery: 'none',
   onStateChange({ state }) {
     const tags = state.context.tagsPlugin?.tags || [];
diff --git a/examples/tags-with-hits/package.json b/examples/tags-with-hits/package.json
@@ -10,7 +10,6 @@
   },
   "dependencies": {
     "@algolia/autocomplete-js": "1.8.3",
-    "@algolia/autocomplete-plugin-algolia-insights": "1.8.3",
     "@algolia/autocomplete-plugin-tags": "1.8.3",
     "@algolia/autocomplete-theme-classic": "1.8.3",
     "@algolia/client-search": "4.16.0",
diff --git a/examples/tags-with-hits/types/ProductHit.ts b/examples/tags-with-hits/types/ProductHit.ts
@@ -1,3 +1,4 @@
+import { AlgoliaInsightsHit } from '@algolia/autocomplete-js';
 import { Hit } from '@algolia/client-search';
 
 type ProductRecord = {
@@ -11,9 +12,4 @@ type ProductRecord = {
   url: string;
 };
 
-type WithAutocompleteAnalytics<THit> = THit & {
-  __autocomplete_indexName: string;
-  __autocomplete_queryID: string;
-};
-
-export type ProductHit = WithAutocompleteAnalytics<Hit<ProductRecord>>;
+export type ProductHit = Hit<ProductRecord> & AlgoliaInsightsHit;
diff --git a/examples/twitter-compose-with-typeahead/src/Autocomplete.tsx b/examples/twitter-compose-with-typeahead/src/Autocomplete.tsx
@@ -25,6 +25,7 @@ export function Autocomplete(
     ...props,
     id: 'twitter-autocomplete',
     defaultActiveItemId: 0,
+    insights: true,
     getSources({ query }) {
       const cursorPosition = inputRef.current?.selectionEnd || 0;
       const activeToken = getActiveToken(query, cursorPosition);
diff --git a/examples/two-column-layout/src/app.tsx b/examples/two-column-layout/src/app.tsx
@@ -40,6 +40,7 @@ autocomplete({
   placeholder: 'Search products, articles, and FAQs',
   autoFocus: true,
   openOnFocus: true,
+  insights: true,
   plugins: [
     recentSearchesPlugin,
     querySuggestionsPlugin,
diff --git a/examples/voice-search/app.tsx b/examples/voice-search/app.tsx
diff --git a/examples/vue-instantsearch/src/Autocomplete.vue b/examples/vue-instantsearch/src/Autocomplete.vue
diff --git a/examples/vue/src/App.vue b/examples/vue/src/App.vue

Original file line number	Diff line number	Diff line change
`@@ -10,6 +10,7 @@ const searchClient = algoliasearch(appId, apiKey);`
`10`	`10`	`autocomplete({`
`11`	`11`	`container: '#autocomplete',`
`12`	`12`	`placeholder: 'Search',`
	`13`	`+ insights: true,`
`13`	`14`	`getSources({ query }) {`
`14`	`15`	`return [`
`15`	`16`	`{`
Original file line number	Diff line number	Diff line change
`@@ -15,6 +15,7 @@ autocomplete({`
`15`	`15`	`container: '#autocomplete',`
`16`	`16`	`detachedMediaQuery: '',`
`17`	`17`	`defaultActiveItemId: 0,`
	`18`	`+ insights: true,`
`18`	`19`	`getSources() {`
`19`	`20`	`return [`
`20`	`21`	`{`