fix(analytics): use usePostHog + captureEvent in hooks, track custom date range

Author: waleedlatif1

apps/sim/app/workspace/[workspaceId]/logs/components/logs-toolbar/logs-toolbar.tsx

@@ -406,8 +406,12 @@ export const LogsToolbar = memo(function LogsToolbar({
     (start: string, end: string) => {
       setDateRange(start, end)
       setDatePickerOpen(false)
+      captureEvent(posthogRef.current, 'logs_filter_applied', {
+        filter_type: 'time',
+        workspace_id: workspaceId,
+      })
     },
-    [setDateRange]
+    [setDateRange, workspaceId]
   )
 
   /**

apps/sim/app/workspace/[workspaceId]/w/hooks/use-export-workflow.ts

@@ -1,7 +1,8 @@
 import { useCallback, useRef, useState } from 'react'
 import { createLogger } from '@sim/logger'
 import { useParams } from 'next/navigation'
-import { captureClientEvent } from '@/lib/posthog/client'
+import { usePostHog } from 'posthog-js/react'
+import { captureEvent } from '@/lib/posthog/client'
 import {
   downloadFile,
   exportWorkflowsToZip,
@@ -28,13 +29,17 @@ export function useExportWorkflow({ onSuccess }: UseExportWorkflowProps = {}) {
   const [isExporting, setIsExporting] = useState(false)
   const params = useParams()
   const workspaceId = params.workspaceId as string | undefined
+  const posthog = usePostHog()
 
   const onSuccessRef = useRef(onSuccess)
   onSuccessRef.current = onSuccess
 
   const workspaceIdRef = useRef(workspaceId)
   workspaceIdRef.current = workspaceId
 
+  const posthogRef = useRef(posthog)
+  posthogRef.current = posthog
+
   /**
    * Export the workflow(s) to JSON or ZIP
    * - Single workflow: exports as JSON file
@@ -101,7 +106,7 @@ export function useExportWorkflow({ onSuccess }: UseExportWorkflowProps = {}) {
         const { clearSelection } = useFolderStore.getState()
         clearSelection()
 
-        captureClientEvent('workflow_exported', {
+        captureEvent(posthogRef.current, 'workflow_exported', {
           workspace_id: workspaceIdRef.current ?? '',
           workflow_count: exportedWorkflows.length,
           format: exportedWorkflows.length === 1 ? 'json' : 'zip',

apps/sim/app/workspace/[workspaceId]/w/hooks/use-import-workflow.ts

@@ -1,8 +1,9 @@
-import { useCallback, useState } from 'react'
+import { useCallback, useRef, useState } from 'react'
 import { createLogger } from '@sim/logger'
 import { useQueryClient } from '@tanstack/react-query'
 import { useRouter } from 'next/navigation'
-import { captureClientEvent } from '@/lib/posthog/client'
+import { usePostHog } from 'posthog-js/react'
+import { captureEvent } from '@/lib/posthog/client'
 import {
   extractWorkflowsFromFiles,
   extractWorkflowsFromZip,
@@ -37,6 +38,9 @@ export function useImportWorkflow({ workspaceId }: UseImportWorkflowProps) {
   const queryClient = useQueryClient()
   const createFolderMutation = useCreateFolder()
   const clearDiff = useWorkflowDiffStore((state) => state.clearDiff)
+  const posthog = usePostHog()
+  const posthogRef = useRef(posthog)
+  posthogRef.current = posthog
   const [isImporting, setIsImporting] = useState(false)
 
   /**
@@ -205,7 +209,7 @@ export function useImportWorkflow({ workspaceId }: UseImportWorkflowProps) {
         logger.info(`Import complete. Imported ${importedWorkflowIds.length} workflow(s)`)
 
         if (importedWorkflowIds.length > 0) {
-          captureClientEvent('workflow_imported', {
+          captureEvent(posthogRef.current, 'workflow_imported', {
             workspace_id: workspaceId,
             workflow_count: importedWorkflowIds.length,
             format: hasZip ? 'zip' : 'json',