typesense / typesense-instantsearch-adapter

A JS adapter library to build rich search interfaces with Typesense and InstantSearch.js

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Additional requests when there're no results with dynamic widgets

dziugas-liaudinskas opened this issue · comments

Description

When using DynamicWidgets and the price range filter simultaneously, an issue arises when encountering scenarios with no search results. In these cases, multiple redundant search requests are triggered, and the received results do not reflect the applied filters. It is expected that a "no results" screen would be displayed, similar to the behavior observed when using Algolia.

Steps to reproduce

Example with Typesense adapter

  1. Clone this repo
  2. Run npm install && npm run build && npm start and open localhost
  3. Select the following filters:
  • "rating" => "5"
  • "free_shipping" => "true"
  • "brand" => "Spigen"
  1. Move the price filter "from" to "23$"
  2. Move the price filter "to" to "28$" so that there would not be any products meeting the filters
  3. You can see screen flickers and selected filters get removed. In the network tab, multiple requests can be seen

Example with Algolia

  1. Clone this repo
  2. Run npm i && npm run dev, open localhost and go to /category/speakers
  3. Select the following filters:
  • "brand" => "BIC America"
  • "rating" => "5"
  1. Move the price filter "from" to "115$"
  2. Move the price filter "to" to "130$" so that there would not be any products meeting the filters
  3. You can see that there are no results but filters remain as you selected

Expected Behavior

When there are no available results there should not be additional requests with filters removed. The user should see the "no results" screen

Actual Behavior

When then are no available results screen flickers and selected filters get removed. In the network tab, multiple requests can be seen

Metadata

"typesense-instantsearch-adapter": "^2.7.0"

It looks like the Typesense example uses react-instantsearch-hooks-web whereas the Algolia example uses instantsearch.js.

I suspect the issue is most likely related to react-instantsearch-hooks-web and not with the adapter (just based on anecdotal reports I've heard from other react-instantsearch-hooks users about unrelated issues).

For eg, with the same dataset that your Typesense example is using, this demo app uses instantsearch.js and doesn't have the same issue, with the same reproduction steps.

Although, I'm not using dynamicWidgets in that example. Could you try using dynamicWidgets with the example I shared above and see if you can reproduce the issue?

@jasonbosco I can reproduce the issue with the app that you shared. Repository with update app which uses dynamic widgets and have the same issue. Let me know if you need any more information from me.

@jasonbosco Would you mind taking a look at this when you have a moment? I would greatly appreciate your input.

@dziugas-liaudinskas Sorry about the delay, and thank you for the detailed reproduction steps. That was super helpful.

I was able to identify where the difference is coming from. I've pushed out a fix in v2.7.1-0 of the adapter. Could you give it a shot now?

@jasonbosco As I can see issue still persists. I pushed the new branch update-2.7.1-0 to the example that I provided in the description of this issue. There "typesense-instantsearch-adapter" is updated to v2.7.1-0 but seems like nothing changed.

@dziugas-liaudinskas I'm not too familiar with react-instantsearch-hooks, but it seems like the fix worked in this other instantsearch.js repo you shared, once you upgrade to v2.7.1-0. Could you verify this?

@jasonbosco The issue still persists on that repo too with an updated version. I pushed a new branch with an updated version (branch name: update-v2.7.1-0) if you are keen to try it. Maybe we do something differently? Added screen recording to check if we follow the same steps.

Screen.Recording.2023-07-17.at.10.04.40.mov

@dziugas-liaudinskas Thank you for the screen recording. Looks like I had some debug code in my test project which was preventing a bug from surfacing. I've fixed now fixed this in 2.7.1-1 and also added an explicit test case for this particular scenario. Could you try now?

@jasonbosco Now it works. That's amazing, thank you!