profile
viewpoint
Haroen Viaene Haroenv @algolia Paris, France https://haroen.me Working on an even better search experience @algolia. Making shit happen @bullgit. feminist. Belgian

enaqx/awesome-react 46671

A collection of awesome things regarding React ecosystem

dmnd/dedent 630

⬅️ ES6 string tag that strips indentation from multi-line strings.

bullgit/fuck-jquery 23

For when you don't like jQuery. Embed this script on every page.

bullgit/trump.js 19

MAKE THE WEB GREAT AGAIN

dervondenbergen/giphy-gitter 13

get the perfect gif in your gitter activity feed

bullgit/australia.css 7

Accessibility is important, even if you live on the wrong side of the globe!

bullgit/parseint 7

THE ultimate javascript function to parse strings (or even objects) to integers!

bullgit/fast-clock 5

A very fast clock, accuracy guaranteed

push eventFCCghent/ikhaat

Haroen Viaene [bot]

commit sha 5f8891537f691f01207c561fbda9c982d93b5880

Built from commit c0ec7cbcce4997bb25d3dc2af131857139687c27

view details

push time in 11 hours

push eventFCCghent/ikhaat

Haroen Viaene [bot]

commit sha a60b254919333ee2272d825468913ecc8e4a470d

Built from commit c0ec7cbcce4997bb25d3dc2af131857139687c27

view details

push time in a day

pull request commentalgolia/instantsearch.js

feat(routing): new router option to prevent write on dispose

In regular InstantSearch.js, it probably should default to the current behaviour, as on dispose, the InstantSearch is no longer valid, and thus should return the URL to its previous state.

Maybe that shouldn't be the default, but changing it is breaking

FabienMotte

comment created time in 2 days

push eventFCCghent/ikhaat

Haroen Viaene [bot]

commit sha 8b687f18bd0e38de04fe6e826e484731bde08b71

Built from commit c0ec7cbcce4997bb25d3dc2af131857139687c27

view details

push time in 2 days

delete branch Haroenv/tide

delete branch : patch-1

delete time in 3 days

issue commentalgolia/algoliasearch-client-javascript

Algolia search 'query' deformed when used inside AWS lambda function

The first argument to index.search is the query, however you probably meant to do client.search(requests), not client.initIndex().search(query, params)

cmgchess

comment created time in 3 days

push eventalgolia/react-instantsearch

Haroen Viaene

commit sha 9b4903b2ea73d9d7e33729b87d9d55990e64312c

