3

I need to refresh frequently my hits because new item are added very often. So that it will avoid me to wait until my component be refreshed or mounted again before see the updated results list.

But i have no idea about how to do so.

 export const Hits = connectInfiniteHits(({ hits, hasMore, refine,currentRefinement}) => {



return (


  // return all my results here

);
});

How to tell my stateless component Hits to render again with the updated results list ?

I've tried to use the refine() but it doesn't work. this function is designed to load more results but i need to simply refresh all the result list.

I've also tried the refresh attribute but the list just doesn't update and i still need to reset manually my component to get the updated list.

Any tips ?

John doe
  • 3,680
  • 7
  • 31
  • 65
  • i guess you have to convert your stateless component into a component with state to handle it – Aravind S Jul 22 '18 at 05:44
  • I've tried to do it. But this didn't solve my problem. Just manipulate states is not enough i really need to reload it completely. I need algolia to make the initial request call again just like when the component is mounted after a `refresh` or `resetAction` – John doe Jul 22 '18 at 15:39
  • 1
    Did you get an answer to this? – Alex Chin Mar 30 '19 at 08:01

2 Answers2

0

it's not possible, Algolia search is horrible for react native.

  • Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Jan 12 '22 at 00:25
0

The "cleanest" way I found is to pass your InfiniteHits component a key prop and increment the key state when you want to do a refresh, effectively remounting your component. Additionally, you can clear the searchClient cache to update existing hits.

const searchClient = algoliasearch(AlgoliaAppId, AlgoliaApiKey);

const [hitsKey, setHitsKey] = useState(0);
const handleRefresh = () => {
  setHitsKey(hitsKey + 1);
  searchClient.clearCache();

  // If you're using a FlatList, you also might want to
  // have a 'refreshing' state that gets updated here.
};
return(
  <InfiniteHits key={hitsKey} />
);