diff --git a/src/components/video-embed/index.tsx b/src/components/video-embed/index.tsx index f2f52cff44..941644b7d2 100644 --- a/src/components/video-embed/index.tsx +++ b/src/components/video-embed/index.tsx @@ -15,6 +15,7 @@ import { useMilestones, } from './helpers' import s from './video-embed.module.css' +import { trackVideoStart } from 'lib/posthog-events' /** * MAX_PLAYBACK_SPEED is based on max speeds for YouTube & Wistia. @@ -142,6 +143,9 @@ function VideoEmbed({ {...reactPlayerProps} config={config} url={url} + onStart={() => { + trackVideoStart(url) + }} onDuration={setDuration} progressInterval={PROGRESS_INTERVAL} onProgress={({ playedSeconds }: { playedSeconds: number }) => { diff --git a/src/layouts/sidebar-sidecar/utils/_local_platform-docs-mdx/index.tsx b/src/layouts/sidebar-sidecar/utils/_local_platform-docs-mdx/index.tsx index 5cf9856c35..368d1a9f43 100644 --- a/src/layouts/sidebar-sidecar/utils/_local_platform-docs-mdx/index.tsx +++ b/src/layouts/sidebar-sidecar/utils/_local_platform-docs-mdx/index.tsx @@ -7,6 +7,7 @@ import React from 'react' import { DocsEnterpriseAlert } from './components/enterprise-alert' import Image from 'components/image' import { ImageProps } from 'components/image/types' +import VideoEmbed from 'components/video-embed' // This function returns a simple object containing the default components // The `additionalComponents` param is purely for convenience. @@ -37,5 +38,6 @@ function _defaultComponents() { return { EnterpriseAlert: DocsEnterpriseAlert, img: makeImageElement({ noBorder: true }), + VideoEmbed, } } diff --git a/src/lib/posthog-events.ts b/src/lib/posthog-events.ts new file mode 100644 index 0000000000..8b9c61bbd5 --- /dev/null +++ b/src/lib/posthog-events.ts @@ -0,0 +1,25 @@ +/** + * Copyright (c) HashiCorp, Inc. + * SPDX-License-Identifier: MPL-2.0 + */ + +/** + * Enables PostHog video start tracking + */ +export function trackVideoStart(url: string): void { + if (!window?.posthog) return + + let video_host = "" + if (url.includes('wistia')) { + video_host = 'wistia' + } else if (url.includes('youtube')) { + video_host = 'youtube' + } + + if (video_host) { + window.posthog.capture('video_start', { + video_host, + url, + }) + } +}