Boost: Ensure Home URL is always a predefined Cornerstone Page

projects/plugins/boost/app/assets/src/js/features/cornerstone-pages/cornerstone-pages.tsx

@@ -5,7 +5,7 @@ import Upgraded from '$features/ui/upgraded/upgraded';
 import styles from './cornerstone-pages.module.scss';
 import { usePremiumFeatures } from '$lib/stores/premium-features';
 import { recordBoostEvent } from '$lib/utils/analytics';
-import { useCornerstonePages } from './lib/stores/cornerstone-pages';
+import { useCustomCornerstonePages } from './lib/stores/cornerstone-pages';
 import Prerender from './prerender/prerender';
 import { useSingleModuleState } from '$features/module/lib/stores';
 
@@ -53,35 +53,22 @@ const CornerstonePages = () => {
 };
 
 const CornerstoneTitleSummary = () => {
-	const [ cornerstonePages ] = useCornerstonePages();
-	if ( ! cornerstonePages.length ) {
+	const [ cornerstonePages ] = useCustomCornerstonePages();
+	if ( ! Array.isArray( cornerstonePages ) ) {
 		return null;
 	}
+
 	return sprintf(
-		/* translators: %s is the number of pages in the cornerstone pages list apart from the homepage. */
+		/* translators: %s is the number of pages in the custom cornerstone pages list. */
 		__( 'Added: %s', 'jetpack-boost' ),
 		() => {
-			const homepage = Jetpack_Boost.site.url.replace( /\/$/, '' );
-			const hasHomepage = cornerstonePages.includes( homepage );
-
-			if ( hasHomepage ) {
-				if ( cornerstonePages.length > 1 ) {
-					return sprintf(
-						/* translators: %d is the number of pages in the cornerstone pages list apart from the homepage. */
-						_n(
-							'Homepage + %d page',
-							'Homepage + %d pages',
-							cornerstonePages.length - 1,
-							'jetpack-boost'
-						),
-						cornerstonePages.length - 1
-					);
-				}
+			if ( cornerstonePages.length === 0 ) {
 				return __( 'Homepage', 'jetpack-boost' );
 			}
+
 			return sprintf(
-				/* translators: %d is the number of pages added to the cornerstone pages list. */
-				_n( '%d page', '%d pages', cornerstonePages.length, 'jetpack-boost' ),
+				/* translators: %d is the number of pages in the custom cornerstone pages list. */
+				_n( 'Homepage + %d page', 'Homepage + %d pages', cornerstonePages.length, 'jetpack-boost' ),
 				cornerstonePages.length
 			);
 		}

projects/plugins/boost/app/assets/src/js/features/cornerstone-pages/lib/stores/cornerstone-pages.ts

@@ -4,7 +4,7 @@ import { z } from 'zod';
 /**
  * Hook to get the Cornerstone Pages.
  */
-export function useCornerstonePages(): [
+export function useCustomCornerstonePages(): [
 	string[],
 	( newValue: string[], onSuccessCallback?: () => void ) => void,
 ] {
@@ -27,7 +27,9 @@ const CornerstonePagesProperties = z.object( {
 	max_pages: z.number(),
 	max_pages_premium: z.number(),
 	default_pages: z.array( z.string() ),
+	predefined_pages: z.array( z.string() ),
 } );
+
 type CornerstonePagesProperties = z.infer< typeof CornerstonePagesProperties >;
 
 export function useCornerstonePagesProperties(): CornerstonePagesProperties | undefined {

projects/plugins/boost/app/assets/src/js/features/cornerstone-pages/meta/meta.module.scss

@@ -38,7 +38,7 @@
 				margin-top: 16px;
 			}
 
-			&.has-error {
+			.has-error {
 
 				textarea {
 					border-color: var( --red-40 );
@@ -77,7 +77,7 @@
 			}
 
 			.description {
-				margin-top: 8px;
+				margin: 0;
 				font-size: 14px;
 				line-height: 1.5;
 				color: var( --gray-60 );
@@ -100,6 +100,15 @@
 		}
 	}
 
+	.predefined-pages {
+		margin-top: 0;
+		padding: 0;
+
+		li:last-child {
+			margin-bottom: 0;
+		}
+	}
+
 	.see-logs-link {
 		font-size: 16px;
 		line-height: 1.5;