Skip to content

Commit

Permalink
Chore: post-ab test cleanup
Browse files Browse the repository at this point in the history
  • Loading branch information
IanRamosC committed Oct 25, 2024
1 parent c2b7dc0 commit 19f572d
Show file tree
Hide file tree
Showing 3 changed files with 19 additions and 127 deletions.
Original file line number Diff line number Diff line change
@@ -1,30 +1,18 @@
import { Container, Col, Text } from '@automattic/jetpack-components';
import { Flex, FlexItem, DropdownMenu, Button } from '@wordpress/components';
import { createInterpolateElement } from '@wordpress/element';
import { Flex, FlexItem, DropdownMenu } from '@wordpress/components';
import { __, _n } from '@wordpress/i18n';
import { moreHorizontalMobile } from '@wordpress/icons';
import { useEffect, useCallback } from 'react';
import { useEffect } from 'react';
import useEvaluationRecommendations from '../../data/evaluation-recommendations/use-evaluation-recommendations';
import useAnalytics from '../../hooks/use-analytics';
import getPurchasePlanUrl from '../../utils/get-purchase-plan-url';
import { JetpackModuleToProductCard } from '../product-cards-section/all';
import styles from './style.module.scss';
import type { WelcomeFlowExperiment } from '../welcome-flow';
import type { FC } from 'react';

interface Props {
welcomeFlowExperimentVariation: WelcomeFlowExperiment[ 'variation' ];
}

