diff --git a/src/app/components/PortraitVideoCarousel/PortraitVideoPromo/index.tsx b/src/app/components/PortraitVideoCarousel/PortraitVideoPromo/index.tsx index 4cd56276f2e..7183c73dd0a 100644 --- a/src/app/components/PortraitVideoCarousel/PortraitVideoPromo/index.tsx +++ b/src/app/components/PortraitVideoCarousel/PortraitVideoPromo/index.tsx @@ -110,7 +110,7 @@ export default ({ // EXPERIMENT: Portrait Video Homepage Play Duration Sizing ...(playDurationVariation && { sendOptimizelyEvents: true, - experimentName: 'newswb_ws_play_and_duration_size_increase', + experimentName: 'newswb_ws_play_and_duration_size_increase_2', experimentVariant: playDurationVariation, }), viewThreshold: 1, diff --git a/src/app/components/PortraitVideoCarousel/index.tsx b/src/app/components/PortraitVideoCarousel/index.tsx index 458198a46b6..75b1a5c18fa 100644 --- a/src/app/components/PortraitVideoCarousel/index.tsx +++ b/src/app/components/PortraitVideoCarousel/index.tsx @@ -3,6 +3,9 @@ import { createPortal } from 'react-dom'; import { RequestContext } from '#app/contexts/RequestContext'; import useViewTracker from '#app/hooks/useViewTracker'; import { EventTrackingData } from '#app/lib/analyticsUtils/types'; +import useOptimizelyVariation, { + ExperimentType, +} from '#app/hooks/useOptimizelyVariation'; import styles from './index.styles'; import PortraitVideoModal from '../PortraitVideoModal'; import { BumpLoader } from '../MediaLoader'; @@ -33,12 +36,25 @@ const PortraitVideoCarousel = ({ const { isLite, nonce } = use(RequestContext); + // EXPERIMENT: Homepage Portrait Video 2 + const playDurationExperimentName = 'newswb_ws_homepage_portrait_video'; + const playDurationVariation = + useOptimizelyVariation({ + experimentName: playDurationExperimentName, + experimentType: ExperimentType.CLIENT_SIDE, + }) ?? undefined; + const eventTrackingDataExtended = { ...eventTrackingData, groupTracker: { ...eventTrackingData?.groupTracker, itemCount: blocks.length, }, + ...(playDurationVariation && { + sendOptimizelyEvents: true, + experimentName: playDurationExperimentName, + experimentVariation: playDurationVariation, + }), }; const viewTracker = useViewTracker(eventTrackingDataExtended); @@ -95,6 +111,7 @@ const PortraitVideoCarousel = ({ blockPosition={index} eventTrackingData={eventTrackingDataExtended} timeOfDayVariant={timeOfDayVariant} + playDurationVariation={playDurationVariation} /> ))}