Rename designSetup step to design-setup

client/blocks/importer/blogger/index.tsx

@@ -87,7 +87,7 @@ export const BloggerImporter: React.FunctionComponent< ImporterBaseProps > = ( p
 	function onSiteViewClick() {
 		if ( isEnabled( 'onboarding/import-redirect-to-themes' ) ) {
 			recordTracksEvent( 'calypso_site_importer_pick_a_design' );
-			stepNavigator?.navigate?.( 'designSetup' );
+			stepNavigator?.navigate?.( 'design-setup' );
 		} else {
 			recordTracksEvent( 'calypso_site_importer_view_site' );
 			stepNavigator?.goToSiteViewPage?.();

client/blocks/importer/medium/index.tsx

@@ -87,7 +87,7 @@ export const MediumImporter: React.FunctionComponent< ImporterBaseProps > = ( pr
 	function onSiteViewClick() {
 		if ( isEnabled( 'onboarding/import-redirect-to-themes' ) ) {
 			recordTracksEvent( 'calypso_site_importer_pick_a_design' );
-			stepNavigator?.navigate?.( 'designSetup' );
+			stepNavigator?.navigate?.( 'design-setup' );
 		} else {
 			recordTracksEvent( 'calypso_site_importer_view_site' );
 			stepNavigator?.goToSiteViewPage?.();

client/blocks/importer/squarespace/index.tsx

@@ -87,7 +87,7 @@ export const SquarespaceImporter: React.FunctionComponent< ImporterBaseProps > =
 	function onSiteViewClick() {
 		if ( isEnabled( 'onboarding/import-redirect-to-themes' ) ) {
 			recordTracksEvent( 'calypso_site_importer_pick_a_design' );
-			stepNavigator?.navigate?.( 'designSetup' );
+			stepNavigator?.navigate?.( 'design-setup' );
 		} else {
 			recordTracksEvent( 'calypso_site_importer_view_site' );
 			stepNavigator?.goToSiteViewPage?.();

client/blocks/importer/wix/index.tsx

@@ -121,7 +121,7 @@ export const WixImporter: React.FunctionComponent< Props > = ( props ) => {
 	function onSiteViewClick() {
 		if ( isEnabled( 'onboarding/import-redirect-to-themes' ) ) {
 			recordTracksEvent( 'calypso_site_importer_pick_a_design' );
-			stepNavigator?.navigate?.( 'designSetup' );
+			stepNavigator?.navigate?.( 'design-setup' );
 		} else {
 			recordTracksEvent( 'calypso_site_importer_view_site' );
 			stepNavigator?.goToSiteViewPage?.();

client/blocks/importer/wordpress/import-content-only/index.tsx

@@ -113,7 +113,7 @@ const ImportContentOnly: React.FunctionComponent< Props > = ( props ) => {
 			job?.importerFileType !== 'playground' &&
 			isEnabled( 'onboarding/import-redirect-to-themes' )
 		) {
-			stepNavigator?.navigate?.( 'designSetup' );
+			stepNavigator?.navigate?.( 'design-setup' );
 		} else {
 			stepNavigator?.goToSiteViewPage?.();
 		}

client/landing/stepper/declarative-flow/design-first.ts

@@ -124,7 +124,7 @@ const designFirst: Flow = {
 						] );
 
 						return window.location.assign(
-							addQueryArgs( `/setup/update-design/designSetup`, {
+							addQueryArgs( `/setup/update-design/design-setup`, {
 								siteSlug: providedDependencies?.siteSlug,
 								flowToReturnTo: DESIGN_FIRST_FLOW,
 								theme: getQueryArg( window.location.href, 'theme' ),
@@ -163,7 +163,7 @@ const designFirst: Flow = {
 						}
 
 						return window.location.assign(
-							addQueryArgs( `/setup/update-design/designSetup`, {
+							addQueryArgs( `/setup/update-design/design-setup`, {
 								siteSlug: siteSlug,
 								flowToReturnTo: flowName,
 								theme: getQueryArg( window.location.href, 'theme' ),

client/landing/stepper/declarative-flow/helpers/get-step-old-slug.ts

@@ -4,6 +4,7 @@
 export const getStepOldSlug = ( stepSlug: string ): string | undefined => {
 	const stepSlugMap: Record< string, string > = {
 		'create-site': 'site-creation-step',
+		'design-setup': 'designSetup',
 	};
 
 	return stepSlugMap[ stepSlug ];

client/landing/stepper/declarative-flow/import-flow.ts

@@ -169,7 +169,7 @@ const importFlow: Flow = {
 					}
 				}
 
-				case 'designSetup': {
+				case 'design-setup': {
 					return navigate( 'processing' );
 				}
 
@@ -305,7 +305,7 @@ const importFlow: Flow = {
 				case 'importReadyNot':
 				case 'importReadyWpcom':
 				case 'importReadyPreview':
-				case 'designSetup':
+				case 'design-setup':
 					return navigate( `import?siteSlug=${ siteSlugParam }` );
 
 				case 'verifyEmail':

client/landing/stepper/declarative-flow/internals/steps-repository/blogger-starting-point/starting-points.tsx

@@ -26,7 +26,7 @@ const useStartingPoints = () => {
 			title: translate( 'Choose a design' ),
 			description: <p>{ translate( 'Make your blog feel like home' ) }</p>,
 			icon: design,
-			value: 'designSetup',
+			value: 'design-setup',
 			actionText: translate( 'View designs' ),
 		},
 	];

client/landing/stepper/declarative-flow/internals/steps-repository/design-choices/index.tsx

@@ -138,7 +138,7 @@ const DesignChoicesStep: Step = ( { navigation, flow, stepName } ) => {
 									title={ translate( 'Choose a theme' ) }
 									description={ translate( 'Choose one of our professionally designed themes.' ) }
 									imageSrc={ themesIllustrationImage }
-									destination="designSetup"
+									destination="design-setup"
 									onSelect={ handleSubmit }
 								/>
 							) : (
@@ -148,7 +148,7 @@ const DesignChoicesStep: Step = ( { navigation, flow, stepName } ) => {
 										'Choose a professionally designed theme and make it yours.'
 									) }
 									fgImageSrc={ themeChoiceFg }
-									destination="designSetup"
+									destination="design-setup"
 									onSelect={ handleSubmit }
 								/>
 							) }

client/landing/stepper/declarative-flow/internals/steps-repository/design-setup/test/unified-design-picker.tsx

@@ -101,7 +101,7 @@ const renderComponent = ( component, initialState = {} ) => {
 		...initialState,
 	} );
 
-	const initialEntries = [ `/setup/site-setup/designSetup?siteSlug=test.wordpress.com` ];
+	const initialEntries = [ `/setup/site-setup/design-setup?siteSlug=test.wordpress.com` ];
 
 	return render(
 		<Provider store={ store }>

client/landing/stepper/declarative-flow/internals/steps-repository/import-light/index.tsx

@@ -112,7 +112,7 @@ const ImportLight: Step = function ImportStep( props ) {
 				return (
 					<Summary
 						colorsNum={ colors.length }
-						onContinueClick={ () => navigation.goToStep?.( 'designSetup' ) }
+						onContinueClick={ () => navigation.goToStep?.( 'design-setup' ) }
 					/>
 				);
 

client/landing/stepper/declarative-flow/internals/steps.tsx

@@ -29,7 +29,7 @@ export const STEPS = {
 	},
 
 	DESIGN_SETUP: {
-		slug: 'designSetup',
+		slug: 'design-setup',
 		asyncComponent: () => import( './steps-repository/design-setup' ),
 	},
 

client/landing/stepper/declarative-flow/onboarding.ts

@@ -222,12 +222,12 @@ const onboarding: Flow = {
 							if ( isDesignChoicesStepEnabled ) {
 								return navigate( 'design-choices' );
 							}
-							return navigate( 'designSetup' );
+							return navigate( 'design-setup' );
 						}
 					}
 				}
 
-				case 'designSetup': {
+				case 'design-setup': {
 					return navigate( 'domains' );
 				}
 
@@ -424,9 +424,9 @@ const onboarding: Flow = {
 						if ( isBigSkyBeforePlansExperiment && createWithBigSky ) {
 							return navigate( 'design-choices' );
 						}
-						return navigate( 'designSetup' );
+						return navigate( 'design-setup' );
 					}
-				case 'designSetup':
+				case 'design-setup':
 					if ( isDesignChoicesStepEnabled ) {
 						return navigate( 'design-choices' );
 					}

client/landing/stepper/declarative-flow/site-setup-flow.ts

@@ -260,12 +260,12 @@ const siteSetupFlow: FlowV1 = {
 						 *
 						 * Instead of having the user manually choose between "Start simple" and "More power", we let them select a theme and use the theme choice to determine which path to take.
 						 */
-						return navigate( 'designSetup' );
+						return navigate( 'design-setup' );
 					}
 					return navigate( 'bloggerStartingPoint' );
 				}
 
-				case 'designSetup': {
+				case 'design-setup': {
 					return navigate( 'processing' );
 				}
 
@@ -344,7 +344,7 @@ const siteSetupFlow: FlowV1 = {
 							if ( isDesignChoicesStepEnabled ) {
 								return navigate( 'design-choices' );
 							}
-							return navigate( 'designSetup' );
+							return navigate( 'design-setup' );
 						}
 					}
 				}
@@ -368,7 +368,7 @@ const siteSetupFlow: FlowV1 = {
 							return exitFlow( `https://wordpress.com/home/${ siteId ?? siteSlug }` );
 						}
 						case 'build': {
-							return navigate( 'designSetup' );
+							return navigate( 'design-setup' );
 						}
 						case 'sell': {
 							return navigate( 'options' );
@@ -497,7 +497,7 @@ const siteSetupFlow: FlowV1 = {
 				case 'courses':
 					return navigate( 'bloggerStartingPoint' );
 
-				case 'designSetup':
+				case 'design-setup':
 					if ( intent === SiteIntent.DIFM ) {
 						return navigate( 'difmStartingPoint' );
 					}
@@ -580,7 +580,7 @@ const siteSetupFlow: FlowV1 = {
 			switch ( currentStep ) {
 				case 'options':
 					if ( intent === 'sell' ) {
-						return navigate( 'designSetup' );
+						return navigate( 'design-setup' );
 					}
 					return navigate( 'bloggerStartingPoint' );
 
@@ -591,7 +591,7 @@ const siteSetupFlow: FlowV1 = {
 					return navigate( 'importList' );
 
 				case 'difmStartingPoint':
-					return navigate( 'designSetup' );
+					return navigate( 'design-setup' );
 
 				default:
 					return navigate( 'intent' );

client/landing/stepper/declarative-flow/test/onboarding-flow.tsx

@@ -78,7 +78,7 @@ describe( 'Onboarding Flow', () => {
 			expect( getFlowLocation().path ).toBe( '/difmStartingPoint' );
 		} );
 
-		it( 'should navigate to designSetup step for other intents', async () => {
+		it( 'should navigate to design-setup step for other intents', async () => {
 			const { runUseStepNavigationSubmit } = renderFlow( onboarding );
 
 			runUseStepNavigationSubmit( {
@@ -88,7 +88,7 @@ describe( 'Onboarding Flow', () => {
 				},
 			} );
 
-			expect( getFlowLocation().path ).toBe( '/designSetup' );
+			expect( getFlowLocation().path ).toBe( '/design-setup' );
 		} );
 	} );
 } );

client/landing/stepper/declarative-flow/update-design.ts

@@ -79,7 +79,7 @@ const updateDesign: Flow = {
 						} )
 					);
 
-				case 'designSetup':
+				case 'design-setup':
 					if ( providedDependencies?.goToCheckout ) {
 						const destination = `/setup/${ flowToReturnTo }/launchpad?siteSlug=${ providedDependencies.siteSlug }`;
 						persistSignupDestination( destination );

client/my-sites/customer-home/cards/launchpad/test/index.tsx

@@ -83,7 +83,7 @@ const DEFAULT_TAKS_RESPONSE = {
 			subtitle: '',
 			badge_text: '',
 			isLaunchTask: false,
-			calypso_path: '/setup/update-design/designSetup?siteSlug=gabrielcaires0.wordpress.com',
+			calypso_path: '/setup/update-design/design-setup?siteSlug=gabrielcaires0.wordpress.com',
 		},
 	],
 	is_enabled: false,

client/my-sites/themes/theme-options.js

@@ -191,7 +191,7 @@ function getAllThemeOptions( { translate, isFSEActive, isGlobalStylesOnPersonal
 			const slug = getSiteSlug( state, siteId );
 
 			const redirectTo = encodeURIComponent(
-				addQueryArgs( `${ origin }/setup/site-setup/designSetup`, {
+				addQueryArgs( `${ origin }/setup/site-setup/design-setup`, {
 					siteSlug: slug,
 					theme: themeId,
 					style_variation: options?.styleVariationSlug,

client/signup/config/flows.js

@@ -145,7 +145,7 @@ function getWithThemeDestination( {
 		! cartItems &&
 		[ DOT_ORG_THEME, PREMIUM_THEME, MARKETPLACE_THEME, BUNDLED_THEME ].includes( themeType )
 	) {
-		return `/setup/site-setup/designSetup?siteSlug=${ siteSlug }`;
+		return `/setup/site-setup/design-setup?siteSlug=${ siteSlug }`;
 	}
 
 	if ( DOT_ORG_THEME === themeType ) {
@@ -158,7 +158,7 @@ function getWithThemeDestination( {
 		return `/marketplace/thank-you/${ siteSlug }?onboarding=&themes=${ themeParameter }${ style }`;
 	}
 
-	return `/setup/site-setup/designSetup?siteSlug=${ siteSlug }&theme=${ themeParameter }${ style }`;
+	return `/setup/site-setup/design-setup?siteSlug=${ siteSlug }&theme=${ themeParameter }${ style }`;
 }
 
 function getWithPluginDestination( { siteSlug, pluginParameter, pluginBillingPeriod } ) {

packages/calypso-e2e/src/lib/flows/start-site-flow.ts

@@ -9,7 +9,7 @@ export type StepName =
 	| 'goals'
 	| 'vertical'
 	| 'intent'
-	| 'designSetup'
+	| 'design-setup'
 	| 'options'
 	| 'designChoices';
 type WriteActions = 'Start writing' | 'Start learning' | 'View designs';
@@ -79,7 +79,7 @@ export class StartSiteFlow {
 			return 'intent';
 		}
 		if ( ( await this.page.locator( selectors.themePickerContainer ).count() ) > 0 ) {
-			return 'designSetup';
+			return 'design-setup';
 		}
 		if ( ( await this.page.locator( selectors.optionsStepContainer ).count() ) > 0 ) {
 			return 'options';
@@ -165,7 +165,7 @@ export class StartSiteFlow {
 			await this.page.waitForURL( /setup\/site-setup\/courses/ );
 		}
 		if ( action === 'View designs' ) {
-			await this.page.waitForURL( /setup\/site-setup\/designSetup/ );
+			await this.page.waitForURL( /setup\/site-setup\/design-setup/ );
 		}
 	}
 

packages/launchpad/src/msw/setup-free.ts

@@ -36,7 +36,7 @@ export default {
 			subtitle: '',
 			badge_text: '',
 			isLaunchTask: false,
-			calypso_path: '/setup/update-design/designSetup?siteSlug=site62798.wordpress.com',
+			calypso_path: '/setup/update-design/design-setup?siteSlug=site62798.wordpress.com',
 		},
 		{
 			id: 'domain_upsell',