@elementor/editor-audits 4.4.0-beta1 → 4.4.0-beta2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elementor/editor-audits",
-  "version": "4.4.0-beta1",
+  "version": "4.4.0-beta2",
   "private": false,
   "author": "Elementor Team",
   "homepage": "https://elementor.com/",
@@ -39,21 +39,22 @@
     "dev": "tsup --config=../../tsup.dev.ts"
   },
   "dependencies": {
-    "@elementor/editor": "4.4.0-beta1",
-    "@elementor/editor-mcp": "4.4.0-beta1",
-    "@elementor/editor-app-bar": "4.4.0-beta1",
-    "@elementor/editor-elements": "4.4.0-beta1",
-    "@elementor/editor-floating-panels": "4.4.0-beta1",
-    "@elementor/editor-notifications": "4.4.0-beta1",
-    "@elementor/editor-props": "4.4.0-beta1",
-    "@elementor/editor-styles": "4.4.0-beta1",
-    "@elementor/editor-v1-adapters": "4.4.0-beta1",
-    "@elementor/events": "4.4.0-beta1",
-    "@elementor/http-client": "4.4.0-beta1",
+    "@elementor/editor": "4.4.0-beta2",
+    "@elementor/editor-mcp": "4.4.0-beta2",
+    "@elementor/editor-app-bar": "4.4.0-beta2",
+    "@elementor/editor-current-user": "4.4.0-beta2",
+    "@elementor/editor-elements": "4.4.0-beta2",
+    "@elementor/editor-floating-panels": "4.4.0-beta2",
+    "@elementor/editor-notifications": "4.4.0-beta2",
+    "@elementor/editor-props": "4.4.0-beta2",
+    "@elementor/editor-styles": "4.4.0-beta2",
+    "@elementor/editor-v1-adapters": "4.4.0-beta2",
+    "@elementor/events": "4.4.0-beta2",
+    "@elementor/http-client": "4.4.0-beta2",
     "@elementor/icons": "~1.78.1",
-    "@elementor/locations": "4.4.0-beta1",
-    "@elementor/session": "4.4.0-beta1",
-    "@elementor/store": "4.4.0-beta1",
+    "@elementor/locations": "4.4.0-beta2",
+    "@elementor/session": "4.4.0-beta2",
+    "@elementor/store": "4.4.0-beta2",
     "@elementor/ui": "1.41.4"
   },
   "peerDependencies": {

package/src/audits/accessibility-statement.ts

@@ -32,6 +32,7 @@ export const audit: Audit = {
 					ctaLabel: __( 'Create', 'elementor' ),
 					secondaryCtaLabel: __( 'Learn more', 'elementor' ),
 					secondaryCtaUrl: 'https://elementor.com/help/start-using-ally/#statement',
+					appInstalled: isReady,
 				},
 			],
 		};

package/src/audits/accessibility-widget.ts

@@ -34,6 +34,7 @@ export const audit: Audit = {
 					label: __( 'No accessibility widget is active on this site.', 'elementor' ),
 					externalUrl: isReady ? ctx.pageContext.ally_widget_settings_url : ctx.pageContext.ally_plugin_url,
 					ctaLabel: __( 'Activate', 'elementor' ),
+					appInstalled: isReady,
 				},
 			],
 		};

package/src/audits/cookie-policy.ts

@@ -26,6 +26,7 @@ export const audit: Audit = {
 					label: __( 'Cookiez plugin is not installed or active.', 'elementor' ),
 					externalUrl: ctx.pageContext.cookiez_plugin_url,
 					ctaLabel: __( 'Set up cookie consent', 'elementor' ),
+					appInstalled: ctx.pageContext.cookiez_plugin_active,
 				},
 			],
 		};

package/src/audits/google-consent-mode.ts

@@ -45,6 +45,7 @@ export const audit: Audit = {
 						auditId: audit.id,
 						label,
 						ctaLabel: __( 'Enable', 'elementor' ),
+						appInstalled: true,
 						externalUrl: ctx.pageContext.cookiez_consent_mode_settings_url,
 					},
 				],

