create a selector to reuse across components

Automattic · Jan 24, 2025 · 548865c · 548865c
1 parent bf6b6e7
commit 548865c
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 12 deletions.
diff --git a/client/landing/stepper/declarative-flow/internals/steps-repository/launchpad/index.tsx b/client/landing/stepper/declarative-flow/internals/steps-repository/launchpad/index.tsx
@@ -1,4 +1,3 @@
-import config from '@automattic/calypso-config';
 import { useLaunchpad } from '@automattic/data-stores';
 import { StepContainer, START_WRITING_FLOW } from '@automattic/onboarding';
 import { useSelect, useDispatch as useWPDispatch } from '@wordpress/data';
@@ -17,6 +16,7 @@ import { urlToSlug } from 'calypso/lib/url';
 import { useSelector, useDispatch } from 'calypso/state';
 import { isUserLoggedIn } from 'calypso/state/current-user/selectors';
 import { successNotice } from 'calypso/state/notices/actions';
+import shouldShowLaunchpadFirst from 'calypso/state/selectors/should-show-launchpad-first';
 import { useQuery } from '../../../../hooks/use-query';
 import StepContent from './step-content';
 import { areLaunchpadTasksCompleted } from './task-helper';
@@ -97,11 +97,16 @@ const Launchpad: Step = ( { navigation, flow }: LaunchpadProps ) => {
 		return;
 	}
 
-	if ( config.isEnabled( 'home/launchpad-first' ) ) {
+	if ( shouldShowLaunchpadFirst( site?.options?.site_creation_flow ) ) {
 		window.location.replace( `/home/${ siteSlug }` );
 		return;
 	}
 
+	// Avoid screen flickering when redirecting to other paths
+	if ( ! site?.options ) {
+		return;
+	}
+
 	return (
 		<>
 			<DocumentHead title={ almostReadyToLaunchText } />

diff --git a/client/my-sites/customer-home/controller.jsx b/client/my-sites/customer-home/controller.jsx
@@ -1,4 +1,3 @@
-import config from '@automattic/calypso-config';
 import page from '@automattic/calypso-router';
 import { fetchLaunchpad } from '@automattic/data-stores';
 import { areLaunchpadTasksCompleted } from 'calypso/landing/stepper/declarative-flow/internals/steps-repository/launchpad/task-helper';
@@ -9,6 +8,7 @@ import { fetchModuleList } from 'calypso/state/jetpack/modules/actions';
 import { fetchSitePlugins } from 'calypso/state/plugins/installed/actions';
 import { getPluginOnSite } from 'calypso/state/plugins/installed/selectors';
 import isJetpackModuleActive from 'calypso/state/selectors/is-jetpack-module-active';
+import { shouldShowLaunchpadFirst } from 'calypso/state/selectors/should-show-launchpad-first';
 import { isSiteOnWooExpressEcommerceTrial } from 'calypso/state/sites/plans/selectors';
 import { canCurrentUserUseCustomerHome, getSiteUrl } from 'calypso/state/sites/selectors';
 import {
@@ -19,13 +19,6 @@ import {
 import { redirectToLaunchpad } from 'calypso/utils';
 import CustomerHome from './main';
 
-const shouldShowLaunchpadFirst = ( site ) => {
-	const wasSiteCreatedOnboardingFlow = site?.options?.site_creation_flow === 'onboarding';
-	const isLaunchpadFirstEnabled = config.isEnabled( 'home/launchpad-first' );
-
-	return wasSiteCreatedOnboardingFlow && isLaunchpadFirstEnabled;
-};
-
 export default async function renderHome( context, next ) {
 	const state = await context.store.getState();
 	const site = getSelectedSite( state );
@@ -36,7 +29,10 @@ export default async function renderHome( context, next ) {
 	}
 
 	context.primary = (
-		<CustomerHome key={ site.ID } showLaunchpadFirst={ shouldShowLaunchpadFirst( site ) } />
+		<CustomerHome
+			key={ site.ID }
+			showLaunchpadFirst={ shouldShowLaunchpadFirst( site?.options?.site_creation_flow ) }
+		/>
 	);
 
 	next();
@@ -86,7 +82,7 @@ export async function maybeRedirect( context, next ) {
 
 	const site = getSelectedSite( state );
 
-	if ( shouldShowLaunchpadFirst( site ) ) {
+	if ( shouldShowLaunchpadFirst( site?.options?.site_creation_flow ) ) {
 		return next();
 	}
 

diff --git a/client/state/selectors/should-show-launchpad-first.js b/client/state/selectors/should-show-launchpad-first.js
@@ -0,0 +1,15 @@
+import config from '@automattic/calypso-config';
+
+/**
+ * Determines if the launchpad should be shown first based on site createion flow
+ * @param {string|undefined} siteCreationFlow Site creation flow
+ * @returns {boolean} Whether launchpad should be shown first
+ */
+export const shouldShowLaunchpadFirst = ( siteCreationFlow ) => {
+	const wasSiteCreatedOnboardingFlow = siteCreationFlow === 'onboarding';
+	const isLaunchpadFirstEnabled = config.isEnabled( 'home/launchpad-first' );
+
+	return wasSiteCreatedOnboardingFlow && isLaunchpadFirstEnabled;
+};
+
+export default shouldShowLaunchpadFirst;