diff --git a/plugins/woocommerce-admin/client/customize-store/assembler-hub/sidebar/sidebar-navigation-screen-typography.tsx b/plugins/woocommerce-admin/client/customize-store/assembler-hub/sidebar/sidebar-navigation-screen-typography.tsx index e904cb922f43a..64bcf64c5cba4 100644 --- a/plugins/woocommerce-admin/client/customize-store/assembler-hub/sidebar/sidebar-navigation-screen-typography.tsx +++ b/plugins/woocommerce-admin/client/customize-store/assembler-hub/sidebar/sidebar-navigation-screen-typography.tsx @@ -211,8 +211,7 @@ export const SidebarNavigationScreenTypography = () => { } ); OptIn(); - closeModal(); - window.location.href = `${ ADMIN_URL }admin.php?page=wc-admin&path=%2Fcustomize-store%2Fassembler-hub`; + window.location.href = `${ ADMIN_URL }admin.php?page=wc-admin&path=%2Fcustomize-store/design/install-fonts`; } } variant="primary" disabled={ ! OptInDataSharing } diff --git a/plugins/woocommerce-admin/client/customize-store/design-without-ai/state-machine.tsx b/plugins/woocommerce-admin/client/customize-store/design-without-ai/state-machine.tsx index 1fde98aae772b..718b5b8f58b2e 100644 --- a/plugins/woocommerce-admin/client/customize-store/design-without-ai/state-machine.tsx +++ b/plugins/woocommerce-admin/client/customize-store/design-without-ai/state-machine.tsx @@ -29,6 +29,47 @@ export const hasStepInUrl = ( ); }; +export const hasInstallFontsInUrl = () => { + const { path = '' } = getQuery() as { path: string }; + const pathFragments = path.split( '/' ); + debugger; + return ( + pathFragments[ 2 ] === 'design' && + pathFragments[ 3 ] === 'install-fonts' + ); +}; + +const installFontFamiliesState = { + initial: 'checkFontLibrary', + states: { + checkFontLibrary: { + always: [ + { + cond: { + type: 'isFontLibraryAvailable', + }, + target: 'pending', + }, + { target: 'success' }, + ], + }, + pending: { + invoke: { + src: 'installFontFamilies', + onDone: { + target: 'success', + }, + onError: { + actions: 'redirectToIntroWithError', + }, + }, + }, + success: { + type: 'final', + }, + }, +}; + export type DesignWithoutAIStateMachineEvents = | { type: 'EXTERNAL_URL_UPDATE' } | { type: 'NO_AI_FLOW_ERROR'; payload: { hasError: boolean } }; @@ -62,6 +103,12 @@ export const designWithNoAiStateMachineDefinition = createMachine( states: { navigate: { always: [ + { + cond: { + type: 'hasInstallFontsInUrl', + }, + target: 'installFontFamilies', + }, { cond: { type: 'hasStepInUrl', @@ -71,6 +118,23 @@ export const designWithNoAiStateMachineDefinition = createMachine( }, ], }, + installFontFamilies: { + meta: { + component: ApiCallLoader, + }, + states: { + checkFontLibrary: + installFontFamiliesState.states.checkFontLibrary, + pending: installFontFamiliesState.states.pending, + success: { + meta: { + component: AssembleHubLoader, + }, + entry: [ 'redirectToAssemblerHub' ], + type: 'final', + }, + }, + }, preAssembleSite: { initial: 'preApiCallLoader', id: 'preAssembleSite', @@ -161,31 +225,14 @@ export const designWithNoAiStateMachineDefinition = createMachine( }, }, installFontFamilies: { - initial: 'checkFontLibrary', + ...installFontFamiliesState, states: { - checkFontLibrary: { - always: [ - { - cond: { - type: 'isFontLibraryAvailable', - }, - target: 'pending', - }, - { target: 'success' }, - ], - }, - pending: { - invoke: { - src: 'installFontFamilies', - onDone: { - target: 'success', - }, - onError: { - actions: - 'redirectToIntroWithError', - }, - }, - }, + ...installFontFamiliesState.states, + checkFontLibrary: + installFontFamiliesState.states + .checkFontLibrary, + pending: + installFontFamiliesState.states.pending, success: { type: 'final', }, @@ -213,6 +260,7 @@ export const designWithNoAiStateMachineDefinition = createMachine( services, guards: { hasStepInUrl, + hasInstallFontsInUrl, isFontLibraryAvailable, }, }