diff --git a/client/src/document/organisms/sidebar/filter.tsx b/client/src/document/organisms/sidebar/filter.tsx index d4191e620890..4dbaf6358e0e 100644 --- a/client/src/document/organisms/sidebar/filter.tsx +++ b/client/src/document/organisms/sidebar/filter.tsx @@ -4,10 +4,14 @@ import { Button } from "../../../ui/atoms/button"; import "./filter.scss"; import { useGleanClick } from "../../../telemetry/glean-context"; -import { SIDEBAR_FILTER_FOCUS } from "../../../telemetry/constants"; +import { + SIDEBAR_FILTER_FOCUS, + SIDEBAR_FILTER_TYPED, +} from "../../../telemetry/constants"; export function SidebarFilter() { const [isActive, setActive] = useState(false); + const [hasTyped, setTyped] = useState(false); const { query, setQuery, matchCount } = useSidebarFilter(); const gleanClick = useGleanClick(); @@ -17,6 +21,24 @@ export function SidebarFilter() { } }, [gleanClick, isActive]); + useEffect(() => { + if (query) { + setTyped(true); + } + }, [query, setTyped]); + + useEffect(() => { + if (hasTyped) { + gleanClick(SIDEBAR_FILTER_TYPED); + } + }, [gleanClick, hasTyped]); + + useEffect(() => { + if (!isActive) { + setTyped(false); + } + }, [isActive, setTyped]); + return (
diff --git a/client/src/telemetry/constants.ts b/client/src/telemetry/constants.ts index 6cf1a3ace4f5..ff9ff0c5e634 100644 --- a/client/src/telemetry/constants.ts +++ b/client/src/telemetry/constants.ts @@ -4,6 +4,7 @@ export const OFFER_OVERVIEW_CLICK = "offer_overview_click"; export const SIDEBAR_CLICK = "sidebar_click"; export const SIDEBAR_CLICK_WITH_FILTER = "sidebar_click_with_filter"; export const SIDEBAR_FILTER_FOCUS = "sidebar_filter_focus"; +export const SIDEBAR_FILTER_TYPED = "sidebar_filter_typed"; export const TOC_CLICK = "toc_click"; /** Replaced "top_nav_already_subscriber" in July 2023. */ export const TOP_NAV_LOGIN = "top_nav: login";