From 935ae6ddfe276a5e5de54c8100b95c6c2716de3f Mon Sep 17 00:00:00 2001 From: Griffith Chen Date: Mon, 9 Dec 2024 10:26:24 +0800 Subject: [PATCH] Sunset Site Assembler: Skip Site Assembler in the assembler-first flow (#97105) --- .../declarative-flow/assembler-first-flow.ts | 78 ++++++++++--------- 1 file changed, 40 insertions(+), 38 deletions(-) diff --git a/client/landing/stepper/declarative-flow/assembler-first-flow.ts b/client/landing/stepper/declarative-flow/assembler-first-flow.ts index a98122cf5deef..b09bae2910bd0 100644 --- a/client/landing/stepper/declarative-flow/assembler-first-flow.ts +++ b/client/landing/stepper/declarative-flow/assembler-first-flow.ts @@ -1,12 +1,14 @@ import { Onboard, updateLaunchpadSettings } from '@automattic/data-stores'; -import { getAssemblerDesign, isAssemblerSupported } from '@automattic/design-picker'; +import { getAssemblerDesign } from '@automattic/design-picker'; import { ASSEMBLER_FIRST_FLOW } from '@automattic/onboarding'; import { useDispatch, useSelect } from '@wordpress/data'; import { useEffect } from 'react'; import { useSelector } from 'react-redux'; import { useQueryTheme } from 'calypso/components/data/query-theme'; import { skipLaunchpad } from 'calypso/landing/stepper/utils/skip-launchpad'; +import { useDispatch as useReduxDispatch } from 'calypso/state'; import { getCurrentUserSiteCount, isUserLoggedIn } from 'calypso/state/current-user/selectors'; +import { activateOrInstallThenActivate } from 'calypso/state/themes/actions'; import { getTheme } from 'calypso/state/themes/selectors'; import { useSiteData } from '../hooks/use-site-data'; import { ONBOARD_STORE, SITE_STORE } from '../stores'; @@ -20,6 +22,9 @@ import { ProvidedDependencies, } from './internals/types'; import type { OnboardSelect } from '@automattic/data-stores'; +import type { CalypsoDispatch } from 'calypso/state/types'; +import type { AnyAction } from 'redux'; +import type { ThunkAction } from 'redux-thunk'; const SiteIntent = Onboard.SiteIntent; @@ -82,45 +87,21 @@ const assemblerFirstFlow: Flow = { const { setPendingAction, setSelectedSite } = useDispatch( ONBOARD_STORE ); const { saveSiteSettings, setIntentOnSite } = useDispatch( SITE_STORE ); const { site, siteSlug, siteId } = useSiteData(); - - const exitFlow = ( to: string ) => { - setPendingAction( () => { - return new Promise( () => { - window.location.assign( to ); - } ); - } ); - - return navigate( 'processing' ); - }; + const reduxDispatch = useReduxDispatch(); + const selectedTheme = getAssemblerDesign().slug; const handleSelectSite = ( providedDependencies: ProvidedDependencies = {} ) => { const selectedSiteSlug = providedDependencies?.siteSlug as string; - const selectedSiteId = providedDependencies?.siteId as string; - const isNewSite = providedDependencies?.isNewSite === 'true'; + const selectedSiteId = providedDependencies?.siteId as number; setSelectedSite( selectedSiteId ); setIntentOnSite( selectedSiteSlug, SiteIntent.AssemblerFirst ); saveSiteSettings( selectedSiteId, { launchpad_screen: 'full' } ); - // Check whether to go to the assembler. If not, go to the site editor directly - let params; - if ( ! isAssemblerSupported() ) { - params = new URLSearchParams( { - canvas: 'edit', - assembler: '1', - } ); - - return `/site-editor/${ selectedSiteSlug }?${ params }`; - } + setPendingAction( + enableAssemblerTheme( selectedTheme, selectedSiteId, selectedSiteSlug, reduxDispatch ) + ); - // Carry over the current search parameters - params = new URLSearchParams( window.location.search ); - params.set( 'siteSlug', selectedSiteSlug ); - params.set( 'siteId', selectedSiteId ); - if ( isNewSite ) { - params.set( 'isNewSite', 'true' ); - } - - return navigate( `pattern-assembler?${ params }` ); + navigate( 'processing' ); }; const submit = async ( @@ -183,12 +164,7 @@ const assemblerFirstFlow: Flow = { return; } - const params = new URLSearchParams( { - canvas: 'edit', - assembler: '1', - } ); - - return exitFlow( `/site-editor/${ siteSlug }?${ params }` ); + return; } case 'pattern-assembler': { @@ -293,4 +269,30 @@ const assemblerFirstFlow: Flow = { }, }; +function enableAssemblerTheme( + themeId: string, + siteId: number, + siteSlug: string, + reduxDispatch: CalypsoDispatch +) { + const params = new URLSearchParams( { + canvas: 'edit', + assembler: '1', + } ); + + return () => + Promise.resolve() + .then( () => + reduxDispatch( + activateOrInstallThenActivate( themeId, siteId, { source: 'assembler' } ) as ThunkAction< + PromiseLike< string >, + any, + any, + AnyAction + > + ) + ) + .then( () => window.location.assign( `/site-editor/${ siteSlug }?${ params }` ) ); +} + export default assemblerFirstFlow;