From 51707978a57759b3d9bca9e47bd49631b26442df Mon Sep 17 00:00:00 2001 From: vykes-mac Date: Wed, 23 Oct 2024 18:02:04 -0500 Subject: [PATCH 1/7] add page selector track events --- client/hosting/performance/site-performance.tsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/client/hosting/performance/site-performance.tsx b/client/hosting/performance/site-performance.tsx index 6a425fddf063c3..ba57b075402034 100644 --- a/client/hosting/performance/site-performance.tsx +++ b/client/hosting/performance/site-performance.tsx @@ -300,7 +300,9 @@ export const SitePerformance = () => { disabled={ disableControls } onChange={ ( page_id ) => { const url = new URL( window.location.href ); - + recordTracksEvent( 'calypso_performance_profiler_page_selector_change', { + page: page_id, + } ); if ( page_id ) { setCurrentPageUserSelection( pages.find( ( page ) => page.value === page_id ) ); url.searchParams.set( 'page_id', page_id ); From c56fedc49fe4aacd17d940005975cdd5c3036c4e Mon Sep 17 00:00:00 2001 From: vykes-mac Date: Wed, 23 Oct 2024 18:55:07 -0500 Subject: [PATCH 2/7] add track events to core webvitals recommendations link --- .../components/status-section/index.tsx | 10 ++++++++++ client/performance-profiler/utils/profiler-version.ts | 2 ++ 2 files changed, 12 insertions(+) create mode 100644 client/performance-profiler/utils/profiler-version.ts diff --git a/client/performance-profiler/components/status-section/index.tsx b/client/performance-profiler/components/status-section/index.tsx index 48047c7d0423ab..648c0b83a9c6d0 100644 --- a/client/performance-profiler/components/status-section/index.tsx +++ b/client/performance-profiler/components/status-section/index.tsx @@ -2,7 +2,9 @@ import { Button } from '@wordpress/components'; import clsx from 'clsx'; import { useTranslate } from 'i18n-calypso'; import { Metrics } from 'calypso/data/site-profiler/types'; +import { recordTracksEvent } from 'calypso/lib/analytics/tracks'; import { Valuation } from 'calypso/performance-profiler/types/performance-metrics'; +import { profilerVersion } from 'calypso/performance-profiler/utils/profiler-version'; import './style.scss'; @@ -39,6 +41,12 @@ export const StatusSection = ( props: StatusSectionProps ) => { good: translate( 'Excellent' ), }[ status ]; + const recordRecommendationsClickEvent = ( filter = 'all' ) => + recordTracksEvent( 'calypso_performance_profiler_recommendations_link_click', { + filter, + version: profilerVersion(), + } ); + return (
{ statusText }
@@ -55,6 +63,7 @@ export const StatusSection = ( props: StatusSectionProps ) => { role="button" tabIndex={ 0 } onClick={ () => { + recordRecommendationsClickEvent(); onRecommendationsFilterChange?.( '' ); recommendationsRef?.current?.scrollIntoView( { behavior: 'smooth', @@ -80,6 +89,7 @@ export const StatusSection = ( props: StatusSectionProps ) => { role="button" tabIndex={ 0 } onClick={ () => { + recordRecommendationsClickEvent( activeTab ?? '' ); onRecommendationsFilterChange?.( activeTab ?? '' ); recommendationsRef?.current?.scrollIntoView( { behavior: 'smooth', diff --git a/client/performance-profiler/utils/profiler-version.ts b/client/performance-profiler/utils/profiler-version.ts new file mode 100644 index 00000000000000..53adadf32b087e --- /dev/null +++ b/client/performance-profiler/utils/profiler-version.ts @@ -0,0 +1,2 @@ +export const profilerVersion = () => + window.location.pathname.includes( '/sites/performance/' ) ? 'logged-in' : 'logged-out'; From 762b3e237b75a30f4f9c1d3965b4813ffceaea58 Mon Sep 17 00:00:00 2001 From: vykes-mac Date: Wed, 23 Oct 2024 19:35:18 -0500 Subject: [PATCH 3/7] add version flag to insight track events --- .../components/core-web-vitals-accordion/index.tsx | 3 ++- .../components/insights-section/index.tsx | 2 ++ .../components/metric-tab-bar/index.tsx | 6 +++++- 3 files changed, 9 insertions(+), 2 deletions(-) diff --git a/client/performance-profiler/components/core-web-vitals-accordion/index.tsx b/client/performance-profiler/components/core-web-vitals-accordion/index.tsx index 3cae54d81f9b2a..61db5f5349c60c 100644 --- a/client/performance-profiler/components/core-web-vitals-accordion/index.tsx +++ b/client/performance-profiler/components/core-web-vitals-accordion/index.tsx @@ -9,7 +9,7 @@ import { mapThresholdsToStatus, displayValue, } from 'calypso/performance-profiler/utils/metrics'; - +import { profilerVersion } from 'calypso/performance-profiler/utils/profiler-version'; import './styles.scss'; type Props = Record< Metrics, number > & { @@ -61,6 +61,7 @@ export const CoreWebVitalsAccordion = ( props: Props ) => { } else { recordTracksEvent( 'calypso_performance_profiler_metric_tab_click', { tab: key, + version: profilerVersion(), } ); setActiveTab( key as Metrics ); } diff --git a/client/performance-profiler/components/insights-section/index.tsx b/client/performance-profiler/components/insights-section/index.tsx index 8fe49147aa65c2..2c0a90e2eb58ae 100644 --- a/client/performance-profiler/components/insights-section/index.tsx +++ b/client/performance-profiler/components/insights-section/index.tsx @@ -11,6 +11,7 @@ import { import { recordTracksEvent } from 'calypso/lib/analytics/tracks'; import { MetricsInsight } from 'calypso/performance-profiler/components/metrics-insight'; import { filterRecommendations, metricsNames } from 'calypso/performance-profiler/utils/metrics'; +import { profilerVersion } from 'calypso/performance-profiler/utils/profiler-version'; import { updateQueryParams } from 'calypso/performance-profiler/utils/query-params'; import './style.scss'; @@ -139,6 +140,7 @@ export const InsightsSection = forwardRef( recordTracksEvent( 'calypso_performance_profiler_insight_click', { url: props.url, key, + version: profilerVersion(), } ) } /> diff --git a/client/performance-profiler/components/metric-tab-bar/index.tsx b/client/performance-profiler/components/metric-tab-bar/index.tsx index 1a8716f7e76c1b..d7605ac8c8f348 100644 --- a/client/performance-profiler/components/metric-tab-bar/index.tsx +++ b/client/performance-profiler/components/metric-tab-bar/index.tsx @@ -8,6 +8,7 @@ import { mapThresholdsToStatus, displayValue, } from 'calypso/performance-profiler/utils/metrics'; +import { profilerVersion } from 'calypso/performance-profiler/utils/profiler-version'; import { StatusIndicator } from '../status-indicator'; import './style.scss'; @@ -23,7 +24,10 @@ const MetricTabBar = ( props: Props ) => { const handleTabClick = ( tab: Metrics ) => { setActiveTab( tab ); - recordTracksEvent( 'calypso_performance_profiler_metric_tab_click', { tab } ); + recordTracksEvent( 'calypso_performance_profiler_metric_tab_click', { + tab, + version: profilerVersion(), + } ); }; return ( From 5026432f506003ecb18841c14eca852120f552cf Mon Sep 17 00:00:00 2001 From: vykes-mac Date: Wed, 23 Oct 2024 19:41:03 -0500 Subject: [PATCH 4/7] add track events for launch site and prepare launch CTA --- client/hosting/performance/site-performance.tsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/client/hosting/performance/site-performance.tsx b/client/hosting/performance/site-performance.tsx index ba57b075402034..a04018b476373b 100644 --- a/client/hosting/performance/site-performance.tsx +++ b/client/hosting/performance/site-performance.tsx @@ -249,10 +249,12 @@ export const SitePerformance = () => { const onLaunchSiteClick = () => { if ( site?.is_a4a_dev_site ) { + recordTracksEvent( 'calypso_performance_profiler_prepare_launch_click' ); page( `/settings/general/${ site.slug }` ); return; } dispatch( launchSite( siteId! ) ); + recordTracksEvent( 'calypso_performance_profiler_launch_site_click' ); }; const isMobile = useMobileBreakpoint(); @@ -301,7 +303,7 @@ export const SitePerformance = () => { onChange={ ( page_id ) => { const url = new URL( window.location.href ); recordTracksEvent( 'calypso_performance_profiler_page_selector_change', { - page: page_id, + page: pages.find( ( page ) => page.value === page_id ).label ?? '/', } ); if ( page_id ) { setCurrentPageUserSelection( pages.find( ( page ) => page.value === page_id ) ); From a70266f29ac4a11a673ff1c06038b8d406cdf114 Mon Sep 17 00:00:00 2001 From: vykes-mac Date: Wed, 23 Oct 2024 19:47:20 -0500 Subject: [PATCH 5/7] adjust event names --- client/hosting/performance/site-performance.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/client/hosting/performance/site-performance.tsx b/client/hosting/performance/site-performance.tsx index a04018b476373b..8785db941e4afd 100644 --- a/client/hosting/performance/site-performance.tsx +++ b/client/hosting/performance/site-performance.tsx @@ -249,12 +249,12 @@ export const SitePerformance = () => { const onLaunchSiteClick = () => { if ( site?.is_a4a_dev_site ) { - recordTracksEvent( 'calypso_performance_profiler_prepare_launch_click' ); + recordTracksEvent( 'calypso_performance_profiler_prepare_launch_cta_click' ); page( `/settings/general/${ site.slug }` ); return; } dispatch( launchSite( siteId! ) ); - recordTracksEvent( 'calypso_performance_profiler_launch_site_click' ); + recordTracksEvent( 'calypso_performance_profiler_launch_site_cta_click' ); }; const isMobile = useMobileBreakpoint(); @@ -303,7 +303,7 @@ export const SitePerformance = () => { onChange={ ( page_id ) => { const url = new URL( window.location.href ); recordTracksEvent( 'calypso_performance_profiler_page_selector_change', { - page: pages.find( ( page ) => page.value === page_id ).label ?? '/', + page: pages.find( ( page ) => page.value === page_id )?.label ?? '/', } ); if ( page_id ) { setCurrentPageUserSelection( pages.find( ( page ) => page.value === page_id ) ); From 70a341df333478126ac0daedb1b99363c35ca86e Mon Sep 17 00:00:00 2001 From: vykes-mac Date: Thu, 24 Oct 2024 14:36:09 -0500 Subject: [PATCH 6/7] make profiler version exhaustive for available options --- client/performance-profiler/utils/profiler-version.ts | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/client/performance-profiler/utils/profiler-version.ts b/client/performance-profiler/utils/profiler-version.ts index 53adadf32b087e..26ef2db42b2cbf 100644 --- a/client/performance-profiler/utils/profiler-version.ts +++ b/client/performance-profiler/utils/profiler-version.ts @@ -1,2 +1,8 @@ -export const profilerVersion = () => - window.location.pathname.includes( '/sites/performance/' ) ? 'logged-in' : 'logged-out'; +export const profilerVersion = () => { + if ( window.location.pathname.includes( '/sites/performance/' ) ) { + return 'logged-in'; + } else if ( window.location.pathname.includes( '/speed-test-tool' ) ) { + return 'logged-out'; + } + return 'unknown'; +}; From 87e1ba1f7444167550d73146a42261c11b4f5f29 Mon Sep 17 00:00:00 2001 From: vykes-mac Date: Thu, 24 Oct 2024 14:42:49 -0500 Subject: [PATCH 7/7] add profiler version to selector change event --- client/hosting/performance/site-performance.tsx | 4 +++- .../performance-profiler/components/status-section/index.tsx | 4 ++-- 2 files changed, 5 insertions(+), 3 deletions(-) diff --git a/client/hosting/performance/site-performance.tsx b/client/hosting/performance/site-performance.tsx index 8785db941e4afd..7cf2627dc4d59f 100644 --- a/client/hosting/performance/site-performance.tsx +++ b/client/hosting/performance/site-performance.tsx @@ -9,6 +9,7 @@ import NavigationHeader from 'calypso/components/navigation-header'; import { useUrlBasicMetricsQuery } from 'calypso/data/site-profiler/use-url-basic-metrics-query'; import { useUrlPerformanceInsightsQuery } from 'calypso/data/site-profiler/use-url-performance-insights'; import { recordTracksEvent } from 'calypso/lib/analytics/tracks'; +import { profilerVersion } from 'calypso/performance-profiler/utils/profiler-version'; import { useDispatch, useSelector } from 'calypso/state'; import getCurrentQueryArguments from 'calypso/state/selectors/get-current-query-arguments'; import getRequest from 'calypso/state/selectors/get-request'; @@ -303,7 +304,8 @@ export const SitePerformance = () => { onChange={ ( page_id ) => { const url = new URL( window.location.href ); recordTracksEvent( 'calypso_performance_profiler_page_selector_change', { - page: pages.find( ( page ) => page.value === page_id )?.label ?? '/', + is_home: page_id === '0', + version: profilerVersion(), } ); if ( page_id ) { setCurrentPageUserSelection( pages.find( ( page ) => page.value === page_id ) ); diff --git a/client/performance-profiler/components/status-section/index.tsx b/client/performance-profiler/components/status-section/index.tsx index 648c0b83a9c6d0..ae9591914dc60b 100644 --- a/client/performance-profiler/components/status-section/index.tsx +++ b/client/performance-profiler/components/status-section/index.tsx @@ -41,7 +41,7 @@ export const StatusSection = ( props: StatusSectionProps ) => { good: translate( 'Excellent' ), }[ status ]; - const recordRecommendationsClickEvent = ( filter = 'all' ) => + const recordRecommendationsClickEvent = ( filter: string ) => recordTracksEvent( 'calypso_performance_profiler_recommendations_link_click', { filter, version: profilerVersion(), @@ -63,7 +63,7 @@ export const StatusSection = ( props: StatusSectionProps ) => { role="button" tabIndex={ 0 } onClick={ () => { - recordRecommendationsClickEvent(); + recordRecommendationsClickEvent( 'all' ); onRecommendationsFilterChange?.( '' ); recommendationsRef?.current?.scrollIntoView( { behavior: 'smooth',