Update coming soon page link to template editor (#46566)

* Update coming soon page link to template editor

* Add changelog

* Hide coming soon link when current theme is classic theme

* Remove line change

* Add type

plugins/woocommerce-admin/client/launch-your-store/constants.ts

@@ -0,0 +1,8 @@
+/**
+ * External dependencies
+ */
+import { getAdminLink } from '@woocommerce/settings';
+
+export const COMING_SOON_PAGE_EDITOR_LINK = getAdminLink(
+	'site-editor.php?postType=wp_template&postId=woocommerce/woocommerce//coming-soon&canvas=edit'
+);

plugins/woocommerce-admin/client/launch-your-store/hooks/use-coming-soon-editor-link.ts

@@ -1,28 +0,0 @@
-/**
- * External dependencies
- */
-import { useSelect } from '@wordpress/data';
-import { OPTIONS_STORE_NAME } from '@woocommerce/data';
-import { getAdminLink } from '@woocommerce/settings';
-
-const COMMING_SOON_PAGE_ID_OPTION = 'woocommerce_coming_soon_page_id';
-
-export const useComingSoonEditorLink = () => {
-	return useSelect( ( select ) => {
-		const { getOption, hasFinishedResolution } =
-			select( OPTIONS_STORE_NAME );
-
-		const isLoading = ! hasFinishedResolution( 'getOption', [
-			COMMING_SOON_PAGE_ID_OPTION,
-		] );
-		const pageID = getOption( COMMING_SOON_PAGE_ID_OPTION );
-
-		const pageLink =
-			isLoading || ! pageID
-				? // Fallback to the pages list if the page ID is not set yet.
-				  getAdminLink( 'edit.php?post_type=page' )
-				: getAdminLink( `post.php?post=${ pageID }&action=edit` );
-
-		return [ pageLink, isLoading ];
-	}, [] );
-};

plugins/woocommerce-admin/client/launch-your-store/settings/slotfill.js

@@ -17,13 +17,14 @@ import { __ } from '@wordpress/i18n';
 import classNames from 'classnames';
 import { useCopyToClipboard } from '@wordpress/compose';
 import { recordEvent } from '@woocommerce/tracks';
+import { getSetting } from '@woocommerce/settings';
 
 /**
  * Internal dependencies
  */
 import { SETTINGS_SLOT_FILL_CONSTANT } from '../../settings/settings-slots';
-import { useComingSoonEditorLink } from '../hooks/use-coming-soon-editor-link';
 import './style.scss';
+import { COMING_SOON_PAGE_EDITOR_LINK } from '../constants';
 
 const { Fill } = createSlotFill( SETTINGS_SLOT_FILL_CONSTANT );
 
@@ -48,7 +49,6 @@ const SiteVisibility = () => {
 	const copyLink = __( 'Copy link', 'woocommerce' );
 	const copied = __( 'Copied!', 'woocommerce' );
 	const [ copyLinkText, setCopyLinkText ] = useState( copyLink );
-	const [ commingSoonPageLink ] = useComingSoonEditorLink();
 
 	const getPrivateLink = () => {
 		if ( storePagesOnly === 'yes' ) {
@@ -111,17 +111,22 @@ const SiteVisibility = () => {
 					selected={ comingSoon }
 				/>
 				<p className="site-visibility-settings-slotfill-section-description">
-					{ createInterpolateElement(
-						__(
-							'Your site is hidden from visitors behind a “Coming soon” landing page until it’s ready for viewing. You can customize your “Coming soon” landing page via the <a>Editor</a>.',
-							'woocommerce'
-						),
-						{
-							a: createElement( 'a', {
-								href: commingSoonPageLink,
-							} ),
-						}
-					) }
+					{ getSetting( 'currentThemeIsFSETheme' )
+						? createInterpolateElement(
+								__(
+									'Your site is hidden from visitors behind a “Coming soon” landing page until it’s ready for viewing. You can customize your “Coming soon” landing page via the <a>Editor</a>.',
+									'woocommerce'
+								),
+								{
+									a: createElement( 'a', {
+										href: COMING_SOON_PAGE_EDITOR_LINK,
+									} ),
+								}
+						  )
+						: __(
+								'Your site is hidden from visitors behind a “Coming soon” landing page until it’s ready for viewing.',
+								'woocommerce'
+						  ) }
 				</p>
 				<div
 					className={ classNames(

plugins/woocommerce-admin/client/launch-your-store/status/index.js

@@ -4,7 +4,7 @@
 import { __ } from '@wordpress/i18n';
 import { Icon, moreVertical, edit, cog } from '@wordpress/icons';
 import { Dropdown, Button, MenuGroup, MenuItem } from '@wordpress/components';
-import { getAdminLink } from '@woocommerce/settings';
+import { getAdminLink, getSetting } from '@woocommerce/settings';
 import classnames from 'classnames';
 
 /**
@@ -13,7 +13,7 @@ import classnames from 'classnames';
 import './style.scss';
 import { SiteVisibilityTour } from '../tour';
 import { useSiteVisibilityTour } from '../tour/use-site-visibility-tour';
-import { useComingSoonEditorLink } from '../hooks/use-coming-soon-editor-link';
+import { COMING_SOON_PAGE_EDITOR_LINK } from '../constants';
 
 export const LaunchYourStoreStatus = ( { comingSoon, storePagesOnly } ) => {
 	const isComingSoon = comingSoon && comingSoon === 'yes';
@@ -26,7 +26,6 @@ export const LaunchYourStoreStatus = ( { comingSoon, storePagesOnly } ) => {
 	const dropdownText = isComingSoon ? comingSoonText : liveText;
 	const { showTour, setShowTour, onClose, shouldTourBeShown } =
 		useSiteVisibilityTour();
-	const [ commingSoonPageLink ] = useComingSoonEditorLink();
 
 	return (
 		<div className="woocommerce-lys-status">
@@ -70,15 +69,20 @@ export const LaunchYourStoreStatus = ( { comingSoon, storePagesOnly } ) => {
 										'woocommerce'
 									) }
 								</MenuItem>
-								{ isComingSoon && (
-									<MenuItem href={ commingSoonPageLink }>
-										<Icon icon={ edit } size={ 24 } />
-										{ __(
-											'Customize "Coming soon" page',
-											'woocommerce'
-										) }
-									</MenuItem>
-								) }
+								{ isComingSoon &&
+									getSetting( 'currentThemeIsFSETheme' ) && (
+										<MenuItem
+											href={
+												COMING_SOON_PAGE_EDITOR_LINK
+											}
+										>
+											<Icon icon={ edit } size={ 24 } />
+											{ __(
+												'Customize "Coming soon" page',
+												'woocommerce'
+											) }
+										</MenuItem>
+									) }
 							</MenuGroup>
 						</>
 					) }

plugins/woocommerce-admin/client/typings/global.d.ts

@@ -7,6 +7,7 @@ declare global {
 			preloadOptions: Record< string, unknown >;
 			adminUrl: string;
 			currentUserId: number;
+			currentThemeIsFSETheme: boolean;
 			admin: {
 				wcpay_welcome_page_connect_nonce: string;
 				currentUserData: {

plugins/woocommerce/changelog/update-coming-soon-page-link

@@ -0,0 +1,4 @@
+Significance: patch
+Type: update
+
+Update coming soon page link to template editor

plugins/woocommerce/src/Blocks/Assets/AssetDataRegistry.php

@@ -80,24 +80,25 @@ class AssetDataRegistry {
 	 */
 	protected function get_core_data() {
 		return [
-			'adminUrl'           => admin_url(),
-			'countries'          => WC()->countries->get_countries(),
-			'currency'           => $this->get_currency_data(),
-			'currentUserId'      => get_current_user_id(),
-			'currentUserIsAdmin' => current_user_can( 'manage_woocommerce' ),
-			'dateFormat'         => wc_date_format(),
-			'homeUrl'            => esc_url( home_url( '/' ) ),
-			'locale'             => $this->get_locale_data(),
-			'dashboardUrl'       => wc_get_account_endpoint_url( 'dashboard' ),
-			'orderStatuses'      => $this->get_order_statuses(),
-			'placeholderImgSrc'  => wc_placeholder_img_src(),
-			'productsSettings'   => $this->get_products_settings(),
-			'siteTitle'          => wp_specialchars_decode( get_bloginfo( 'name' ), ENT_QUOTES ),
-			'storePages'         => $this->get_store_pages(),
-			'wcAssetUrl'         => plugins_url( 'assets/', WC_PLUGIN_FILE ),
-			'wcVersion'          => defined( 'WC_VERSION' ) ? WC_VERSION : '',
-			'wpLoginUrl'         => wp_login_url(),
-			'wpVersion'          => get_bloginfo( 'version' ),
+			'adminUrl'               => admin_url(),
+			'countries'              => WC()->countries->get_countries(),
+			'currency'               => $this->get_currency_data(),
+			'currentUserId'          => get_current_user_id(),
+			'currentUserIsAdmin'     => current_user_can( 'manage_woocommerce' ),
+			'currentThemeIsFSETheme' => wc_current_theme_is_fse_theme(),
+			'dateFormat'             => wc_date_format(),
+			'homeUrl'                => esc_url( home_url( '/' ) ),
+			'locale'                 => $this->get_locale_data(),
+			'dashboardUrl'           => wc_get_account_endpoint_url( 'dashboard' ),
+			'orderStatuses'          => $this->get_order_statuses(),
+			'placeholderImgSrc'      => wc_placeholder_img_src(),
+			'productsSettings'       => $this->get_products_settings(),
+			'siteTitle'              => wp_specialchars_decode( get_bloginfo( 'name' ), ENT_QUOTES ),
+			'storePages'             => $this->get_store_pages(),
+			'wcAssetUrl'             => plugins_url( 'assets/', WC_PLUGIN_FILE ),
+			'wcVersion'              => defined( 'WC_VERSION' ) ? WC_VERSION : '',
+			'wpLoginUrl'             => wp_login_url(),
+			'wpVersion'              => get_bloginfo( 'version' ),
 		];
 	}
 
@@ -332,7 +333,7 @@ class AssetDataRegistry {
 	public function hydrate_data_from_api_request( $key, $path, $check_key_exists = false ) {
 		$this->add(
 			$key,
-			function() use ( $path ) {
+			function () use ( $path ) {
 				if ( isset( $this->preloaded_api_requests[ $path ], $this->preloaded_api_requests[ $path ]['body'] ) ) {
 					return $this->preloaded_api_requests[ $path ]['body'];
 				}