diff --git a/web/app/components/plugins/marketplace/context.tsx b/web/app/components/plugins/marketplace/context.tsx index cba3835513..47da7ee160 100644 --- a/web/app/components/plugins/marketplace/context.tsx +++ b/web/app/components/plugins/marketplace/context.tsx @@ -143,6 +143,7 @@ export const MarketplaceContextProvider = ({ resetPlugins, queryPlugins, queryPluginsWithDebounced, + cancelQueryPluginsWithDebounced, isLoading: isPluginsLoading, } = useMarketplacePlugins() @@ -209,12 +210,13 @@ export const MarketplaceContextProvider = ({ const handleQuery = useCallback((debounced?: boolean) => { if (!searchPluginTextRef.current && !filterPluginTagsRef.current.length) { + cancelQueryPluginsWithDebounced() handleQueryMarketplaceCollectionsAndPlugins() return } handleQueryPlugins(debounced) - }, [handleQueryMarketplaceCollectionsAndPlugins, handleQueryPlugins]) + }, [handleQueryMarketplaceCollectionsAndPlugins, handleQueryPlugins, cancelQueryPluginsWithDebounced]) const handleSearchPluginTextChange = useCallback((text: string) => { setSearchPluginText(text) diff --git a/web/app/components/plugins/marketplace/hooks.ts b/web/app/components/plugins/marketplace/hooks.ts index 83a6709a47..c581ee0d91 100644 --- a/web/app/components/plugins/marketplace/hooks.ts +++ b/web/app/components/plugins/marketplace/hooks.ts @@ -89,7 +89,7 @@ export const useMarketplacePlugins = () => { handleUpdatePlugins(pluginsSearchParams) }, [handleUpdatePlugins]) - const { run: queryPluginsWithDebounced } = useDebounceFn((pluginsSearchParams: PluginsSearchParams) => { + const { run: queryPluginsWithDebounced, cancel: cancelQueryPluginsWithDebounced } = useDebounceFn((pluginsSearchParams: PluginsSearchParams) => { handleUpdatePlugins(pluginsSearchParams) }, { wait: 500, @@ -101,6 +101,7 @@ export const useMarketplacePlugins = () => { resetPlugins, queryPlugins, queryPluginsWithDebounced, + cancelQueryPluginsWithDebounced, isLoading: isPending, } }