From ea9414543f3870e0e1b1e46a22ae620c49df7579 Mon Sep 17 00:00:00 2001
From: Thomas Camlong <thomas@ajnart.fr>
Date: Fri, 7 Nov 2025 08:10:43 +0100
Subject: [PATCH] fix(analytics): debounce PostHog "no icons found" event
 tracking

- Use debouncedQuery instead of searchQuery to prevent premature events
- Add 500ms debounce delay before sending PostHog events
- Require minimum 2 characters to avoid false positives from single character searches
- Fix bug where events fired before filtering completed
---
 web/src/components/icon-search.tsx | 34 +++++++++++++++++++++++-------
 1 file changed, 26 insertions(+), 8 deletions(-)

diff --git a/web/src/components/icon-search.tsx b/web/src/components/icon-search.tsx
index 2557b4b9..a7ba8c8a 100644
--- a/web/src/components/icon-search.tsx
+++ b/web/src/components/icon-search.tsx
@@ -38,6 +38,7 @@ export function IconSearch({ icons }: IconSearchProps) {
 	const [selectedCategories, setSelectedCategories] = useState<string[]>(initialCategories ?? [])
 	const [sortOption, setSortOption] = useState<SortOption>(initialSort)
 	const timeoutRef = useRef<NodeJS.Timeout | null>(null)
+	const noIconsFoundTimeoutRef = useRef<NodeJS.Timeout | null>(null)
 	const { resolvedTheme } = useTheme()
 	const [isLazyRequestSubmitted, setIsLazyRequestSubmitted] = useState(false)
 
@@ -162,19 +163,36 @@ export function IconSearch({ icons }: IconSearchProps) {
 			if (timeoutRef.current) {
 				clearTimeout(timeoutRef.current)
 			}
+			if (noIconsFoundTimeoutRef.current) {
+				clearTimeout(noIconsFoundTimeoutRef.current)
+			}
 		}
 	}, [])
 
 	useEffect(() => {
-		if (filteredIcons.length === 0 && searchQuery) {
-			console.log("no icons found", {
-				query: searchQuery,
-			})
-			posthog.capture("no icons found", {
-				query: searchQuery,
-			})
+		if (noIconsFoundTimeoutRef.current) {
+			clearTimeout(noIconsFoundTimeoutRef.current)
 		}
-	}, [filteredIcons, searchQuery])
+
+		if (filteredIcons.length === 0 && debouncedQuery.trim().length >= 2) {
+			noIconsFoundTimeoutRef.current = setTimeout(() => {
+				if (filteredIcons.length === 0 && debouncedQuery.trim().length >= 2) {
+					console.log("no icons found", {
+						query: debouncedQuery,
+					})
+					posthog.capture("no icons found", {
+						query: debouncedQuery,
+					})
+				}
+			}, 500)
+		}
+
+		return () => {
+			if (noIconsFoundTimeoutRef.current) {
+				clearTimeout(noIconsFoundTimeoutRef.current)
+			}
+		}
+	}, [filteredIcons, debouncedQuery])
 
 	if (!searchParams) return null