From 92c5d6dbbc3018514863c8368dfc9cfbc1884fd3 Mon Sep 17 00:00:00 2001 From: Kyrylo Shmidt Date: Thu, 20 Jul 2023 13:41:56 +0200 Subject: [PATCH] Add tracking events to the Installation Wizard --- .../InstallStep/EngineManager/index.tsx | 49 +++++++++++++------ .../InstallStep/EngineManager/types.ts | 4 +- .../InstallationWizard/InstallStep/index.tsx | 17 ++++++- src/components/InstallationWizard/index.tsx | 9 ++++ src/components/InstallationWizard/tracking.ts | 10 +++- 5 files changed, 69 insertions(+), 20 deletions(-) diff --git a/src/components/InstallationWizard/InstallStep/EngineManager/index.tsx b/src/components/InstallationWizard/InstallStep/EngineManager/index.tsx index fd0856c9f..77c746489 100644 --- a/src/components/InstallationWizard/InstallStep/EngineManager/index.tsx +++ b/src/components/InstallationWizard/InstallStep/EngineManager/index.tsx @@ -75,10 +75,20 @@ export const EngineManager = (props: EngineManagerProps) => { data: AsyncActionResultData, operation: Operation ) => { - setCurrentOperation({ + const operationData = { operation: operation, status: data.result, error: data.error + }; + + setCurrentOperation(operationData); + + window.sendMessageToDigma({ + action: globalActions.SEND_TRACKING_EVENT, + payload: { + eventName: trackingEvents.ENGINE_ACTION_RESULT_MESSAGE_RECEIVED, + data: operationData + } }); }; const handleInstallDigmaResultData = (data: unknown) => { @@ -148,6 +158,12 @@ export const EngineManager = (props: EngineManagerProps) => { useEffect(() => { if (props.autoInstall) { + window.sendMessageToDigma({ + action: globalActions.SEND_TRACKING_EVENT, + payload: { + eventName: trackingEvents.AUTO_INSTALLATION_FLOW_STARTED + } + }); window.sendMessageToDigma({ action: actions.INSTALL_DIGMA_ENGINE }); @@ -161,18 +177,12 @@ export const EngineManager = (props: EngineManagerProps) => { switch (currentOperation.operation) { case Operation.INSTALL: if (props.autoInstall && props.onAutoInstallFinish) { - props.onAutoInstallFinish(); + props.onAutoInstallFinish("success"); } break; case Operation.UNINSTALL: - if (props.autoInstall) { - if (props.onManualInstallSelect) { - props.onManualInstallSelect(); - } - } else { - if (props.onRemoveFinish) { - props.onRemoveFinish(); - } + if (!props.autoInstall && props.onRemoveFinish) { + props.onRemoveFinish(); } break; case Operation.START: @@ -184,11 +194,11 @@ export const EngineManager = (props: EngineManagerProps) => { if (currentOperation.status === "failure") { switch (currentOperation.operation) { case Operation.INSTALL: - case Operation.UNINSTALL: - if (props.autoInstall && props.onManualInstallSelect) { - props.onManualInstallSelect(); + if (props.autoInstall && props.onAutoInstallFinish) { + props.onAutoInstallFinish("failure"); } break; + case Operation.UNINSTALL: case Operation.START: case Operation.STOP: break; @@ -233,6 +243,7 @@ export const EngineManager = (props: EngineManagerProps) => { }; const handleRetryButtonClick = () => { + sendActionButtonTrackingEvent("Retry"); if (failedOperation) { window.sendMessageToDigma({ action: operationsInfo[failedOperation.operation].action @@ -245,16 +256,26 @@ export const EngineManager = (props: EngineManagerProps) => { }; const handleInstallManuallyButtonClick = () => { + sendActionButtonTrackingEvent("Install manually"); props.onManualInstallSelect && props.onManualInstallSelect(); }; const renderOperationButton = (operation: Operation) => { const handleOperationButtonClick = () => { const operationInfo = operationsInfo[operation]; + sendActionButtonTrackingEvent(operationInfo.button.label); + window.sendMessageToDigma({ action: operationInfo.action }); - sendActionButtonTrackingEvent(operationInfo.button.label); + window.sendMessageToDigma({ + action: globalActions.SEND_TRACKING_EVENT, + payload: { + eventName: trackingEvents.ENGINE_ACTION_MESSAGE_SENT, + data: { action: operationInfo.action } + } + }); + setCurrentOperation({ operation, status: "pending" }); }; diff --git a/src/components/InstallationWizard/InstallStep/EngineManager/types.ts b/src/components/InstallationWizard/InstallStep/EngineManager/types.ts index b2fda6be8..f48db6bb5 100644 --- a/src/components/InstallationWizard/InstallStep/EngineManager/types.ts +++ b/src/components/InstallationWizard/InstallStep/EngineManager/types.ts @@ -1,10 +1,10 @@ import { MemoExoticComponent } from "react"; import { IconProps } from "../../../common/icons/types"; -import { AsyncActionStatus } from "../../types"; +import { AsyncActionResult, AsyncActionStatus } from "../../types"; export interface EngineManagerProps { onManualInstallSelect?: () => void; - onAutoInstallFinish?: () => void; + onAutoInstallFinish?: (result: AsyncActionResult) => void; onRemoveFinish?: () => void; onOperationStart?: () => void; onOperationFinish?: () => void; diff --git a/src/components/InstallationWizard/InstallStep/index.tsx b/src/components/InstallationWizard/InstallStep/index.tsx index 1b95454b5..cde5b0442 100644 --- a/src/components/InstallationWizard/InstallStep/index.tsx +++ b/src/components/InstallationWizard/InstallStep/index.tsx @@ -13,6 +13,7 @@ import { CodeSnippet } from "../CodeSnippet"; import { Tabs } from "../Tabs"; import { Link, MainButton, SectionDescription } from "../styles"; import { trackingEvents } from "../tracking"; +import { AsyncActionResult } from "../types"; import { EngineManager } from "./EngineManager"; import * as s from "./styles"; import { InstallStepProps } from "./types"; @@ -97,8 +98,21 @@ export const InstallStep = (props: InstallStepProps) => { props.onSlackLinkClick(); }; - const handleEngineAutoInstallationFinish = () => { + const handleEngineAutoInstallationFinish = (result: AsyncActionResult) => { setIsAutoInstallationFinished(true); + window.sendMessageToDigma({ + action: globalActions.SEND_TRACKING_EVENT, + payload: { + eventName: trackingEvents.AUTO_INSTALLATION_FLOW_FINISHED, + data: { + result + } + } + }); + + if (result === "failure") { + handleEngineManualInstallSelect(); + } }; const handleEngineRemovalFinish = () => { @@ -107,7 +121,6 @@ export const InstallStep = (props: InstallStepProps) => { }; const handleEngineManualInstallSelect = () => { - setIsAutoInstallationFinished(true); setAreTabsVisible(true); setIsAutoInstallTabVisible(false); }; diff --git a/src/components/InstallationWizard/index.tsx b/src/components/InstallationWizard/index.tsx index 953aa4bd8..a25a7ca35 100644 --- a/src/components/InstallationWizard/index.tsx +++ b/src/components/InstallationWizard/index.tsx @@ -265,6 +265,15 @@ export const InstallationWizard = () => { installationType: InstallationType ) => { setInstallationType(installationType); + window.sendMessageToDigma({ + action: globalActions.SEND_TRACKING_EVENT, + payload: { + eventName: trackingEvents.INSTALLATION_TYPE_BUTTON_CLICKED, + data: { + installationType + } + } + }); }; const handleEmailInputChange = (e: ChangeEvent) => { diff --git a/src/components/InstallationWizard/tracking.ts b/src/components/InstallationWizard/tracking.ts index 34b713274..ad9cbbd1f 100644 --- a/src/components/InstallationWizard/tracking.ts +++ b/src/components/InstallationWizard/tracking.ts @@ -12,9 +12,15 @@ export const trackingEvents = addPrefix( OBSERVABILITY_BUTTON_CLICKED: "set observability button clicked", TAB_CLICKED: "tab clicked", NO_DOCKER_SLACK_LINK_CLICKED: "no docker slack link clicked", - ENGINE_ACTION_BUTTON_CLICKED: "engine action button clicked", DIGMA_CLOUD_AVAILABILITY_NOTIFICATION_EMAIL_ADDRESS_CAPTURED: - "digma cloud availability notification email address captured" + "digma cloud availability notification email address captured", + INSTALLATION_TYPE_BUTTON_CLICKED: "installation type button clicked", + AUTO_INSTALLATION_FLOW_STARTED: "auto installation flow started", + AUTO_INSTALLATION_FLOW_FINISHED: "auto installation flow finished", + ENGINE_ACTION_BUTTON_CLICKED: "engine action button clicked", + ENGINE_ACTION_MESSAGE_SENT: "engine action message sent", + ENGINE_ACTION_RESULT_MESSAGE_RECEIVED: + "engine action result message received" }, " " );