diff --git a/client/landing/stepper/declarative-flow/hosted-site-migration-flow.ts b/client/landing/stepper/declarative-flow/hosted-site-migration-flow.ts index ecdd3c96ed0681..627f37cd90d719 100644 --- a/client/landing/stepper/declarative-flow/hosted-site-migration-flow.ts +++ b/client/landing/stepper/declarative-flow/hosted-site-migration-flow.ts @@ -1,4 +1,5 @@ import { HOSTED_SITE_MIGRATION_FLOW } from '@automattic/onboarding'; +import { useSearchParams } from 'react-router-dom'; import { type Flow } from './internals/types'; import siteMigration from './site-migration-flow'; @@ -6,6 +7,16 @@ const hostedSiteMigrationFlow: Flow = { ...siteMigration, variantSlug: HOSTED_SITE_MIGRATION_FLOW, isSignupFlow: true, + useLoginParams() { + const [ searchParams ] = useSearchParams(); + const backTo = searchParams.get( 'back_to' ); + + return { + extraQueryParams: { + ...( backTo ? { back_to: backTo } : {} ), + }, + }; + }, }; export default hostedSiteMigrationFlow; diff --git a/client/landing/stepper/declarative-flow/onboarding.ts b/client/landing/stepper/declarative-flow/onboarding.ts index 285082ea5b44e7..48dc78a1e4d040 100644 --- a/client/landing/stepper/declarative-flow/onboarding.ts +++ b/client/landing/stepper/declarative-flow/onboarding.ts @@ -122,6 +122,11 @@ const onboarding: Flow = { const submit = async ( providedDependencies: ProvidedDependencies = {} ) => { switch ( currentStepSlug ) { case 'goals': { + const goalsUrl = + locale && locale !== 'en' + ? `/setup/onboarding/goals/${ locale }` + : '/setup/onboarding/goals'; + const { intent } = providedDependencies; switch ( intent ) { @@ -130,7 +135,11 @@ const onboarding: Flow = { locale && locale !== 'en' ? `/setup/hosted-site-migration/${ locale }` : '/setup/hosted-site-migration'; - return window.location.assign( migrationFlowLink ); + return window.location.assign( + addQueryArgs( migrationFlowLink, { + back_to: goalsUrl, + } ) + ); } case SiteIntent.DIFM: { @@ -139,7 +148,11 @@ const onboarding: Flow = { ? `/start/do-it-for-me/${ locale }` : '/start/do-it-for-me'; - return window.location.assign( difmFlowLink ); + return window.location.assign( + addQueryArgs( difmFlowLink, { + back_to: goalsUrl, + } ) + ); } default: { diff --git a/client/landing/stepper/declarative-flow/test/onboarding-flow.tsx b/client/landing/stepper/declarative-flow/test/onboarding-flow.tsx index b1dd5806de223d..cd0dd41643cd73 100644 --- a/client/landing/stepper/declarative-flow/test/onboarding-flow.tsx +++ b/client/landing/stepper/declarative-flow/test/onboarding-flow.tsx @@ -49,7 +49,9 @@ describe( 'Onboarding Flow', () => { }, } ); - expect( window.location.assign ).toHaveBeenCalledWith( '/setup/hosted-site-migration' ); + expect( window.location.assign ).toHaveBeenCalledWith( + '/setup/hosted-site-migration?back_to=%2Fsetup%2Fonboarding%2Fgoals' + ); } ); it( 'should redirect to DIFM flow when intent is DIFM', async () => { @@ -62,7 +64,9 @@ describe( 'Onboarding Flow', () => { }, } ); - expect( window.location.assign ).toHaveBeenCalledWith( '/start/do-it-for-me' ); + expect( window.location.assign ).toHaveBeenCalledWith( + '/start/do-it-for-me?back_to=%2Fsetup%2Fonboarding%2Fgoals' + ); } ); it( 'should navigate to designSetup step for other intents', async () => { diff --git a/client/signup/step-wrapper/index.jsx b/client/signup/step-wrapper/index.jsx index 8dff7913ac5ca4..26e491b6c17cf9 100644 --- a/client/signup/step-wrapper/index.jsx +++ b/client/signup/step-wrapper/index.jsx @@ -9,6 +9,7 @@ import { usePresalesChat } from 'calypso/lib/presales-chat'; import flows from 'calypso/signup/config/flows'; import NavigationLink from 'calypso/signup/navigation-link'; import { isUserLoggedIn } from 'calypso/state/current-user/selectors'; +import getCurrentQueryArguments from 'calypso/state/selectors/get-current-query-arguments'; import { isReskinnedFlow } from '../is-flow'; import './style.scss'; @@ -67,7 +68,7 @@ class StepWrapper extends Component { backUrl={ this.props.backUrl } rel={ this.props.isExternalBackUrl ? 'external' : '' } labelText={ this.props.backLabelText } - allowBackFirstStep={ this.props.allowBackFirstStep } + allowBackFirstStep={ this.props.allowBackFirstStep || !! this.props.backUrl } backIcon={ isReskinnedFlow( this.props.flowName ) ? 'chevron-left' : undefined } queryParams={ this.props.queryParams } /> @@ -265,8 +266,14 @@ class StepWrapper extends Component { } } -export default connect( ( state ) => { +export default connect( ( state, ownProps ) => { + const backToParam = getCurrentQueryArguments( state )?.back_to?.toString(); + const backTo = backToParam?.startsWith( '/' ) ? backToParam : undefined; + + const backUrl = ownProps.backUrl ?? backTo; + return { + backUrl, userLoggedIn: isUserLoggedIn( state ), }; } )( localize( StepWrapper ) ); diff --git a/client/signup/step-wrapper/style.scss b/client/signup/step-wrapper/style.scss index 497e55db9200b4..b4c9e34319fe50 100644 --- a/client/signup/step-wrapper/style.scss +++ b/client/signup/step-wrapper/style.scss @@ -57,7 +57,7 @@ @mixin unstick { position: absolute; top: 9px; - left: 11px; + left: 56px; right: 16px; padding: 0; border: none; diff --git a/client/signup/steps/user/index.jsx b/client/signup/steps/user/index.jsx index fc73edf0ceed67..554a53218e3e2b 100644 --- a/client/signup/steps/user/index.jsx +++ b/client/signup/steps/user/index.jsx @@ -773,6 +773,7 @@ export class UserStep extends Component { const ConnectedUser = connect( ( state ) => { const oauth2Client = getCurrentOAuth2Client( state ); + return { oauth2Client: oauth2Client, suggestedUsername: getSuggestedUsername( state ),