Add Redirection Conditions

inc/plugins/class-fse-onboarding.php

@@ -25,20 +25,108 @@ class FSE_Onboarding {
 	 * Initialize the class
 	 */
 	public function init() {
+		add_action( 'after_switch_theme', array( $this, 'on_switch_theme' ) );
 		add_action( 'enqueue_block_editor_assets', array( $this, 'enqueue_options_assets' ) );
+		add_action( 'admin_menu', array( $this, 'register_menu_page' ) );
+	}
+
+	/**
+	 * Register menu page
+	 * 
+	 * @access public
+	 * @return void
+	 */
+	public function register_menu_page() {
+		$has_support = get_theme_support( 'otter-onboarding' );
+
+		if ( false === $has_support || ! current_user_can( 'manage_options' ) ) {
+			return;
+		}
+
+		add_submenu_page(
+			'otter',
+			esc_html__( 'FSE Onboarding', 'otter-blocks' ),
+			esc_html__( 'FSE Onboarding', 'otter-blocks' ),
+			'manage_options',
+			'otter-onboarding',
+			function() {
+				$redirect = add_query_arg(
+					array(
+						'onboarding' => 'true',
+					),
+					admin_url( 'site-editor.php' )
+				);
+
+				echo '<p>Redirecting...</p>
+				<script>document.location.href = "' . esc_url( $redirect ) . '";</script>';
+			}
+		);
+	}
+
+	/**
+	 * On switch theme
+	 * 
+	 * @access public
+	 * @return void
+	 */
+	public function on_switch_theme() {
+		// Check if the theme has support for FSE.
+		$support = get_theme_support( 'otter-onboarding' );
+
+		if ( false === $support ) {
+			return;
+		}
+
+		$status = get_option( 'otter_onboarding_status', array() );
+		$slug   = get_stylesheet();
+
+		if ( ! empty( $status[ $slug ] ) ) {
+			return;
+		}
+
+		// Run the onboarding.
+		self::run_onboarding();
+	}
+
+	/**
+	 * Run the onboarding.
+	 * 
+	 * @access public
+	 * @return void
+	 */
+	public static function run_onboarding() {
+		$redirect = add_query_arg(
+			array(
+				'onboarding' => 'true',
+			),
+			admin_url( 'site-editor.php' )
+		);
+
+		// Set the onboarding ran option.
+		$status          = get_option( 'otter_onboarding_status', array() );
+		$slug            = get_stylesheet();
+		$status[ $slug ] = true;
+		update_option( 'otter_onboarding_status', $status );
+
+		// Redirect to the onboarding.
+		wp_safe_redirect( $redirect );
+		exit;
 	}
 
 	/**
 	 * Get Theme Templates
+	 * 
+	 * @access public
+	 * @return array|false
 	 */
 	public function get_templates() {
-        $support = get_theme_support( 'otter-onboarding' );
+		$support = get_theme_support( 'otter-onboarding' );
 
-        if ( false === $support && ! is_array( $support ) || ( ! isset( $support[0]['templates'] ) && ! isset( $support[0]['page_templates'] )  ) ) {
-            return false;
-        }
+		if ( false === $support || ! is_array( $support ) || ( ! isset( $support[0]['templates'] ) && ! isset( $support[0]['page_templates'] ) ) ) {
+			return false;
+		}
 
-		$template = array();
+		$templates = array();
 
 		if ( isset( $support[0]['templates'] ) ) {
 			$templates = $support[0]['templates'];
@@ -48,26 +136,29 @@ public function get_templates() {
 			$templates['page_templates'] = $support[0]['page_templates'];
 		}
 
-        if ( ! $templates ) {
-            return false;
-        }
-
-        foreach ( $templates as $key => $categories ) {
-            foreach ( $categories as $i => $template ) {
-                if ( file_exists( $template['file'] ) ) {
-                    $templates[ $key ][ $i ]['content']['raw'] = file_get_contents( $template['file'] );
-                    unset( $templates[ $key ][ $i ]['file'] );
-                } else {
-                    unset( $templates[ $key ][ $i ] );
-                }
-            }
-        }
+		if ( ! $templates ) {
+			return false;
+		}
+
+		foreach ( $templates as $key => $categories ) {
+			foreach ( $categories as $i => $template ) {
+				if ( file_exists( $template['file'] ) ) {
+					$templates[ $key ][ $i ]['content']['raw'] = file_get_contents( $template['file'] );
+					unset( $templates[ $key ][ $i ]['file'] );
+				} else {
+					unset( $templates[ $key ][ $i ] );
+				}
+			}
+		}
 
 		return $templates;
 	}
 
 	/**
 	 * Get Templates Types
+	 * 
+	 * @access public
+	 * @return array
 	 */
 	public function get_templates_types() {
 		$templates = $this->get_templates();
@@ -79,10 +170,25 @@ public function get_templates_types() {
 		return array_keys( $templates );
 	}
 
-    /**
-     * Enqueue options assets.
-     */
-    public function enqueue_options_assets() {
+	/**
+	 * Enqueue options assets.
+	 * 
+	 * @access public
+	 * @return void
+	 */
+	public function enqueue_options_assets() {
+		$current_screen = get_current_screen();
+		$has_support    = get_theme_support( 'otter-onboarding' );
+
+		if (
+			false === $has_support ||
+			! current_user_can( 'manage_options' ) ||
+			! isset( $current_screen->id ) ||
+			'site-editor' !== $current_screen->id
+		) {
+			return;
+		}
+
 		$asset_file = include OTTER_BLOCKS_PATH . '/build/onboarding/index.asset.php';
 
 		wp_enqueue_media();
@@ -106,7 +212,7 @@ public function enqueue_options_assets() {
 
 		wp_localize_script(
 			'otter-onboarding-scripts',
-			'otterObj',
+			'otterOnboardingData',
 			apply_filters(
 				'otter_onboarding_data',
 				array(
@@ -116,7 +222,7 @@ public function enqueue_options_assets() {
 				)
 			)
 		);
-    }
+	}
 
 	/**
 	 * The instance method for the static class.

inc/server/class-fse-onboarding-server.php

@@ -56,7 +56,7 @@ public function register_routes() {
 					'methods'             => \WP_REST_Server::READABLE,
 					'callback'            => array( $this, 'get_templates' ),
 					'permission_callback' => function () {
-                        return current_user_can( 'manage_options' );
+						return current_user_can( 'manage_options' );
 					},
 				),
 			)
@@ -76,16 +76,16 @@ public function get_templates( \WP_REST_Request $request ) {
 
 		$templates = $fse_onboarding->get_templates();
 
-        if ( ! $templates ) {
-            return rest_ensure_response(
-                array(
-                    'success' => false,
-                    'data'    => array(
-                        'message' => __( 'Missing templates', 'otter-blocks' ),
-                    ),
-                )
-            );
-        }
+		if ( ! $templates ) {
+			return rest_ensure_response(
+				array(
+					'success' => false,
+					'data'    => array(
+						'message' => __( 'Missing templates', 'otter-blocks' ),
+					),
+				)
+			);
+		}
 
 		return rest_ensure_response(
 			array(
@@ -95,25 +95,6 @@ public function get_templates( \WP_REST_Request $request ) {
 		);
 	}
 
-	/**
-	 * Get Product Pricing.
-	 *
-	 * @param \WP_REST_Request $request The request.
-	 * 
-	 * @return \WP_REST_Response
-	 * @access  public
-	 */
-	public function get_price( \WP_REST_Request $request ) {
-		return ( new Stripe_API() )->create_request(
-			'prices',
-			array(
-				'active'  => true,
-				'product' => $request->get_param( 'id' ),
-				'limit'   => 50,
-			)
-		);
-	}
-
 	/**
 	 * The instance method for the static class.
 	 * Defines and returns the instance of the static class.

src/onboarding/components/Finish.js

@@ -12,7 +12,7 @@ import { useSelect } from '@wordpress/data';
 
 import { useState } from '@wordpress/element';
 
-const { version } = window.otterObj;
+const { version } = window.otterOnboardingData;
 
 const Finish = () => {
 	const [ feedback, setFeedback ] = useState( '' );
@@ -74,7 +74,7 @@ const Finish = () => {
 			<div className="o-finish__container">
 				<img
 					className="o-finish__logo"
-					src={ `${ window.otterObj.assetsPath }images/logo-alt.png` }
+					src={ `${ window.otterOnboardingData.assetsPath }images/logo-alt.png` }
 				/>
 
 				<h1>{ __( 'Your website is ready to go!', 'otter-blocks' ) }</h1>

src/onboarding/components/Sidebar.js

@@ -75,7 +75,7 @@ const Sidebar = ({ isEditorLoading }) => {
 			<div className="o-sidebar__header">
 				<img
 					className="o-sidebar__logo"
-					src={ `${ window.otterObj.assetsPath }images/logo-alt.png` }
+					src={ `${ window.otterOnboardingData.assetsPath }images/logo-alt.png` }
 				/>
 
 				{ 0 !== stepIndex ? (

src/onboarding/index.js

@@ -19,6 +19,14 @@ const Render = () => {
 	);
 };
 
-registerPlugin( 'otter-onboarding', {
-	render: Render
-});
+// Check the URL for the onboarding query string.
+const urlParams = new URLSearchParams( window.location.search );
+const onboarding = urlParams.get( 'onboarding' );
+console.log( onboarding );
+
+// If the onboarding query string is present, render the onboarding modal.
+if ( 'true' === onboarding ) {
+	registerPlugin( 'otter-onboarding', {
+		render: Render
+	});
+}

src/onboarding/steps.js

@@ -13,7 +13,7 @@ import Template from './components/steps/Template';
 import Pages from './components/steps/Pages';
 
 const isSupported = step => {
-	const { supportedSteps } = window.otterObj;
+	const { supportedSteps } = window.otterOnboardingData;
 
 	return supportedSteps.includes( step );
 };

src/onboarding/style.scss

@@ -127,7 +127,7 @@ div.error, div.notice {
 		}
 
 		@media ( min-width: 1920px ) {
-			width: 25vw;
+			width: 20vw;
 		}
 	}