calvin.erfmann/pangolin
1
0
Fork 0
mirror of https://github.com/fosrl/pangolin.git synced 2026-07-06 12:19:50 +00:00
Code Issues Packages Projects Releases Wiki Activity

improve search bar debounce behavior

Browse Source
This commit is contained in:
miloschwartz
2026-07-01 11:53:11 -04:00
parent 97cdb2eb5a
commit 75f481bc3d
1 changed files with 9 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
src/components/resource-launcher/ResourceLauncher.tsx
View File

@@ -85,22 +85,17 @@ export default function ResourceLauncher({
const { navigate, isNavigating, searchParams } = useNavigationContext(); const { navigate, isNavigating, searchParams } = useNavigationContext();
const hasRestoredLastView = useRef(false); const hasRestoredLastView = useRef(false);
const [searchInput, setSearchInput] = useState(config.query); const [searchInputResetKey, setSearchInputResetKey] = useState(0);
const [saveDialogOpen, setSaveDialogOpen] = useState(false); const [saveDialogOpen, setSaveDialogOpen] = useState(false);
const [newViewName, setNewViewName] = useState(""); const [newViewName, setNewViewName] = useState("");
const [saveOrgWide, setSaveOrgWide] = useState(false); const [saveOrgWide, setSaveOrgWide] = useState(false);
const configRef = useRef(config); const configRef = useRef(config);
configRef.current = config; configRef.current = config;
const searchInputRef = useRef(searchInput); const searchInputRef = useRef(config.query);
searchInputRef.current = searchInput;
const activeViewIdRef = useRef(activeViewId); const activeViewIdRef = useRef(activeViewId);
activeViewIdRef.current = activeViewId; activeViewIdRef.current = activeViewId;
useEffect(() => {
setSearchInput(config.query);
}, [config.query]);
useEffect(() => { useEffect(() => {
if (hasRestoredLastView.current) { if (hasRestoredLastView.current) {
return; return;
@@ -307,7 +302,8 @@ export default function ResourceLauncher({
); );
const handleClearFilters = useCallback(() => { const handleClearFilters = useCallback(() => {
setSearchInput(""); searchInputRef.current = "";
setSearchInputResetKey((key) => key + 1);
navigateToConfig(activeViewIdRef.current, { navigateToConfig(activeViewIdRef.current, {
...configRef.current, ...configRef.current,
query: "", query: "",
@@ -376,10 +372,11 @@ export default function ResourceLauncher({
<div className="relative w-full sm:max-w-sm shrink-0"> <div className="relative w-full sm:max-w-sm shrink-0">
<Search className="absolute left-2.5 top-1/2 -translate-y-1/2 size-4 text-muted-foreground" /> <Search className="absolute left-2.5 top-1/2 -translate-y-1/2 size-4 text-muted-foreground" />
<Input <Input
value={searchInput} key={`${activeViewId}-${searchInputResetKey}`}
defaultValue={config.query}
onChange={(event) => { onChange={(event) => {
const value = event.target.value; const value = event.currentTarget.value;
setSearchInput(value); searchInputRef.current = value;
debouncedNavigateSearch( debouncedNavigateSearch(
activeViewIdRef.current, activeViewIdRef.current,
value value
@@ -389,6 +386,7 @@ export default function ResourceLauncher({
"resourceLauncherSearchPlaceholder" "resourceLauncherSearchPlaceholder"
)} )}
className="pl-8" className="pl-8"
type="search"
/> />
</div> </div>
<LauncherViewTabs <LauncherViewTabs