Newsletter: scaffold the wp-build dashboard chassis behind the flag

projects/packages/newsletter/_inc/subscribers/lib/query-client.ts

@@ -0,0 +1,10 @@
+import { QueryClient } from '@tanstack/react-query';
+
+export const queryClient = new QueryClient( {
+	defaultOptions: {
+		queries: {
+			refetchOnWindowFocus: false,
+			staleTime: 30 * 1000,
+		},
+	},
+} );

projects/packages/newsletter/changelog/add-wp-build-page-shell

@@ -0,0 +1,3 @@
+Significance: patch
+Type: added
+Comment: Newsletter modernization chassis (Page chrome, React Query, analytics init) behind the same feature flag; no user-visible change unless the flag is enabled.

projects/packages/newsletter/package.json

@@ -42,12 +42,15 @@
 		"@automattic/jetpack-connection": "workspace:*",
 		"@automattic/jetpack-script-data": "workspace:*",
 		"@automattic/jetpack-shared-extension-utils": "workspace:*",
+		"@tanstack/react-query": "5.90.8",
+		"@wordpress/admin-ui": "1.12.0",
 		"@wordpress/api-fetch": "7.44.0",
 		"@wordpress/components": "32.6.0",
 		"@wordpress/dataviews": "14.1.0",
 		"@wordpress/element": "6.44.0",
 		"@wordpress/i18n": "6.17.0",
 		"@wordpress/notices": "5.44.0",
+		"@wordpress/route": "0.10.0",
 		"@wordpress/theme": "0.11.0",
 		"@wordpress/ui": "0.11.0",
 		"@wordpress/url": "4.44.0",

projects/packages/newsletter/routes/dashboard/inspector.tsx

@@ -0,0 +1,9 @@
+import { Page } from '@wordpress/admin-ui';
+
+const Inspector = () => {
+	// Subscriber detail content lands in a follow-up PR; the empty Page keeps
+	// the inspector slot stable so the route hook can target it.
+	return <Page hasPadding={ false } />;
+};
+
+export { Inspector as inspector };

projects/packages/newsletter/routes/dashboard/package.json

@@ -3,9 +3,14 @@
 	"version": "1.0.0",
 	"private": true,
 	"dependencies": {
+		"@automattic/jetpack-analytics": "workspace:*",
+		"@automattic/jetpack-script-data": "workspace:*",
+		"@tanstack/react-query": "5.90.8",
 		"@types/react": "18.3.28",
+		"@wordpress/admin-ui": "1.12.0",
 		"@wordpress/element": "6.44.0",
-		"@wordpress/i18n": "6.17.0"
+		"@wordpress/i18n": "6.17.0",
+		"@wordpress/route": "0.10.0"
 	},
 	"route": {
 		"path": "/",

projects/packages/newsletter/routes/dashboard/route.tsx

@@ -1 +1,19 @@
-export const route = {};
+type SubscribersSearch = {
+	subscriber?: string | number;
+	u?: string | number;
+};
+
+export const route = {
+	/**
+	 * Show the inspector slot only when a subscriber is selected via URL params.
+	 * Boot's router calls this on every navigation and uses the boolean to
+	 * decide whether to render the `<Inspector />` export.
+	 *
+	 * @param ctx        - Route loader context.
+	 * @param ctx.search - URL search-param record.
+	 * @return Whether to render the inspector slot.
+	 */
+	inspector: ( { search }: { search: SubscribersSearch } ) => {
+		return Boolean( search?.subscriber || search?.u );
+	},
+};

projects/packages/newsletter/routes/dashboard/stage.tsx

@@ -1,6 +1,27 @@
+import analytics from '@automattic/jetpack-analytics';
+import { QueryClientProvider } from '@tanstack/react-query';
+import { Page } from '@wordpress/admin-ui';
+import { useEffect } from '@wordpress/element';
+import { queryClient } from '../../_inc/subscribers/lib/query-client';
+import { getNewsletterScriptData } from '../../src/settings/script-data';
+
 const Stage = () => {
-	// "Newsletter" is a product name, do not translate.
-	return <h1>Newsletter</h1>;
+	// Initialize analytics once for the entire page so future tab/section
+	// events fire regardless of which tab a visitor lands on. Mirrors the
+	// initialization that lived in the legacy `NewsletterSettingsApp`.
+	useEffect( () => {
+		const tracksUserData = getNewsletterScriptData()?.tracksUserData;
+		if ( tracksUserData && typeof tracksUserData === 'object' ) {
+			analytics.initialize( tracksUserData.userid, tracksUserData.username );
+		}
+	}, [] );
+
+	return (
+		<QueryClientProvider client={ queryClient }>
+			{ /* "Newsletter" is a product name, do not translate. */ }
+			<Page title="Newsletter" />
+		</QueryClientProvider>
+	);
 };
 
 export { Stage as stage };

projects/packages/wp-build-polyfills/changelog/fix-late-register

@@ -0,0 +1,3 @@
+Significance: patch
+Type: fixed
+Comment: Internal — register polyfills synchronously when wp_default_scripts has already fired, so wp-build admin pages render reliably regardless of which plugin first instantiated wp_scripts().

projects/packages/wp-build-polyfills/src/class-wp-build-polyfills.php

@@ -92,6 +92,19 @@ public static function register( $consumer, $polyfills, $wp_version_threshold =
 		$build_dir    = $package_root . '/build';
 		$base_file    = $package_root . '/composer.json';
 
+		// `wp_default_scripts` fires once when the WP_Scripts singleton is
+		// instantiated. If something has already initialized `wp_scripts()` —
+		// common on admin requests where WP or other plugins register scripts
+		// before `admin_menu` priority 1 runs — adding this hook here is too
+		// late and the polyfills never register. Detect that case and run the
+		// registration synchronously so consumers can rely on the script
+		// handles and module IDs being available regardless of init order.
+		if ( did_action( 'wp_default_scripts' ) ) {
+			self::register_scripts( wp_scripts(), $build_dir, $base_file, self::$wp_version_threshold );
+			self::register_modules( $build_dir, $base_file );
+			return;
+		}
+
 		add_action(
 			'wp_default_scripts',
 			function ( $scripts ) use ( $build_dir, $base_file ) {