Replace / refresh searchClient while using ais-instantsearch on Angular

Hello,

i have a sample searchClient ,
when user click on some button on the page I need to update the apiKey with some params in order to get a fresh api client from the server
the api key is based on a list the user choose and then i can give him a search client only for those data

now when the user click i would like to change is without rendering the page so i wont loose the filters (dont want to use router)
so I replace whole searchClient but this is not work

i see that the api is different but the client is always use the previous api key so always got old data and the user choice dose not take effect.

i have tried searchClient.clearCache() and also to replace whole searchClient

  this.searchClient = algoliasearch('key', apiKey, {
          responsesCache: createNullCache(),
   });

this.config = {
          indexName: `index_name`,
          searchClient: this.searchClient
}

and sample html

<ng-container *ngIf="config">
  <ais-instantsearch [config]="config">
  </ais-instantsearch>
<ng-container/>

so how can i replace client without rendering the ais-instantserach

@yosef.ono welcome to the community!

Is the data you are granting access to only available to this User under this scoped API key? I just want to ensure I understand your use case fully.

I checked this out locally and didn’t see an out-of-the-box way to do this. However, if your issue is that the filters reset, a workaround would be to cache the search parameters (filters, search query, sort, etc), and after the client has re-rendered use this information to rebuild the client to the previous state.

@haroen not sure if you have anything else we can point him towards regarding the Angular library

@michael.king thanks

the answer is yes

its little bit annoying because the user see whole page render and its not “fun”
so now when there is a new api key that has been generated on the server i will re render the whole component
so looks like the solution will be saving the data in localStorage or smth

when I have those data . which params do i need to update ? how do i get the state in order to fill the filters/search , lets say i m on the ngOninit after rerender