Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Additional requests when there're no results with dynamic widgets #173

Closed
dziugas-liaudinskas opened this issue Jun 13, 2023 · 10 comments
Closed

Comments

@dziugas-liaudinskas
Copy link

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"

@jasonbosco
Copy link
Member

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?

@dziugas-liaudinskas
Copy link
Author

@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.

@dziugas-liaudinskas
Copy link
Author

Also, the Algolia example above also uses dynamic widgets from react-instant-search-hooks-web

@dziugas-liaudinskas
Copy link
Author

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

jasonbosco added a commit that referenced this issue Jul 11, 2023
@jasonbosco
Copy link
Member

jasonbosco commented Jul 11, 2023

@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?

@dziugas-liaudinskas
Copy link
Author

@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.

@jasonbosco
Copy link
Member

@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?

@dziugas-liaudinskas
Copy link
Author

@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

@jasonbosco
Copy link
Member

@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?

@dziugas-liaudinskas
Copy link
Author

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants