feat: add recent-searches plugin #316

eunjae-lee · 2020-09-04T09:30:24Z

Summary

Here is the PoC of plugin API and the recent searches plugin on top of it.

This example is based on François' recent implementation.

import createRecentSearches from "@algolia/autocomplete-plugin-recent-searches";
const recentSearches = createRecentSearches({ limit: 5 });

autocomplete({
  // ...
  plugins: [recentSearches],
  // ...
  // ...
           facetFilters: [...recentSearches.getFacetFilters()]

These are all it takes to use the recent searches plugin.

Discussions

Batching API calls

From the perspective of autocomplete-core, it's impossible to know where a plugin is going to get sources from. If the core knows that a plugin is going to call getAlgoliaResults, then it can aggregate everything and fire a single request with multiple queries. We could change the implementation of getAlgoliaResults to request to a BatchProcessor (temp name), and when it's done, receives the result and return it. Anyway it looks like it's out of the scope of designing the plugin API.

Customizable templates

With the current API, plugins can have getSources function which returns an array of sources. I haven't found any good way to force plugins to provide a specific API to customize templates. It's going to be up to each plugin to accept a certain option as they want.

codesandbox-ci · 2020-09-04T14:54:01Z

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 1444f02:

Sandbox	Source
algolia/autocomplete.js: js	Configuration
algolia/autocomplete.js: js (forked)	PR

francoischalifour

Great!

packages/autocomplete-plugin-recent-searches/README.md

packages/autocomplete-plugin-recent-searches/package.json

packages/autocomplete-plugin-recent-searches/src/createPlugin.ts

packages/autocomplete-plugin-recent-searches/src/index.ts

Co-authored-by: François Chalifour <[email protected]>

packages/autocomplete-core/src/getPropGetters.ts

packages/autocomplete-plugin-recent-searches/src/createPlugin.ts

packages/autocomplete-plugin-recent-searches/src/createRecentSearchStore.ts

packages/autocomplete-plugin-recent-searches/src/index.ts

packages/autocomplete-plugin-recent-searches/src/createRecentSearchesPlugin.ts

packages/autocomplete-core/src/getPropGetters.ts

…earchesPlugin.ts Co-authored-by: François Chalifour <[email protected]>

eunjae-lee · 2020-09-16T09:11:04Z

packages/autocomplete-core/src/types/api.ts

+  /**
+   * The array of plugins.
+   */
+  plugins?: Array<AutocompletePlugin<TItem, unknown>>;


This must be unknown, right? We cannot know what it's going to be at this point. What do you think?

packages/autocomplete-core/src/getDefaultProps.ts

francoischalifour · 2020-09-16T12:10:22Z

packages/autocomplete-core/src/getDefaultProps.ts

+        .then((sources) =>
+          sources.map((source) => ({
+            ...source,
+            onSelect: (payload) => {


We can use the term params here too.

francoischalifour · 2020-09-16T12:17:08Z

packages/autocomplete-core/src/getDefaultProps.ts

+      )
+        .then((nested) =>
+          // same as `nested.flat()`
+          nested.reduce((acc, array) => {


Why do we need to flatten sources here? (Does it reveal a data structure problem prior to this instruction?)

No big deal, just to make the next iteration easier.

Co-authored-by: François Chalifour <[email protected]>

…e.js into feat/recent-searches

francoischalifour · 2020-09-18T09:52:20Z

packages/autocomplete-plugin-recent-searches/src/createRecentSearchesPlugin.ts

    },
    onSelect: ({ suggestion }) => {
-      store.add(suggestion);
+      const { query, objectID } = suggestion as any;
+      if (query && objectID) {


This won't work with non-Algolia records so we should rather store the record and fallback objectID to query.

@francoischalifour Okay, that part makes sense.

However I'm gonna have to leave if (query) condition.
For example,

these products (not coming from suggestion index) don't have query attribute.
In this case, is it correct that we're not storing them? Not sure how we've decided, but if it's correct, we need to keep if (query) clause. cc @Shipow

Perhaps this deserves a sync on Monday?

https://github.com/algolia/autocomplete.js/blob/feat/recent-searches/packages/autocomplete-core/src/getPropGetters.ts#L323-L336

If the source has getSuggestionUrl, it doesn't reach to source.onSelect, so it naturally doesn't get to be saved in recent searches.

eunjae-lee · 2020-09-18T13:44:21Z

While implementing this, I've realized that, for example,

there are 3 sources
there is 1 plugin (which returns 1 source)

-> then total 4 sources

Whatever source triggers onSelect, the core is going to call all the onSelect from 4 sources.
I feel like this can open a door to unexpected issues. But we can leave it as is and add more plugins and figure out later?
What do you think?

eunjae-lee · 2020-09-23T15:16:53Z

@francoischalifour what do you think? a1e5d98

francoischalifour · 2020-09-24T09:18:45Z

packages/autocomplete-plugin-recent-searches/src/createRecentSearchesPlugin.ts

+      }
+    },
+    onSelect: ({ suggestion, state, source }) => {
+      const inputValue = source.getInputValue({ suggestion, state });


This is only going to work in the query-completion use case but let's scope it down to this and move forward 👍

You're saying it won't work in case of "redirecting to a product page", right?

If so, yes. We're not thinking of the case in this PR: #316 (comment)

eunjae-lee added 3 commits September 4, 2020 11:26

feat: add recent-searches plugin

062bb91

WIP

fc51e8b

fix rollup error (peerDeps)

d157def

eunjae-lee mentioned this pull request Sep 4, 2020

feat: add recent-searches plugin #313

Closed

eunjae-lee force-pushed the feat/recent-searches branch from d2be2c4 to d157def Compare September 4, 2020 09:52

Merge branch 'next' into feat/recent-searches

06e4f6e

eunjae-lee added 9 commits September 7, 2020 15:24

chore: exclude website from codesandbox ci builds

0eb1766

expose getRecentSearches

f4d58d5

add getSources back

3898ad0

build only esm for codesandbox ci

ad574bb

add getSuggestions

f4dfc8d

remove peerDependency

8f453a3

renames

920d6c8

rename methods

fa4e8ea

resolve getSources from plugins too

9252f21

eunjae-lee force-pushed the feat/recent-searches branch from f32f5c1 to 9252f21 Compare September 9, 2020 19:41

eunjae-lee added 2 commits September 9, 2020 22:05

call onSubmit and onSelect for plugins

fb41a05

update ci

5c82607

eunjae-lee marked this pull request as ready for review September 10, 2020 08:13

eunjae-lee requested review from francoischalifour and Shipow September 10, 2020 08:13

francoischalifour reviewed Sep 10, 2020

View reviewed changes

Eunjae Lee and others added 5 commits September 11, 2020 13:35

Apply suggestions from code review

0f6f06d

Co-authored-by: François Chalifour <[email protected]>

add key to distinguish multiple stores of recent searches

e0e1749

early return

1c93b91

named export

17809ca

Merge branch 'next' into feat/recent-searches

a32b6aa

francoischalifour reviewed Sep 11, 2020

View reviewed changes

apply feedbacks

90fc790

eunjae-lee added 2 commits September 11, 2020 15:09

wrap plugin specific methods with data

b945621

run onSubmit for plugins at getDefaultProps

88fa4c1

francoischalifour reviewed Sep 11, 2020

View reviewed changes

packages/autocomplete-plugin-recent-searches/src/createRecentSearchesPlugin.ts Outdated Show resolved Hide resolved

packages/autocomplete-core/src/getPropGetters.ts Outdated Show resolved Hide resolved

Eunjae Lee and others added 2 commits September 11, 2020 15:49

Update packages/autocomplete-plugin-recent-searches/src/createRecentS…

3ed2977

…earchesPlugin.ts Co-authored-by: François Chalifour <[email protected]>

add TData to plugins

6446097

eunjae-lee commented Sep 16, 2020

View reviewed changes

forward onSelect plugin calls in getDefaultProps

0912b89

francoischalifour approved these changes Sep 16, 2020

View reviewed changes

Shipow approved these changes Sep 16, 2020

View reviewed changes

Eunjae Lee and others added 4 commits September 18, 2020 10:53

Update packages/autocomplete-core/src/getDefaultProps.ts

d46f29f

Co-authored-by: François Chalifour <[email protected]>

rename payload to params

5d73d9b

Merge branch 'feat/recent-searches' of github.com:algolia/autocomplet…

10865ac

…e.js into feat/recent-searches

add to store only when data exists

0c1c35c

francoischalifour reviewed Sep 18, 2020

View reviewed changes

use query as a fallback for queryID

47ce0bb

eunjae-lee added 3 commits September 23, 2020 16:27

get input value from source

a1e5d98

Merge branch 'next' into feat/recent-searches

989fce7

fix type errors

1444f02

eunjae-lee requested a review from francoischalifour September 23, 2020 15:16

francoischalifour approved these changes Sep 24, 2020

View reviewed changes

eunjae-lee merged commit 858637e into next Sep 24, 2020

eunjae-lee deleted the feat/recent-searches branch September 24, 2020 09:30

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: add recent-searches plugin #316

feat: add recent-searches plugin #316

eunjae-lee commented Sep 4, 2020 •

edited

Loading

codesandbox-ci bot commented Sep 4, 2020 •

edited

Loading

francoischalifour left a comment

eunjae-lee Sep 16, 2020

francoischalifour Sep 16, 2020

francoischalifour Sep 16, 2020

francoischalifour Sep 16, 2020

eunjae-lee Sep 18, 2020

francoischalifour Sep 18, 2020

eunjae-lee Sep 18, 2020

francoischalifour Sep 18, 2020

eunjae-lee Sep 23, 2020 •

edited

Loading

eunjae-lee commented Sep 18, 2020

eunjae-lee commented Sep 23, 2020

francoischalifour Sep 24, 2020

eunjae-lee Sep 24, 2020

feat: add recent-searches plugin #316

feat: add recent-searches plugin #316

Conversation

eunjae-lee commented Sep 4, 2020 • edited Loading

Summary

Discussions

Batching API calls

Customizable templates

codesandbox-ci bot commented Sep 4, 2020 • edited Loading

francoischalifour left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

eunjae-lee Sep 23, 2020 • edited Loading

Choose a reason for hiding this comment

eunjae-lee commented Sep 18, 2020

eunjae-lee commented Sep 23, 2020

Choose a reason for hiding this comment

Choose a reason for hiding this comment

eunjae-lee commented Sep 4, 2020 •

edited

Loading

codesandbox-ci bot commented Sep 4, 2020 •

edited

Loading

eunjae-lee Sep 23, 2020 •

edited

Loading