const EvaluationRecommendations: FC< Props > = ( { welcomeFlowExperimentVariation } ) => {
const EvaluationRecommendations: FC = () => {
const { recordEvent } = useAnalytics();
const { recommendedModules, isFirstRun, redoEvaluation, removeEvaluationResult } =
const { recommendedModules, redoEvaluation, removeEvaluationResult } =
useEvaluationRecommendations();
const isTreatmentVariation = welcomeFlowExperimentVariation === 'treatment';

const handleExploreAllPlansLinkClick = useCallback( () => {
recordEvent( 'jetpack_myjetpack_evaluation_recommendations_explore_all_plans_click' );
}, [ recordEvent ] );

// We're defining each of these translations in separate variables here, otherwise optimizations in
// the build step end up breaking the translations and causing error.
Expand All @@ -34,19 +22,8 @@ const EvaluationRecommendations: FC< Props > = ( { welcomeFlowExperimentVariatio
recommendedModules.length,
'jetpack-my-jetpack'
);
const recommendationsHeadlineTreatment = __( 'Recommended for your site', 'jetpack-my-jetpack' );
const menuRedoTitle = __( 'Redo', 'jetpack-my-jetpack' );
const menuRedoTitleTreatment = __( 'Customize recommendations', 'jetpack-my-jetpack' );
const menuDismissTitle = __( 'Dismiss', 'jetpack-my-jetpack' );
const menuDismissTitleTreatment = __( 'Close', 'jetpack-my-jetpack' );
const recommendationsRedoLink = __(
'Start over? <link>Analyze again for fresh recommendations</link>!',
'jetpack-my-jetpack'
);
const recommendationsRedoLinkTreatment = __(
'Find your perfect match by <link>letting us know what you’re looking for</link>!',
'jetpack-my-jetpack'
);

useEffect( () => {
recordEvent( 'jetpack_myjetpack_evaluation_recommendations_view', {
Expand All @@ -60,18 +37,14 @@ const EvaluationRecommendations: FC< Props > = ( { welcomeFlowExperimentVariatio
<Flex>
<FlexItem>
<Text variant="headline-small" className={ styles.title }>
{ isTreatmentVariation && isFirstRun
? recommendationsHeadlineTreatment
: recommendationsHeadline }
{ recommendationsHeadline }
</Text>
<Text>
{ __(
'Here are the tools that we think will help you reach your website goals:',
'jetpack-my-jetpack'
) }
</Text>
{ ! isTreatmentVariation && (
<Text>
{ __(
'Here are the tools that we think will help you reach your website goals:',
'jetpack-my-jetpack'
) }
</Text>
) }
</FlexItem>
<FlexItem>
<DropdownMenu
Expand All @@ -81,15 +54,11 @@ const EvaluationRecommendations: FC< Props > = ( { welcomeFlowExperimentVariatio
label={ __( 'Recommendations menu', 'jetpack-my-jetpack' ) }
controls={ [
{
title:
isTreatmentVariation && isFirstRun ? menuRedoTitleTreatment : menuRedoTitle,
title: menuRedoTitle,
onClick: redoEvaluation,
},
{
title:
isTreatmentVariation && isFirstRun
? menuDismissTitleTreatment
: menuDismissTitle,
title: menuDismissTitle,
onClick: removeEvaluationResult,
},
] }
Expand Down Expand Up @@ -117,40 +86,6 @@ const EvaluationRecommendations: FC< Props > = ( { welcomeFlowExperimentVariatio
} ) }
</Container>
</Col>
{ isTreatmentVariation && (
<Col>
<Flex>
<FlexItem>
<Text variant="body">
{ createInterpolateElement(
isFirstRun ? recommendationsRedoLinkTreatment : recommendationsRedoLink,
{
link: (
<Button
variant="link"
className={ styles[ 'evaluation-footer-link' ] }
onClick={ redoEvaluation }
/>
),
}
) }
</Text>
</FlexItem>
<FlexItem>
<Text variant="body">
<Button
variant="link"
className={ styles[ 'evaluation-footer-link' ] }
href={ getPurchasePlanUrl() }
onClick={ handleExploreAllPlansLinkClick }
>
{ __( 'Explore all Jetpack plans', 'jetpack-my-jetpack' ) }
</Button>
</Text>
</FlexItem>
</Flex>
</Col>
) }
</Container>
);
};
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -172,11 +172,7 @@ export default function MyJetpackScreen() {
</Container>
)
) }
{ ! isWelcomeBannerVisible && isSectionVisible && (
<EvaluationRecommendations
welcomeFlowExperimentVariation={ welcomeFlowExperiment.variation }
/>
) }
{ ! isWelcomeBannerVisible && isSectionVisible && <EvaluationRecommendations /> }

<ProductCardsSection />

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ const WelcomeFlow: FC< Props > = ( {
} ) => {
const { recordEvent } = useAnalytics();
const { dismissWelcomeBanner } = useWelcomeBanner();
const { recommendedModules, isFirstRun, submitEvaluation, saveEvaluationResult } =
const { recommendedModules, submitEvaluation, saveEvaluationResult } =
useEvaluationRecommendations();
const {
siteIsRegistered,
Expand All @@ -47,35 +47,24 @@ const WelcomeFlow: FC< Props > = ( {
const [ prevStep, setPrevStep ] = useState( '' );

const currentStep = useMemo( () => {
if ( ! siteIsRegistered || welcomeFlowExperiment.isLoading ) {
if ( ! siteIsRegistered ) {
return 'connection';
} else if ( ! isProcessingEvaluation ) {
if ( ! recommendedModules && ! isJetpackUserNew() ) {
// If user is not new but doesn't have recommendations, we skip evaluation
// If user has recommendations, it means they redo the evaluation
return null;
}
// For the "treatment" experiment we immediately jump to the 'evaluation-processing' step if
// there are no `recommendedModules` loaded yet.
if (
'treatment' === welcomeFlowExperiment.variation &&
! recommendedModules &&
isJetpackUserNew()
) {

if ( ! recommendedModules && isJetpackUserNew() ) {
return 'evaluation-processing';
}
// Otherwise, it means user is either new or just repeats the recommendation
return 'evaluation';
}

return 'evaluation-processing';
}, [
isProcessingEvaluation,
recommendedModules,
siteIsRegistered,
welcomeFlowExperiment.isLoading,
welcomeFlowExperiment.variation,
] );
}, [ isProcessingEvaluation, recommendedModules, siteIsRegistered ] );

useEffect( () => {
if ( prevStep !== currentStep ) {
Expand Down Expand Up @@ -117,34 +106,6 @@ const WelcomeFlow: FC< Props > = ( {
[ dismissWelcomeBanner, recordEvent, saveEvaluationResult, submitEvaluation ]
);

useEffect( () => {
// For the "treatment" experiment, when there are no `recommendedModules` loaded yet,
// we immediately submit some default evaluation data (when we change from connection
// step to evaluation-processing step).
if (
'treatment' === welcomeFlowExperiment.variation &&
! recommendedModules &&
isFirstRun &&
prevStep === 'connection' &&
currentStep === 'evaluation-processing'
) {
handleEvaluation( {
protect: true,
performance: true,
audience: true,
content: true,
unsure: false,
} );
}
}, [
currentStep,
prevStep,
recommendedModules,
welcomeFlowExperiment.variation,
handleEvaluation,
isFirstRun,
] );

useEffect( () => {
if ( ! currentStep ) {
dismissWelcomeBanner();
Expand Down

0 comments on commit 19f572d

Please sign in to comment.