generated from Luis/nextjs-python-web-template
30 lines
788 B
TypeScript
30 lines
788 B
TypeScript
"use client";
|
|
|
|
import { ChangeEvent, SetStateAction, Dispatch } from "react";
|
|
import IconButton from "@mui/material/IconButton";
|
|
import Tooltip from "@mui/material/Tooltip";
|
|
import SearchIcon from "@mui/icons-material/Search";
|
|
|
|
export interface SearchBarProps {
|
|
search: string;
|
|
setSearch: Dispatch<SetStateAction<string>>;
|
|
}
|
|
|
|
export function SearchBar(props: SearchBarProps) {
|
|
const { search, setSearch } = props;
|
|
const handleSearch = (event: ChangeEvent<HTMLInputElement>) => {
|
|
setSearch(event.target.value);
|
|
};
|
|
|
|
return (
|
|
<label htmlFor="search">
|
|
<Tooltip title="Filter list">
|
|
<IconButton>
|
|
<SearchIcon />
|
|
</IconButton>
|
|
</Tooltip>
|
|
<input id="search" type="text" value={search} onChange={handleSearch} />
|
|
</label>
|
|
);
|
|
}
|