feat: track workflow search context

Author: benceruleanlu

site/src/components/hub/SearchPopover.vue

@@ -79,6 +79,9 @@ const visibleBadgesDesktop = computed(() => store.filterBadges.value.slice(0, MA
 const overflowCountDesktop = computed(() =>
   Math.max(0, store.filterBadges.value.length - MAX_BADGES_DESKTOP)
 );
+const activeFilters = computed(() =>
+  store.filterBadges.value.map((badge) => `${badge.type}:${badge.value}`)
+);
 
 // ── All tags and models with counts (for filter suggestions) ──
 
@@ -186,7 +189,7 @@ const badgeOnlyResults = computed(() => {
 // ── Search with debounce ──
 
 watchDebounced(
-  [searchQuery, () => store.filterBadges.value],
+  [searchQuery, activeFilters],
   async ([query]) => {
     const trimmed = (query as string).trim();
     if (!trimmed) {
@@ -195,17 +198,24 @@ watchDebounced(
       return;
     }
     isSearching.value = true;
+    const filtersApplied = [...activeFilters.value];
     try {
-      searchResults.value = await searchIndex(trimmed, {
+      const results = await searchIndex(trimmed, {
         allowedNames: badgeFilteredNames.value ?? undefined,
       });
-      trackSearchPerformed(trimmed);
+      searchResults.value = results;
+      const resultCount = results.workflows.length + matchedCreators.value.length;
+      trackSearchPerformed({
+        query: trimmed,
+        resultCount,
+        filtersApplied,
+      });
     } finally {
       isSearching.value = false;
       hasSearched.value = true;
     }
   },
-  { debounce: 200 }
+  { debounce: 500 }
 );
 
 // ── Displayed results (combines badge-only and text search) ──

site/src/lib/posthog.ts

@@ -27,7 +27,14 @@ export function initPostHog(): void {
  * - past tense verbs
  * - e.g. hub:run_button_clicked, hub:template_viewed
  */
-type EventProperties = Record<string, string | number | boolean | undefined>;
+type EventPropertyValue = string | number | boolean | string[] | undefined;
+type EventProperties = Record<string, EventPropertyValue>;
+
+export interface SearchPerformedProperties {
+  query: string;
+  resultCount: number;
+  filtersApplied: string[];
+}
 
 export function capture(eventName: string, properties?: EventProperties): void {
   if (typeof window === 'undefined' || !initialized) return;
@@ -74,9 +81,19 @@ export function trackTemplateViewed(
   });
 }
 
-export function trackSearchPerformed(query: string): void {
+export function trackSearchPerformed({
+  query,
+  resultCount,
+  filtersApplied,
+}: SearchPerformedProperties): void {
+  const trimmedQuery = query.trim();
+  if (!trimmedQuery) return;
+
   capture('hub:search_performed', {
-    query,
+    query: trimmedQuery,
+    result_count: resultCount,
+    surface: 'workflows',
+    filters_applied: filtersApplied,
   });
 }
 

site/tests/unit/posthog.test.ts

@@ -0,0 +1,76 @@
+import { afterEach, describe, expect, it, vi } from 'vitest';
+
+const posthogMock = vi.hoisted(() => ({
+  init: vi.fn(),
+  capture: vi.fn(),
+}));
+
+vi.mock('posthog-js', () => ({
+  default: posthogMock,
+}));
+
+async function loadPostHog() {
+  vi.resetModules();
+  vi.stubGlobal('window', {});
+  vi.stubEnv('PUBLIC_POSTHOG_KEY', 'phc_test');
+  return import('../../src/lib/posthog');
+}
+
+afterEach(() => {
+  posthogMock.init.mockReset();
+  posthogMock.capture.mockReset();
+  vi.unstubAllEnvs();
+  vi.unstubAllGlobals();
+  vi.resetModules();
+});
+
+describe('trackSearchPerformed', () => {
+  it('tracks workflow search metadata', async () => {
+    const { initPostHog, trackSearchPerformed } = await loadPostHog();
+
+    initPostHog();
+    trackSearchPerformed({
+      query: ' flux ',
+      resultCount: 12,
+      filtersApplied: ['model:Flux', 'mode:app'],
+    });
+
+    expect(posthogMock.capture).toHaveBeenCalledWith('hub:search_performed', {
+      query: 'flux',
+      result_count: 12,
+      surface: 'workflows',
+      filters_applied: ['model:Flux', 'mode:app'],
+    });
+  });
+
+  it('tracks zero-result searches', async () => {
+    const { initPostHog, trackSearchPerformed } = await loadPostHog();
+
+    initPostHog();
+    trackSearchPerformed({
+      query: 'nonexistent workflow',
+      resultCount: 0,
+      filtersApplied: [],
+    });
+
+    expect(posthogMock.capture).toHaveBeenCalledWith('hub:search_performed', {
+      query: 'nonexistent workflow',
+      result_count: 0,
+      surface: 'workflows',
+      filters_applied: [],
+    });
+  });
+
+  it('skips empty queries', async () => {
+    const { initPostHog, trackSearchPerformed } = await loadPostHog();
+
+    initPostHog();
+    trackSearchPerformed({
+      query: '   ',
+      resultCount: 1,
+      filtersApplied: ['tag:image'],
+    });
+
+    expect(posthogMock.capture).not.toHaveBeenCalled();
+  });
+});