From 9fbf38165b01e7d7a1d0f94d2a3a72680ef76753 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Fran=C3=A7ois=20Chalifour?= Date: Fri, 6 Nov 2020 11:49:41 +0100 Subject: [PATCH 1/2] feat(plugins): introduce Query Suggestions plugin --- .circleci/config.yml | 9 +- bundlesize.config.json | 4 + examples/js/app.ts | 83 +++---------------- examples/js/package.json | 2 +- .../autocomplete-core/src/getDefaultProps.ts | 10 +-- packages/autocomplete-core/src/types/api.ts | 2 +- .../autocomplete-core/src/types/plugins.ts | 4 +- packages/autocomplete-core/src/utils.ts | 16 ++-- .../README.md | 11 +++ .../package.json | 45 ++++++++++ .../rollup.config.js | 16 ++++ .../src/createQuerySuggestionsPlugin.ts | 63 ++++++++++++++ .../src/getTemplates.ts | 43 ++++++++++ .../src/icons/index.ts | 2 + .../src/icons/searchIcon.ts | 12 +++ .../src/icons/tapAheadIcon.ts | 11 +++ .../src/index.ts | 2 + .../src/types/QuerySuggestionsHit.ts | 7 ++ .../src/types/index.ts | 1 + .../tsconfig.declaration.json | 3 + .../package.json | 6 ++ .../rollup.config.js | 1 - .../src/createRecentSearchesPlugin.ts | 36 ++++---- .../src/getTemplates.ts | 7 +- 24 files changed, 281 insertions(+), 115 deletions(-) create mode 100644 packages/autocomplete-plugin-query-suggestions/README.md create mode 100644 packages/autocomplete-plugin-query-suggestions/package.json create mode 100644 packages/autocomplete-plugin-query-suggestions/rollup.config.js create mode 100644 packages/autocomplete-plugin-query-suggestions/src/createQuerySuggestionsPlugin.ts create mode 100644 packages/autocomplete-plugin-query-suggestions/src/getTemplates.ts create mode 100644 packages/autocomplete-plugin-query-suggestions/src/icons/index.ts create mode 100644 packages/autocomplete-plugin-query-suggestions/src/icons/searchIcon.ts create mode 100644 packages/autocomplete-plugin-query-suggestions/src/icons/tapAheadIcon.ts create mode 100644 packages/autocomplete-plugin-query-suggestions/src/index.ts create mode 100644 packages/autocomplete-plugin-query-suggestions/src/types/QuerySuggestionsHit.ts create mode 100644 packages/autocomplete-plugin-query-suggestions/src/types/index.ts create mode 100644 packages/autocomplete-plugin-query-suggestions/tsconfig.declaration.json diff --git a/.circleci/config.yml b/.circleci/config.yml index 6721e7c17..ad053cd20 100644 --- a/.circleci/config.yml +++ b/.circleci/config.yml @@ -26,14 +26,16 @@ aliases: mkdir -p packages/autocomplete-shared/dist mkdir -p packages/autocomplete-core/dist mkdir -p packages/autocomplete-js/dist - mkdir -p packages/autocomplete-plugin-recent-searches/dist mkdir -p packages/autocomplete-preset-algolia/dist + mkdir -p packages/autocomplete-plugin-recent-searches/dist + mkdir -p packages/autocomplete-plugin-query-suggestions/dist cp -R /tmp/workspace/packages/autocomplete-shared/dist packages/autocomplete-shared cp -R /tmp/workspace/packages/autocomplete-core/dist packages/autocomplete-core cp -R /tmp/workspace/packages/autocomplete-js/dist packages/autocomplete-js - cp -R /tmp/workspace/packages/autocomplete-plugin-recent-searches/dist packages/autocomplete-plugin-recent-searches cp -R /tmp/workspace/packages/autocomplete-preset-algolia/dist packages/autocomplete-preset-algolia + cp -R /tmp/workspace/packages/autocomplete-plugin-recent-searches/dist packages/autocomplete-plugin-recent-searches + cp -R /tmp/workspace/packages/autocomplete-plugin-query-suggestions/dist packages/autocomplete-plugin-query-suggestions defaults: &defaults working_directory: ~/autocomplete @@ -72,8 +74,9 @@ jobs: cp -R packages/autocomplete-shared/dist /tmp/workspace/packages/autocomplete-shared cp -R packages/autocomplete-core/dist /tmp/workspace/packages/autocomplete-core cp -R packages/autocomplete-js/dist /tmp/workspace/packages/autocomplete-js - cp -R packages/autocomplete-plugin-recent-searches/dist /tmp/workspace/packages/autocomplete-plugin-recent-searches cp -R packages/autocomplete-preset-algolia/dist /tmp/workspace/packages/autocomplete-preset-algolia + cp -R packages/autocomplete-plugin-recent-searches/dist /tmp/workspace/packages/autocomplete-plugin-recent-searches + cp -R packages/autocomplete-plugin-query-suggestions/dist /tmp/workspace/packages/autocomplete-plugin-query-suggestions - persist_to_workspace: root: *workspace_root paths: diff --git a/bundlesize.config.json b/bundlesize.config.json index 932767d40..abdbd52d5 100644 --- a/bundlesize.config.json +++ b/bundlesize.config.json @@ -14,6 +14,10 @@ }, { "path": "packages/autocomplete-plugin-recent-searches/dist/umd/index.js", + "maxSize": "2.5 kB" + }, + { + "path": "packages/autocomplete-plugin-query-suggestions/dist/umd/index.js", "maxSize": "2.25 kB" } ] diff --git a/examples/js/app.ts b/examples/js/app.ts index 24e784694..61dc27e58 100644 --- a/examples/js/app.ts +++ b/examples/js/app.ts @@ -1,87 +1,28 @@ -import { Hit } from '@algolia/client-search'; import algoliasearch from 'algoliasearch/lite'; -import { - autocomplete, - AutocompleteSource, - getAlgoliaHits, - reverseHighlightHit, -} from '@algolia/autocomplete-js'; +import { autocomplete } from '@algolia/autocomplete-js'; import { createLocalStorageRecentSearchesPlugin } from '@algolia/autocomplete-plugin-recent-searches'; +import { createQuerySuggestionsPlugin } from '@algolia/autocomplete-plugin-query-suggestions'; const searchClient = algoliasearch( 'latency', '6be0576ff61c053d5f9a3225e2a90f76' ); -type QuerySuggestionHit = { query: string }; - const recentSearches = createLocalStorageRecentSearchesPlugin({ key: 'recent', limit: 3, }); -autocomplete>({ - container: '#autocomplete', - debug: true, - openOnFocus: true, - // dropdownPlacement: 'start', - plugins: [recentSearches], - getSources({ query }) { - return getAlgoliaHits({ - searchClient, - queries: [ - { - indexName: 'instant_search_demo_query_suggestions', - query, - params: { - hitsPerPage: recentSearches.data.getAlgoliaQuerySuggestionsHitsPerPage( - 10 - ), - facetFilters: [ - ...recentSearches.data.getAlgoliaQuerySuggestionsFacetFilters(), - ], - }, - }, - ], - }).then(([hits]) => { - return [ - { - getItemInputValue({ item }) { - return item.query; - }, - getItems() { - return hits; - }, - templates: { - item({ item }) { - return ` -
-
${searchIcon}
-
- ${reverseHighlightHit>({ - hit: item, - attribute: 'query', - })} -
-
- `; - }, - }, - } as AutocompleteSource>, - ]; - }); +const querySuggestions = createQuerySuggestionsPlugin({ + searchClient, + indexName: 'instant_search_demo_query_suggestions', + getSearchParams() { + return recentSearches.data.getAlgoliaSearchParams(); }, }); -const searchIcon = ` - - - -`; +autocomplete({ + container: '#autocomplete', + openOnFocus: true, + plugins: [recentSearches, querySuggestions], +}); diff --git a/examples/js/package.json b/examples/js/package.json index cabedf7ca..44f455cf1 100644 --- a/examples/js/package.json +++ b/examples/js/package.json @@ -12,7 +12,7 @@ "dependencies": { "@algolia/autocomplete-js": "1.0.0-alpha.34", "@algolia/autocomplete-plugin-recent-searches": "1.0.0-alpha.34", - "@algolia/client-search": "4.5.1", + "@algolia/autocomplete-plugin-query-suggestions": "1.0.0-alpha.34", "algoliasearch": "4.5.1" }, "devDependencies": { diff --git a/packages/autocomplete-core/src/getDefaultProps.ts b/packages/autocomplete-core/src/getDefaultProps.ts index 8b424dff8..067b05544 100644 --- a/packages/autocomplete-core/src/getDefaultProps.ts +++ b/packages/autocomplete-core/src/getDefaultProps.ts @@ -51,14 +51,10 @@ export function getDefaultProps( }); }, getSources(options) { - const getSourcesFromPlugins = plugins - .map((plugin) => plugin.getSources) - .filter((getSources) => getSources !== undefined); - return Promise.all( - [...getSourcesFromPlugins, props.getSources].map((getSources) => - getNormalizedSources(getSources!, options) - ) + [...plugins.map((plugin) => plugin.getSources), props.getSources] + .filter(Boolean) + .map((getSources) => getNormalizedSources(getSources!, options)) ) .then((nested) => flatten(nested)) .then((sources) => diff --git a/packages/autocomplete-core/src/types/api.ts b/packages/autocomplete-core/src/types/api.ts index 7ae5a36cf..37883a94c 100644 --- a/packages/autocomplete-core/src/types/api.ts +++ b/packages/autocomplete-core/src/types/api.ts @@ -217,7 +217,7 @@ export interface AutocompleteOptions { /** * The sources to get the suggestions from. */ - getSources( + getSources?( params: GetSourcesParams ): MaybePromise>>; /** diff --git a/packages/autocomplete-core/src/types/plugins.ts b/packages/autocomplete-core/src/types/plugins.ts index 5b92d5380..6e4714f1c 100644 --- a/packages/autocomplete-core/src/types/plugins.ts +++ b/packages/autocomplete-core/src/types/plugins.ts @@ -7,11 +7,11 @@ export type AutocompletePlugin = Partial< * The subscribed properties are properties that are called when other sources * are interacted with. */ - subscribed: { + subscribed?: { onSelect: AutocompleteSource['onSelect']; }; /** * An extra plugin specific object to store variables and functions */ - data: TData; + data?: TData; }; diff --git a/packages/autocomplete-core/src/utils.ts b/packages/autocomplete-core/src/utils.ts index 7d4cc9c15..a11662000 100644 --- a/packages/autocomplete-core/src/utils.ts +++ b/packages/autocomplete-core/src/utils.ts @@ -1,10 +1,12 @@ +import { MaybePromise } from '@algolia/autocomplete-shared'; + import { - InternalAutocompleteOptions, - InternalAutocompleteSource, - AutocompleteState, AutocompleteCollection, - AutocompleteOptions, AutocompleteSource, + AutocompleteState, + GetSourcesParams, + InternalAutocompleteOptions, + InternalAutocompleteSource, } from './types'; export const noop = () => {}; @@ -45,8 +47,10 @@ function normalizeSource( } export function getNormalizedSources( - getSources: AutocompleteOptions['getSources'], - options + getSources: ( + params: GetSourcesParams + ) => MaybePromise>>, + options: GetSourcesParams ): Promise>> { return Promise.resolve(getSources(options)).then((sources) => Promise.all( diff --git a/packages/autocomplete-plugin-query-suggestions/README.md b/packages/autocomplete-plugin-query-suggestions/README.md new file mode 100644 index 000000000..70f7295e8 --- /dev/null +++ b/packages/autocomplete-plugin-query-suggestions/README.md @@ -0,0 +1,11 @@ +# @algolia/autocomplete-plugin-query-suggestions + +A plugin to add Query Suggestions to Algolia Autocomplete. + +## Installation + +```sh +yarn add @algolia/autocomplete-plugin-query-suggestions@alpha +# or +npm install @algolia/autocomplete-plugin-query-suggestions@alpha +``` diff --git a/packages/autocomplete-plugin-query-suggestions/package.json b/packages/autocomplete-plugin-query-suggestions/package.json new file mode 100644 index 000000000..f89b81a3d --- /dev/null +++ b/packages/autocomplete-plugin-query-suggestions/package.json @@ -0,0 +1,45 @@ +{ + "name": "@algolia/autocomplete-plugin-query-suggestions", + "description": "A plugin to add query suggestions to Algolia Autocomplete.", + "version": "1.0.0-alpha.34", + "license": "MIT", + "homepage": "https://github.com/algolia/autocomplete.js", + "repository": "algolia/autocomplete.js", + "author": { + "name": "Algolia, Inc.", + "url": "https://www.algolia.com" + }, + "source": "src/index.ts", + "types": "dist/esm/index.d.ts", + "module": "dist/esm/index.js", + "main": "dist/umd/index.js", + "umd:main": "dist/umd/index.js", + "unpkg": "dist/umd/index.js", + "jsdelivr": "dist/umd/index.js", + "sideEffects": false, + "files": [ + "dist/" + ], + "scripts": { + "build:clean": "rm -rf ./dist", + "build:esm": "babel src --root-mode upward --extensions '.ts,.tsx' --out-dir dist/esm --ignore '**/*/__tests__/'", + "build:types": "tsc -p ./tsconfig.declaration.json --outDir ./dist/esm", + "build:umd": "rollup --config", + "build": "rm -rf ./dist && yarn build:umd && yarn build:esm && yarn build:types", + "on:change": "concurrently \"yarn build:esm\" \"yarn build:types\"", + "prepare": "yarn run build:esm", + "watch": "watch \"yarn on:change\" --ignoreDirectoryPattern \"/dist/\"" + }, + "dependencies": { + "@algolia/autocomplete-core": "1.0.0-alpha.34", + "@algolia/autocomplete-js": "1.0.0-alpha.34" + }, + "devDependencies": { + "@algolia/client-search": "4.5.1", + "algoliasearch": "4.5.1" + }, + "peerDependencies": { + "@algolia/client-search": "^4.5.1", + "algoliasearch": "^4.5.1" + } +} diff --git a/packages/autocomplete-plugin-query-suggestions/rollup.config.js b/packages/autocomplete-plugin-query-suggestions/rollup.config.js new file mode 100644 index 000000000..ed757380a --- /dev/null +++ b/packages/autocomplete-plugin-query-suggestions/rollup.config.js @@ -0,0 +1,16 @@ +import { plugins } from '../../rollup.base.config'; +import { getBundleBanner } from '../../scripts/getBundleBanner'; + +import pkg from './package.json'; + +export default { + input: 'src/index.ts', + output: { + file: 'dist/umd/index.js', + format: 'umd', + sourcemap: true, + name: pkg.name, + banner: getBundleBanner(pkg), + }, + plugins, +}; diff --git a/packages/autocomplete-plugin-query-suggestions/src/createQuerySuggestionsPlugin.ts b/packages/autocomplete-plugin-query-suggestions/src/createQuerySuggestionsPlugin.ts new file mode 100644 index 000000000..631545306 --- /dev/null +++ b/packages/autocomplete-plugin-query-suggestions/src/createQuerySuggestionsPlugin.ts @@ -0,0 +1,63 @@ +import { AutocompletePlugin } from '@algolia/autocomplete-core'; +import { getAlgoliaHits, SourceTemplates } from '@algolia/autocomplete-js'; +import { SearchOptions } from '@algolia/client-search'; +import { SearchClient } from 'algoliasearch/lite'; + +import { + getTemplates as defaultGetTemplates, + GetTemplatesParams, +} from './getTemplates'; +import { QuerySuggestionsHit } from './types'; + +export type CreateQuerySuggestionsPluginParams< + TItem extends QuerySuggestionsHit +> = { + searchClient: SearchClient; + indexName: string; + getSearchParams?(): SearchOptions; + getTemplates?( + params: GetTemplatesParams + ): SourceTemplates['templates']; +}; + +export function createQuerySuggestionsPlugin< + TItem extends QuerySuggestionsHit +>({ + searchClient, + indexName, + getSearchParams = () => ({}), + getTemplates = defaultGetTemplates, +}: CreateQuerySuggestionsPluginParams): AutocompletePlugin< + TItem, + undefined +> { + return { + getSources({ query, setQuery, refresh }) { + return [ + { + getItemInputValue({ item }) { + return item.query; + }, + getItems() { + return getAlgoliaHits({ + searchClient, + queries: [ + { + indexName, + query, + params: getSearchParams(), + }, + ], + }); + }, + templates: getTemplates({ + onTapAhead(item) { + setQuery(item.query); + refresh(); + }, + }), + }, + ]; + }, + }; +} diff --git a/packages/autocomplete-plugin-query-suggestions/src/getTemplates.ts b/packages/autocomplete-plugin-query-suggestions/src/getTemplates.ts new file mode 100644 index 000000000..ef52d043a --- /dev/null +++ b/packages/autocomplete-plugin-query-suggestions/src/getTemplates.ts @@ -0,0 +1,43 @@ +import { reverseHighlightHit, SourceTemplates } from '@algolia/autocomplete-js'; + +import { searchIcon, tapAheadIcon } from './icons'; +import { QuerySuggestionsHit } from './types'; + +export type GetTemplatesParams = { + onTapAhead(item: TItem): void; +}; + +export function getTemplates({ + onTapAhead, +}: GetTemplatesParams): SourceTemplates['templates'] { + return { + item({ item, root }) { + const content = document.createElement('div'); + content.className = 'aa-ItemContent'; + const icon = document.createElement('div'); + icon.className = 'aa-ItemSourceIcon'; + icon.innerHTML = searchIcon; + const title = document.createElement('div'); + title.className = 'aa-ItemTitle'; + title.innerHTML = reverseHighlightHit({ + hit: item, + attribute: 'query', + }); + content.appendChild(icon); + content.appendChild(title); + + const tapAheadButton = document.createElement('button'); + tapAheadButton.className = 'aa-ItemActionButton'; + tapAheadButton.type = 'button'; + tapAheadButton.innerHTML = tapAheadIcon; + tapAheadButton.title = `Fill query with "${item.query}"`; + tapAheadButton.addEventListener('click', (event) => { + event.stopPropagation(); + onTapAhead(item); + }); + + root.appendChild(content); + root.appendChild(tapAheadButton); + }, + }; +} diff --git a/packages/autocomplete-plugin-query-suggestions/src/icons/index.ts b/packages/autocomplete-plugin-query-suggestions/src/icons/index.ts new file mode 100644 index 000000000..e4f81c62c --- /dev/null +++ b/packages/autocomplete-plugin-query-suggestions/src/icons/index.ts @@ -0,0 +1,2 @@ +export * from './searchIcon'; +export * from './tapAheadIcon'; diff --git a/packages/autocomplete-plugin-query-suggestions/src/icons/searchIcon.ts b/packages/autocomplete-plugin-query-suggestions/src/icons/searchIcon.ts new file mode 100644 index 000000000..a0d055ba3 --- /dev/null +++ b/packages/autocomplete-plugin-query-suggestions/src/icons/searchIcon.ts @@ -0,0 +1,12 @@ +export const searchIcon = ` + + + +`; diff --git a/packages/autocomplete-plugin-query-suggestions/src/icons/tapAheadIcon.ts b/packages/autocomplete-plugin-query-suggestions/src/icons/tapAheadIcon.ts new file mode 100644 index 000000000..5ba006dc6 --- /dev/null +++ b/packages/autocomplete-plugin-query-suggestions/src/icons/tapAheadIcon.ts @@ -0,0 +1,11 @@ +export const tapAheadIcon = ` + + + + +`; diff --git a/packages/autocomplete-plugin-query-suggestions/src/index.ts b/packages/autocomplete-plugin-query-suggestions/src/index.ts new file mode 100644 index 000000000..a50c2aaea --- /dev/null +++ b/packages/autocomplete-plugin-query-suggestions/src/index.ts @@ -0,0 +1,2 @@ +export * from './createQuerySuggestionsPlugin'; +export * from './getTemplates'; diff --git a/packages/autocomplete-plugin-query-suggestions/src/types/QuerySuggestionsHit.ts b/packages/autocomplete-plugin-query-suggestions/src/types/QuerySuggestionsHit.ts new file mode 100644 index 000000000..062f73d76 --- /dev/null +++ b/packages/autocomplete-plugin-query-suggestions/src/types/QuerySuggestionsHit.ts @@ -0,0 +1,7 @@ +import { Hit } from '@algolia/client-search'; + +export type QuerySuggestionsHit = Hit<{ + query: string; + popularity: number; + nb_words: number; +}>; diff --git a/packages/autocomplete-plugin-query-suggestions/src/types/index.ts b/packages/autocomplete-plugin-query-suggestions/src/types/index.ts new file mode 100644 index 000000000..8a7f7e353 --- /dev/null +++ b/packages/autocomplete-plugin-query-suggestions/src/types/index.ts @@ -0,0 +1 @@ +export * from './QuerySuggestionsHit'; diff --git a/packages/autocomplete-plugin-query-suggestions/tsconfig.declaration.json b/packages/autocomplete-plugin-query-suggestions/tsconfig.declaration.json new file mode 100644 index 000000000..1e0c6449f --- /dev/null +++ b/packages/autocomplete-plugin-query-suggestions/tsconfig.declaration.json @@ -0,0 +1,3 @@ +{ + "extends": "../../tsconfig.declaration" +} diff --git a/packages/autocomplete-plugin-recent-searches/package.json b/packages/autocomplete-plugin-recent-searches/package.json index bda2995b2..7741ea331 100644 --- a/packages/autocomplete-plugin-recent-searches/package.json +++ b/packages/autocomplete-plugin-recent-searches/package.json @@ -34,5 +34,11 @@ "@algolia/autocomplete-core": "1.0.0-alpha.34", "@algolia/autocomplete-js": "1.0.0-alpha.34", "@algolia/autocomplete-shared": "1.0.0-alpha.34" + }, + "devDependencies": { + "@algolia/client-search": "4.5.1" + }, + "peerDependencies": { + "@algolia/client-search": "^4.5.1" } } diff --git a/packages/autocomplete-plugin-recent-searches/rollup.config.js b/packages/autocomplete-plugin-recent-searches/rollup.config.js index be58b7a35..ed757380a 100644 --- a/packages/autocomplete-plugin-recent-searches/rollup.config.js +++ b/packages/autocomplete-plugin-recent-searches/rollup.config.js @@ -12,6 +12,5 @@ export default { name: pkg.name, banner: getBundleBanner(pkg), }, - external: ['@algolia/autocomplete-core'], plugins, }; diff --git a/packages/autocomplete-plugin-recent-searches/src/createRecentSearchesPlugin.ts b/packages/autocomplete-plugin-recent-searches/src/createRecentSearchesPlugin.ts index f36337083..0060af032 100644 --- a/packages/autocomplete-plugin-recent-searches/src/createRecentSearchesPlugin.ts +++ b/packages/autocomplete-plugin-recent-searches/src/createRecentSearchesPlugin.ts @@ -1,6 +1,7 @@ import { AutocompletePlugin } from '@algolia/autocomplete-core'; import { SourceTemplates } from '@algolia/autocomplete-js'; import { MaybePromise, warn } from '@algolia/autocomplete-shared'; +import { SearchOptions } from '@algolia/client-search'; import { createStore, RecentSearchesStorage } from './createStore'; import { @@ -14,8 +15,7 @@ type Ref = { }; export type RecentSearchesPluginData = { - getAlgoliaQuerySuggestionsFacetFilters(): string[][]; - getAlgoliaQuerySuggestionsHitsPerPage(hitsPerPage: number): number; + getAlgoliaSearchParams(params?: SearchOptions): SearchOptions; }; export type CreateRecentSearchesPluginParams< @@ -87,31 +87,29 @@ export function createRecentSearchesPlugin({ }); }, data: { - getAlgoliaQuerySuggestionsFacetFilters() { + // @ts-ignore SearchOptions `facetFilters` is ReadonlyArray + getAlgoliaSearchParams(params = {}) { // If the items returned by `store.getAll` are contained in a Promise, - // we cannot provide the facet filters in time when this function is called + // we cannot provide the search params in time when this function is called // because we need to resolve the promise before getting the value. if (!Array.isArray(lastItemsRef.current)) { warn( 'The `getAlgoliaQuerySuggestionsFacetFilters` function is not supported with storages that return promises in `getAll`.' ); - return []; - } - - return lastItemsRef.current.map((item) => [`objectID:-${item.query}`]); - }, - getAlgoliaQuerySuggestionsHitsPerPage(hitsPerPage: number) { - // If the items returned by `store.getAll` are contained in a Promise, - // we cannot provide the number of hits per page in time when this function - // is called because we need to resolve the promise before getting the value. - if (!Array.isArray(lastItemsRef.current)) { - warn( - 'The `getAlgoliaQuerySuggestionsHitsPerPage` function is not supported with storages that return promises in `getAll`.' - ); - return hitsPerPage; + return params; } - return Math.max(1, hitsPerPage - lastItemsRef.current.length); + return { + ...params, + facetFilters: [ + ...(params.facetFilters ?? []), + ...lastItemsRef.current.map((item) => [`objectID:-${item.query}`]), + ], + hitsPerPage: Math.max( + 1, + (params.hitsPerPage ?? 10) - lastItemsRef.current.length + ), + }; }, }, }; diff --git a/packages/autocomplete-plugin-recent-searches/src/getTemplates.ts b/packages/autocomplete-plugin-recent-searches/src/getTemplates.ts index 7f5ef9c93..0dda0629d 100644 --- a/packages/autocomplete-plugin-recent-searches/src/getTemplates.ts +++ b/packages/autocomplete-plugin-recent-searches/src/getTemplates.ts @@ -28,14 +28,13 @@ export function getTemplates({ removeButton.type = 'button'; removeButton.innerHTML = resetIcon; removeButton.title = 'Remove'; - - root.appendChild(content); - root.appendChild(removeButton); - removeButton.addEventListener('click', (event) => { event.stopPropagation(); onRemove(item.id); }); + + root.appendChild(content); + root.appendChild(removeButton); }, }; } From 706245b7a74086060e9d1fe8f2d0a7a8364b059f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Fran=C3=A7ois=20Chalifour?= Date: Fri, 6 Nov 2020 14:44:40 +0100 Subject: [PATCH 2/2] chore(ci): add QS plugin to Circle command --- .circleci/config.yml | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/.circleci/config.yml b/.circleci/config.yml index ad053cd20..c9376a710 100644 --- a/.circleci/config.yml +++ b/.circleci/config.yml @@ -68,8 +68,9 @@ jobs: mkdir -p /tmp/workspace/packages/autocomplete-shared/dist mkdir -p /tmp/workspace/packages/autocomplete-core/dist mkdir -p /tmp/workspace/packages/autocomplete-js/dist - mkdir -p /tmp/workspace/packages/autocomplete-plugin-recent-searches/dist mkdir -p /tmp/workspace/packages/autocomplete-preset-algolia/dist + mkdir -p /tmp/workspace/packages/autocomplete-plugin-recent-searches/dist + mkdir -p /tmp/workspace/packages/autocomplete-plugin-query-suggestions/dist cp -R packages/autocomplete-shared/dist /tmp/workspace/packages/autocomplete-shared cp -R packages/autocomplete-core/dist /tmp/workspace/packages/autocomplete-core