Algolia vue-instantsearch - Deleting a result

Question

I'm currently experimenting with Algolia. It's really impressive so far. However, I've hit a bit of a 'roadblock'.

I'm using the vue-instantsearch package. It's currently in use only on a administration page. On this page I can click a button to bring up a modal, which confirms whether or not it should be deleted. I'm struggling to find a method to 'simply' remove the specified article from the results, without reloading.

I've essentially scoured the documentation and I've found the deleteObjects method, but it's not accessible from within the ais-index component, nor any of it's child components.

So, my question really is, is how would I go about correctly implementing this?

Any help with this matter would be greatly appreciated :)

Answer 1

Okay, I appear to have solved my own issue.

Here is how I fixed it.

First off, I created my own instance of a searchStore

const searchStore = createFromAlgoliaCredentials(
    'APP_ID',
    'SEARCH_KEY'
);

Once I instantiated the search store, I passed it to the ais-index Vue component, via the :search-store prop.

That works like a normal vue-instantsearch component.

To remove the 'thing' from the results, I had to loop through the search store and remove the result. There are two results objects within the search store. The one I needed was the one prefixed with an underscore, which is accessible via this.store._results (this refers to the Vue component, which has access to the search store).

The full code to remove a result:

this.store._results = this.store._results.filter(loopedArticle => {
    return loopedArticle.objectID !== article.objectID;
});

It may be improper to use the search store this way, and access a 'private' property in this fashion, but it is the only way I could get it to work.

Hope this helps anyone else out who requires this functionality!