mirrors/smov
mirrors/smov
1
0
Fork 0
mirror of https://github.com/sussy-code/smov.git synced 2024-12-29 16:07:40 +01:00
Code Issues Wiki Activity

Fixed search query updating on clear

Browse source
This commit is contained in:
RyloRiz 2024-01-27 15:34:33 -08:00
parent 6a9e135de2
commit ef9792827a
1 changed files with 14 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
src/components/form/SearchBar.tsx
View file

@ -1,5 +1,5 @@
import c from "classnames";
import { forwardRef, useState } from "react";
import { forwardRef, useRef, useState } from "react";
import { Flare } from "@/components/utils/Flare";
@ -16,9 +16,20 @@ export interface SearchBarProps {
export const SearchBarInput = forwardRef<HTMLInputElement, SearchBarProps>(
(props, ref) => {
const [focused, setFocused] = useState(false);
const clearButtonRef = useRef<HTMLDivElement>(null);
function setSearch(value: string) {
props.onChange(value, false);
clearButtonRef.current!.hidden = value.length >= 0;
}
function refocusSearch() {
if (ref && typeof ref !== "function") {
ref.current?.blur();
setTimeout(() => ref.current?.focus(), 10);
setTimeout(() => ref.current?.blur(), 20);
setTimeout(() => ref.current?.focus(), 30);
}
}
return (
@ -59,8 +70,10 @@ export const SearchBarInput = forwardRef<HTMLInputElement, SearchBarProps>(
/>
<div
ref={clearButtonRef}
onClick={() => {
setSearch("");
setTimeout(() => refocusSearch(), 100);
}}
className="cursor-pointer absolute bottom-0 right-5 top-0 flex max-h-14 items-center text-search-icon"
>