Search Box
The search box widget is used to let the user perform a text-based query.
Searchkit Setup
Configure the search_attributes to include the fields you want to search on.
he search attributes define what Elasticsearch fields should be searched when a user performs a search.
The search attributes can be configured as follows:
{
search_settings: {
search_attributes: [
"description",
"actors",
{ field: "title", weight: 3 },
"released.year"
]
}
}The following configuration will search the description, actors and an object field released.year fields with the default weight of 1. The title field will be weighted 3 times more than the actors field.
Example: Adjusting the organic query
Out the box, Searchkit provides a Elasticsearch query that is designed to work well for most search use cases. However, you may want to customise the query to improve the relevance of the search results.
This example shows how to use the getQuery function to customise the query for a given request.
Below is an example of using the combined_fields query (opens in a new tab) instead.
const results = await apiClient.handleRequest(req.body, {
getQuery: (query, search_attributes) => {
return [
{
combined_fields: {
query,
fields: search_attributes,
},
},
];
},
});Example: Vector Search
The KNN Search is a special type of search that is designed to find similar items based on a vector field.
const results = await client.handleRequest(req.body, {
getKnnQuery(query, search_attributes, config) {
return {
field: 'dense-vector-field',
k: 10,
num_candidates: 100,
// supported in latest version of Elasticsearch
query_vector_builder: {
text_embedding: {
model_id: 'msmarco-distilbert-base-tas-b',
model_text: query
}
}
}
}
});Usage
Basic (React Example)
import { InstantSearch, SearchBox } from 'react-instantsearch';
export function App() {
return (
<InstantSearch indexName="instant_search" searchClient={searchClient}>
<SearchBox />
</InstantSearch>
);
}