package/src/audits/images-alt-text.ts

@@ -38,6 +38,7 @@ export const audit: Audit = {
 					label: __( 'Image is missing alt text.', 'elementor' ),
 					externalUrl: isReady ? ctx.pageContext.ally_scan_url : ctx.pageContext.ally_plugin_url,
 					ctaLabel: __( 'Fix with Ally', 'elementor' ),
+					appInstalled: isReady,
 				} );
 			}
 		} );

package/src/audits/images-inefficient-format.ts

@@ -57,6 +57,7 @@ export const audit: Audit = {
 				? ctx.pageContext.image_optimization_settings_url
 				: ctx.pageContext.image_optimization_plugin_url,
 			ctaLabel: __( 'Optimize all', 'elementor' ),
+			appInstalled: isReady,
 		} ) );
 
 		return violations.length === 0

package/src/audits/images-too-large.ts

@@ -65,6 +65,7 @@ export const audit: Audit = {
 				? ctx.pageContext.image_optimization_settings_url
 				: ctx.pageContext.image_optimization_plugin_url,
 			ctaLabel: __( 'Optimize all', 'elementor' ),
+			appInstalled: isReady,
 		} ) );
 
 		return violations.length === 0

package/src/audits/scan-for-cookies.ts

@@ -23,6 +23,7 @@ export const audit: Audit = {
 					auditId: audit.id,
 					label: __( 'This page has not been scanned for cookies yet.', 'elementor' ),
 					externalUrl: isReady ? ctx.pageContext.cookiez_scan_url : ctx.pageContext.cookiez_plugin_action_url,
+					appInstalled: isReady,
 				},
 			],
 		};

package/src/components/audit-panel.tsx

@@ -6,6 +6,8 @@ import { __ } from '@wordpress/i18n';
 
 import { AUDIT_PANEL_ID } from '../constants';
 import { useAuditReport } from '../hooks/use-audit-report';
+import { useTrackPanelViewed } from '../hooks/use-track-panel-viewed';
+import { trackPanelClosed } from '../utils/tracking';
 import AuditFeedback from './audit-feedback';
 import ErrorPage from './pages/error-page';
 import LoadingPage from './pages/loading-page';
