diff --git a/plugins/woocommerce-admin/client/customize-store/design-without-ai/services.ts b/plugins/woocommerce-admin/client/customize-store/design-without-ai/services.ts index c47b93230a1d..4b23307f2679 100644 --- a/plugins/woocommerce-admin/client/customize-store/design-without-ai/services.ts +++ b/plugins/woocommerce-admin/client/customize-store/design-without-ai/services.ts @@ -32,7 +32,7 @@ import { FONT_PAIRINGS_WHEN_AI_IS_OFFLINE, FONT_PAIRINGS_WHEN_USER_DID_NOT_ALLOW_TRACKING, } from '../assembler-hub/sidebar/global-styles/font-pairing-variations/constants'; -import { DesignWithoutAIStateMachineContext } from './types'; +import { DesignWithoutAIStateMachineContext, Theme } from './types'; const assembleSite = async () => { await updateTemplate( { @@ -51,9 +51,89 @@ const browserPopstateHandler = }; }; -const installAndActivateTheme = async () => { +const getActiveThemeWithRetries = async (): Promise< Theme[] | null > => { + let retries = 3; + + while ( retries > 0 ) { + const activeThemes = ( await resolveSelect( 'core' ).getEntityRecords( + 'root', + 'theme', + { status: 'active' }, + true + ) ) as Theme[]; + if ( activeThemes ) { + return activeThemes; + } + + retries--; + } + + return null; +}; + +const getCurrentGlobalStylesId = async (): Promise< number | null > => { + const activeThemes = await getActiveThemeWithRetries(); + if ( ! activeThemes ) { + return null; + } + + const currentThemeLinks = activeThemes[ 0 ]?._links; + const url = currentThemeLinks?.[ 'wp:user-global-styles' ]?.[ 0 ]?.href; + const globalStylesObject = ( await apiFetch( { url } ) ) as { id: number }; + + return globalStylesObject.id; +}; + +const updateGlobalStylesWithDefaultValues = async ( + context: DesignWithoutAIStateMachineContext +) => { + // We are using the first color palette and font pairing that are displayed on the color/font picker on the sidebar. + const colorPalette = COLOR_PALETTES[ 0 ]; + + const allowTracking = + ( await resolveSelect( OPTIONS_STORE_NAME ).getOption( + 'woocommerce_allow_tracking' + ) ) === 'yes'; + + const fontPairing = + context.isFontLibraryAvailable && allowTracking + ? FONT_PAIRINGS_WHEN_AI_IS_OFFLINE[ 0 ] + : FONT_PAIRINGS_WHEN_USER_DID_NOT_ALLOW_TRACKING[ 0 ]; + + const globalStylesId = await getCurrentGlobalStylesId(); + if ( ! globalStylesId ) { + return; + } + + // @ts-expect-error No types for this exist yet. + const { saveEntityRecord } = dispatch( coreStore ); + + await saveEntityRecord( + 'root', + 'globalStyles', + { + id: globalStylesId, + styles: mergeBaseAndUserConfigs( + colorPalette?.styles || {}, + fontPairing?.styles || {} + ), + settings: mergeBaseAndUserConfigs( + colorPalette?.settings || {}, + fontPairing?.settings || {} + ), + }, + { + throwOnError: true, + } + ); +}; + +const installAndActivateTheme = async ( + context: DesignWithoutAIStateMachineContext +) => { try { await setTheme( THEME_SLUG ); + await updateGlobalStylesWithDefaultValues( context ); } catch ( error ) { recordEvent( 'customize_your_store__no_ai_install_and_activate_theme_error', @@ -155,56 +235,6 @@ const createProducts = async () => { } }; -const updateGlobalStylesWithDefaultValues = async ( - context: DesignWithoutAIStateMachineContext -) => { - // We are using the first color palette and font pairing that are displayed on the color/font picker on the sidebar. - const colorPalette = COLOR_PALETTES[ 0 ]; - - const allowTracking = - ( await resolveSelect( OPTIONS_STORE_NAME ).getOption( - 'woocommerce_allow_tracking' - ) ) === 'yes'; - - const fontPairing = - context.isFontLibraryAvailable && allowTracking - ? FONT_PAIRINGS_WHEN_AI_IS_OFFLINE[ 0 ] - : FONT_PAIRINGS_WHEN_USER_DID_NOT_ALLOW_TRACKING[ 0 ]; - - // @ts-expect-error No types for this exist yet. - const { invalidateResolutionForStoreSelector } = dispatch( coreStore ); - invalidateResolutionForStoreSelector( - '__experimentalGetCurrentGlobalStylesId' - ); - - const globalStylesId = await resolveSelect( - coreStore - // @ts-expect-error No types for this exist yet. - ).__experimentalGetCurrentGlobalStylesId(); - - // @ts-expect-error No types for this exist yet. - const { saveEntityRecord } = dispatch( coreStore ); - - await saveEntityRecord( - 'root', - 'globalStyles', - { - id: globalStylesId, - styles: mergeBaseAndUserConfigs( - colorPalette?.styles || {}, - fontPairing?.styles || {} - ), - settings: mergeBaseAndUserConfigs( - colorPalette?.settings || {}, - fontPairing?.settings || {} - ), - }, - { - throwOnError: true, - } - ); -}; - export const services = { assembleSite, browserPopstateHandler, 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 1fde98aae772..54bcbfaadda7 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 @@ -140,26 +140,6 @@ export const designWithNoAiStateMachineDefinition = createMachine( }, }, }, - setGlobalStyles: { - initial: 'pending', - states: { - pending: { - invoke: { - src: 'updateGlobalStylesWithDefaultValues', - onDone: { - target: 'success', - }, - onError: { - actions: - 'redirectToIntroWithError', - }, - }, - }, - success: { - type: 'final', - }, - }, - }, installFontFamilies: { initial: 'checkFontLibrary', states: { diff --git a/plugins/woocommerce-admin/client/customize-store/design-without-ai/types.ts b/plugins/woocommerce-admin/client/customize-store/design-without-ai/types.ts index 93bfd680f105..90b6cf7e610c 100644 --- a/plugins/woocommerce-admin/client/customize-store/design-without-ai/types.ts +++ b/plugins/woocommerce-admin/client/customize-store/design-without-ai/types.ts @@ -11,3 +11,9 @@ export type DesignWithoutAIStateMachineContext = { flowType: FlowType.noAI; isFontLibraryAvailable: boolean; }; + +export interface Theme { + _links: { + 'wp:user-global-styles': { href: string }[]; + }; +} diff --git a/plugins/woocommerce/changelog/45519-45479-fix-404-error b/plugins/woocommerce/changelog/45519-45479-fix-404-error new file mode 100644 index 000000000000..d16f8acb7f77 --- /dev/null +++ b/plugins/woocommerce/changelog/45519-45479-fix-404-error @@ -0,0 +1,4 @@ +Significance: minor +Type: fix + +CYS - Fix the failed to load resource error in the CYS whenever the current active theme is not TT4 \ No newline at end of file