ReactiveSearch, DataSearch and indexing user query

Question

I'm using the DataSearch from Reactivesearch for an autocomplete feature and I'm trying to figure out how I can take the user's selected query and add that to my autocomplete index hosted at Appbaseio?

When I say user's selected query, I mean a query either typed in OR selected from DataSearch component dropdown list.

Here is what I've come up with so far

<DataSearch
   componentId="SearchSensor"
   dataField={["original_title"]}
   className="search-bar"
   onValueSelected={
     function(value, cause, source) {
       console.log("current value: ", value)
     }
   }
   iconPosition="right"
   innerclassName={{
     list: "text-item"
   }}
   />

The onValueSelected above is taken straight from the docs. It seems that is the property that I need to work with in order to do this. I'm just not sure how to connect it to my Appbaseio ES index?

score 0 · Accepted Answer · answered Aug 22 '18 at 06:13

0

onValueSelected is the correct approach to get the selected value here. (You can also get the full query with onQueryChange if needed). After getting this selected value in onValueSelected you can index this using a simple fetch request to your elasticsearch index or send it to a backend. There's also a helper library and the docs for rest you can try.

Also I would recommend pulling the indexing logic to a server instead of exposing it on client side since you would need the write credentials in order to perform a write. This would keep your write credentials safer.

For example:

<DataSearch
  ...
  onValueSelected={(value) => {
    fetch('YOUR_SERVER_URL' or 'Elasticsearch URL', { method: 'POST', body: {...} })
  }
/>

answered Aug 22 '18 at 06:13

Divyanshu Maithani

13,908
2
36
47

if I use appbase-js to interact with my Appbaseio ES, how would I call the indexing logic on the Node app with onValueSelected? – user3125823 Aug 22 '18 at 17:58
You would have to create a route on your server which receives the selected value and then use the `index` method from appbase-js [docs](https://docs.appbase.io/javascript/quickstart.html#storing-data) – Divyanshu Maithani Aug 22 '18 at 18:29
as I've done more testing, now I realize what you mean by using onQueryChange to get the WHOLE query - thanks for the heads up! Still learning but getting better with ReactiveSearch! – user3125823 Sep 19 '18 at 20:25
follow up to this. If I'm going to use a paid plan from Appbase - I don't have to worry about indexing user queries - it seems I can get the same query data from Appbase - is that right? – user3125823 Dec 28 '18 at 20:19
Not really sure about this. Would be best to consult with support imo – Divyanshu Maithani Dec 29 '18 at 08:01

ReactiveSearch, DataSearch and indexing user query

1 Answers1