@@ -16,8 +18,10 @@ import RescanButton from './rescan-button';
 export default function AuditPanel() {
 	const { status, report, error, isStale, run } = useAuditReport();
 
+	useTrackPanelViewed();
+
 	const hostDocumentId = getHostDocumentId() ?? 0;
-	const onRun = () => run( hostDocumentId );
+	const onRun = () => run( hostDocumentId, report ? 'rescan' : 'run_audit' );
 	const lastScanLabel = report ? new Date( report.runAt ).toLocaleTimeString() : null;
 
 	return (
@@ -27,6 +31,7 @@ export default function AuditPanel() {
 				title={ __( 'Page Audit', 'elementor' ) }
 				badge={ __( 'Beta', 'elementor' ) }
 				titleVariant="subtitle2"
+				onClose={ trackPanelClosed }
 			/>
 			<FloatingPanelBody
 				sx={

package/src/components/fix-violation-with-angie.tsx

@@ -5,14 +5,17 @@ import { Button, IconButton, Tooltip } from '@elementor/ui';
 import { __ } from '@wordpress/i18n';
 
 import { ANGIE_FIX_ENTRY_POINT, CREATE_WIDGET_EVENT } from '../constants';
+import { type AuditMeta } from '../types';
+import { trackFindingClicked } from '../utils/tracking';
 
 type Props = {
+	audit: AuditMeta;
 	prompt: string;
 	panelZIndex: number;
 	variant?: 'icon' | 'button';
 };
 
-export default function FixViolationWithAngie( { prompt, panelZIndex, variant = 'icon' }: Props ) {
+export default function FixViolationWithAngie( { audit, prompt, panelZIndex, variant = 'icon' }: Props ) {
 	const label = __( 'Fix with Angie', 'elementor' );
 	const href = `#angie-prompt=${ encodeURIComponent( prompt ) }`;
 
@@ -22,6 +25,12 @@ export default function FixViolationWithAngie( { prompt, panelZIndex, variant =
 
 		if ( isAngieAvailable() ) {
 			sendPromptToAngie( prompt );
+			trackFindingClicked( {
+				audit,
+				locationL2: 'issues',
+				actionType: 'fix_with_angie',
+				interactionResult: 'angie_prompt_sent',
+			} );
 			return;
 		}
 

package/src/components/promotions.tsx

@@ -5,6 +5,7 @@ import { __ } from '@wordpress/i18n';
 import { PROMOTIONS } from '../register-promotions';
 import { type PageAuditReport } from '../types';
 import { findAuditRun } from '../utils/find-audit-run';
+import { trackFixWithApp } from '../utils/tracking';
 import PromotionCard from './promotion-card';
 
 type Props = {
@@ -58,8 +59,14 @@ export default function Promotions( { report }: Props ) {
 						ctaLabel={ config.ctaLabel }
 						ctaDisabled={ ! ctaUrl }
 						onCtaClick={ () => {
-							if ( ctaUrl ) {
-								window.open( ctaUrl, '_blank' );
+							if ( ! ctaUrl ) {
+								return;
+							}
+
+							window.open( ctaUrl, '_blank', 'noopener' );
+
+							if ( run.result.status === 'fail' ) {
+								trackFixWithApp( run.audit, run.result.violations[ 0 ], 'overview' );
 							}
 						} }
 					/>

package/src/components/violation-cta-button.tsx

@@ -7,14 +7,22 @@ type Props = {
 	externalUrl: string;
 	variant?: 'outlined' | 'text';
 	withIcon?: boolean;
+	onOpen?: () => void;
 };
 
-export default function ViolationCtaButton( { ctaLabel, externalUrl, variant = 'outlined', withIcon = false }: Props ) {
+export default function ViolationCtaButton( {
+	ctaLabel,
+	externalUrl,
+	variant = 'outlined',
+	withIcon = false,
+	onOpen,
+}: Props ) {
 	const handleClick = ( event: React.MouseEvent< HTMLButtonElement > ) => {
 		event.stopPropagation();
 		event.preventDefault();
 
 		window.open( externalUrl, '_blank', 'noopener' );
+		onOpen?.();
 	};
 
 	return (

package/src/components/violation-row.tsx

@@ -11,6 +11,7 @@ import { type AuditMeta, type AuditViolation } from '../types';
 import { buildAngiePrompt } from '../utils/build-angie-prompt';
 import { isScoredAudit } from '../utils/is-scored-audit';
 import { onKeyboardClick } from '../utils/keyboard-click';
+import { trackFindingClicked, trackFixWithApp } from '../utils/tracking';
 import FixViolationWithAngie from './fix-violation-with-angie';
 import SeverityIcon from './severity-icons';
 import ViolationCtaButton from './violation-cta-button';
@@ -52,10 +53,12 @@ function StatusIndicator( { audit, violations }: Pick< Props, 'audit' | 'violati
 }
 
 function GuidanceAction( {
+	audit,
 	violation,
 	sharedAngiePrompt,
 	panelZIndex,
 }: {
+	audit: AuditMeta;
 	violation: AuditViolation;
 	sharedAngiePrompt?: string;
 	panelZIndex: number;
@@ -73,6 +76,7 @@ function GuidanceAction( {
 					ctaLabel={ violation.ctaLabel as string }
 					externalUrl={ violation.externalUrl as string }
 					withIcon
+					onOpen={ () => trackFixWithApp( audit, violation, 'issues' ) }
 				/>
 			) }
 			{ hasPrimaryCta && violation.secondaryCtaLabel && violation.secondaryCtaUrl && (
@@ -83,7 +87,12 @@ function GuidanceAction( {
 				/>
 			) }
 			{ sharedAngiePrompt && (
-				<FixViolationWithAngie prompt={ sharedAngiePrompt } panelZIndex={ panelZIndex } variant="button" />
+				<FixViolationWithAngie
+					audit={ audit }
+					prompt={ sharedAngiePrompt }
+					panelZIndex={ panelZIndex }
+					variant="button"
+				/>
 			) }
 		</Box>
 	);
@@ -113,9 +122,22 @@ export default function ViolationRow( { audit, expanded, onToggleExpand, skipRea
 	const panelZIndex = useFloatingPanelZIndex( AUDIT_PANEL_ID );
 	const sharedAngiePrompt = getSharedAngiePrompt( violations );
 
+	const viewIssue = ( violation: AuditViolation ) => {
+		const interactionResult = focusViolation( violation );
+
+		if ( interactionResult ) {
+			trackFindingClicked( {
+				audit,
+				locationL2: 'issues',
+				actionType: 'view_issue',
+				interactionResult,
+			} );
+		}
+	};
+
 	const handleGuidanceClick = () => {
 		if ( isGuidanceFocusable && primaryViolation ) {
-			focusViolation( primaryViolation );
+			viewIssue( primaryViolation );
 		}
 	};
 
@@ -170,6 +192,7 @@ export default function ViolationRow( { audit, expanded, onToggleExpand, skipRea
 							</Typography>
 							{ primaryViolation && (
 								<GuidanceAction
+									audit={ audit }
 									violation={ primaryViolation }
 									sharedAngiePrompt={ sharedAngiePrompt }
 									panelZIndex={ panelZIndex }
@@ -194,8 +217,8 @@ export default function ViolationRow( { audit, expanded, onToggleExpand, skipRea
 									key={ idx }
 									role="button"
 									tabIndex={ 0 }
-									onClick={ () => focusViolation( violation ) }
-									onKeyDown={ onKeyboardClick( () => focusViolation( violation ) ) }
+									onClick={ () => viewIssue( violation ) }
+									onKeyDown={ onKeyboardClick( () => viewIssue( violation ) ) }
 									sx={ {
 										display: 'flex',
 										alignItems: 'center',
@@ -226,6 +249,7 @@ export default function ViolationRow( { audit, expanded, onToggleExpand, skipRea
 											sx={ { opacity: 0, transition: 'opacity .15s' } }
 										>
 											<FixViolationWithAngie
+												audit={ audit }
 												prompt={
 													violation.angiePrompt ?? buildAngiePrompt( angiePromptContext )
 												}

package/src/constants.ts

@@ -18,6 +18,19 @@ export const FEEDBACK_SENT_EVENT = 'audit_feedback_sent';
 export const FEEDBACK_CANCELLED_EVENT = 'audit_feedback_cancelled';
 export const FEEDBACK_CLOSED_EVENT = 'audit_feedback_closed';
 
+export const PANEL_VIEWED_EVENT = 'page_audit_panel_viewed';
+export const PANEL_CLOSED_EVENT = 'page_audit_panel_closed';
+export const RUN_STARTED_EVENT = 'page_audit_run_started';
+export const RUN_COMPLETED_EVENT = 'page_audit_run_completed';
+export const FINDING_CLICKED_EVENT = 'page_audit_finding_clicked';
+
+export const TRACKING_WINDOW_NAME = 'page_audit';
+export const TRACKING_TARGET_LOCATION = 'panel';
+export const TRACKING_LOCATION_L1 = 'audit_panel';
+
+export const FIRST_OPEN_MESSAGE_KEY = 'page-audit-panel-opened';
+export const AUDIT_ID_PREFIX = 'audits/';
+
 export const ALL_CATEGORIES: AuditCategory[] = [
 	'best-practices',
 	'seo',

package/src/hooks/focus-violation.ts

@@ -2,10 +2,11 @@ import { getContainer, selectElement } from '@elementor/editor-elements';
 import { __privateOpenRoute as openRoute, __privateRunCommand as runCommand } from '@elementor/editor-v1-adapters';
 
 import { type AuditViolation } from '../types';
+import { type ViewIssueResult } from '../utils/tracking';
 
 const SCROLL_TO_VIEW_DELAY_MS = 200;
 
-export function focusViolation( violation: AuditViolation ): void {
+export function focusViolation( violation: AuditViolation ): ViewIssueResult | null {
 	if ( violation.elementId ) {
 		const container = getContainer( violation.elementId );
 
@@ -27,27 +28,30 @@ export function focusViolation( violation: AuditViolation ): void {
 			runCommand( 'panel/editor/open' );
 		}
 
-		return;
+		return container ? 'element_focused' : null;
 	}
 
 	if ( violation.externalUrl ) {
 		window.open( violation.externalUrl, '_blank' );
-		return;
+		return 'external_url_opened';
 	}
 
 	if ( violation.targetHint === 'page-settings' ) {
 		openRoute( 'panel/page-settings/settings' );
-		return;
+		return 'page_settings_opened';
 	}
 
 	if ( violation.targetHint === 'site-settings' ) {
 		runCommand( 'panel/global/open' );
-		return;
+		return 'site_settings_opened';
 	}
 
 	if ( violation.targetHint === 'site-identity-settings' ) {
 		void runCommand( 'panel/global/open' ).then( () => {
 			openRoute( 'panel/global/settings-site-identity' );
 		} );
+		return 'site_settings_opened';
 	}
+
+	return null;
 }

package/src/hooks/use-audit-report.ts

@@ -6,6 +6,7 @@ import { runPageAudit } from '../runner';
 import { type GlobalState, selectError, selectIsStale, selectReport, selectStatus, slice } from '../store';
 import { getPersistedReport, persistReport } from '../utils/report-storage';
 import { SessionExpiredError } from '../utils/session-expiration';
+import { type RunTrigger, trackRunCompleted, trackRunFailed, trackRunStarted } from '../utils/tracking';
 
 export function useAuditReport() {
 	const status = useSelector( ( state: GlobalState ) => selectStatus( state ) );
@@ -29,20 +30,24 @@ export function useAuditReport() {
 		}
 	}, [ documentId, report, dispatch ] );
 
-	const run = async ( documentIdToRun: number ) => {
+	const run = async ( documentIdToRun: number, trigger: RunTrigger ) => {
 		dispatch( slice.actions.runStarted() );
+		trackRunStarted( trigger );
 
 		try {
 			const nextReport = await runPageAudit( documentIdToRun );
 			dispatch( slice.actions.runSucceeded( nextReport ) );
 			persistReport( documentIdToRun, nextReport );
+			trackRunCompleted( nextReport );
 		} catch ( e ) {
 			if ( e instanceof SessionExpiredError ) {
 				dispatch( slice.actions.runAborted() );
+				trackRunFailed();
 				return;
 			}
 
 			dispatch( slice.actions.runFailed( e instanceof Error ? e.message : 'Unknown error' ) );
+			trackRunFailed();
 		}
 	};
 

package/src/hooks/use-track-panel-viewed.ts

@@ -0,0 +1,31 @@
+import { useEffect, useRef, useState } from 'react';
+import { useCurrentUser, useSuppressedMessage } from '@elementor/editor-current-user';
+import { getHostDocumentId } from '@elementor/editor-elements';
+import { __useSelector as useSelector } from '@elementor/store';
+
+import { FIRST_OPEN_MESSAGE_KEY } from '../constants';
+import { type GlobalState, selectReport } from '../store';
+import { getPersistedReport } from '../utils/report-storage';
+import { trackPanelViewed } from '../utils/tracking';
+
+export function useTrackPanelViewed() {
+	const { data: currentUser } = useCurrentUser();
+	const [ isFirstOpenMessageSuppressed, suppressFirstOpenMessage ] = useSuppressedMessage( FIRST_OPEN_MESSAGE_KEY );
+	const report = useSelector( ( state: GlobalState ) => selectReport( state ) );
+	const [ hasPriorReport ] = useState( () => {
+		const documentId = getHostDocumentId() ?? 0;
+
+		return Boolean( report ) || Boolean( documentId && getPersistedReport( documentId ) );
+	} );
+	const hasTracked = useRef( false );
+
+	useEffect( () => {
+		if ( ! currentUser || hasTracked.current ) {
+			return;
+		}
+
+		hasTracked.current = true;
+		trackPanelViewed( { hasPriorReport, isFirstOpen: ! isFirstOpenMessageSuppressed } );
+		suppressFirstOpenMessage();
+	}, [ currentUser, hasPriorReport, isFirstOpenMessageSuppressed, suppressFirstOpenMessage ] );
+}

package/src/types.ts

@@ -43,6 +43,7 @@ export type AuditViolation = {
 	ctaLabel?: string;
 	secondaryCtaLabel?: string;
 	secondaryCtaUrl?: string;
+	appInstalled?: boolean;
 };
 
 export type PageContextResponse = {

package/src/utils/build-run-summary.ts

@@ -0,0 +1,45 @@
+import { type PageAuditReport } from '../types';
+import { isScoredAudit } from './is-scored-audit';
+import { toCheckName, toTrackingSeverity, type TrackingSeverity } from './tracking-names';
+
+type RequiredFix = {
+	check: string;
+	severity: TrackingSeverity;
+};
+
+export type RunSummary = {
+	state: TrackingSeverity | 'success';
+	metadata: {
+		score: number;
+		fix_count: number;
+		error_count: number;
+		warning_count: number;
+		suggestion_count: number;
+		required_fixes: RequiredFix[];
+	};
+};
+
+const SEVERITY_PRIORITY: TrackingSeverity[] = [ 'error', 'warning', 'suggestion' ];
+
+export function buildRunSummary( report: PageAuditReport ): RunSummary {
+	const requiredFixes: RequiredFix[] = report.auditResults
+		.filter( ( { audit, result } ) => result.status === 'fail' && isScoredAudit( audit ) )
+		.map( ( { audit } ) => ( { check: toCheckName( audit.id ), severity: toTrackingSeverity( audit.severity ) } ) );
+
+	const countBySeverity = ( severity: TrackingSeverity ) =>
+		requiredFixes.filter( ( fix ) => fix.severity === severity ).length;
+
+	const highestSeverity = SEVERITY_PRIORITY.find( ( severity ) => countBySeverity( severity ) > 0 );
+
+	return {
+		state: highestSeverity ?? 'success',
+		metadata: {
+			score: report.overall,
+			fix_count: requiredFixes.length,
+			error_count: countBySeverity( 'error' ),
+			warning_count: countBySeverity( 'warning' ),
+			suggestion_count: countBySeverity( 'suggestion' ),
+			required_fixes: requiredFixes,
+		},
+	};
+}

package/src/utils/tracking-names.ts

@@ -0,0 +1,12 @@
+import { AUDIT_ID_PREFIX } from '../constants';
+import { type AuditSeverity } from '../types';
+
+export type TrackingSeverity = 'error' | 'warning' | 'suggestion';
+
+export function toTrackingSeverity( severity: AuditSeverity ): TrackingSeverity {
+	return severity === 'info' ? 'suggestion' : severity;
+}
+
+export function toCheckName( auditId: string ): string {
+	return auditId.replace( AUDIT_ID_PREFIX, '' ).replace( /-/g, '_' );
+}

package/src/utils/tracking.ts

@@ -0,0 +1,130 @@
+import { getMixpanel } from '@elementor/events';
+
+import {
+	FINDING_CLICKED_EVENT,
+	PANEL_CLOSED_EVENT,
+	PANEL_VIEWED_EVENT,
+	RUN_COMPLETED_EVENT,
+	RUN_STARTED_EVENT,
+	TRACKING_LOCATION_L1,
+	TRACKING_TARGET_LOCATION,
+	TRACKING_WINDOW_NAME,
+} from '../constants';
+import { type AuditMeta, type AuditViolation, type PageAuditReport } from '../types';
+import { buildRunSummary } from './build-run-summary';
+import { toCheckName, toTrackingSeverity } from './tracking-names';
+
+export type RunTrigger = 'run_audit' | 'rescan';
+
+export type ViewIssueResult =
+	| 'element_focused'
+	| 'page_settings_opened'
+	| 'site_settings_opened'
+	| 'external_url_opened';
+
+export type FindingLocation = 'overview' | 'issues';
+
+type FindingAction =
+	| { actionType: 'view_issue'; interactionResult: ViewIssueResult }
+	| { actionType: 'fix_with_angie'; interactionResult: 'angie_prompt_sent' }
+	| { actionType: 'fix_with_app'; interactionResult: 'app_opened'; appInstalled?: boolean };
+
+type FindingClick = FindingAction & {
+	audit: AuditMeta;
+	locationL2: FindingLocation;
+};
+
+const dispatch = ( eventName: string, payload: Record< string, unknown > ) => {
+	getMixpanel().dispatchEvent?.( eventName, {
+		window_name: TRACKING_WINDOW_NAME,
+		target_location: TRACKING_TARGET_LOCATION,
+		location_l1: TRACKING_LOCATION_L1,
+		...payload,
+	} );
+};
+
+export const trackPanelViewed = ( {
+	hasPriorReport,
+	isFirstOpen,
+}: {
+	hasPriorReport: boolean;
+	isFirstOpen: boolean;
+} ) => {
+	dispatch( PANEL_VIEWED_EVENT, {
+		interaction_type: 'view',
+		target_type: 'panel',
+		target_name: 'page_audit_panel',
+		interaction_result: 'panel_viewed',
+		metadata: { has_prior_report: hasPriorReport, is_first_open: isFirstOpen },
+	} );
+};
+
+export const trackPanelClosed = () => {
+	dispatch( PANEL_CLOSED_EVENT, {
+		interaction_type: 'click',
+		target_type: 'button',
+		target_name: 'close',
+		interaction_result: 'panel_closed',
+	} );
+};
+
+export const trackRunStarted = ( trigger: RunTrigger ) => {
+	dispatch( RUN_STARTED_EVENT, {
+		interaction_type: 'click',
+		target_type: 'button',
+		target_name: trigger,
+		interaction_result: 'run_initiated',
+	} );
+};
+
+const trackRunOutcome = ( interactionResult: 'run_completed' | 'run_failed', details: Record< string, unknown > ) => {
+	dispatch( RUN_COMPLETED_EVENT, {
+		interaction_type: 'view',
+		target_type: 'report',
+		target_name: 'audit_report',
+		interaction_result: interactionResult,
+		...details,
+	} );
+};
+
+export const trackRunCompleted = ( report: PageAuditReport ) => {
+	const { state, metadata } = buildRunSummary( report );
+
+	trackRunOutcome( 'run_completed', { state, metadata } );
+};
+
+export const trackRunFailed = () => {
+	trackRunOutcome( 'run_failed', {} );
+};
+
+export const trackFixWithApp = ( audit: AuditMeta, violation: AuditViolation, locationL2: FindingLocation ) => {
+	if ( violation.appInstalled === undefined ) {
+		return;
+	}
+
+	trackFindingClicked( {
+		audit,
+		locationL2,
+		actionType: 'fix_with_app',
+		interactionResult: 'app_opened',
+		appInstalled: violation.appInstalled,
+	} );
+};
+
+export const trackFindingClicked = ( click: FindingClick ) => {
+	const { audit, locationL2, actionType, interactionResult } = click;
+
+	dispatch( FINDING_CLICKED_EVENT, {
+		interaction_type: 'click',
+		target_type: 'row',
+		target_name: 'finding_row',
+		action_type: actionType,
+		target_value: toCheckName( audit.id ),
+		interaction_result: interactionResult,
+		state: toTrackingSeverity( audit.severity ),
+		location_l2: locationL2,
+		...( click.actionType === 'fix_with_app' && {
+			app_status: click.appInstalled ? 'installed' : 'not_installed',
+		} ),
+	} );
+};