aboutsummaryrefslogtreecommitdiffstats
path: root/src/components/Search/index.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/Search/index.tsx')
-rw-r--r--src/components/Search/index.tsx27
1 files changed, 8 insertions, 19 deletions
diff --git a/src/components/Search/index.tsx b/src/components/Search/index.tsx
index 7f9d502..4d1ae83 100644
--- a/src/components/Search/index.tsx
+++ b/src/components/Search/index.tsx
@@ -11,30 +11,18 @@ interface Props {
}
export function Search({ currentTry, setSelectedSong }: Props) {
- const [value, setValue] = React.useState<string>("");
+ const [value, setValue] = React.useState("");
const [results, setResults] = React.useState<Song[]>([]);
React.useEffect(() => {
- let cancelled = false;
-
- async function runSearch() {
- if (!value) {
- setResults([]);
- return;
- }
- const songs = await searchSong(value);
-
- if (!cancelled) {
- setResults(songs);
- }
+ if (!value.trim()) {
+ setResults([]);
+ return;
}
- runSearch();
- return () => {
- cancelled = true;
- };
+
+ setResults(searchSong(value));
}, [value]);
- // clear value on selection
React.useEffect(() => {
setValue("");
}, [currentTry]);
@@ -57,13 +45,14 @@ export function Search({ currentTry, setSelectedSong }: Props) {
</Styled.Result>
))}
</Styled.ResultsContainer>
+
<Styled.SearchContainer>
<Styled.SearchPadding>
<IoSearch size={20} />
<Styled.Input
+ value={value}
onChange={(e) => setValue(e.currentTarget.value)}
placeholder="Search"
- value={value}
/>
</Styled.SearchPadding>
</Styled.SearchContainer>
send patches to the email below
yukais@pinapelz.com
include the subject [PATCH repo_name]
pinapelz.com
homepage