All files / packages/app/components search-bar.tsx

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
 
 
 
 
 
 
 
 
 
 
 
 
1163x
1289x
1289x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
import type React from "react";
 
import { useTranslation } from "react-i18next";
 
import { Icon } from "~components/icons";
import { Input } from "~components/input";
 
export const SearchBar: React.FC<
	Omit<React.ComponentProps<typeof Input>, "value" | "onValueChange"> & {
		value: string;
		onValueChange: React.Dispatch<string>;
	}
> = ({ startContent, value, onValueChange, ...props }) => {
	const { t } = useTranslation("default");
	return (
		<Input
			startContent={
				<>
					<Icon name="search" className="size-5" />
					{startContent}
				</>
			}
			testID="search-bar"
			value={value}
			onValueChange={onValueChange}
			placeholder={t("searchBar.placeholder")}
			isClearable
			{...props}
		/>
	);
};