mirror of
https://github.com/streetwriters/notesnook.git
synced 2026-02-24 04:00:59 +01:00
web: add support for realtime search (#2171)
Signed-off-by: Abdulrehman-Jafer <abdulrehmanjaferwork01233@gmail.com>
This commit is contained in:
committed by
GitHub
parent
969611c9e6
commit
e12372364d
@@ -20,8 +20,8 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||
import * as Icon from "../icons";
|
||||
import "./search.css";
|
||||
import Field from "../field";
|
||||
|
||||
function SearchBox(props) {
|
||||
import { debounce } from "../../utils/debounce";
|
||||
function SearchBox({ onSearch }) {
|
||||
return (
|
||||
<Field
|
||||
data-test-id="search-input"
|
||||
@@ -29,18 +29,16 @@ function SearchBox(props) {
|
||||
id="search"
|
||||
name="search"
|
||||
type="text"
|
||||
sx={{m: 0,mx: 1,mt: 1}}
|
||||
sx={{ m: 0, mx: 1, mt: 1 }}
|
||||
placeholder="Type your query here"
|
||||
onKeyDown={(e) => {
|
||||
if (e.key === "Enter") props.onSearch(e.target.value);
|
||||
}}
|
||||
onChange={debounce((e) => onSearch(e.target.value), 250)}
|
||||
action={{
|
||||
icon: Icon.Search,
|
||||
testId: "search-button",
|
||||
onClick: () => {
|
||||
const searchField = document.getElementById("search");
|
||||
if (searchField && searchField.value && searchField.value.length) {
|
||||
props.onSearch(searchField.value);
|
||||
onSearch(searchField.value);
|
||||
}
|
||||
}
|
||||
}}
|
||||
|
||||
Reference in New Issue
Block a user