From 211989123b079240e45d584ed8740643bf856f9e Mon Sep 17 00:00:00 2001 From: Jesse Hallam Date: Wed, 6 Jul 2022 10:53:40 -0300 Subject: [PATCH] Feedback from Jose re: telemetry (#1294) --- .../playbook_editor/outline/outline.tsx | 4 ++-- .../overview/overview.tsx | 4 ++-- .../retrospective/retrospective.tsx | 4 ++-- .../metrics/playbook_key_metrics.tsx | 4 ++-- .../backstage/playbooks/playbook_usage.tsx | 4 ++-- webapp/src/components/rhs/rhs_run_details.tsx | 4 ++-- webapp/src/hooks/telemetry.ts | 20 +++++++++++++++---- 7 files changed, 28 insertions(+), 16 deletions(-) diff --git a/webapp/src/components/backstage/playbook_editor/outline/outline.tsx b/webapp/src/components/backstage/playbook_editor/outline/outline.tsx index c93ff342b7..91b7ded3ff 100644 --- a/webapp/src/components/backstage/playbook_editor/outline/outline.tsx +++ b/webapp/src/components/backstage/playbook_editor/outline/outline.tsx @@ -9,7 +9,7 @@ import {useIntl} from 'react-intl'; import {PlaybookWithChecklist} from 'src/types/playbook'; import MarkdownEdit from 'src/components/markdown_edit'; import ChecklistList from 'src/components/checklist/checklist_list'; -import {usePlaybookNavigationTelemetry} from 'src/hooks/telemetry'; +import {usePlaybookViewTelemetry, PlaybookTarget} from 'src/hooks/telemetry'; import {Toggle} from 'src/components/backstage/playbook_edit/automation/toggle'; @@ -33,7 +33,7 @@ interface Props { type StyledAttrs = {className?: string}; const Outline = ({playbook, refetch}: Props) => { - usePlaybookNavigationTelemetry('outline', playbook.id); + usePlaybookViewTelemetry(PlaybookTarget.Outline, playbook.id); const {formatMessage} = useIntl(); const updatePlaybook = useUpdatePlaybook(playbook.id); diff --git a/webapp/src/components/backstage/playbook_runs/playbook_run_backstage/overview/overview.tsx b/webapp/src/components/backstage/playbook_runs/playbook_run_backstage/overview/overview.tsx index 8f0702b1b8..f75afa8be5 100644 --- a/webapp/src/components/backstage/playbook_runs/playbook_run_backstage/overview/overview.tsx +++ b/webapp/src/components/backstage/playbook_runs/playbook_run_backstage/overview/overview.tsx @@ -3,7 +3,7 @@ import React from 'react'; -import {usePlaybookRunNavigationTelemetry} from 'src/hooks/telemetry'; +import {usePlaybookRunViewTelemetry, PlaybookRunTarget} from 'src/hooks/telemetry'; import Description from 'src/components/backstage/playbook_runs/playbook_run_backstage/overview/description'; import Updates from 'src/components/backstage/playbook_runs/playbook_run_backstage/overview/updates'; @@ -15,7 +15,7 @@ import {Container, Left, Right} from 'src/components/backstage/playbook_runs/sha import {PlaybookRun} from 'src/types/playbook_run'; export const Overview = (props: {playbookRun: PlaybookRun}) => { - usePlaybookRunNavigationTelemetry('overview', props.playbookRun.id); + usePlaybookRunViewTelemetry(PlaybookRunTarget.Overview, props.playbookRun.id); return ( diff --git a/webapp/src/components/backstage/playbook_runs/playbook_run_backstage/retrospective/retrospective.tsx b/webapp/src/components/backstage/playbook_runs/playbook_run_backstage/retrospective/retrospective.tsx index 60e5baf5e5..b80832840f 100644 --- a/webapp/src/components/backstage/playbook_runs/playbook_run_backstage/retrospective/retrospective.tsx +++ b/webapp/src/components/backstage/playbook_runs/playbook_run_backstage/retrospective/retrospective.tsx @@ -15,7 +15,7 @@ import {Container, Content, Left, Right, Title} from 'src/components/backstage/p import UpgradeBanner from 'src/components/upgrade_banner'; import {AdminNotificationType} from 'src/constants'; -import {useAllowPlaybookAndRunMetrics, useAllowRetrospectiveAccess, usePlaybookRunNavigationTelemetry} from 'src/hooks'; +import {useAllowPlaybookAndRunMetrics, useAllowRetrospectiveAccess, usePlaybookRunViewTelemetry, PlaybookRunTarget} from 'src/hooks'; import {PlaybookRun, RunMetricData} from 'src/types/playbook_run'; import {Metric} from 'src/types/playbook'; @@ -58,7 +58,7 @@ const PUB_TIME = { }; export const Retrospective = (props: Props) => { - usePlaybookRunNavigationTelemetry('retrospective', props.playbookRun.id); + usePlaybookRunViewTelemetry(PlaybookRunTarget.Retrospective, props.playbookRun.id); const allowRetrospectiveAccess = useAllowRetrospectiveAccess(); const {formatMessage} = useIntl(); diff --git a/webapp/src/components/backstage/playbooks/metrics/playbook_key_metrics.tsx b/webapp/src/components/backstage/playbooks/metrics/playbook_key_metrics.tsx index 5dcd3f527a..e923b75773 100644 --- a/webapp/src/components/backstage/playbooks/metrics/playbook_key_metrics.tsx +++ b/webapp/src/components/backstage/playbooks/metrics/playbook_key_metrics.tsx @@ -13,7 +13,7 @@ import {PlaybookRunStatus} from 'src/types/playbook_run'; import MetricsRunList from 'src/components/backstage/playbooks/metrics/metrics_run_list'; import NoMetricsPlaceholder from 'src/components/backstage/playbooks/metrics/no_metrics_placeholder'; import {Metric} from 'src/types/playbook'; -import {usePlaybookNavigationTelemetry} from 'src/hooks/telemetry'; +import {usePlaybookViewTelemetry, PlaybookTarget} from 'src/hooks/telemetry'; const defaultPlaybookFetchParams = { page: 0, @@ -37,7 +37,7 @@ const PlaybookKeyMetrics = ({ stats, ...attrs }: Props & Attrs) => { - usePlaybookNavigationTelemetry('reports', playbookID); + usePlaybookViewTelemetry(PlaybookTarget.Reports, playbookID); const allowStatsView = useAllowPlaybookAndRunMetrics(); const [playbookRuns, totalCount, fetchParams, setFetchParams] = useRunsList(defaultPlaybookFetchParams); diff --git a/webapp/src/components/backstage/playbooks/playbook_usage.tsx b/webapp/src/components/backstage/playbooks/playbook_usage.tsx index aa62227882..dcedfd4641 100644 --- a/webapp/src/components/backstage/playbooks/playbook_usage.tsx +++ b/webapp/src/components/backstage/playbooks/playbook_usage.tsx @@ -10,7 +10,7 @@ import StatsView from 'src/components/backstage/playbooks/stats_view'; import {useRunsList} from 'src/hooks'; import RunList from '../runs_list/runs_list'; import {PlaybookRunStatus} from 'src/types/playbook_run'; -import {usePlaybookNavigationTelemetry} from 'src/hooks/telemetry'; +import {usePlaybookViewTelemetry, PlaybookTarget} from 'src/hooks/telemetry'; const defaultPlaybookFetchParams = { page: 0, @@ -32,7 +32,7 @@ const PlaybookUsage = ({ stats, ...attrs }: Props & Attrs) => { - usePlaybookNavigationTelemetry('usage', playbookID); + usePlaybookViewTelemetry(PlaybookTarget.Usage, playbookID); const [filterPill, setFilterPill] = useState(null); const [playbookRuns, totalCount, fetchParams, setFetchParams] = useRunsList(defaultPlaybookFetchParams); diff --git a/webapp/src/components/rhs/rhs_run_details.tsx b/webapp/src/components/rhs/rhs_run_details.tsx index 1bd696ee6e..1d95618b15 100644 --- a/webapp/src/components/rhs/rhs_run_details.tsx +++ b/webapp/src/components/rhs/rhs_run_details.tsx @@ -23,14 +23,14 @@ import {FINISHED, RunDetailsTutorialSteps, SKIPPED, TutorialTourCategories} from import {displayRhsRunDetailsTourDialog} from 'src/actions'; import {useTutorialStepper} from '../tutorial/tutorial_tour_tip/manager'; import {browserHistory} from 'src/webapp_globals'; -import {usePlaybookRunNavigationTelemetry} from 'src/hooks/telemetry'; +import {usePlaybookRunViewTelemetry, PlaybookRunTarget} from 'src/hooks/telemetry'; const RHSRunDetails = () => { const dispatch = useDispatch(); const scrollbarsRef = useRef(null); const playbookRun = useSelector(currentPlaybookRun); - usePlaybookRunNavigationTelemetry('channels_rhs_details', playbookRun?.id); + usePlaybookRunViewTelemetry(PlaybookRunTarget.ChannelsRHSDetails, playbookRun?.id); const prevStatus = usePrevious(playbookRun?.current_status); diff --git a/webapp/src/hooks/telemetry.ts b/webapp/src/hooks/telemetry.ts index 6703764504..c6be7d0e6c 100644 --- a/webapp/src/hooks/telemetry.ts +++ b/webapp/src/hooks/telemetry.ts @@ -2,18 +2,30 @@ import {useEffect} from 'react'; import {telemetryEventForPlaybook, telemetryEventForPlaybookRun} from 'src/client'; -export const usePlaybookNavigationTelemetry = (target: string, playbookID?: string) => { +export enum PlaybookTarget { + Usage = 'view_playbook_usage', + Outline = 'view_playbook_outline', + Reports = 'view_playbook_reports' +} + +export enum PlaybookRunTarget { + Overview = 'view_run_overview', + Retrospective = 'view_run_retrospective', + ChannelsRHSDetails = 'view_run_channels_rhs_details', +} + +export const usePlaybookViewTelemetry = (target: PlaybookTarget, playbookID?: string) => { useEffect(() => { if (playbookID) { - telemetryEventForPlaybook(playbookID, `navigate_playbook_${target}`); + telemetryEventForPlaybook(playbookID, target); } }, [playbookID]); }; -export const usePlaybookRunNavigationTelemetry = (target: string, playbookRunID?: string) => { +export const usePlaybookRunViewTelemetry = (target: PlaybookRunTarget, playbookRunID?: string) => { useEffect(() => { if (playbookRunID) { - telemetryEventForPlaybookRun(playbookRunID, `navigate_run_${target}`); + telemetryEventForPlaybookRun(playbookRunID, target); } }, [playbookRunID]); };