diff --git a/includes/Data/Patterns.php b/includes/Data/Patterns.php index 59789e946..81ba7bcf6 100644 --- a/includes/Data/Patterns.php +++ b/includes/Data/Patterns.php @@ -123,6 +123,19 @@ protected static function get_theme_step_patterns() { ); } + /** + * Callback Functions for Theme Step. + * + * @return array + */ + protected static function get_theme_step_filters() { + return array( + 'yith-wonder' => array( + 'homepage-styles' => array( __CLASS__, 'filter_yith_wonder_homepage_patterns' ), + ), + ); + } + /** * Get post metadata for a pattern. Ref: SitePagesController.php * @@ -191,7 +204,7 @@ public static function get_meta_from_pattern_slug( $pattern_slug ) { /** * Retrieve pattern from slug. * - * @param array $pattern_slug Pattern Slug Data + * @param string $pattern_slug Pattern Slug Data * * @return array|boolean */ @@ -211,21 +224,23 @@ public static function get_pattern_from_slug( $pattern_slug ) { } /** - * Replace the header menu slug in the patterns array + * Retrieve the header menu slug from flow data. * - * @param array $patterns Patterns for the specific step - * @param string $header_menu_slug header menu slug choosen by the user - * - * @return array + * @return string|boolean */ - private static function replace_header_menu_slug( $patterns, $header_menu_slug ) { - foreach ( $patterns as $slug => $slug_details ) { - if ( isset( $slug_details['replace'] ) && true === $slug_details['replace'] ) { - unset( $patterns[ $slug ] ); - $patterns = array_merge( array( $header_menu_slug => $slug_details ), $patterns ); - } + private static function get_selected_header_from_flow_data() { + // fetch the selected header menu slug from DB + $flow_data = \get_option( Options::get_option_name( 'flow' ), false ); + if ( ! $flow_data ) { + return false; } - return $patterns; + + if ( ! empty( $flow_data['data']['partHeader'] ) ) { + return explode( '/', $flow_data['data']['partHeader'] )[1]; + } + + return false; + } /** @@ -268,44 +283,81 @@ public static function get_theme_step_patterns_from_step( $step, $squash = false $pattern_slugs = self::get_theme_step_patterns()[ $active_theme ][ $step ]; $block_patterns_registry = \WP_Block_Patterns_Registry::get_instance(); - $block_patterns = array(); - $block_patterns_squashed = ''; - // fetch the selected header menu slug from DB - $flow_data = \get_option( Options::get_option_name( 'flow' ) ); - $header_menu_slug = explode( '/', $flow_data['data']['partHeader'] )[1]; - if ( ! empty( $header_menu_slug ) ) { - $pattern_slugs = self::replace_header_menu_slug( $pattern_slugs, $header_menu_slug ); + foreach ( array_keys( $pattern_slugs ) as $pattern_slug ) { + if ( true !== $pattern_slugs[ $pattern_slug ]['active'] ) { + continue; + } + if ( isset( $pattern_slugs[ $pattern_slug ]['replace'] ) && true === $pattern_slugs[ $pattern_slug ]['replace'] ) { + $pattern_slug_data = $pattern_slugs[ $pattern_slug ]; + $header_menu_slug = self::get_selected_header_from_flow_data(); + $pattern_slug = ( ! empty( $header_menu_slug ) ) ? $header_menu_slug : $pattern_slug; + $pattern_slugs[ $pattern_slug ] = $pattern_slug_data; + } + $pattern_name = $active_theme . '/' . $pattern_slug; + if ( ! $block_patterns_registry->is_registered( $pattern_name ) ) { + continue; + } + $pattern = $block_patterns_registry->get_registered( $pattern_name ); + // if header menu slug contains "split" replace the menu links with dummy links + if ( false !== stripos( $pattern_slug, 'split' ) ) { + $pattern['content'] = self::replace_split_menu_items( $pattern['content'] ); + } + if ( ! $squash ) { + $block_patterns[] = array_merge( + array( + 'slug' => $pattern_name, + 'title' => $pattern['title'], + 'content' => self::cleanup_wp_grammar( $pattern['content'] ), + 'name' => $pattern['name'], + 'categories' => $pattern['categories'], + ), + $pattern_slugs[ $pattern_slug ] + ); + continue; + } + $block_patterns .= self::cleanup_wp_grammar( $pattern['content'] ); } - foreach ( array_keys( $pattern_slugs ) as $pattern_slug ) { - if ( true === $pattern_slugs[ $pattern_slug ]['active'] ) { - $pattern_name = $active_theme . '/' . $pattern_slug; - if ( $block_patterns_registry->is_registered( $pattern_name ) ) { - $pattern = $block_patterns_registry->get_registered( $pattern_name ); - // if header menu slug contains "split" replace the menu links with dummy links - if ( false !== stripos( $pattern_slug, 'split' ) ) { - $pattern['content'] = self::replace_split_menu_items( $pattern['content'] ); - } - - if ( ! $squash ) { - $block_patterns[] = array_merge( - array( - 'slug' => $pattern_name, - 'title' => $pattern['title'], - 'content' => self::cleanup_wp_grammar( $pattern['content'] ), - 'name' => $pattern['name'], - ), - $pattern_slugs[ $pattern_slug ] - ); - continue; - } - $block_patterns_squashed .= self::cleanup_wp_grammar( $pattern['content'] ); - } + $step_filter = self::get_theme_step_filters()[ $active_theme ][ $step ]; + $theme_step_callback = isset( $step_filter ) ? $step_filter : false; + if ( is_callable( $theme_step_callback ) ) { + return $theme_step_callback( $block_patterns ); + } + + return $block_patterns; + } + + /** + * Retrieve Homepage Menu Step Patterns + * + * @param array $patterns Step Patterns Data + * @return array + */ + private static function filter_yith_wonder_homepage_patterns( $patterns ) { + $header_content = ''; + $homepage_style_slugs = array(); + $footer_content = ''; + + foreach ( $patterns as $index_key => $slug ) { + if ( in_array( 'yith-wonder-site-header', $slug['categories'] ) ) { + $header_content = $slug['content']; + continue; + } + if ( in_array( 'yith-wonder-pages', $slug['categories'] ) ) { + array_push( $homepage_style_slugs, $slug ); + } + if ( in_array( 'yith-wonder-site-footer', $slug['categories'] ) ) { + $footer_content = $slug['content']; + continue; } } - return $squash ? $block_patterns_squashed : $block_patterns; + foreach ( $homepage_style_slugs as $key => $homepage_style ) { + $homepage_style_slugs[ $key ]['content'] = $header_content . $homepage_style['content'] . $footer_content; + } + + return $homepage_style_slugs; } /** diff --git a/src/OnboardingSPA/pages/Steps/DesignHomepageMenu/index.js b/src/OnboardingSPA/pages/Steps/DesignHomepageMenu/index.js index 9d9e11ad9..a4e4fab69 100644 --- a/src/OnboardingSPA/pages/Steps/DesignHomepageMenu/index.js +++ b/src/OnboardingSPA/pages/Steps/DesignHomepageMenu/index.js @@ -20,32 +20,9 @@ import { } from '../../../components/LivePreview'; const StepDesignHomepageMenu = () => { - const homepagePatternList = [ - 'yith-wonder/homepage-1', - 'yith-wonder/homepage-2', - 'yith-wonder/homepage-3', - ]; - - const homepagesList = { - 'homepage-1': [ - 'yith-wonder/site-header-left-logo-navigation-inline', - 'yith-wonder/homepage-1', - 'yith-wonder/site-footer', - ], - 'homepage-2': [ - 'yith-wonder/site-header-left-logo-navigation-inline', - 'yith-wonder/homepage-2', - 'yith-wonder/site-footer', - ], - 'homepage-3': [ - 'yith-wonder/site-header-left-logo-navigation-inline', - 'yith-wonder/homepage-3', - 'yith-wonder/site-footer', - ], - }; - const location = useLocation(); const [ homepagePattern, setHomepagePattern ] = useState(); + const [ homepagePatternList, setHomepagePatternList ] = useState( [] ); const [ selectedHomepage, setSelectedHomepage ] = useState( 0 ); const { currentStep, currentData, themeStatus, themeVariations } = @@ -76,30 +53,13 @@ const StepDesignHomepageMenu = () => { function refactorPatterns( homepagePatternDataResp ) { const makeHomepagePattern = []; - - for ( const key in homepagesList ) { - const homepagePatterns = homepagesList[ key ]; - // update the header menu pattern if already selected - if ( - currentData.data.partHeader || - currentData.data.partHeader !== '' - ) { - homepagePatterns[ 0 ] = currentData.data.partHeader; + homepagePatternDataResp.forEach( + ( homepagePatternData ) => { + makeHomepagePattern.push( homepagePatternData.content ); + homepagePatternList.push( homepagePatternData.slug ); } - - let patternData = ''; - homepagePatterns.forEach( ( patternName ) => { - homepagePatternDataResp?.body.forEach( - ( homepagePatternData ) => { - if ( homepagePatternData.slug === patternName ) { - patternData += homepagePatternData.content; - } - } - ); - } ); - makeHomepagePattern.push( patternData ); - } - + ); + setHomepagePatternList( homepagePatternList ); return makeHomepagePattern; } @@ -107,10 +67,13 @@ const StepDesignHomepageMenu = () => { const homepagePatternDataTemp = await getPatterns( currentStep.patternId ); + if ( homepagePatternDataTemp?.error ) { return updateThemeStatus( THEME_STATUS_INIT ); } + setHomepagePattern( refactorPatterns( homepagePatternDataTemp?.body ) ); + if ( currentData?.data.sitePages.homepage !== '' ) { setSelectedHomepage( homepagePatternList?.indexOf( @@ -124,8 +87,6 @@ const StepDesignHomepageMenu = () => { }; setCurrentOnboardingData( currentData ); } - - setHomepagePattern( refactorPatterns( homepagePatternDataTemp ) ); } function saveDataForHomepage( idx ) {