Custom hook for the elastic Search With tire data structure
Overview
This npm package provides a custom React hook for implementing Elasticsearch-like search features using the Trie data structure. It is designed to efficiently retrieve data on a large dataset.
Homepage website for demo
https://elastic-search-sage.vercel.app/
Installation
To use this package in your React project, you can install it using npm:
npm install elastic_search
import { useElasticSearch } from "trie_elastic_search/src/index";
Usage / Example
Import the useTrieSearch hook in your React component and use it as follows:
import { useState } from "react";
import "./App.css";
import data from "./data/data.json";
import { useElasticSearch } from "trie_elastic_search/src/index";
function App() {
const [search, setSearch] = useState("");
const [suggestions, setSuggestions] = useState([]);
const handleChange = (e) => {
console.log("search", search);
setSearch(e.target.value);
};
useElasticSearch(search, setSuggestions, data, 10);
return (
<div className="App">
<div className="search-bar">
<h1 className="header">Elastic Search</h1>
<input
value={search}
className="search-input"
name={"search"}
onChange={(e) => {
handleChange(e);
}}
/>
{suggestions.length > 0 && (
<div className="search-suggestion">
{suggestions.map((item, key) => {
return <p key={key}>{item}</p>;
})}
</div>
)}
</div>
</div>
);
}
export default App;
API
useElasticSearch()
A custom React hook that provides Trie-based search functionality.
useElasticSearch(searchKeyword,updateStateCallback,data,numberOfEnteries)
Parameters
searchKeyword (string): The searching keyword.
updateStateCallback (function): A callback function that updates the state with the search results.
data : Data on which we have to do the search query .
numberOfEntries (optional, number): The number of entries to retrieve (default is 10 if not passed).
Contributions
Always welcomed . create a pull request with proper desciption . Connect with developers for more understanding of the project
Profile
Github
For more refences you can visit the github link
Github Link