feat(hooks-server): load data twice in the case of dynamic widget usage (#3259) * wip * make the api actually work * correct test * fix tests * undo v6 changes * fix build? * make TS pass again * try passing in v3 * ugh i guess not? * idk does this make a difference? * Update packages/react-instantsearch-hooks-server/src/getServerState.tsx Co-authored-by: François Chalifour <francoischalifour@users.noreply.github.com> * docs(example): normal UI * refactor * different help comment * fix import * add a test with two dynamic widgets * Update packages/react-instantsearch-hooks/src/components/InstantSearchSSRProvider.tsx Co-authored-by: François Chalifour <francoischalifour@users.noreply.github.com> * only one nested dw in the test * change test to be simpler Co-authored-by: François Chalifour <francoischalifour@users.noreply.github.com>

view details

push time in 3 days

delete branch algolia/react-instantsearch

delete branch : wip/double-backend-fetch

delete time in 3 days

PR merged algolia/react-instantsearch

feat(hooks-server): load data twice in the case of dynamic widget usage

<!-- Thanks for submitting a pull request! Please provide enough information so that others can review your pull request. -->

Summary

dynamic widgets requires two requests to function properly, as the widgets mounted depend on what widgets are in the search result.

<!-- Explain the motivation for making this change. What existing problem does the pull request solve? Are there any linked issues? -->

Result

<!-- Demonstrate the code is solid. Example: The exact commands you ran and their output, screenshots / videos if the pull request changes UI. -->

if a dynamic widget is detected, getServerState calls itself a second time with the previous results provided

+373 -75

2 comments

8 changed files

Haroenv

pr closed time in 3 days

push eventalgolia/react-instantsearch

Haroen Viaene

commit sha 91cd085f9a323ed6b872f3a098f561007a72d0d2

feat(server): load data twice in the case of dynamic widget usage (#3268) * feat(server): load data twice in the case of dynamic widget usage see https://codesandbox.io/s/keen-moon-wdxou for the use case fixed by this PR * fix TS * add multi-index tests * omg hits is required: https://github.com/algolia/react-instantsearch/blob/d459e62f5cae4c98427ab302531873f5ee23d149/packages/react-instantsearch-core/src/core/indexUtils.js#L14-L16

view details

push time in 3 days

PR merged algolia/react-instantsearch

Reviewers
feat(server): load data twice in the case of dynamic widget usage

<!-- Thanks for submitting a pull request! Please provide enough information so that others can review your pull request. -->

Summary

<!-- Explain the motivation for making this change. What existing problem does the pull request solve? Are there any linked issues? -->

Same as #3259, but for React InstantSearch core, not hooks.

We render twice in the case that dynamic widgets are discovered

Result

<!-- Demonstrate the code is solid. Example: The exact commands you ran and their output, screenshots / videos if the pull request changes UI. -->

  • no search request when there's a refinement applied using server side rendering
  • no flash of non-filtered content
  • https://codesandbox.io/s/keen-moon-wdxou fixed by this PR (select a refinement and reload)
+245 -52

2 comments

6 changed files

Haroenv

pr closed time in 3 days

delete branch algolia/react-instantsearch

delete branch : fix/dynamic-widget-double-fetch

delete time in 3 days

push eventalgolia/react-instantsearch

Haroen Viaene

commit sha a2be112ac245d0f3c64d533c6d0b143a9f842654

change test to be simpler

view details

push time in 3 days

Pull request review commentalgolia/instantsearch.js

feat(routing): new router option to prevent write on dispose

 export const createRouterMiddleware = <      const initialUiState = instantSearchInstance._initialUiState; +    let unsubscribed = false;

subscribe will not be called if already subscribed, because it would mean the middleware was added twice, or InstantSearch started twice, both aren't possible

FabienMotte

comment created time in 3 days

PullRequestReviewEvent

Pull request review commentalgolia/instantsearch.js

feat(routing): new router option to prevent write on dispose

 export const createRouterMiddleware = <      const initialUiState = instantSearchInstance._initialUiState; +    let unsubscribed = false;

yes, I meant false indeed, although we probably want to make the logic opposite to avoid negations (using subscribed = false initially, and checking if !subscribed )

FabienMotte

comment created time in 3 days

PullRequestReviewEvent

Pull request review commentalgolia/react-instantsearch

feat(server): load data twice in the case of dynamic widget usage

 describe('findResultsState', () => {         expect(data.rawResults[0].params).toMatchInlineSnapshot(`"lol=lol"`);       });     });++    it('searches twice (cached) with dynamic widgets', async () => {+      const RefinementList = connectRefinementList(() => null);+      const App = (props) => (+        <InstantSearch {...props}>+          <DynamicWidgets fallbackComponent={RefinementList} />+        </InstantSearch>+      );++      const props = {+        searchClient: createSearchClient(),+        indexName: 'abc',+        searchState: {+          query: 'iPhone',+        },+      };++      await findResultsState(App, props);++      expect(props.searchClient.search).toHaveBeenCalledTimes(2);+      // both calls are the same, so they're cached+      expect(props.searchClient.search.mock.calls[0][0]).toEqual(+        props.searchClient.search.mock.calls[1][0]+      );+    });++    it('searches twice with dynamic widgets and a refinement', async () => {+      const RefinementList = connectRefinementList(() => null);+      const App = (props) => (+        <InstantSearch {...props}>+          <DynamicWidgets fallbackComponent={RefinementList} />+        </InstantSearch>+      );++      const props = {+        searchClient: createSearchClient(),+        indexName: 'instant_search',+        searchState: {+          query: 'iPhone',+          refinementList: { categories: ['refined!'] },+        },+      };++      await findResultsState(App, props);++      expect(props.searchClient.search).toHaveBeenCalledTimes(2);++      // first query doesn't have the fallback widget mounted yet+      expect(props.searchClient.search.mock.calls[0][0][0]).toEqual({+        indexName: 'instant_search',+        params: {+          facets: ['*'],+          highlightPostTag: '</ais-highlight-0000000000>',+          highlightPreTag: '<ais-highlight-0000000000>',+          maxValuesPerFacet: 20,+          tagFilters: '',+        },+      });++      // second query does have the fallback widget mounted, and thus also the refinement+      expect(props.searchClient.search.mock.calls[1][0][0]).toEqual({+        indexName: 'instant_search',+        params: {+          facetFilters: [['categories:refined!']],

solved in 77ce0f1d

Haroenv

comment created time in 3 days

PullRequestReviewEvent

push eventalgolia/react-instantsearch

Haroen Viaene

commit sha 77ce0f1dc879574af4595b19f60cba5062c6645d

omg hits is required: https://github.com/algolia/react-instantsearch/blob/d459e62f5cae4c98427ab302531873f5ee23d149/packages/react-instantsearch-core/src/core/indexUtils.js#L14-L16

view details

push time in 3 days

Pull request review commentalgolia/react-instantsearch

feat(server): load data twice in the case of dynamic widget usage

 describe('findResultsState', () => {         expect(data.rawResults[0].params).toMatchInlineSnapshot(`"lol=lol"`);       });     });++    it('searches twice (cached) with dynamic widgets', async () => {+      const RefinementList = connectRefinementList(() => null);+      const App = (props) => (+        <InstantSearch {...props}>+          <DynamicWidgets fallbackComponent={RefinementList} />+        </InstantSearch>+      );++      const props = {+        searchClient: createSearchClient(),+        indexName: 'abc',+        searchState: {+          query: 'iPhone',+        },+      };++      await findResultsState(App, props);++      expect(props.searchClient.search).toHaveBeenCalledTimes(2);+      // both calls are the same, so they're cached+      expect(props.searchClient.search.mock.calls[0][0]).toEqual(+        props.searchClient.search.mock.calls[1][0]+      );+    });++    it('searches twice with dynamic widgets and a refinement', async () => {+      const RefinementList = connectRefinementList(() => null);+      const App = (props) => (+        <InstantSearch {...props}>+          <DynamicWidgets fallbackComponent={RefinementList} />+        </InstantSearch>+      );++      const props = {+        searchClient: createSearchClient(),+        indexName: 'instant_search',+        searchState: {+          query: 'iPhone',+          refinementList: { categories: ['refined!'] },+        },+      };++      await findResultsState(App, props);++      expect(props.searchClient.search).toHaveBeenCalledTimes(2);++      // first query doesn't have the fallback widget mounted yet+      expect(props.searchClient.search.mock.calls[0][0][0]).toEqual({+        indexName: 'instant_search',+        params: {+          facets: ['*'],+          highlightPostTag: '</ais-highlight-0000000000>',+          highlightPreTag: '<ais-highlight-0000000000>',+          maxValuesPerFacet: 20,+          tagFilters: '',+        },+      });++      // second query does have the fallback widget mounted, and thus also the refinement+      expect(props.searchClient.search.mock.calls[1][0][0]).toEqual({+        indexName: 'instant_search',+        params: {+          facetFilters: [['categories:refined!']],

so in the test the refinement list doesn't mount, but it does mount when it's nested in an index. as far as I can tell the results are passed correctly though, so I don't yet see the difference between the two cases

Haroenv

comment created time in 3 days

PullRequestReviewEvent

issue commentalgolia/vue-instantsearch

Components does not work in a fresh Nuxt 3 project

We have now planned this issue for early February, thanks for standing by!

Baroshem

comment created time in 3 days

issue closedalgolia/instantsearch.js

Connect Infinite Hits Makes Network Requests Despite Retrieving Results From Cache

🐛 Bug description

I have an instance of connectInfiniteHits with a custom cache. The custom cache is working and confirmed by modifying the data before the cache is written. The modified data is what gets rendered, not what is directly returned from the server. However, InstantSearch continues to make network requests for each page regardless of whether the cache.read method returns data from cache.

🔍 Bug reproduction

Create an instance of InstantSearch, set the cache to instantsearch.createInfiniteHitsSessionStorageCache(), watch for network requests regardless of whether or not we have hydrated cache.

Steps to reproduce the behavior:

  1. Create an instance of InstantSearch
  2. Set cache to instantsearch.createInfiniteHitsSessionStorageCache()
  3. Fresh page reload sees cache get written
  4. Second page load sees cache get read, and network request made for the same data.

💭 Expected behavior

InstantSearch only performs network requests if the cache read method returns null

🖥 Screenshots

Successfully written to cache: Screenshot 2022-01-16 at 10 38 37

Requests page data anyway: Screenshot 2022-01-16 at 10 41 01

Environment

  • Browser: Chrome, Safari
  • Version: [e.g. 22]
  • InstantSearch 4.23.0
  • Vanilla JS (no framework)

closed time in 3 days

matt-savage

issue commentalgolia/instantsearch.js

Connect Infinite Hits Makes Network Requests Despite Retrieving Results From Cache

While we might revisit this, for the time being this issue is solved I think. If you have any more questions, don't hesitate to open a different issue. Have a great day!

matt-savage

comment created time in 3 days

Pull request review commentalgolia/react-instantsearch

feat(server): load data twice in the case of dynamic widget usage

 describe('findResultsState', () => {         expect(data.rawResults[0].params).toMatchInlineSnapshot(`"lol=lol"`);       });     });++    it('searches twice (cached) with dynamic widgets', async () => {+      const RefinementList = connectRefinementList(() => null);+      const App = (props) => (+        <InstantSearch {...props}>+          <DynamicWidgets fallbackComponent={RefinementList} />+        </InstantSearch>+      );++      const props = {+        searchClient: createSearchClient(),+        indexName: 'abc',+        searchState: {+          query: 'iPhone',+        },+      };++      await findResultsState(App, props);++      expect(props.searchClient.search).toHaveBeenCalledTimes(2);+      // both calls are the same, so they're cached+      expect(props.searchClient.search.mock.calls[0][0]).toEqual(+        props.searchClient.search.mock.calls[1][0]+      );+    });++    it('searches twice with dynamic widgets and a refinement', async () => {+      const RefinementList = connectRefinementList(() => null);+      const App = (props) => (+        <InstantSearch {...props}>+          <DynamicWidgets fallbackComponent={RefinementList} />+        </InstantSearch>+      );++      const props = {+        searchClient: createSearchClient(),+        indexName: 'instant_search',+        searchState: {+          query: 'iPhone',+          refinementList: { categories: ['refined!'] },+        },+      };++      await findResultsState(App, props);++      expect(props.searchClient.search).toHaveBeenCalledTimes(2);++      // first query doesn't have the fallback widget mounted yet+      expect(props.searchClient.search.mock.calls[0][0][0]).toEqual({+        indexName: 'instant_search',+        params: {+          facets: ['*'],+          highlightPostTag: '</ais-highlight-0000000000>',+          highlightPreTag: '<ais-highlight-0000000000>',+          maxValuesPerFacet: 20,+          tagFilters: '',+        },+      });++      // second query does have the fallback widget mounted, and thus also the refinement+      expect(props.searchClient.search.mock.calls[1][0][0]).toEqual({+        indexName: 'instant_search',+        params: {+          facetFilters: [['categories:refined!']],

according to the test, facetFilters isn't present in this case, but it is in multi-index context. When I'm trying it out manually in the Next app, it seems that the right parameters are used.

Haroenv

comment created time in 3 days

PullRequestReviewEvent

push eventFCCghent/ikhaat

Haroen Viaene [bot]

commit sha ead805c0319ab2ca891e8dc29e3f63d0cd66364a

Built from commit c0ec7cbcce4997bb25d3dc2af131857139687c27

view details

push time in 3 days

pull request commentalgolia/firestore-algolia-search

docs: add disclaimer about space between fields

Thanks!

aseidma

comment created time in 4 days

more