diff --git a/apps/studio/components/interfaces/QueryPerformance/QueryIndexes.tsx b/apps/studio/components/interfaces/QueryPerformance/QueryIndexes.tsx index 5e4e85447f3..93c9bd231fa 100644 --- a/apps/studio/components/interfaces/QueryPerformance/QueryIndexes.tsx +++ b/apps/studio/components/interfaces/QueryPerformance/QueryIndexes.tsx @@ -1,5 +1,5 @@ import { Check, Lightbulb, Table2 } from 'lucide-react' -import { useState } from 'react' +import { useState, useEffect } from 'react' import { AccordionTrigger } from '@ui/components/shadcn/ui/accordion' import { useIndexAdvisorStatus } from 'components/interfaces/QueryPerformance/hooks/useIsIndexAdvisorStatus' @@ -35,6 +35,7 @@ import { import { EnableIndexAdvisorButton } from './IndexAdvisor/EnableIndexAdvisorButton' import { DocsButton } from 'components/ui/DocsButton' import { DOCS_URL } from 'lib/constants' +import { useTrack } from 'lib/telemetry/track' interface QueryIndexesProps { selectedRow: any @@ -49,6 +50,8 @@ export const QueryIndexes = ({ selectedRow }: QueryIndexesProps) => { const { data: project } = useSelectedProjectQuery() const [showStartupCosts, setShowStartupCosts] = useState(false) const [isExecuting, setIsExecuting] = useState(false) + const track = useTrack() + const [hasTrackedTabView, setHasTrackedTabView] = useState(false) const { data: usedIndexes, @@ -100,10 +103,27 @@ export const QueryIndexes = ({ selectedRow }: QueryIndexesProps) => { const invalidateQueries = useIndexInvalidation() + useEffect(() => { + if (!isLoadingIndexAdvisorResult && !hasTrackedTabView) { + track('index_advisor_tab_clicked', { + hasRecommendations: hasIndexRecommendation, + isIndexAdvisorEnabled: isIndexAdvisorEnabled, + }) + setHasTrackedTabView(true) + } + }, [ + isLoadingIndexAdvisorResult, + hasIndexRecommendation, + hasTrackedTabView, + track, + isIndexAdvisorEnabled, + ]) + const createIndex = async () => { if (index_statements.length === 0) return setIsExecuting(true) + track('index_advisor_create_indexes_button_clicked') try { await createIndexes({ diff --git a/apps/studio/components/layouts/ObservabilityLayout/ObservabilityLayout.tsx b/apps/studio/components/layouts/ObservabilityLayout/ObservabilityLayout.tsx index ff1eafbe877..6207f84d4f3 100644 --- a/apps/studio/components/layouts/ObservabilityLayout/ObservabilityLayout.tsx +++ b/apps/studio/components/layouts/ObservabilityLayout/ObservabilityLayout.tsx @@ -55,7 +55,6 @@ const ObservabilityLayoutContent = ({ useEffect(() => { const isQueryPerformancePage = pathname?.includes('/query-performance') - const wasQueryPerformancePage = prevPathnameRef.current?.includes('/query-performance') if ( isQueryPerformancePage && @@ -69,7 +68,7 @@ const ObservabilityLayoutContent = ({ content: , priority: 3, }) - } else if (isIndexAdvisorBannerDismissed || !isQueryPerformancePage) { + } else if (isIndexAdvisorBannerDismissed || !isQueryPerformancePage || isIndexAdvisorEnabled) { dismissBanner('index-advisor-banner') } diff --git a/packages/common/telemetry-constants.ts b/packages/common/telemetry-constants.ts index 2d536d67be6..92c7ce67b61 100644 --- a/packages/common/telemetry-constants.ts +++ b/packages/common/telemetry-constants.ts @@ -1130,6 +1130,34 @@ export interface IndexAdvisorBannerDismissButtonClickedEvent { groups: TelemetryGroups } +/** + * Index Advisor tab clicked event. + * + * @group Events + * @source studio + * @page /observability/query-performance + */ +export interface IndexAdvisorTabClickedEvent { + action: 'index_advisor_tab_clicked' + properties: { + hasRecommendations: boolean + isIndexAdvisorEnabled: boolean + } + groups: TelemetryGroups +} + +/** + * Index Advisor create indexes button clicked event. + * + * @group Events + * @source studio + * @page /observability/query-performance + */ +export interface IndexAdvisorCreateIndexesButtonClickedEvent { + action: 'index_advisor_create_indexes_button_clicked' + groups: TelemetryGroups +} + /** * User clicked the dismiss button on a banner in studio Observability pages. * @@ -2536,6 +2564,8 @@ export type TelemetryEvent = | IndexAdvisorBannerEnableButtonClickedEvent | IndexAdvisorBannerDismissButtonClickedEvent | IndexAdvisorDialogEnableButtonClickedEvent + | IndexAdvisorTabClickedEvent + | IndexAdvisorCreateIndexesButtonClickedEvent | EdgeFunctionDeployButtonClickedEvent | EdgeFunctionDeployUpdatesConfirmClickedEvent | EdgeFunctionAiAssistantButtonClickedEvent