posthog events

Author: brendan-kellam

packages/web/src/app/[domain]/browse/[...path]/components/codePreviewPanel.tsx

@@ -17,6 +17,7 @@ import { EditorContextMenu } from "../../../components/editorContextMenu";
 import { BrowseHighlightRange, HIGHLIGHT_RANGE_QUERY_PARAM, useBrowseNavigation } from "../../hooks/useBrowseNavigation";
 import { useBrowseState } from "../../hooks/useBrowseState";
 import { rangeHighlightingExtension } from "./rangeHighlightingExtension";
+import useCaptureEvent from "@/hooks/useCaptureEvent";
 
 interface CodePreviewPanelProps {
     path: string;
@@ -40,6 +41,7 @@ export const CodePreviewPanel = ({
     const hasCodeNavEntitlement = useHasEntitlement("code-nav");
     const { updateBrowseState } = useBrowseState();
     const { navigateToPath } = useBrowseNavigation();
+    const captureEvent = useCaptureEvent();
 
     const highlightRangeQuery = useNonEmptyQueryParam(HIGHLIGHT_RANGE_QUERY_PARAM);
     const highlightRange = useMemo((): BrowseHighlightRange | undefined => {
@@ -132,6 +134,8 @@ export const CodePreviewPanel = ({
     }, [editorRef, highlightRange]);
 
     const onFindReferences = useCallback((symbolName: string) => {
+        captureEvent('wa_browse_find_references_pressed', {});
+
         updateBrowseState({
             selectedSymbolInfo: {
                 repoName,
@@ -142,12 +146,14 @@ export const CodePreviewPanel = ({
             isBottomPanelCollapsed: false,
             activeExploreMenuTab: "references",
         })
-    }, [updateBrowseState, repoName, revisionName, language]);
+    }, [captureEvent, updateBrowseState, repoName, revisionName, language]);
 
 
     // If we resolve multiple matches, instead of navigating to the first match, we should
     // instead popup the bottom sheet with the list of matches.
     const onGotoDefinition = useCallback((symbolName: string, symbolDefinitions: SymbolDefinition[]) => {
+        captureEvent('wa_browse_goto_definition_pressed', {});
+
         if (symbolDefinitions.length === 0) {
             return;
         }
@@ -175,7 +181,7 @@ export const CodePreviewPanel = ({
                 isBottomPanelCollapsed: false,
             })
         }
-    }, [navigateToPath, revisionName, updateBrowseState, repoName, language]);
+    }, [captureEvent, navigateToPath, revisionName, updateBrowseState, repoName, language]);
 
     const theme = useCodeMirrorTheme();
 

packages/web/src/app/[domain]/search/components/codePreviewPanel/codePreview.tsx

@@ -21,6 +21,7 @@ import { SymbolHoverPopup } from "@/ee/features/codeNav/components/symbolHoverPo
 import { symbolHoverTargetsExtension } from "@/ee/features/codeNav/components/symbolHoverPopup/symbolHoverTargetsExtension";
 import { useHasEntitlement } from "@/features/entitlements/useHasEntitlement";
 import { SymbolDefinition } from "@/ee/features/codeNav/components/symbolHoverPopup/useHoveredOverSymbolInfo";
+import useCaptureEvent from "@/hooks/useCaptureEvent";
 
 export interface CodePreviewFile {
     content: string;
@@ -57,6 +58,8 @@ export const CodePreview = ({
     const languageExtension = useCodeMirrorLanguageExtension(file?.language ?? '', editorRef?.view);
     const [currentSelection, setCurrentSelection] = useState<SelectionRange>();
 
+    const captureEvent = useCaptureEvent();
+
     const extensions = useMemo(() => {
         return [
             keymapExtension,
@@ -112,6 +115,8 @@ export const CodePreview = ({
     }, [onSelectedMatchIndexChange]);
 
     const onGotoDefinition = useCallback((symbolName: string, symbolDefinitions: SymbolDefinition[]) => {
+        captureEvent('wa_preview_panel_goto_definition_pressed', {});
+
         if (symbolDefinitions.length === 0) {
             return;
         }
@@ -145,9 +150,11 @@ export const CodePreview = ({
                 }
             });
         }
-    }, [file.filepath, file.language, file.revision, navigateToPath, repoName]);
+    }, [captureEvent, file.filepath, file.language, file.revision, navigateToPath, repoName]);
 
     const onFindReferences = useCallback((symbolName: string) => {
+        captureEvent('wa_preview_panel_find_references_pressed', {});
+
         navigateToPath({
             repoName,
             revisionName: file.revision,
@@ -164,7 +171,7 @@ export const CodePreview = ({
                 isBottomPanelCollapsed: false,
             }
         })
-    }, [file.filepath, file.language, file.revision, navigateToPath, repoName]);
+    }, [captureEvent, file.filepath, file.language, file.revision, navigateToPath, repoName]);
 
     return (
         <div className="flex flex-col h-full">

packages/web/src/app/[domain]/search/components/searchResultsPanel/fileMatch.tsx

@@ -48,7 +48,7 @@ export const FileMatch = ({
             onClick={(e) => {
                 onOpen(e.metaKey || e.ctrlKey);
             }}
-            title="Open file preview (cmd/ctrl + click)"
+            title="open file: click, open file preview: cmd/ctrl + click"
         >
             <LightweightCodeHighlighter
                 language={file.language}

packages/web/src/ee/features/codeNav/components/exploreMenu/referenceList.tsx

@@ -8,6 +8,7 @@ import { FindRelatedSymbolsResponse } from "@/features/codeNav/types";
 import { RepositoryInfo, SourceRange } from "@/features/search/types";
 import { base64Decode } from "@/lib/utils";
 import { useMemo } from "react";
+import useCaptureEvent from "@/hooks/useCaptureEvent";
 
 interface ReferenceListProps {
     data: FindRelatedSymbolsResponse;
@@ -26,6 +27,7 @@ export const ReferenceList = ({
     }, [data.repositoryInfo]);
 
     const { navigateToPath } = useBrowseNavigation();
+    const captureEvent = useCaptureEvent();
 
     return (
         <ScrollArea className="h-full">
@@ -56,6 +58,7 @@ export const ReferenceList = ({
                                         range={match.range}
                                         language={file.language}
                                         onClick={() => {
+                                            captureEvent('wa_explore_menu_reference_clicked', {});
                                             navigateToPath({
                                                 repoName: file.repository,
                                                 revisionName,

packages/web/src/lib/posthogEvents.ts

@@ -263,5 +263,13 @@ export type PosthogEventMap = {
     //////////////////////////////////////////////////////////////////
     wa_api_key_created: {},
     wa_api_key_creation_fail: {},
+    //////////////////////////////////////////////////////////////////
+    wa_preview_panel_find_references_pressed: {},
+    wa_preview_panel_goto_definition_pressed: {},
+    //////////////////////////////////////////////////////////////////
+    wa_browse_find_references_pressed: {},
+    wa_browse_goto_definition_pressed: {},
+    //////////////////////////////////////////////////////////////////
+    wa_explore_menu_reference_clicked: {},
 } 
 export type PosthogEvent = keyof PosthogEventMap;