From 9ef64fb0892c5d57df27c264edd963a19f23b492 Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Mon, 15 Jul 2024 15:35:40 +0530
Subject: [PATCH 01/37] Create webpack utils for dependency extraction

---
 .../js-packages/webpack-config/package.json   |  3 +-
 .../webpack-config/src/dependencies.js        | 40 +++++++++++++++++++
 2 files changed, 42 insertions(+), 1 deletion(-)
 create mode 100644 projects/js-packages/webpack-config/src/dependencies.js

diff --git a/projects/js-packages/webpack-config/package.json b/projects/js-packages/webpack-config/package.json
index 3f54cb8195be1..8f62f59c99a32 100644
--- a/projects/js-packages/webpack-config/package.json
+++ b/projects/js-packages/webpack-config/package.json
@@ -67,6 +67,7 @@
 		".": "./src/index.js",
 		"./webpack": "./src/webpack.js",
 		"./babel": "./src/babel.js",
-		"./babel/preset": "./src/babel-preset.js"
+		"./babel/preset": "./src/babel-preset.js",
+		"./dependencies": "./src/dependencies.js"
 	}
 }
diff --git a/projects/js-packages/webpack-config/src/dependencies.js b/projects/js-packages/webpack-config/src/dependencies.js
new file mode 100644
index 0000000000000..7da1829f0d7a1
--- /dev/null
+++ b/projects/js-packages/webpack-config/src/dependencies.js
@@ -0,0 +1,40 @@
+const {
+	defaultRequestToExternal,
+	defaultRequestToHandle,
+} = require( '@wordpress/dependency-extraction-webpack-plugin/lib/util' );
+
+/**
+ * Used to determine if the module import request should be externalized.
+ *
+ * Here we want to externalize `@automattic/jetpack-publicize`
+ *
+ * @param {string} request - Requested module
+ * @returns {(string|string[]|undefined)} Script global
+ */
+function requestToExternal( request ) {
+	if ( request === '@automattic/jetpack-publicize' ) {
+		return 'JetpackPublicize';
+	}
+
+	return defaultRequestToExternal( request );
+}
+
+/**
+ * Transform @automattic dependencies:
+ * - request `@automattic/jetpack-publicize` becomes `jetpack-publicize`
+ *
+ * @param {string} request - Module request (the module name in `import from`) to be transformed
+ * @returns {string|undefined} Script handle to map the request to.
+ */
+function requestToHandle( request ) {
+	if ( '@automattic/jetpack-publicize' === request ) {
+		return 'jetpack-publicize';
+	}
+
+	return defaultRequestToHandle( request );
+}
+
+module.exports = {
+	requestToExternal,
+	requestToHandle,
+};

From c8b355159535308849cf787f1dd9558476ac629e Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Mon, 15 Jul 2024 15:36:46 +0530
Subject: [PATCH 02/37] Prepare publicize package for bundling

---
 projects/packages/publicize/package.json        | 16 ++++++++++++++++
 projects/packages/publicize/postcss.config.js   | 11 +++++++++++
 .../publicize/src/js/jetpack-publicize.ts       |  5 +++++
 projects/packages/publicize/tsconfig.json       |  4 ++++
 projects/packages/publicize/webpack.config.js   | 17 +++++++++++++++++
 5 files changed, 53 insertions(+)
 create mode 100644 projects/packages/publicize/postcss.config.js
 create mode 100644 projects/packages/publicize/src/js/jetpack-publicize.ts
 create mode 100644 projects/packages/publicize/tsconfig.json

diff --git a/projects/packages/publicize/package.json b/projects/packages/publicize/package.json
index 1330f40ed2ff9..132f94e1cb6ce 100644
--- a/projects/packages/publicize/package.json
+++ b/projects/packages/publicize/package.json
@@ -26,14 +26,30 @@
 	"browserslist": [
 		"extends @wordpress/browserslist-config"
 	],
+	"exports": {
+		".": {
+			"jetpack:src": "./src/js/jetpack-publicize.ts",
+			"default": "./build/jetpack-publicize.js"
+		}
+	},
 	"devDependencies": {
+		"@automattic/calypso-color-schemes": "3.1.3",
+		"@automattic/color-studio": "2.6.0",
 		"@automattic/jetpack-webpack-config": "workspace:*",
+		"@csstools/postcss-global-data": "2.1.1",
 		"@wordpress/browserslist-config": "6.2.0",
+		"autoprefixer": "10.4.14",
 		"concurrently": "7.6.0",
+		"postcss": "8.4.31",
+		"postcss-custom-properties": "12.1.7",
+		"postcss-loader": "6.2.0",
+		"sass": "1.64.1",
+		"sass-loader": "12.4.0",
 		"webpack": "5.76.0",
 		"webpack-cli": "4.9.1"
 	},
 	"dependencies": {
+		"@automattic/jetpack-publicize-components": "workspace:*",
 		"@wordpress/i18n": "5.2.0"
 	}
 }
diff --git a/projects/packages/publicize/postcss.config.js b/projects/packages/publicize/postcss.config.js
new file mode 100644
index 0000000000000..a25afd875c263
--- /dev/null
+++ b/projects/packages/publicize/postcss.config.js
@@ -0,0 +1,11 @@
+module.exports = () => ( {
+	plugins: [
+		require( '@csstools/postcss-global-data' )( {
+			files: [ require.resolve( '@automattic/calypso-color-schemes/root-only/index.css' ) ],
+		} ),
+		require( 'postcss-custom-properties' )( {
+			preserve: false,
+		} ),
+		require( 'autoprefixer' ),
+	],
+} );
diff --git a/projects/packages/publicize/src/js/jetpack-publicize.ts b/projects/packages/publicize/src/js/jetpack-publicize.ts
new file mode 100644
index 0000000000000..f123704b8d1ca
--- /dev/null
+++ b/projects/packages/publicize/src/js/jetpack-publicize.ts
@@ -0,0 +1,5 @@
+export {
+	PostPublishManualSharing,
+	PostPublishReviewPrompt,
+	ConnectionManagement,
+} from '@automattic/jetpack-publicize-components';
diff --git a/projects/packages/publicize/tsconfig.json b/projects/packages/publicize/tsconfig.json
new file mode 100644
index 0000000000000..a2ecf0d6e8fd0
--- /dev/null
+++ b/projects/packages/publicize/tsconfig.json
@@ -0,0 +1,4 @@
+{
+	"extends": "jetpack-js-tools/tsconfig.base.json",
+	"include": [ "./src/js" ]
+}
diff --git a/projects/packages/publicize/webpack.config.js b/projects/packages/publicize/webpack.config.js
index 123017cff7b57..40fbeeed7d122 100644
--- a/projects/packages/publicize/webpack.config.js
+++ b/projects/packages/publicize/webpack.config.js
@@ -1,11 +1,28 @@
 const path = require( 'path' );
 const jetpackWebpackConfig = require( '@automattic/jetpack-webpack-config/webpack' );
 
+/**
+ * @type {import('webpack').Configuration[]} Webpack configuration.
+ */
 module.exports = [
 	{
 		entry: {
 			[ 'classic-editor-share-limits' ]: './src/js/classic-editor-share-limits.js',
 			[ 'classic-editor-connections' ]: './src/js/classic-editor-connections.js',
+			social: {
+				import: './src/js/jetpack-publicize.ts',
+				filename: 'jetpack-publicize.js',
+				library: {
+					name: 'JetpackPublicize',
+					type: 'umd',
+				},
+			},
+		},
+		externals: {
+			...jetpackWebpackConfig.externals,
+			jetpackConfig: JSON.stringify( {
+				consumer_slug: 'jetpack-publicize',
+			} ),
 		},
 		mode: jetpackWebpackConfig.mode,
 		devtool: jetpackWebpackConfig.devtool,

From 9d5b441a6af84e78b8bb2be038639433e2c2873f Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Mon, 15 Jul 2024 15:37:12 +0530
Subject: [PATCH 03/37] Register the publicize assets

---
 .../publicize/src/class-publicize-ui.php      | 22 +++++++++++++++++++
 1 file changed, 22 insertions(+)

diff --git a/projects/packages/publicize/src/class-publicize-ui.php b/projects/packages/publicize/src/class-publicize-ui.php
index a478d88894105..4b51f803785f1 100644
--- a/projects/packages/publicize/src/class-publicize-ui.php
+++ b/projects/packages/publicize/src/class-publicize-ui.php
@@ -58,6 +58,28 @@ public function init() {
 
 		// Management of publicize (sharing screen, ajax/lightbox popup, and metabox on post screen).
 		add_action( 'post_submitbox_misc_actions', array( $this, 'post_page_metabox' ) );
+
+		add_action( 'admin_enqueue_scripts', array( $this, 'register_assets' ) );
+		add_action( 'enqueue_block_editor_assets', array( $this, 'register_assets' ) );
+	}
+
+	/**
+	 * Register assets.
+	 */
+	public function register_assets() {
+
+		if ( ! wp_script_is( 'jetpack-publicize', 'registered' ) ) {
+
+			Assets::register_script(
+				'jetpack-publicize',
+				'../build/jetpack-publicize.js',
+				__FILE__,
+				array(
+					'in_footer'  => true,
+					'textdomain' => 'jetpack-publicize-pkg',
+				)
+			);
+		}
 	}
 
 	/**

From bdd3df4cc353e51eda27953149946d838d3fc7f8 Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Mon, 15 Jul 2024 15:38:00 +0530
Subject: [PATCH 04/37] Prepare Jetpack plugin to brace the new norm

---
 .../jetpack/_inc/client/sharing/publicize.jsx  |  6 ++----
 .../plugins/publicize/post-publish.js          |  5 +----
 projects/plugins/jetpack/package.json          |  2 ++
 .../jetpack/tools/webpack.config.extensions.js | 11 ++++++++++-
 .../plugins/jetpack/tools/webpack.config.js    | 18 ++++++++++++++++--
 5 files changed, 31 insertions(+), 11 deletions(-)

diff --git a/projects/plugins/jetpack/_inc/client/sharing/publicize.jsx b/projects/plugins/jetpack/_inc/client/sharing/publicize.jsx
index ca1a10f703965..210928044e188 100644
--- a/projects/plugins/jetpack/_inc/client/sharing/publicize.jsx
+++ b/projects/plugins/jetpack/_inc/client/sharing/publicize.jsx
@@ -1,8 +1,6 @@
 import { getRedirectUrl } from '@automattic/jetpack-components';
-import {
-	ConnectionManagement,
-	RefreshJetpackSocialSettingsWrapper,
-} from '@automattic/jetpack-publicize-components';
+import { ConnectionManagement } from '@automattic/jetpack-publicize';
+import { RefreshJetpackSocialSettingsWrapper } from '@automattic/jetpack-publicize-components';
 import { createInterpolateElement } from '@wordpress/element';
 import { __, _x } from '@wordpress/i18n';
 import Card from 'components/card';
diff --git a/projects/plugins/jetpack/extensions/plugins/publicize/post-publish.js b/projects/plugins/jetpack/extensions/plugins/publicize/post-publish.js
index f3cceba56e3bf..62e36c5c9f20d 100644
--- a/projects/plugins/jetpack/extensions/plugins/publicize/post-publish.js
+++ b/projects/plugins/jetpack/extensions/plugins/publicize/post-publish.js
@@ -1,7 +1,4 @@
-import {
-	PostPublishManualSharing,
-	PostPublishReviewPrompt,
-} from '@automattic/jetpack-publicize-components';
+import { PostPublishManualSharing, PostPublishReviewPrompt } from '@automattic/jetpack-publicize';
 
 const PostPublishPanels = () => {
 	return (
diff --git a/projects/plugins/jetpack/package.json b/projects/plugins/jetpack/package.json
index 6e36c4931a746..ce0b57c481058 100644
--- a/projects/plugins/jetpack/package.json
+++ b/projects/plugins/jetpack/package.json
@@ -55,6 +55,7 @@
 		"@automattic/jetpack-licensing": "workspace:*",
 		"@automattic/jetpack-my-jetpack": "workspace:*",
 		"@automattic/jetpack-partner-coupon": "workspace:*",
+		"@automattic/jetpack-publicize": "workspace:*",
 		"@automattic/jetpack-publicize-components": "workspace:*",
 		"@automattic/jetpack-shared-extension-utils": "workspace:*",
 		"@automattic/popup-monitor": "1.0.2",
@@ -139,6 +140,7 @@
 		"@wordpress/block-serialization-default-parser": "5.2.0",
 		"@wordpress/components": "28.2.0",
 		"@wordpress/core-data": "7.2.0",
+		"@wordpress/dependency-extraction-webpack-plugin": "5.9.0",
 		"@wordpress/dom-ready": "4.2.0",
 		"@wordpress/editor": "14.2.0",
 		"@wordpress/escape-html": "3.2.0",
diff --git a/projects/plugins/jetpack/tools/webpack.config.extensions.js b/projects/plugins/jetpack/tools/webpack.config.extensions.js
index ac538c63d9e8f..506126e20a6d6 100644
--- a/projects/plugins/jetpack/tools/webpack.config.extensions.js
+++ b/projects/plugins/jetpack/tools/webpack.config.extensions.js
@@ -4,6 +4,10 @@
 
 const fs = require( 'fs' );
 const path = require( 'path' );
+const {
+	requestToExternal,
+	requestToHandle,
+} = require( '@automattic/jetpack-webpack-config/dependencies' );
 const jetpackWebpackConfig = require( '@automattic/jetpack-webpack-config/webpack' );
 const webpack = jetpackWebpackConfig.webpack;
 const RemoveAssetWebpackPlugin = require( '@automattic/remove-asset-webpack-plugin' );
@@ -111,7 +115,12 @@ const sharedWebpackConfig = {
 	node: {},
 	plugins: [
 		...jetpackWebpackConfig.StandardPlugins( {
-			DependencyExtractionPlugin: { injectPolyfill: true },
+			DependencyExtractionPlugin: {
+				injectPolyfill: true,
+				useDefaults: false,
+				requestToExternal,
+				requestToHandle,
+			},
 		} ),
 	],
 	externals: {
diff --git a/projects/plugins/jetpack/tools/webpack.config.js b/projects/plugins/jetpack/tools/webpack.config.js
index 7a877ec472d0e..07e7a5dee452e 100644
--- a/projects/plugins/jetpack/tools/webpack.config.js
+++ b/projects/plugins/jetpack/tools/webpack.config.js
@@ -1,4 +1,8 @@
 const path = require( 'path' );
+const {
+	requestToExternal,
+	requestToHandle,
+} = require( '@automattic/jetpack-webpack-config/dependencies' );
 const jetpackWebpackConfig = require( '@automattic/jetpack-webpack-config/webpack' );
 const RemoveAssetWebpackPlugin = require( '@automattic/remove-asset-webpack-plugin' );
 const { glob } = require( 'glob' );
@@ -125,7 +129,12 @@ module.exports = [
 		entry: moduleEntries,
 		plugins: [
 			...sharedWebpackConfig.plugins,
-			...jetpackWebpackConfig.DependencyExtractionPlugin(),
+			...jetpackWebpackConfig.DependencyExtractionPlugin( {
+				injectPolyfill: true,
+				useDefaults: false,
+				requestToExternal,
+				requestToHandle,
+			} ),
 		],
 		output: {
 			...sharedWebpackConfig.output,
@@ -149,7 +158,12 @@ module.exports = [
 		},
 		plugins: [
 			...sharedWebpackConfig.plugins,
-			...jetpackWebpackConfig.DependencyExtractionPlugin( { injectPolyfill: true } ),
+			...jetpackWebpackConfig.DependencyExtractionPlugin( {
+				injectPolyfill: true,
+				useDefaults: false,
+				requestToExternal,
+				requestToHandle,
+			} ),
 		],
 		externals: {
 			...sharedWebpackConfig.externals,

From 2524fd6817d442089df3b3483e2bd9b23a2e7cd5 Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Mon, 15 Jul 2024 15:38:19 +0530
Subject: [PATCH 05/37] Prepare social for the reform

---
 projects/plugins/social/package.json                  |  2 ++
 .../src/js/components/social-module-toggle/index.tsx  |  3 ++-
 projects/plugins/social/src/js/editor.js              |  3 +--
 projects/plugins/social/webpack.config.js             | 11 ++++++++++-
 4 files changed, 15 insertions(+), 4 deletions(-)

diff --git a/projects/plugins/social/package.json b/projects/plugins/social/package.json
index afe830e62e0d4..a8030799f70d5 100644
--- a/projects/plugins/social/package.json
+++ b/projects/plugins/social/package.json
@@ -31,6 +31,7 @@
 		"@automattic/jetpack-connection": "workspace:*",
 		"@automattic/jetpack-publicize-components": "workspace:*",
 		"@automattic/jetpack-shared-extension-utils": "workspace:*",
+		"@automattic/jetpack-publicize": "workspace:*",
 		"@wordpress/api-fetch": "7.2.0",
 		"@wordpress/components": "28.2.0",
 		"@wordpress/data": "10.2.0",
@@ -55,6 +56,7 @@
 		"@types/react": "18.3.1",
 		"@types/react-dom": "18.3.0",
 		"@wordpress/browserslist-config": "6.2.0",
+		"@wordpress/dependency-extraction-webpack-plugin": "5.9.0",
 		"autoprefixer": "10.4.14",
 		"babel-jest": "29.4.3",
 		"concurrently": "7.6.0",
diff --git a/projects/plugins/social/src/js/components/social-module-toggle/index.tsx b/projects/plugins/social/src/js/components/social-module-toggle/index.tsx
index aad58eb516cb3..419280e94b735 100644
--- a/projects/plugins/social/src/js/components/social-module-toggle/index.tsx
+++ b/projects/plugins/social/src/js/components/social-module-toggle/index.tsx
@@ -5,7 +5,8 @@ import {
 	getRedirectUrl,
 	useBreakpointMatch,
 } from '@automattic/jetpack-components';
-import { ConnectionManagement, SOCIAL_STORE_ID } from '@automattic/jetpack-publicize-components';
+import { ConnectionManagement } from '@automattic/jetpack-publicize';
+import { SOCIAL_STORE_ID } from '@automattic/jetpack-publicize-components';
 import { ExternalLink } from '@wordpress/components';
 import { useSelect, useDispatch } from '@wordpress/data';
 import { __ } from '@wordpress/i18n';
diff --git a/projects/plugins/social/src/js/editor.js b/projects/plugins/social/src/js/editor.js
index 840a63360981f..b6bcd4e54cf6a 100644
--- a/projects/plugins/social/src/js/editor.js
+++ b/projects/plugins/social/src/js/editor.js
@@ -1,4 +1,5 @@
 import { SocialIcon } from '@automattic/jetpack-components';
+import { PostPublishManualSharing, PostPublishReviewPrompt } from '@automattic/jetpack-publicize';
 import {
 	SocialPreviewsModal,
 	SocialPreviewsPanel,
@@ -6,8 +7,6 @@ import {
 	usePublicizeConfig,
 	useSocialMediaConnections,
 	PublicizePanel,
-	PostPublishReviewPrompt,
-	PostPublishManualSharing,
 	useSyncPostDataToStore,
 } from '@automattic/jetpack-publicize-components';
 import { JetpackEditorPanelLogo } from '@automattic/jetpack-shared-extension-utils';
diff --git a/projects/plugins/social/webpack.config.js b/projects/plugins/social/webpack.config.js
index a86334fca5478..b3ce79a4f472a 100644
--- a/projects/plugins/social/webpack.config.js
+++ b/projects/plugins/social/webpack.config.js
@@ -1,4 +1,8 @@
 const path = require( 'path' );
+const {
+	requestToExternal,
+	requestToHandle,
+} = require( '@automattic/jetpack-webpack-config/dependencies' );
 const jetpackWebpackConfig = require( '@automattic/jetpack-webpack-config/webpack' );
 const socialWebpackConfig = {
 	mode: jetpackWebpackConfig.mode,
@@ -16,7 +20,12 @@ const socialWebpackConfig = {
 	node: false,
 	plugins: [
 		...jetpackWebpackConfig.StandardPlugins( {
-			DependencyExtractionPlugin: { injectPolyfill: true },
+			DependencyExtractionPlugin: {
+				injectPolyfill: true,
+				useDefaults: false,
+				requestToExternal,
+				requestToHandle,
+			},
 		} ),
 	],
 	module: {

From 23bd3ea0e1d186fc928e864dbfbeb8a26bfc9eae Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Mon, 15 Jul 2024 15:38:34 +0530
Subject: [PATCH 06/37] Update pnpm-lock.yaml

---
 pnpm-lock.yaml | 42 ++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 42 insertions(+)

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 31a8e780d1f55..afb551c933c63 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -2478,19 +2478,49 @@ importers:
 
   projects/packages/publicize:
     dependencies:
+      '@automattic/jetpack-publicize-components':
+        specifier: workspace:*
+        version: link:../../js-packages/publicize-components
       '@wordpress/i18n':
         specifier: 5.2.0
         version: 5.2.0
     devDependencies:
+      '@automattic/calypso-color-schemes':
+        specifier: 3.1.3
+        version: 3.1.3
+      '@automattic/color-studio':
+        specifier: 2.6.0
+        version: 2.6.0
       '@automattic/jetpack-webpack-config':
         specifier: workspace:*
         version: link:../../js-packages/webpack-config
+      '@csstools/postcss-global-data':
+        specifier: 2.1.1
+        version: 2.1.1(postcss@8.4.31)
       '@wordpress/browserslist-config':
         specifier: 6.2.0
         version: 6.2.0
+      autoprefixer:
+        specifier: 10.4.14
+        version: 10.4.14(postcss@8.4.31)
       concurrently:
         specifier: 7.6.0
         version: 7.6.0
+      postcss:
+        specifier: 8.4.31
+        version: 8.4.31
+      postcss-custom-properties:
+        specifier: 12.1.7
+        version: 12.1.7(postcss@8.4.31)
+      postcss-loader:
+        specifier: 6.2.0
+        version: 6.2.0(postcss@8.4.31)(webpack@5.76.0(webpack-cli@4.9.1))
+      sass:
+        specifier: 1.64.1
+        version: 1.64.1
+      sass-loader:
+        specifier: 12.4.0
+        version: 12.4.0(sass@1.64.1)(webpack@5.76.0(webpack-cli@4.9.1))
       webpack:
         specifier: 5.76.0
         version: 5.76.0(webpack-cli@4.9.1)
@@ -3637,6 +3667,9 @@ importers:
       '@automattic/jetpack-partner-coupon':
         specifier: workspace:*
         version: link:../../js-packages/partner-coupon
+      '@automattic/jetpack-publicize':
+        specifier: workspace:*
+        version: link:../../packages/publicize
       '@automattic/jetpack-publicize-components':
         specifier: workspace:*
         version: link:../../js-packages/publicize-components
@@ -3891,6 +3924,9 @@ importers:
       '@wordpress/core-data':
         specifier: 7.2.0
         version: 7.2.0(@types/react@18.3.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@wordpress/dependency-extraction-webpack-plugin':
+        specifier: 5.9.0
+        version: 5.9.0(webpack@5.76.0(webpack-cli@4.9.1))
       '@wordpress/dom-ready':
         specifier: 4.2.0
         version: 4.2.0
@@ -4191,6 +4227,9 @@ importers:
       '@automattic/jetpack-connection':
         specifier: workspace:*
         version: link:../../js-packages/connection
+      '@automattic/jetpack-publicize':
+        specifier: workspace:*
+        version: link:../../packages/publicize
       '@automattic/jetpack-publicize-components':
         specifier: workspace:*
         version: link:../../js-packages/publicize-components
@@ -4264,6 +4303,9 @@ importers:
       '@wordpress/browserslist-config':
         specifier: 6.2.0
         version: 6.2.0
+      '@wordpress/dependency-extraction-webpack-plugin':
+        specifier: 5.9.0
+        version: 5.9.0(webpack@5.76.0(webpack-cli@4.9.1))
       autoprefixer:
         specifier: 10.4.14
         version: 10.4.14(postcss@8.4.31)

From d0d5f4d40d57488bd8ff3ac9b1a079ab84a2138f Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Mon, 15 Jul 2024 15:38:55 +0530
Subject: [PATCH 07/37] Ensure that initial state is rendered before publicize
 handle

---
 .../_inc/lib/admin-pages/class.jetpack-react-page.php  | 10 ++++++----
 projects/plugins/jetpack/class.jetpack-gutenberg.php   |  4 ++--
 projects/plugins/social/src/class-jetpack-social.php   | 10 +++++-----
 3 files changed, 13 insertions(+), 11 deletions(-)

diff --git a/projects/plugins/jetpack/_inc/lib/admin-pages/class.jetpack-react-page.php b/projects/plugins/jetpack/_inc/lib/admin-pages/class.jetpack-react-page.php
index 56b96499d14a4..05f42d906e4e7 100644
--- a/projects/plugins/jetpack/_inc/lib/admin-pages/class.jetpack-react-page.php
+++ b/projects/plugins/jetpack/_inc/lib/admin-pages/class.jetpack-react-page.php
@@ -289,17 +289,19 @@ public function page_admin_scripts() {
 			// Required for Analytics.
 			wp_enqueue_script( 'jp-tracks', '//stats.wp.com/w.js', array(), gmdate( 'YW' ), true );
 		}
+		// The script handle for the initial state.
+		$initial_state_handle = 'jetpack-publicize';
 
-		wp_set_script_translations( 'react-plugin', 'jetpack' );
+		wp_set_script_translations( $initial_state_handle, 'jetpack' );
 
 		// Add objects to be passed to the initial state of the app.
 		// Use wp_add_inline_script instead of wp_localize_script, see https://core.trac.wordpress.org/ticket/25280.
-		wp_add_inline_script( 'react-plugin', 'var Initial_State=JSON.parse(decodeURIComponent("' . rawurlencode( wp_json_encode( Jetpack_Redux_State_Helper::get_initial_state() ) ) . '"));', 'before' );
+		wp_add_inline_script( $initial_state_handle, 'var Initial_State=JSON.parse(decodeURIComponent("' . rawurlencode( wp_json_encode( Jetpack_Redux_State_Helper::get_initial_state() ) ) . '"));', 'before' );
 
 		// This will set the default URL of the jp_redirects lib.
-		wp_add_inline_script( 'react-plugin', 'var jetpack_redirects = { currentSiteRawUrl: "' . $site_suffix . '"' . $blog_id_prop . ' };', 'before' );
+		wp_add_inline_script( $initial_state_handle, 'var jetpack_redirects = { currentSiteRawUrl: "' . $site_suffix . '"' . $blog_id_prop . ' };', 'before' );
 
 		// Adds Connection package initial state.
-		Connection_Initial_State::render_script( 'react-plugin' );
+		Connection_Initial_State::render_script( $initial_state_handle );
 	}
 }
diff --git a/projects/plugins/jetpack/class.jetpack-gutenberg.php b/projects/plugins/jetpack/class.jetpack-gutenberg.php
index fd13cf4b19484..5195399ce401b 100644
--- a/projects/plugins/jetpack/class.jetpack-gutenberg.php
+++ b/projects/plugins/jetpack/class.jetpack-gutenberg.php
@@ -770,13 +770,13 @@ public static function enqueue_block_editor_assets() {
 		}
 
 		wp_localize_script(
-			'jetpack-blocks-editor',
+			'jetpack-publicize',
 			'Jetpack_Editor_Initial_State',
 			$initial_state
 		);
 
 		// Adds Connection package initial state.
-		Connection_Initial_State::render_script( 'jetpack-blocks-editor' );
+		Connection_Initial_State::render_script( 'jetpack-publicize' );
 	}
 
 	/**
diff --git a/projects/plugins/social/src/class-jetpack-social.php b/projects/plugins/social/src/class-jetpack-social.php
index a347f7c8bf74a..3a5a801176eb6 100644
--- a/projects/plugins/social/src/class-jetpack-social.php
+++ b/projects/plugins/social/src/class-jetpack-social.php
@@ -179,8 +179,8 @@ public function enqueue_admin_scripts() {
 
 		Assets::enqueue_script( 'jetpack-social' );
 		// Initial JS state including JP Connection data.
-		Connection_Initial_State::render_script( 'jetpack-social' );
-		wp_add_inline_script( 'jetpack-social', $this->render_initial_state(), 'before' );
+		Connection_Initial_State::render_script( 'jetpack-publicize' );
+		wp_add_inline_script( 'jetpack-publicize', $this->render_initial_state(), 'before' );
 	}
 
 	/**
@@ -353,7 +353,7 @@ class_exists( 'Jetpack' ) ||
 		}
 
 		wp_localize_script(
-			'jetpack-social-editor',
+			'jetpack-publicize',
 			'Jetpack_Editor_Initial_State',
 			array(
 				'siteFragment' => ( new Status() )->get_site_suffix(),
@@ -363,7 +363,7 @@ class_exists( 'Jetpack' ) ||
 		);
 
 		// Connection initial state is expected when the connection JS package is in the bundle
-		Connection_Initial_State::render_script( 'jetpack-social-editor' );
+		Connection_Initial_State::render_script( 'jetpack-publicize' );
 		// Conditionally load analytics scripts
 		// The only component using analytics in the editor at the moment is the review request
 		if ( ! in_array( get_post_status(), array( 'publish', 'private', 'trash' ), true ) && self::can_use_analytics() && ! self::is_review_request_dismissed() ) {
@@ -386,7 +386,7 @@ public function add_review_initial_state() {
 		);
 
 		wp_add_inline_script(
-			class_exists( 'Jetpack' ) ? 'jetpack-blocks-editor' : 'jetpack-social-editor',
+			'jetpack-publicize',
 			sprintf( 'Object.assign( window.Jetpack_Editor_Initial_State.social, %s )', wp_json_encode( $review_state ) ),
 			'after'
 		);

From 21bb40b6f47f977266b1afbbb7a9bc229e4a735d Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Mon, 15 Jul 2024 15:40:19 +0530
Subject: [PATCH 08/37] Add changelogs

---
 .../changelog/update-unbundle-publicize-from-jetpack         | 5 +++++
 .../changelog/update-unbundle-publicize-from-jetpack         | 5 +++++
 .../jetpack/changelog/update-unbundle-publicize-from-jetpack | 5 +++++
 .../social/changelog/update-unbundle-publicize-from-jetpack  | 5 +++++
 4 files changed, 20 insertions(+)
 create mode 100644 projects/js-packages/webpack-config/changelog/update-unbundle-publicize-from-jetpack
 create mode 100644 projects/packages/publicize/changelog/update-unbundle-publicize-from-jetpack
 create mode 100644 projects/plugins/jetpack/changelog/update-unbundle-publicize-from-jetpack
 create mode 100644 projects/plugins/social/changelog/update-unbundle-publicize-from-jetpack

diff --git a/projects/js-packages/webpack-config/changelog/update-unbundle-publicize-from-jetpack b/projects/js-packages/webpack-config/changelog/update-unbundle-publicize-from-jetpack
new file mode 100644
index 0000000000000..a6969effb9841
--- /dev/null
+++ b/projects/js-packages/webpack-config/changelog/update-unbundle-publicize-from-jetpack
@@ -0,0 +1,5 @@
+Significance: patch
+Type: changed
+Comment: Bundling tools update
+
+
diff --git a/projects/packages/publicize/changelog/update-unbundle-publicize-from-jetpack b/projects/packages/publicize/changelog/update-unbundle-publicize-from-jetpack
new file mode 100644
index 0000000000000..a6969effb9841
--- /dev/null
+++ b/projects/packages/publicize/changelog/update-unbundle-publicize-from-jetpack
@@ -0,0 +1,5 @@
+Significance: patch
+Type: changed
+Comment: Bundling tools update
+
+
diff --git a/projects/plugins/jetpack/changelog/update-unbundle-publicize-from-jetpack b/projects/plugins/jetpack/changelog/update-unbundle-publicize-from-jetpack
new file mode 100644
index 0000000000000..14dd075249cf3
--- /dev/null
+++ b/projects/plugins/jetpack/changelog/update-unbundle-publicize-from-jetpack
@@ -0,0 +1,5 @@
+Significance: patch
+Type: other
+Comment: Bundling tools update
+
+
diff --git a/projects/plugins/social/changelog/update-unbundle-publicize-from-jetpack b/projects/plugins/social/changelog/update-unbundle-publicize-from-jetpack
new file mode 100644
index 0000000000000..a6969effb9841
--- /dev/null
+++ b/projects/plugins/social/changelog/update-unbundle-publicize-from-jetpack
@@ -0,0 +1,5 @@
+Significance: patch
+Type: changed
+Comment: Bundling tools update
+
+

From 8126aaeeb884b81c3f7269e864fd1bc8aab7f7f5 Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Mon, 15 Jul 2024 15:56:41 +0530
Subject: [PATCH 09/37] Fix up versions

---
 projects/js-packages/webpack-config/package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/projects/js-packages/webpack-config/package.json b/projects/js-packages/webpack-config/package.json
index 8f62f59c99a32..25e535ed71eb4 100644
--- a/projects/js-packages/webpack-config/package.json
+++ b/projects/js-packages/webpack-config/package.json
@@ -1,7 +1,7 @@
 {
 	"private": true,
 	"name": "@automattic/jetpack-webpack-config",
-	"version": "3.2.10",
+	"version": "3.2.11-alpha",
 	"description": "Library of pieces for webpack config in Jetpack projects.",
 	"homepage": "https://github.com/Automattic/jetpack/tree/HEAD/projects/js-packages/webpack-config/#readme",
 	"bugs": {

From 8aa53ca47eab62fd137afbc26cc7f13a36bfc97a Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Tue, 16 Jul 2024 10:27:51 +0530
Subject: [PATCH 10/37] Update changelogs

---
 .../changelog/update-unbundle-publicize-from-jetpack       | 7 +++----
 .../changelog/update-unbundle-publicize-from-jetpack       | 7 +++----
 .../changelog/update-unbundle-publicize-from-jetpack       | 5 ++---
 .../changelog/update-unbundle-publicize-from-jetpack       | 7 +++----
 4 files changed, 11 insertions(+), 15 deletions(-)

diff --git a/projects/js-packages/webpack-config/changelog/update-unbundle-publicize-from-jetpack b/projects/js-packages/webpack-config/changelog/update-unbundle-publicize-from-jetpack
index a6969effb9841..ccdfc97f79171 100644
--- a/projects/js-packages/webpack-config/changelog/update-unbundle-publicize-from-jetpack
+++ b/projects/js-packages/webpack-config/changelog/update-unbundle-publicize-from-jetpack
@@ -1,5 +1,4 @@
-Significance: patch
-Type: changed
-Comment: Bundling tools update
-
+Significance: minor
+Type: added
 
+Extracted common UI logic from Social to publicize package to load it dynamically at runtime
diff --git a/projects/packages/publicize/changelog/update-unbundle-publicize-from-jetpack b/projects/packages/publicize/changelog/update-unbundle-publicize-from-jetpack
index a6969effb9841..ccdfc97f79171 100644
--- a/projects/packages/publicize/changelog/update-unbundle-publicize-from-jetpack
+++ b/projects/packages/publicize/changelog/update-unbundle-publicize-from-jetpack
@@ -1,5 +1,4 @@
-Significance: patch
-Type: changed
-Comment: Bundling tools update
-
+Significance: minor
+Type: added
 
+Extracted common UI logic from Social to publicize package to load it dynamically at runtime
diff --git a/projects/plugins/jetpack/changelog/update-unbundle-publicize-from-jetpack b/projects/plugins/jetpack/changelog/update-unbundle-publicize-from-jetpack
index 14dd075249cf3..b82a168e6e80c 100644
--- a/projects/plugins/jetpack/changelog/update-unbundle-publicize-from-jetpack
+++ b/projects/plugins/jetpack/changelog/update-unbundle-publicize-from-jetpack
@@ -1,5 +1,4 @@
-Significance: patch
+Significance: minor
 Type: other
-Comment: Bundling tools update
-
 
+Extracted common UI logic from Jetpack to publicize package to load it dynamically at runtime
diff --git a/projects/plugins/social/changelog/update-unbundle-publicize-from-jetpack b/projects/plugins/social/changelog/update-unbundle-publicize-from-jetpack
index a6969effb9841..ccdfc97f79171 100644
--- a/projects/plugins/social/changelog/update-unbundle-publicize-from-jetpack
+++ b/projects/plugins/social/changelog/update-unbundle-publicize-from-jetpack
@@ -1,5 +1,4 @@
-Significance: patch
-Type: changed
-Comment: Bundling tools update
-
+Significance: minor
+Type: added
 
+Extracted common UI logic from Social to publicize package to load it dynamically at runtime

From 719e08c56839153cfeb23455ec6951162a280a75 Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Tue, 16 Jul 2024 10:58:01 +0530
Subject: [PATCH 11/37] Use defaultRequestMap for extracting dependencies

---
 pnpm-lock.yaml                                |  6 ---
 .../js-packages/webpack-config/package.json   |  5 +--
 .../webpack-config/src/dependencies.js        | 40 -------------------
 .../js-packages/webpack-config/src/webpack.js | 27 ++++++++++++-
 projects/plugins/jetpack/package.json         |  1 -
 .../tools/webpack.config.extensions.js        | 11 +----
 .../plugins/jetpack/tools/webpack.config.js   | 18 +--------
 projects/plugins/social/package.json          |  1 -
 projects/plugins/social/webpack.config.js     | 11 +----
 9 files changed, 32 insertions(+), 88 deletions(-)
 delete mode 100644 projects/js-packages/webpack-config/src/dependencies.js

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index afb551c933c63..c73c0e6478896 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -3924,9 +3924,6 @@ importers:
       '@wordpress/core-data':
         specifier: 7.2.0
         version: 7.2.0(@types/react@18.3.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
-      '@wordpress/dependency-extraction-webpack-plugin':
-        specifier: 5.9.0
-        version: 5.9.0(webpack@5.76.0(webpack-cli@4.9.1))
       '@wordpress/dom-ready':
         specifier: 4.2.0
         version: 4.2.0
@@ -4303,9 +4300,6 @@ importers:
       '@wordpress/browserslist-config':
         specifier: 6.2.0
         version: 6.2.0
-      '@wordpress/dependency-extraction-webpack-plugin':
-        specifier: 5.9.0
-        version: 5.9.0(webpack@5.76.0(webpack-cli@4.9.1))
       autoprefixer:
         specifier: 10.4.14
         version: 10.4.14(postcss@8.4.31)
diff --git a/projects/js-packages/webpack-config/package.json b/projects/js-packages/webpack-config/package.json
index 25e535ed71eb4..3f54cb8195be1 100644
--- a/projects/js-packages/webpack-config/package.json
+++ b/projects/js-packages/webpack-config/package.json
@@ -1,7 +1,7 @@
 {
 	"private": true,
 	"name": "@automattic/jetpack-webpack-config",
-	"version": "3.2.11-alpha",
+	"version": "3.2.10",
 	"description": "Library of pieces for webpack config in Jetpack projects.",
 	"homepage": "https://github.com/Automattic/jetpack/tree/HEAD/projects/js-packages/webpack-config/#readme",
 	"bugs": {
@@ -67,7 +67,6 @@
 		".": "./src/index.js",
 		"./webpack": "./src/webpack.js",
 		"./babel": "./src/babel.js",
-		"./babel/preset": "./src/babel-preset.js",
-		"./dependencies": "./src/dependencies.js"
+		"./babel/preset": "./src/babel-preset.js"
 	}
 }
diff --git a/projects/js-packages/webpack-config/src/dependencies.js b/projects/js-packages/webpack-config/src/dependencies.js
deleted file mode 100644
index 7da1829f0d7a1..0000000000000
--- a/projects/js-packages/webpack-config/src/dependencies.js
+++ /dev/null
@@ -1,40 +0,0 @@
-const {
-	defaultRequestToExternal,
-	defaultRequestToHandle,
-} = require( '@wordpress/dependency-extraction-webpack-plugin/lib/util' );
-
-/**
- * Used to determine if the module import request should be externalized.
- *
- * Here we want to externalize `@automattic/jetpack-publicize`
- *
- * @param {string} request - Requested module
- * @returns {(string|string[]|undefined)} Script global
- */
-function requestToExternal( request ) {
-	if ( request === '@automattic/jetpack-publicize' ) {
-		return 'JetpackPublicize';
-	}
-
-	return defaultRequestToExternal( request );
-}
-
-/**
- * Transform @automattic dependencies:
- * - request `@automattic/jetpack-publicize` becomes `jetpack-publicize`
- *
- * @param {string} request - Module request (the module name in `import from`) to be transformed
- * @returns {string|undefined} Script handle to map the request to.
- */
-function requestToHandle( request ) {
-	if ( '@automattic/jetpack-publicize' === request ) {
-		return 'jetpack-publicize';
-	}
-
-	return defaultRequestToHandle( request );
-}
-
-module.exports = {
-	requestToExternal,
-	requestToHandle,
-};
diff --git a/projects/js-packages/webpack-config/src/webpack.js b/projects/js-packages/webpack-config/src/webpack.js
index caa64d98f278f..40b2ce25cd882 100644
--- a/projects/js-packages/webpack-config/src/webpack.js
+++ b/projects/js-packages/webpack-config/src/webpack.js
@@ -105,7 +105,32 @@ const DefinePlugin = defines => [
 	} ),
 ];
 
-const DependencyExtractionPlugin = options => [ new DependencyExtractionWebpackPlugin( options ) ];
+const defaultRequestMap = {
+	'@automattic/jetpack-publicize': {
+		external: 'JetpackPublicize',
+		handle: 'jetpack-publicize',
+	},
+};
+
+const DependencyExtractionPlugin = ( { requestMap, ...options } = {} ) => {
+	const finalRequestMap = { ...defaultRequestMap, ...requestMap };
+
+	const requestToExternal = request => {
+		return finalRequestMap[ request ]?.external || undefined;
+	};
+
+	const requestToHandle = request => {
+		return finalRequestMap[ request ]?.handle || undefined;
+	};
+
+	return [
+		new DependencyExtractionWebpackPlugin( {
+			...options,
+			requestToExternal,
+			requestToHandle,
+		} ),
+	];
+};
 
 const DuplicatePackageCheckerPlugin = options => [
 	new DuplicatePackageCheckerWebpackPlugin( options ),
diff --git a/projects/plugins/jetpack/package.json b/projects/plugins/jetpack/package.json
index ce0b57c481058..44e58609c8426 100644
--- a/projects/plugins/jetpack/package.json
+++ b/projects/plugins/jetpack/package.json
@@ -140,7 +140,6 @@
 		"@wordpress/block-serialization-default-parser": "5.2.0",
 		"@wordpress/components": "28.2.0",
 		"@wordpress/core-data": "7.2.0",
-		"@wordpress/dependency-extraction-webpack-plugin": "5.9.0",
 		"@wordpress/dom-ready": "4.2.0",
 		"@wordpress/editor": "14.2.0",
 		"@wordpress/escape-html": "3.2.0",
diff --git a/projects/plugins/jetpack/tools/webpack.config.extensions.js b/projects/plugins/jetpack/tools/webpack.config.extensions.js
index 506126e20a6d6..ac538c63d9e8f 100644
--- a/projects/plugins/jetpack/tools/webpack.config.extensions.js
+++ b/projects/plugins/jetpack/tools/webpack.config.extensions.js
@@ -4,10 +4,6 @@
 
 const fs = require( 'fs' );
 const path = require( 'path' );
-const {
-	requestToExternal,
-	requestToHandle,
-} = require( '@automattic/jetpack-webpack-config/dependencies' );
 const jetpackWebpackConfig = require( '@automattic/jetpack-webpack-config/webpack' );
 const webpack = jetpackWebpackConfig.webpack;
 const RemoveAssetWebpackPlugin = require( '@automattic/remove-asset-webpack-plugin' );
@@ -115,12 +111,7 @@ const sharedWebpackConfig = {
 	node: {},
 	plugins: [
 		...jetpackWebpackConfig.StandardPlugins( {
-			DependencyExtractionPlugin: {
-				injectPolyfill: true,
-				useDefaults: false,
-				requestToExternal,
-				requestToHandle,
-			},
+			DependencyExtractionPlugin: { injectPolyfill: true },
 		} ),
 	],
 	externals: {
diff --git a/projects/plugins/jetpack/tools/webpack.config.js b/projects/plugins/jetpack/tools/webpack.config.js
index 07e7a5dee452e..7a877ec472d0e 100644
--- a/projects/plugins/jetpack/tools/webpack.config.js
+++ b/projects/plugins/jetpack/tools/webpack.config.js
@@ -1,8 +1,4 @@
 const path = require( 'path' );
-const {
-	requestToExternal,
-	requestToHandle,
-} = require( '@automattic/jetpack-webpack-config/dependencies' );
 const jetpackWebpackConfig = require( '@automattic/jetpack-webpack-config/webpack' );
 const RemoveAssetWebpackPlugin = require( '@automattic/remove-asset-webpack-plugin' );
 const { glob } = require( 'glob' );
@@ -129,12 +125,7 @@ module.exports = [
 		entry: moduleEntries,
 		plugins: [
 			...sharedWebpackConfig.plugins,
-			...jetpackWebpackConfig.DependencyExtractionPlugin( {
-				injectPolyfill: true,
-				useDefaults: false,
-				requestToExternal,
-				requestToHandle,
-			} ),
+			...jetpackWebpackConfig.DependencyExtractionPlugin(),
 		],
 		output: {
 			...sharedWebpackConfig.output,
@@ -158,12 +149,7 @@ module.exports = [
 		},
 		plugins: [
 			...sharedWebpackConfig.plugins,
-			...jetpackWebpackConfig.DependencyExtractionPlugin( {
-				injectPolyfill: true,
-				useDefaults: false,
-				requestToExternal,
-				requestToHandle,
-			} ),
+			...jetpackWebpackConfig.DependencyExtractionPlugin( { injectPolyfill: true } ),
 		],
 		externals: {
 			...sharedWebpackConfig.externals,
diff --git a/projects/plugins/social/package.json b/projects/plugins/social/package.json
index a8030799f70d5..c6d2cb8307b69 100644
--- a/projects/plugins/social/package.json
+++ b/projects/plugins/social/package.json
@@ -56,7 +56,6 @@
 		"@types/react": "18.3.1",
 		"@types/react-dom": "18.3.0",
 		"@wordpress/browserslist-config": "6.2.0",
-		"@wordpress/dependency-extraction-webpack-plugin": "5.9.0",
 		"autoprefixer": "10.4.14",
 		"babel-jest": "29.4.3",
 		"concurrently": "7.6.0",
diff --git a/projects/plugins/social/webpack.config.js b/projects/plugins/social/webpack.config.js
index b3ce79a4f472a..a86334fca5478 100644
--- a/projects/plugins/social/webpack.config.js
+++ b/projects/plugins/social/webpack.config.js
@@ -1,8 +1,4 @@
 const path = require( 'path' );
-const {
-	requestToExternal,
-	requestToHandle,
-} = require( '@automattic/jetpack-webpack-config/dependencies' );
 const jetpackWebpackConfig = require( '@automattic/jetpack-webpack-config/webpack' );
 const socialWebpackConfig = {
 	mode: jetpackWebpackConfig.mode,
@@ -20,12 +16,7 @@ const socialWebpackConfig = {
 	node: false,
 	plugins: [
 		...jetpackWebpackConfig.StandardPlugins( {
-			DependencyExtractionPlugin: {
-				injectPolyfill: true,
-				useDefaults: false,
-				requestToExternal,
-				requestToHandle,
-			},
+			DependencyExtractionPlugin: { injectPolyfill: true },
 		} ),
 	],
 	module: {

From 55e9edb2c8f129636bf68eab5ba11a35e73217f6 Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Tue, 16 Jul 2024 10:59:22 +0530
Subject: [PATCH 12/37] Restore comments in postcss.config

---
 projects/packages/publicize/postcss.config.js | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/projects/packages/publicize/postcss.config.js b/projects/packages/publicize/postcss.config.js
index a25afd875c263..2d7e7fa74e8a9 100644
--- a/projects/packages/publicize/postcss.config.js
+++ b/projects/packages/publicize/postcss.config.js
@@ -1,9 +1,19 @@
 module.exports = () => ( {
 	plugins: [
 		require( '@csstools/postcss-global-data' )( {
+			// Provide the properties that postcss-custom-properties is going to work with.
 			files: [ require.resolve( '@automattic/calypso-color-schemes/root-only/index.css' ) ],
 		} ),
 		require( 'postcss-custom-properties' )( {
+			// Use of `preserve: false` dates back to when we still used @automattic/calypso-build.
+			// Ideally we'd get rid of it to properly make use of CSS vars, but first we have to
+			// figure out how to ensure the vars actually get defined in the browser without
+			// including them in every bundle. Some base stylesheet (wp_register_style) the other
+			// stylesheets depend on maybe? And also deal with extremely generic vars like "--color-text".
+			//
+			// See also https://github.com/Automattic/jetpack/pull/13854#issuecomment-550898168,
+			// where people were confused about what was going on when calypso-build stopped
+			// including a postcss.config.js like this by default.
 			preserve: false,
 		} ),
 		require( 'autoprefixer' ),

From 1a1960b6de68f38edb20c1de6c3da23123adc59d Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Tue, 16 Jul 2024 11:01:35 +0530
Subject: [PATCH 13/37] Use script handle as entry name in webpack config for
 publicize

---
 projects/packages/publicize/webpack.config.js | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/projects/packages/publicize/webpack.config.js b/projects/packages/publicize/webpack.config.js
index 40fbeeed7d122..010874bbcf856 100644
--- a/projects/packages/publicize/webpack.config.js
+++ b/projects/packages/publicize/webpack.config.js
@@ -9,9 +9,8 @@ module.exports = [
 		entry: {
 			[ 'classic-editor-share-limits' ]: './src/js/classic-editor-share-limits.js',
 			[ 'classic-editor-connections' ]: './src/js/classic-editor-connections.js',
-			social: {
+			[ 'jetpack-publicize' ]: {
 				import: './src/js/jetpack-publicize.ts',
-				filename: 'jetpack-publicize.js',
 				library: {
 					name: 'JetpackPublicize',
 					type: 'umd',

From b4560362fb30c3b824022db9c6d367adbb7f4fb1 Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Tue, 16 Jul 2024 11:03:32 +0530
Subject: [PATCH 14/37] Fix up versions

---
 projects/js-packages/webpack-config/package.json             | 2 +-
 projects/packages/publicize/composer.json                    | 2 +-
 projects/packages/publicize/package.json                     | 2 +-
 .../changelog/update-unbundle-publicize-from-jetpack#2       | 5 +++++
 projects/plugins/jetpack/composer.lock                       | 4 ++--
 .../changelog/update-unbundle-publicize-from-jetpack#2       | 5 +++++
 projects/plugins/social/composer.json                        | 2 +-
 projects/plugins/social/composer.lock                        | 4 ++--
 projects/plugins/social/jetpack-social.php                   | 2 +-
 9 files changed, 19 insertions(+), 9 deletions(-)
 create mode 100644 projects/plugins/jetpack/changelog/update-unbundle-publicize-from-jetpack#2
 create mode 100644 projects/plugins/social/changelog/update-unbundle-publicize-from-jetpack#2

diff --git a/projects/js-packages/webpack-config/package.json b/projects/js-packages/webpack-config/package.json
index 3f54cb8195be1..320134eae4321 100644
--- a/projects/js-packages/webpack-config/package.json
+++ b/projects/js-packages/webpack-config/package.json
@@ -1,7 +1,7 @@
 {
 	"private": true,
 	"name": "@automattic/jetpack-webpack-config",
-	"version": "3.2.10",
+	"version": "3.3.0-alpha",
 	"description": "Library of pieces for webpack config in Jetpack projects.",
 	"homepage": "https://github.com/Automattic/jetpack/tree/HEAD/projects/js-packages/webpack-config/#readme",
 	"bugs": {
diff --git a/projects/packages/publicize/composer.json b/projects/packages/publicize/composer.json
index 77d85828d891b..c8531e0d9ad1d 100644
--- a/projects/packages/publicize/composer.json
+++ b/projects/packages/publicize/composer.json
@@ -67,7 +67,7 @@
 			"link-template": "https://github.com/Automattic/jetpack-publicize/compare/v${old}...v${new}"
 		},
 		"branch-alias": {
-			"dev-trunk": "0.47.x-dev"
+			"dev-trunk": "0.48.x-dev"
 		}
 	},
 	"config": {
diff --git a/projects/packages/publicize/package.json b/projects/packages/publicize/package.json
index 3a7dacba01e43..1eef18fca0bae 100644
--- a/projects/packages/publicize/package.json
+++ b/projects/packages/publicize/package.json
@@ -1,7 +1,7 @@
 {
 	"private": true,
 	"name": "@automattic/jetpack-publicize",
-	"version": "0.47.3",
+	"version": "0.48.0-alpha",
 	"description": "Publicize makes it easy to share your site’s posts on several social media networks automatically when you publish a new post.",
 	"homepage": "https://github.com/Automattic/jetpack/tree/HEAD/projects/packages/publicize/#readme",
 	"bugs": {
diff --git a/projects/plugins/jetpack/changelog/update-unbundle-publicize-from-jetpack#2 b/projects/plugins/jetpack/changelog/update-unbundle-publicize-from-jetpack#2
new file mode 100644
index 0000000000000..a1c1831fa1ef7
--- /dev/null
+++ b/projects/plugins/jetpack/changelog/update-unbundle-publicize-from-jetpack#2
@@ -0,0 +1,5 @@
+Significance: patch
+Type: other
+Comment: Updated composer.lock.
+
+
diff --git a/projects/plugins/jetpack/composer.lock b/projects/plugins/jetpack/composer.lock
index fbe7bb73118fe..1dc78386495bf 100644
--- a/projects/plugins/jetpack/composer.lock
+++ b/projects/plugins/jetpack/composer.lock
@@ -2217,7 +2217,7 @@
 			"dist": {
 				"type": "path",
 				"url": "../../packages/publicize",
-				"reference": "6494d867225a31d465c41e86117becbe7a35c11e"
+				"reference": "af5dd80bea134427f6b4d5bc8c0a95452afb17c1"
 			},
 			"require": {
 				"automattic/jetpack-assets": "@dev",
@@ -2245,7 +2245,7 @@
 					"link-template": "https://github.com/Automattic/jetpack-publicize/compare/v${old}...v${new}"
 				},
 				"branch-alias": {
-					"dev-trunk": "0.47.x-dev"
+					"dev-trunk": "0.48.x-dev"
 				}
 			},
 			"autoload": {
diff --git a/projects/plugins/social/changelog/update-unbundle-publicize-from-jetpack#2 b/projects/plugins/social/changelog/update-unbundle-publicize-from-jetpack#2
new file mode 100644
index 0000000000000..9aa70e3ec1f75
--- /dev/null
+++ b/projects/plugins/social/changelog/update-unbundle-publicize-from-jetpack#2
@@ -0,0 +1,5 @@
+Significance: patch
+Type: changed
+Comment: Updated composer.lock.
+
+
diff --git a/projects/plugins/social/composer.json b/projects/plugins/social/composer.json
index c79f8fcbe7954..3ef59774d0170 100644
--- a/projects/plugins/social/composer.json
+++ b/projects/plugins/social/composer.json
@@ -84,6 +84,6 @@
 			"automattic/jetpack-autoloader": true,
 			"automattic/jetpack-composer-plugin": true
 		},
-		"autoloader-suffix": "c4802e05bbcf59fd3b6350e8d3e5482c_socialⓥ4_5_3_alpha"
+		"autoloader-suffix": "c4802e05bbcf59fd3b6350e8d3e5482c_socialⓥ4_6_0_alpha"
 	}
 }
diff --git a/projects/plugins/social/composer.lock b/projects/plugins/social/composer.lock
index 4614b6dfd86df..f143ca189f067 100644
--- a/projects/plugins/social/composer.lock
+++ b/projects/plugins/social/composer.lock
@@ -1421,7 +1421,7 @@
 			"dist": {
 				"type": "path",
 				"url": "../../packages/publicize",
-				"reference": "6494d867225a31d465c41e86117becbe7a35c11e"
+				"reference": "af5dd80bea134427f6b4d5bc8c0a95452afb17c1"
 			},
 			"require": {
 				"automattic/jetpack-assets": "@dev",
@@ -1449,7 +1449,7 @@
 					"link-template": "https://github.com/Automattic/jetpack-publicize/compare/v${old}...v${new}"
 				},
 				"branch-alias": {
-					"dev-trunk": "0.47.x-dev"
+					"dev-trunk": "0.48.x-dev"
 				}
 			},
 			"autoload": {
diff --git a/projects/plugins/social/jetpack-social.php b/projects/plugins/social/jetpack-social.php
index f3bd3a204b52a..7e49f9a61055b 100644
--- a/projects/plugins/social/jetpack-social.php
+++ b/projects/plugins/social/jetpack-social.php
@@ -4,7 +4,7 @@
  * Plugin Name: Jetpack Social
  * Plugin URI: https://wordpress.org/plugins/jetpack-social
  * Description: Share your site’s posts on several social media networks automatically when you publish a new post.
- * Version: 4.5.3-alpha
+ * Version: 4.6.0-alpha
  * Author: Automattic - Jetpack Social team
  * Author URI: https://jetpack.com/social/
  * License: GPLv2 or later

From 23096ffc919ab4144e7af88990a8013e24570d02 Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Tue, 16 Jul 2024 11:07:55 +0530
Subject: [PATCH 15/37] Build publicize package for e2e tests

---
 projects/plugins/jetpack/tests/e2e/package.json | 2 +-
 projects/plugins/social/tests/e2e/package.json  | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/projects/plugins/jetpack/tests/e2e/package.json b/projects/plugins/jetpack/tests/e2e/package.json
index 7d7903ae847c4..1724dd945bf49 100644
--- a/projects/plugins/jetpack/tests/e2e/package.json
+++ b/projects/plugins/jetpack/tests/e2e/package.json
@@ -13,7 +13,7 @@
 	"license": "GPL-2.0-or-later",
 	"author": "Automattic",
 	"scripts": {
-		"build": "pnpm jetpack build packages/forms packages/connection packages/blaze plugins/jetpack -v --no-pnpm-install --production",
+		"build": "pnpm jetpack build packages/publicize packages/forms packages/connection packages/blaze plugins/jetpack -v --no-pnpm-install --production",
 		"clean": "rm -rf output",
 		"config:decrypt": "pnpm test-decrypt-default-config && pnpm test-decrypt-config",
 		"distclean": "rm -rf node_modules",
diff --git a/projects/plugins/social/tests/e2e/package.json b/projects/plugins/social/tests/e2e/package.json
index ae3f96cd66611..afdf1d4aa9bbc 100644
--- a/projects/plugins/social/tests/e2e/package.json
+++ b/projects/plugins/social/tests/e2e/package.json
@@ -14,7 +14,7 @@
 	"license": "GPL-2.0-or-later",
 	"author": "Automattic",
 	"scripts": {
-		"build": "pnpm jetpack build plugins/social plugins/jetpack -v --no-pnpm-install --production",
+		"build": "pnpm jetpack build packages/publicize plugins/social plugins/jetpack -v --no-pnpm-install --production",
 		"clean": "rm -rf output",
 		"config:decrypt": "openssl enc -md sha1 -aes-256-cbc -d -pass env:CONFIG_KEY -in ./node_modules/jetpack-e2e-commons/config/encrypted.enc -out ./config/local.cjs",
 		"distclean": "rm -rf node_modules",

From a7f58b811f558a9038b5f90d773158cbec0292bf Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Tue, 16 Jul 2024 11:18:57 +0530
Subject: [PATCH 16/37] Allow plugins to override dependency extraction config

---
 projects/js-packages/webpack-config/src/webpack.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/projects/js-packages/webpack-config/src/webpack.js b/projects/js-packages/webpack-config/src/webpack.js
index 40b2ce25cd882..be427bfa17fd9 100644
--- a/projects/js-packages/webpack-config/src/webpack.js
+++ b/projects/js-packages/webpack-config/src/webpack.js
@@ -125,9 +125,9 @@ const DependencyExtractionPlugin = ( { requestMap, ...options } = {} ) => {
 
 	return [
 		new DependencyExtractionWebpackPlugin( {
-			...options,
 			requestToExternal,
 			requestToHandle,
+			...options,
 		} ),
 	];
 };

From deb19ebd67bb9ad3c5e539b5712e69ea956dec26 Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Tue, 16 Jul 2024 14:04:49 +0530
Subject: [PATCH 17/37] Create a standalone class to register assets

---
 .../publicize/src/class-publicize-assets.php  | 41 +++++++++++++++++++
 .../publicize/src/class-publicize-ui.php      | 22 ----------
 projects/plugins/jetpack/class.jetpack.php    |  3 ++
 .../social/src/class-jetpack-social.php       |  3 ++
 4 files changed, 47 insertions(+), 22 deletions(-)
 create mode 100644 projects/packages/publicize/src/class-publicize-assets.php

diff --git a/projects/packages/publicize/src/class-publicize-assets.php b/projects/packages/publicize/src/class-publicize-assets.php
new file mode 100644
index 0000000000000..8cf11b0b2c4ab
--- /dev/null
+++ b/projects/packages/publicize/src/class-publicize-assets.php
@@ -0,0 +1,41 @@
+<?php
+/**
+ * PublicizeAssets.
+ *
+ * @package automattic/jetpack-publicize
+ */
+
+namespace Automattic\Jetpack\Publicize;
+
+use Automattic\Jetpack\Assets;
+
+/**
+ * PublicizeAssets class.
+ */
+class Publicize_Assets {
+
+	/**
+	 * Initialize the class.
+	 */
+	public static function configure() {
+		add_action( 'init', array( __CLASS__, 'register_assets' ) );
+	}
+
+	/**
+	 * Register assets.
+	 */
+	public static function register_assets() {
+		if ( ! wp_script_is( 'jetpack-publicize', 'registered' ) ) {
+
+			Assets::register_script(
+				'jetpack-publicize',
+				'../build/jetpack-publicize.js',
+				__FILE__,
+				array(
+					'in_footer'  => true,
+					'textdomain' => 'jetpack-publicize-pkg',
+				)
+			);
+		}
+	}
+}
diff --git a/projects/packages/publicize/src/class-publicize-ui.php b/projects/packages/publicize/src/class-publicize-ui.php
index 4b51f803785f1..a478d88894105 100644
--- a/projects/packages/publicize/src/class-publicize-ui.php
+++ b/projects/packages/publicize/src/class-publicize-ui.php
@@ -58,28 +58,6 @@ public function init() {
 
 		// Management of publicize (sharing screen, ajax/lightbox popup, and metabox on post screen).
 		add_action( 'post_submitbox_misc_actions', array( $this, 'post_page_metabox' ) );
-
-		add_action( 'admin_enqueue_scripts', array( $this, 'register_assets' ) );
-		add_action( 'enqueue_block_editor_assets', array( $this, 'register_assets' ) );
-	}
-
-	/**
-	 * Register assets.
-	 */
-	public function register_assets() {
-
-		if ( ! wp_script_is( 'jetpack-publicize', 'registered' ) ) {
-
-			Assets::register_script(
-				'jetpack-publicize',
-				'../build/jetpack-publicize.js',
-				__FILE__,
-				array(
-					'in_footer'  => true,
-					'textdomain' => 'jetpack-publicize-pkg',
-				)
-			);
-		}
 	}
 
 	/**
diff --git a/projects/plugins/jetpack/class.jetpack.php b/projects/plugins/jetpack/class.jetpack.php
index c71bcf2848e6c..df7cf53c294f0 100644
--- a/projects/plugins/jetpack/class.jetpack.php
+++ b/projects/plugins/jetpack/class.jetpack.php
@@ -909,6 +909,9 @@ public function configure() {
 			$this->connection_manager = new Connection_Manager( 'jetpack' );
 		}
 
+		// Assets should be registered regardless of connection status.
+		\Automattic\Jetpack\Publicize\Publicize_Assets::configure();
+
 		$modules = new Automattic\Jetpack\Modules();
 		if ( $modules->is_active( 'publicize' ) && $this->connection_manager->has_connected_user() ) {
 			$config->ensure( 'publicize' );
diff --git a/projects/plugins/social/src/class-jetpack-social.php b/projects/plugins/social/src/class-jetpack-social.php
index 3a5a801176eb6..fb40d6e38e826 100644
--- a/projects/plugins/social/src/class-jetpack-social.php
+++ b/projects/plugins/social/src/class-jetpack-social.php
@@ -77,6 +77,9 @@ function () {
 				// Identity crisis package.
 				$config->ensure( 'identity_crisis' );
 
+				// Assets should be registered regardless of connection status.
+				\Automattic\Jetpack\Publicize\Publicize_Assets::configure();
+
 				if ( ! $this->is_connected() ) {
 					return;
 				}

From 311ba28eba6015bed47da8d651db669023ab1acb Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Tue, 16 Jul 2024 22:34:35 +0530
Subject: [PATCH 18/37] Directly export publilize components instead of
 relaying it

---
 pnpm-lock.yaml                                      |  6 ------
 projects/js-packages/webpack-config/src/webpack.js  |  2 +-
 projects/packages/publicize/package.json            |  6 ------
 .../packages/publicize/src/js/jetpack-publicize.js  |  1 +
 .../packages/publicize/src/js/jetpack-publicize.ts  |  5 -----
 projects/packages/publicize/tsconfig.json           |  4 ----
 projects/packages/publicize/webpack.config.js       | 13 +++++++++++--
 .../jetpack/_inc/client/sharing/publicize.jsx       |  6 ++++--
 .../extensions/plugins/publicize/post-publish.js    |  5 ++++-
 projects/plugins/jetpack/package.json               |  1 -
 projects/plugins/social/package.json                |  1 -
 .../js/components/social-module-toggle/index.tsx    |  3 +--
 projects/plugins/social/src/js/editor.js            |  3 ++-
 13 files changed, 24 insertions(+), 32 deletions(-)
 create mode 100644 projects/packages/publicize/src/js/jetpack-publicize.js
 delete mode 100644 projects/packages/publicize/src/js/jetpack-publicize.ts
 delete mode 100644 projects/packages/publicize/tsconfig.json

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index c73c0e6478896..70b75ad5d566b 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -3667,9 +3667,6 @@ importers:
       '@automattic/jetpack-partner-coupon':
         specifier: workspace:*
         version: link:../../js-packages/partner-coupon
-      '@automattic/jetpack-publicize':
-        specifier: workspace:*
-        version: link:../../packages/publicize
       '@automattic/jetpack-publicize-components':
         specifier: workspace:*
         version: link:../../js-packages/publicize-components
@@ -4224,9 +4221,6 @@ importers:
       '@automattic/jetpack-connection':
         specifier: workspace:*
         version: link:../../js-packages/connection
-      '@automattic/jetpack-publicize':
-        specifier: workspace:*
-        version: link:../../packages/publicize
       '@automattic/jetpack-publicize-components':
         specifier: workspace:*
         version: link:../../js-packages/publicize-components
diff --git a/projects/js-packages/webpack-config/src/webpack.js b/projects/js-packages/webpack-config/src/webpack.js
index be427bfa17fd9..288d7b33ab8d7 100644
--- a/projects/js-packages/webpack-config/src/webpack.js
+++ b/projects/js-packages/webpack-config/src/webpack.js
@@ -106,7 +106,7 @@ const DefinePlugin = defines => [
 ];
 
 const defaultRequestMap = {
-	'@automattic/jetpack-publicize': {
+	'@automattic/jetpack-publicize-components': {
 		external: 'JetpackPublicize',
 		handle: 'jetpack-publicize',
 	},
diff --git a/projects/packages/publicize/package.json b/projects/packages/publicize/package.json
index 1eef18fca0bae..5bfd7190058ed 100644
--- a/projects/packages/publicize/package.json
+++ b/projects/packages/publicize/package.json
@@ -26,12 +26,6 @@
 	"browserslist": [
 		"extends @wordpress/browserslist-config"
 	],
-	"exports": {
-		".": {
-			"jetpack:src": "./src/js/jetpack-publicize.ts",
-			"default": "./build/jetpack-publicize.js"
-		}
-	},
 	"devDependencies": {
 		"@automattic/calypso-color-schemes": "3.1.3",
 		"@automattic/color-studio": "2.6.0",
diff --git a/projects/packages/publicize/src/js/jetpack-publicize.js b/projects/packages/publicize/src/js/jetpack-publicize.js
new file mode 100644
index 0000000000000..007af2f5d85c9
--- /dev/null
+++ b/projects/packages/publicize/src/js/jetpack-publicize.js
@@ -0,0 +1 @@
+export * from '@automattic/jetpack-publicize-components';
diff --git a/projects/packages/publicize/src/js/jetpack-publicize.ts b/projects/packages/publicize/src/js/jetpack-publicize.ts
deleted file mode 100644
index f123704b8d1ca..0000000000000
--- a/projects/packages/publicize/src/js/jetpack-publicize.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-export {
-	PostPublishManualSharing,
-	PostPublishReviewPrompt,
-	ConnectionManagement,
-} from '@automattic/jetpack-publicize-components';
diff --git a/projects/packages/publicize/tsconfig.json b/projects/packages/publicize/tsconfig.json
deleted file mode 100644
index a2ecf0d6e8fd0..0000000000000
--- a/projects/packages/publicize/tsconfig.json
+++ /dev/null
@@ -1,4 +0,0 @@
-{
-	"extends": "jetpack-js-tools/tsconfig.base.json",
-	"include": [ "./src/js" ]
-}
diff --git a/projects/packages/publicize/webpack.config.js b/projects/packages/publicize/webpack.config.js
index 010874bbcf856..a705a93350dcc 100644
--- a/projects/packages/publicize/webpack.config.js
+++ b/projects/packages/publicize/webpack.config.js
@@ -10,7 +10,7 @@ module.exports = [
 			[ 'classic-editor-share-limits' ]: './src/js/classic-editor-share-limits.js',
 			[ 'classic-editor-connections' ]: './src/js/classic-editor-connections.js',
 			[ 'jetpack-publicize' ]: {
-				import: './src/js/jetpack-publicize.ts',
+				import: './src/js/jetpack-publicize.js',
 				library: {
 					name: 'JetpackPublicize',
 					type: 'umd',
@@ -36,7 +36,16 @@ module.exports = [
 			...jetpackWebpackConfig.resolve,
 		},
 		node: false,
-		plugins: [ ...jetpackWebpackConfig.StandardPlugins() ],
+		plugins: [
+			...jetpackWebpackConfig.StandardPlugins( {
+				DependencyExtractionPlugin: {
+					requestMap: {
+						// We don't want to externalize this package, we rather want to bundle it.
+						'@automattic/jetpack-publicize-components': {},
+					},
+				},
+			} ),
+		],
 		module: {
 			strictExportPresence: true,
 			rules: [
diff --git a/projects/plugins/jetpack/_inc/client/sharing/publicize.jsx b/projects/plugins/jetpack/_inc/client/sharing/publicize.jsx
index 210928044e188..ca1a10f703965 100644
--- a/projects/plugins/jetpack/_inc/client/sharing/publicize.jsx
+++ b/projects/plugins/jetpack/_inc/client/sharing/publicize.jsx
@@ -1,6 +1,8 @@
 import { getRedirectUrl } from '@automattic/jetpack-components';
-import { ConnectionManagement } from '@automattic/jetpack-publicize';
-import { RefreshJetpackSocialSettingsWrapper } from '@automattic/jetpack-publicize-components';
+import {
+	ConnectionManagement,
+	RefreshJetpackSocialSettingsWrapper,
+} from '@automattic/jetpack-publicize-components';
 import { createInterpolateElement } from '@wordpress/element';
 import { __, _x } from '@wordpress/i18n';
 import Card from 'components/card';
diff --git a/projects/plugins/jetpack/extensions/plugins/publicize/post-publish.js b/projects/plugins/jetpack/extensions/plugins/publicize/post-publish.js
index 62e36c5c9f20d..f3cceba56e3bf 100644
--- a/projects/plugins/jetpack/extensions/plugins/publicize/post-publish.js
+++ b/projects/plugins/jetpack/extensions/plugins/publicize/post-publish.js
@@ -1,4 +1,7 @@
-import { PostPublishManualSharing, PostPublishReviewPrompt } from '@automattic/jetpack-publicize';
+import {
+	PostPublishManualSharing,
+	PostPublishReviewPrompt,
+} from '@automattic/jetpack-publicize-components';
 
 const PostPublishPanels = () => {
 	return (
diff --git a/projects/plugins/jetpack/package.json b/projects/plugins/jetpack/package.json
index e9a02e5e6ea44..fc848ce7bc1f3 100644
--- a/projects/plugins/jetpack/package.json
+++ b/projects/plugins/jetpack/package.json
@@ -55,7 +55,6 @@
 		"@automattic/jetpack-licensing": "workspace:*",
 		"@automattic/jetpack-my-jetpack": "workspace:*",
 		"@automattic/jetpack-partner-coupon": "workspace:*",
-		"@automattic/jetpack-publicize": "workspace:*",
 		"@automattic/jetpack-publicize-components": "workspace:*",
 		"@automattic/jetpack-shared-extension-utils": "workspace:*",
 		"@automattic/popup-monitor": "1.0.2",
diff --git a/projects/plugins/social/package.json b/projects/plugins/social/package.json
index c6d2cb8307b69..afe830e62e0d4 100644
--- a/projects/plugins/social/package.json
+++ b/projects/plugins/social/package.json
@@ -31,7 +31,6 @@
 		"@automattic/jetpack-connection": "workspace:*",
 		"@automattic/jetpack-publicize-components": "workspace:*",
 		"@automattic/jetpack-shared-extension-utils": "workspace:*",
-		"@automattic/jetpack-publicize": "workspace:*",
 		"@wordpress/api-fetch": "7.2.0",
 		"@wordpress/components": "28.2.0",
 		"@wordpress/data": "10.2.0",
diff --git a/projects/plugins/social/src/js/components/social-module-toggle/index.tsx b/projects/plugins/social/src/js/components/social-module-toggle/index.tsx
index 419280e94b735..aad58eb516cb3 100644
--- a/projects/plugins/social/src/js/components/social-module-toggle/index.tsx
+++ b/projects/plugins/social/src/js/components/social-module-toggle/index.tsx
@@ -5,8 +5,7 @@ import {
 	getRedirectUrl,
 	useBreakpointMatch,
 } from '@automattic/jetpack-components';
-import { ConnectionManagement } from '@automattic/jetpack-publicize';
-import { SOCIAL_STORE_ID } from '@automattic/jetpack-publicize-components';
+import { ConnectionManagement, SOCIAL_STORE_ID } from '@automattic/jetpack-publicize-components';
 import { ExternalLink } from '@wordpress/components';
 import { useSelect, useDispatch } from '@wordpress/data';
 import { __ } from '@wordpress/i18n';
diff --git a/projects/plugins/social/src/js/editor.js b/projects/plugins/social/src/js/editor.js
index b6bcd4e54cf6a..840a63360981f 100644
--- a/projects/plugins/social/src/js/editor.js
+++ b/projects/plugins/social/src/js/editor.js
@@ -1,5 +1,4 @@
 import { SocialIcon } from '@automattic/jetpack-components';
-import { PostPublishManualSharing, PostPublishReviewPrompt } from '@automattic/jetpack-publicize';
 import {
 	SocialPreviewsModal,
 	SocialPreviewsPanel,
@@ -7,6 +6,8 @@ import {
 	usePublicizeConfig,
 	useSocialMediaConnections,
 	PublicizePanel,
+	PostPublishReviewPrompt,
+	PostPublishManualSharing,
 	useSyncPostDataToStore,
 } from '@automattic/jetpack-publicize-components';
 import { JetpackEditorPanelLogo } from '@automattic/jetpack-shared-extension-utils';

From 92d36686f4a88c35845264adbeea5f9dba52589f Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Tue, 16 Jul 2024 22:38:14 +0530
Subject: [PATCH 19/37] No need of " || undefined"

---
 projects/js-packages/webpack-config/src/webpack.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/projects/js-packages/webpack-config/src/webpack.js b/projects/js-packages/webpack-config/src/webpack.js
index 288d7b33ab8d7..6b4399a4e8169 100644
--- a/projects/js-packages/webpack-config/src/webpack.js
+++ b/projects/js-packages/webpack-config/src/webpack.js
@@ -116,11 +116,11 @@ const DependencyExtractionPlugin = ( { requestMap, ...options } = {} ) => {
 	const finalRequestMap = { ...defaultRequestMap, ...requestMap };
 
 	const requestToExternal = request => {
-		return finalRequestMap[ request ]?.external || undefined;
+		return finalRequestMap[ request ]?.external;
 	};
 
 	const requestToHandle = request => {
-		return finalRequestMap[ request ]?.handle || undefined;
+		return finalRequestMap[ request ]?.handle;
 	};
 
 	return [

From 324efdc8d31223282f6fcd0d8f9a441fcfdb6e11 Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Tue, 16 Jul 2024 22:49:48 +0530
Subject: [PATCH 20/37] Add css deps

---
 .../_inc/lib/admin-pages/class.jetpack-admin-page.php        | 2 +-
 projects/plugins/social/src/class-jetpack-social.php         | 5 +++--
 2 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/projects/plugins/jetpack/_inc/lib/admin-pages/class.jetpack-admin-page.php b/projects/plugins/jetpack/_inc/lib/admin-pages/class.jetpack-admin-page.php
index aaab346c71bb2..66e81f5724680 100644
--- a/projects/plugins/jetpack/_inc/lib/admin-pages/class.jetpack-admin-page.php
+++ b/projects/plugins/jetpack/_inc/lib/admin-pages/class.jetpack-admin-page.php
@@ -262,7 +262,7 @@ public function check_plan_deactivate_modules( $page ) {
 	 */
 	public static function load_wrapper_styles() {
 		$rtl = is_rtl() ? '.rtl' : '';
-		wp_enqueue_style( 'dops-css', plugins_url( "_inc/build/admin{$rtl}.css", JETPACK__PLUGIN_FILE ), array(), JETPACK__VERSION );
+		wp_enqueue_style( 'dops-css', plugins_url( "_inc/build/admin{$rtl}.css", JETPACK__PLUGIN_FILE ), array( 'jetpack-publicize' ), JETPACK__VERSION );
 		wp_enqueue_style( 'components-css', plugins_url( "_inc/build/style.min{$rtl}.css", JETPACK__PLUGIN_FILE ), array( 'wp-components' ), JETPACK__VERSION );
 	}
 
diff --git a/projects/plugins/social/src/class-jetpack-social.php b/projects/plugins/social/src/class-jetpack-social.php
index fb40d6e38e826..77d628bb504ab 100644
--- a/projects/plugins/social/src/class-jetpack-social.php
+++ b/projects/plugins/social/src/class-jetpack-social.php
@@ -175,8 +175,9 @@ public function enqueue_admin_scripts() {
 			'build/index.js',
 			JETPACK_SOCIAL_PLUGIN_ROOT_FILE,
 			array(
-				'in_footer'  => true,
-				'textdomain' => 'jetpack-social',
+				'in_footer'        => true,
+				'textdomain'       => 'jetpack-social',
+				'css_dependencies' => array( 'jetpack-publicize' ),
 			)
 		);
 

From c32ec63dec648da4a6720b3b4f0e8132a1e02004 Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Tue, 16 Jul 2024 23:07:22 +0530
Subject: [PATCH 21/37] Unbundle connection components

---
 pnpm-lock.yaml                                |  3 +++
 .../js-packages/webpack-config/src/webpack.js |  4 ++++
 projects/packages/connection/package.json     |  1 +
 .../packages/connection/src/class-manager.php | 23 +++++++++++++++++++
 .../connection/src/js/jetpack-connection.js   |  1 +
 .../packages/connection/webpack.config.js     | 16 +++++++++++++
 .../admin-pages/class.jetpack-admin-page.php  |  2 +-
 .../social/src/class-jetpack-social.php       |  2 +-
 8 files changed, 50 insertions(+), 2 deletions(-)
 create mode 100644 projects/packages/connection/src/js/jetpack-connection.js

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 70b75ad5d566b..7a3bcc6a5480a 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -1845,6 +1845,9 @@ importers:
 
   projects/packages/connection:
     dependencies:
+      '@automattic/jetpack-connection':
+        specifier: workspace:*
+        version: link:../../js-packages/connection
       '@automattic/jetpack-idc':
         specifier: workspace:*
         version: link:../../js-packages/idc
diff --git a/projects/js-packages/webpack-config/src/webpack.js b/projects/js-packages/webpack-config/src/webpack.js
index 6b4399a4e8169..4cdb3d81652e1 100644
--- a/projects/js-packages/webpack-config/src/webpack.js
+++ b/projects/js-packages/webpack-config/src/webpack.js
@@ -110,6 +110,10 @@ const defaultRequestMap = {
 		external: 'JetpackPublicize',
 		handle: 'jetpack-publicize',
 	},
+	'@automattic/jetpack-connection': {
+		external: 'JetpackConnection',
+		handle: 'jetpack-connection',
+	},
 };
 
 const DependencyExtractionPlugin = ( { requestMap, ...options } = {} ) => {
diff --git a/projects/packages/connection/package.json b/projects/packages/connection/package.json
index d7d6a96d09c30..28f613c7df984 100644
--- a/projects/packages/connection/package.json
+++ b/projects/packages/connection/package.json
@@ -25,6 +25,7 @@
 		"watch": "pnpm run build && pnpm webpack watch"
 	},
 	"dependencies": {
+		"@automattic/jetpack-connection": "workspace:*",
 		"@automattic/jetpack-idc": "workspace:*",
 		"@wordpress/data": "10.2.0",
 		"@wordpress/element": "6.2.0"
diff --git a/projects/packages/connection/src/class-manager.php b/projects/packages/connection/src/class-manager.php
index 3765b8779e95c..dee92b7950c24 100644
--- a/projects/packages/connection/src/class-manager.php
+++ b/projects/packages/connection/src/class-manager.php
@@ -8,6 +8,7 @@
 namespace Automattic\Jetpack\Connection;
 
 use Automattic\Jetpack\A8c_Mc_Stats;
+use Automattic\Jetpack\Assets;
 use Automattic\Jetpack\Constants;
 use Automattic\Jetpack\Heartbeat;
 use Automattic\Jetpack\Partner;
@@ -155,6 +156,28 @@ public static function configure() {
 
 		// Initial Partner management.
 		Partner::init();
+
+		add_action( 'init', array( __CLASS__, 'register_assets' ) );
+	}
+
+	/**
+	 * Register assets.
+	 */
+	public static function register_assets() {
+		if ( ! wp_script_is( 'jetpack-connection', 'registered' ) ) {
+
+			Assets::register_script(
+				'jetpack-connection',
+				'../dist/jetpack-connection.js',
+				__FILE__,
+				array(
+					'in_footer'  => true,
+					'textdomain' => 'jetpack-idc',
+				)
+			);
+
+			Initial_State::render_script( 'jetpack-connection' );
+		}
 	}
 
 	/**
diff --git a/projects/packages/connection/src/js/jetpack-connection.js b/projects/packages/connection/src/js/jetpack-connection.js
new file mode 100644
index 0000000000000..e50e4642d6a7b
--- /dev/null
+++ b/projects/packages/connection/src/js/jetpack-connection.js
@@ -0,0 +1 @@
+export * from '@automattic/jetpack-connection';
diff --git a/projects/packages/connection/webpack.config.js b/projects/packages/connection/webpack.config.js
index e451025a4fdd0..c254033522eda 100644
--- a/projects/packages/connection/webpack.config.js
+++ b/projects/packages/connection/webpack.config.js
@@ -29,6 +29,13 @@ module.exports = [
 			},
 			'identity-crisis': './src/identity-crisis/_inc/admin.jsx',
 			...ssoEntries,
+			[ 'jetpack-connection' ]: {
+				import: './src/js/jetpack-connection.js',
+				library: {
+					name: 'JetpackConnection',
+					type: 'umd',
+				},
+			},
 		},
 		mode: jetpackWebpackConfig.mode,
 		devtool: jetpackWebpackConfig.devtool,
@@ -46,6 +53,12 @@ module.exports = [
 		plugins: [
 			...jetpackWebpackConfig.StandardPlugins( {
 				MiniCssExtractPlugin: { filename: '[name].css' },
+				DependencyExtractionPlugin: {
+					requestMap: {
+						// We don't want to externalize this package, we rather want to bundle it.
+						'@automattic/jetpack-connection': {},
+					},
+				},
 			} ),
 		],
 		module: {
@@ -64,6 +77,9 @@ module.exports = [
 					extensions: [ 'css', 'sass', 'scss' ],
 					extraLoaders: [ 'sass-loader' ],
 				} ),
+
+				// Handle images.
+				jetpackWebpackConfig.FileRule(),
 			],
 		},
 		externals: {
diff --git a/projects/plugins/jetpack/_inc/lib/admin-pages/class.jetpack-admin-page.php b/projects/plugins/jetpack/_inc/lib/admin-pages/class.jetpack-admin-page.php
index 66e81f5724680..4ef5f14c0fd07 100644
--- a/projects/plugins/jetpack/_inc/lib/admin-pages/class.jetpack-admin-page.php
+++ b/projects/plugins/jetpack/_inc/lib/admin-pages/class.jetpack-admin-page.php
@@ -262,7 +262,7 @@ public function check_plan_deactivate_modules( $page ) {
 	 */
 	public static function load_wrapper_styles() {
 		$rtl = is_rtl() ? '.rtl' : '';
-		wp_enqueue_style( 'dops-css', plugins_url( "_inc/build/admin{$rtl}.css", JETPACK__PLUGIN_FILE ), array( 'jetpack-publicize' ), JETPACK__VERSION );
+		wp_enqueue_style( 'dops-css', plugins_url( "_inc/build/admin{$rtl}.css", JETPACK__PLUGIN_FILE ), array( 'jetpack-publicize', 'jetpack-connection' ), JETPACK__VERSION );
 		wp_enqueue_style( 'components-css', plugins_url( "_inc/build/style.min{$rtl}.css", JETPACK__PLUGIN_FILE ), array( 'wp-components' ), JETPACK__VERSION );
 	}
 
diff --git a/projects/plugins/social/src/class-jetpack-social.php b/projects/plugins/social/src/class-jetpack-social.php
index 77d628bb504ab..0b22754d20398 100644
--- a/projects/plugins/social/src/class-jetpack-social.php
+++ b/projects/plugins/social/src/class-jetpack-social.php
@@ -177,7 +177,7 @@ public function enqueue_admin_scripts() {
 			array(
 				'in_footer'        => true,
 				'textdomain'       => 'jetpack-social',
-				'css_dependencies' => array( 'jetpack-publicize' ),
+				'css_dependencies' => array( 'jetpack-publicize', 'jetpack-connection' ),
 			)
 		);
 

From 73039cbb9a0593d5bed0ac6668919aa758c88d78 Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Tue, 16 Jul 2024 23:13:07 +0530
Subject: [PATCH 22/37] Build connection package for e2e tests

---
 projects/plugins/jetpack/tests/e2e/package.json | 2 +-
 projects/plugins/social/tests/e2e/package.json  | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/projects/plugins/jetpack/tests/e2e/package.json b/projects/plugins/jetpack/tests/e2e/package.json
index 1724dd945bf49..fb69921df72a1 100644
--- a/projects/plugins/jetpack/tests/e2e/package.json
+++ b/projects/plugins/jetpack/tests/e2e/package.json
@@ -13,7 +13,7 @@
 	"license": "GPL-2.0-or-later",
 	"author": "Automattic",
 	"scripts": {
-		"build": "pnpm jetpack build packages/publicize packages/forms packages/connection packages/blaze plugins/jetpack -v --no-pnpm-install --production",
+		"build": "pnpm jetpack build packages/connection packages/publicize packages/forms packages/connection packages/blaze plugins/jetpack -v --no-pnpm-install --production",
 		"clean": "rm -rf output",
 		"config:decrypt": "pnpm test-decrypt-default-config && pnpm test-decrypt-config",
 		"distclean": "rm -rf node_modules",
diff --git a/projects/plugins/social/tests/e2e/package.json b/projects/plugins/social/tests/e2e/package.json
index afdf1d4aa9bbc..365d4017b1db6 100644
--- a/projects/plugins/social/tests/e2e/package.json
+++ b/projects/plugins/social/tests/e2e/package.json
@@ -14,7 +14,7 @@
 	"license": "GPL-2.0-or-later",
 	"author": "Automattic",
 	"scripts": {
-		"build": "pnpm jetpack build packages/publicize plugins/social plugins/jetpack -v --no-pnpm-install --production",
+		"build": "pnpm jetpack build packages/publicize packages/connection plugins/social plugins/jetpack -v --no-pnpm-install --production",
 		"clean": "rm -rf output",
 		"config:decrypt": "openssl enc -md sha1 -aes-256-cbc -d -pass env:CONFIG_KEY -in ./node_modules/jetpack-e2e-commons/config/encrypted.enc -out ./config/local.cjs",
 		"distclean": "rm -rf node_modules",

From faa407cec327c4b46d2470340652eab1c2ad79b0 Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Tue, 16 Jul 2024 23:25:32 +0530
Subject: [PATCH 23/37] Build connection package for search e2e tests

---
 projects/plugins/search/tests/e2e/package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/projects/plugins/search/tests/e2e/package.json b/projects/plugins/search/tests/e2e/package.json
index 16c55b15704ba..6c73f32c1fc8b 100644
--- a/projects/plugins/search/tests/e2e/package.json
+++ b/projects/plugins/search/tests/e2e/package.json
@@ -10,7 +10,7 @@
 	"license": "GPL-2.0-or-later",
 	"author": "Automattic",
 	"scripts": {
-		"build": "pnpm jetpack build packages/search plugins/jetpack -v --no-pnpm-install --production",
+		"build": "pnpm jetpack build packages/connection packages/search plugins/jetpack -v --no-pnpm-install --production",
 		"clean": "rm -rf output",
 		"config:decrypt": "openssl enc -md sha1 -aes-256-cbc -d -pass env:CONFIG_KEY -in ./node_modules/jetpack-e2e-commons/config/encrypted.enc -out ./config/local.cjs",
 		"distclean": "rm -rf node_modules",

From d26a3cd8718fe3870ad7ebc15ec2636552a91be0 Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Wed, 17 Jul 2024 15:11:23 +0530
Subject: [PATCH 24/37] Fix editor styles for publicize in Jetpack

---
 projects/plugins/jetpack/class.jetpack-gutenberg.php | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/projects/plugins/jetpack/class.jetpack-gutenberg.php b/projects/plugins/jetpack/class.jetpack-gutenberg.php
index 5195399ce401b..1f6239a49a3d5 100644
--- a/projects/plugins/jetpack/class.jetpack-gutenberg.php
+++ b/projects/plugins/jetpack/class.jetpack-gutenberg.php
@@ -667,7 +667,7 @@ public static function enqueue_block_editor_assets() {
 		// wp-edit-post but wp-edit-post's styles break the Widget Editor and
 		// Site Editor) until a real fix gets unblocked.
 		// @todo Remove this once #20357 is properly fixed.
-		wp_styles()->query( 'jetpack-blocks-editor', 'registered' )->deps = array();
+		wp_styles()->query( 'jetpack-blocks-editor', 'registered' )->deps = array( 'jetpack-publicize' );
 
 		Assets::enqueue_script( 'jetpack-blocks-editor' );
 

From 636ef0497c90d42f3e0dfcbbae3bbf368bdb0dc2 Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Wed, 17 Jul 2024 15:34:04 +0530
Subject: [PATCH 25/37] Use a dedicated assets class for connection assets

---
 .../src/class-connection-assets.php           | 43 +++++++++++++++++++
 .../packages/connection/src/class-manager.php | 23 ----------
 .../publicize/src/class-publicize-assets.php  |  2 +-
 projects/plugins/jetpack/class.jetpack.php    |  1 +
 .../social/src/class-jetpack-social.php       |  1 +
 5 files changed, 46 insertions(+), 24 deletions(-)
 create mode 100644 projects/packages/connection/src/class-connection-assets.php

diff --git a/projects/packages/connection/src/class-connection-assets.php b/projects/packages/connection/src/class-connection-assets.php
new file mode 100644
index 0000000000000..30626e591137d
--- /dev/null
+++ b/projects/packages/connection/src/class-connection-assets.php
@@ -0,0 +1,43 @@
+<?php
+/**
+ * Connection_Assets.
+ *
+ * @package automattic/jetpack-connection
+ */
+
+namespace Automattic\Jetpack\Connection;
+
+use Automattic\Jetpack\Assets;
+
+/**
+ * Connection_Assets class.
+ */
+class Connection_Assets {
+
+	/**
+	 * Initialize the class.
+	 */
+	public static function configure() {
+		add_action( 'wp_loaded', array( __CLASS__, 'register_assets' ) );
+	}
+
+	/**
+	 * Register assets.
+	 */
+	public static function register_assets() {
+		if ( ! wp_script_is( 'jetpack-connection', 'registered' ) ) {
+
+			Assets::register_script(
+				'jetpack-connection',
+				'../dist/jetpack-connection.js',
+				__FILE__,
+				array(
+					'in_footer'  => true,
+					'textdomain' => 'jetpack-idc',
+				)
+			);
+
+			Initial_State::render_script( 'jetpack-connection' );
+		}
+	}
+}
diff --git a/projects/packages/connection/src/class-manager.php b/projects/packages/connection/src/class-manager.php
index dee92b7950c24..3765b8779e95c 100644
--- a/projects/packages/connection/src/class-manager.php
+++ b/projects/packages/connection/src/class-manager.php
@@ -8,7 +8,6 @@
 namespace Automattic\Jetpack\Connection;
 
 use Automattic\Jetpack\A8c_Mc_Stats;
-use Automattic\Jetpack\Assets;
 use Automattic\Jetpack\Constants;
 use Automattic\Jetpack\Heartbeat;
 use Automattic\Jetpack\Partner;
@@ -156,28 +155,6 @@ public static function configure() {
 
 		// Initial Partner management.
 		Partner::init();
-
-		add_action( 'init', array( __CLASS__, 'register_assets' ) );
-	}
-
-	/**
-	 * Register assets.
-	 */
-	public static function register_assets() {
-		if ( ! wp_script_is( 'jetpack-connection', 'registered' ) ) {
-
-			Assets::register_script(
-				'jetpack-connection',
-				'../dist/jetpack-connection.js',
-				__FILE__,
-				array(
-					'in_footer'  => true,
-					'textdomain' => 'jetpack-idc',
-				)
-			);
-
-			Initial_State::render_script( 'jetpack-connection' );
-		}
 	}
 
 	/**
diff --git a/projects/packages/publicize/src/class-publicize-assets.php b/projects/packages/publicize/src/class-publicize-assets.php
index 8cf11b0b2c4ab..da1c7418cdbb2 100644
--- a/projects/packages/publicize/src/class-publicize-assets.php
+++ b/projects/packages/publicize/src/class-publicize-assets.php
@@ -18,7 +18,7 @@ class Publicize_Assets {
 	 * Initialize the class.
 	 */
 	public static function configure() {
-		add_action( 'init', array( __CLASS__, 'register_assets' ) );
+		add_action( 'wp_loaded', array( __CLASS__, 'register_assets' ) );
 	}
 
 	/**
diff --git a/projects/plugins/jetpack/class.jetpack.php b/projects/plugins/jetpack/class.jetpack.php
index df7cf53c294f0..f7f0fd32aa7cc 100644
--- a/projects/plugins/jetpack/class.jetpack.php
+++ b/projects/plugins/jetpack/class.jetpack.php
@@ -911,6 +911,7 @@ public function configure() {
 
 		// Assets should be registered regardless of connection status.
 		\Automattic\Jetpack\Publicize\Publicize_Assets::configure();
+		\Automattic\Jetpack\Connection\Connection_Assets::configure();
 
 		$modules = new Automattic\Jetpack\Modules();
 		if ( $modules->is_active( 'publicize' ) && $this->connection_manager->has_connected_user() ) {
diff --git a/projects/plugins/social/src/class-jetpack-social.php b/projects/plugins/social/src/class-jetpack-social.php
index 0b22754d20398..787ca4e40cf60 100644
--- a/projects/plugins/social/src/class-jetpack-social.php
+++ b/projects/plugins/social/src/class-jetpack-social.php
@@ -79,6 +79,7 @@ function () {
 
 				// Assets should be registered regardless of connection status.
 				\Automattic\Jetpack\Publicize\Publicize_Assets::configure();
+				\Automattic\Jetpack\Connection\Connection_Assets::configure();
 
 				if ( ! $this->is_connected() ) {
 					return;

From d5d1d95f71346eee9ac807493c6b837bcc887b94 Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Thu, 18 Jul 2024 10:37:23 +0530
Subject: [PATCH 26/37] Use shared webpack config to ensure only the target
 bundle is extracted

---
 .../packages/connection/webpack.config.js     |  95 ++++++++++------
 projects/packages/publicize/webpack.config.js | 106 ++++++++++--------
 2 files changed, 122 insertions(+), 79 deletions(-)

diff --git a/projects/packages/connection/webpack.config.js b/projects/packages/connection/webpack.config.js
index c254033522eda..4079895fd2195 100644
--- a/projects/packages/connection/webpack.config.js
+++ b/projects/packages/connection/webpack.config.js
@@ -16,8 +16,55 @@ for ( const file of glob.sync( './src/sso/*.css' ) ) {
 	ssoEntries[ name ].push( path.resolve( file ) );
 }
 
+/**
+ * @type {import('webpack').Configuration[]} Webpack configuration.
+ */
+const sharedConfig = {
+	mode: jetpackWebpackConfig.mode,
+	devtool: jetpackWebpackConfig.devtool,
+	output: {
+		...jetpackWebpackConfig.output,
+		path: path.resolve( './dist' ),
+	},
+	optimization: {
+		...jetpackWebpackConfig.optimization,
+	},
+	resolve: {
+		...jetpackWebpackConfig.resolve,
+	},
+	node: false,
+	module: {
+		strictExportPresence: true,
+		rules: [
+			// Transpile JavaScript, including node_modules.
+			jetpackWebpackConfig.TranspileRule(),
+
+			// Transpile @automattic/jetpack-* in node_modules too.
+			jetpackWebpackConfig.TranspileRule( {
+				includeNodeModules: [ '@automattic/jetpack-' ],
+			} ),
+
+			// Handle CSS.
+			jetpackWebpackConfig.CssRule( {
+				extensions: [ 'css', 'sass', 'scss' ],
+				extraLoaders: [ 'sass-loader' ],
+			} ),
+		],
+	},
+	externals: {
+		...jetpackWebpackConfig.externals,
+		jetpackConfig: JSON.stringify( {
+			consumer_slug: 'identity_crisis',
+		} ),
+	},
+};
+
+/**
+ * @type {import('webpack').Configuration[]} Webpack configuration.
+ */
 module.exports = [
 	{
+		...sharedConfig,
 		entry: {
 			'tracks-ajax': './src/js/tracks-ajax.js',
 			'tracks-callables': {
@@ -29,7 +76,17 @@ module.exports = [
 			},
 			'identity-crisis': './src/identity-crisis/_inc/admin.jsx',
 			...ssoEntries,
-			[ 'jetpack-connection' ]: {
+		},
+		plugins: [
+			...jetpackWebpackConfig.StandardPlugins( {
+				MiniCssExtractPlugin: { filename: '[name].css' },
+			} ),
+		],
+	},
+	{
+		...sharedConfig,
+		entry: {
+			'jetpack-connection': {
 				import: './src/js/jetpack-connection.js',
 				library: {
 					name: 'JetpackConnection',
@@ -37,19 +94,6 @@ module.exports = [
 				},
 			},
 		},
-		mode: jetpackWebpackConfig.mode,
-		devtool: jetpackWebpackConfig.devtool,
-		output: {
-			...jetpackWebpackConfig.output,
-			path: path.resolve( './dist' ),
-		},
-		optimization: {
-			...jetpackWebpackConfig.optimization,
-		},
-		resolve: {
-			...jetpackWebpackConfig.resolve,
-		},
-		node: false,
 		plugins: [
 			...jetpackWebpackConfig.StandardPlugins( {
 				MiniCssExtractPlugin: { filename: '[name].css' },
@@ -62,31 +106,12 @@ module.exports = [
 			} ),
 		],
 		module: {
-			strictExportPresence: true,
+			...sharedConfig.module,
 			rules: [
-				// Transpile JavaScript, including node_modules.
-				jetpackWebpackConfig.TranspileRule(),
-
-				// Transpile @automattic/jetpack-* in node_modules too.
-				jetpackWebpackConfig.TranspileRule( {
-					includeNodeModules: [ '@automattic/jetpack-' ],
-				} ),
-
-				// Handle CSS.
-				jetpackWebpackConfig.CssRule( {
-					extensions: [ 'css', 'sass', 'scss' ],
-					extraLoaders: [ 'sass-loader' ],
-				} ),
-
+				...sharedConfig.module.rules,
 				// Handle images.
 				jetpackWebpackConfig.FileRule(),
 			],
 		},
-		externals: {
-			...jetpackWebpackConfig.externals,
-			jetpackConfig: JSON.stringify( {
-				consumer_slug: 'identity_crisis',
-			} ),
-		},
 	},
 ];
diff --git a/projects/packages/publicize/webpack.config.js b/projects/packages/publicize/webpack.config.js
index a705a93350dcc..f338fd5b600ec 100644
--- a/projects/packages/publicize/webpack.config.js
+++ b/projects/packages/publicize/webpack.config.js
@@ -1,14 +1,76 @@
 const path = require( 'path' );
 const jetpackWebpackConfig = require( '@automattic/jetpack-webpack-config/webpack' );
 
+/**
+ * @type {import('webpack').Configuration[]} Webpack configuration.
+ */
+const sharedConfig = {
+	entry: {
+		[ 'classic-editor-share-limits' ]: './src/js/classic-editor-share-limits.js',
+		[ 'classic-editor-connections' ]: './src/js/classic-editor-connections.js',
+	},
+	mode: jetpackWebpackConfig.mode,
+	devtool: jetpackWebpackConfig.devtool,
+	output: {
+		...jetpackWebpackConfig.output,
+		path: path.resolve( './build' ),
+	},
+	optimization: {
+		...jetpackWebpackConfig.optimization,
+	},
+	resolve: {
+		...jetpackWebpackConfig.resolve,
+	},
+	node: false,
+	plugins: [ ...jetpackWebpackConfig.StandardPlugins() ],
+	module: {
+		strictExportPresence: true,
+		rules: [
+			// Transpile JavaScript
+			jetpackWebpackConfig.TranspileRule( {
+				exclude: /node_modules\//,
+			} ),
+
+			// Transpile @automattic/* in node_modules too.
+			jetpackWebpackConfig.TranspileRule( {
+				includeNodeModules: [ '@automattic/' ],
+			} ),
+
+			// Handle CSS.
+			jetpackWebpackConfig.CssRule( {
+				extensions: [ 'css', 'sass', 'scss' ],
+				extraLoaders: [
+					{
+						loader: 'postcss-loader',
+						options: {
+							postcssOptions: { config: path.join( __dirname, 'postcss.config.js' ) },
+						},
+					},
+					'sass-loader',
+				],
+			} ),
+
+			// Handle images.
+			jetpackWebpackConfig.FileRule(),
+		],
+	},
+};
+
 /**
  * @type {import('webpack').Configuration[]} Webpack configuration.
  */
 module.exports = [
 	{
+		...sharedConfig,
 		entry: {
 			[ 'classic-editor-share-limits' ]: './src/js/classic-editor-share-limits.js',
 			[ 'classic-editor-connections' ]: './src/js/classic-editor-connections.js',
+		},
+		plugins: [ ...jetpackWebpackConfig.StandardPlugins() ],
+	},
+	{
+		...sharedConfig,
+		entry: {
 			[ 'jetpack-publicize' ]: {
 				import: './src/js/jetpack-publicize.js',
 				library: {
@@ -23,19 +85,6 @@ module.exports = [
 				consumer_slug: 'jetpack-publicize',
 			} ),
 		},
-		mode: jetpackWebpackConfig.mode,
-		devtool: jetpackWebpackConfig.devtool,
-		output: {
-			...jetpackWebpackConfig.output,
-			path: path.resolve( './build' ),
-		},
-		optimization: {
-			...jetpackWebpackConfig.optimization,
-		},
-		resolve: {
-			...jetpackWebpackConfig.resolve,
-		},
-		node: false,
 		plugins: [
 			...jetpackWebpackConfig.StandardPlugins( {
 				DependencyExtractionPlugin: {
@@ -46,36 +95,5 @@ module.exports = [
 				},
 			} ),
 		],
-		module: {
-			strictExportPresence: true,
-			rules: [
-				// Transpile JavaScript
-				jetpackWebpackConfig.TranspileRule( {
-					exclude: /node_modules\//,
-				} ),
-
-				// Transpile @automattic/* in node_modules too.
-				jetpackWebpackConfig.TranspileRule( {
-					includeNodeModules: [ '@automattic/' ],
-				} ),
-
-				// Handle CSS.
-				jetpackWebpackConfig.CssRule( {
-					extensions: [ 'css', 'sass', 'scss' ],
-					extraLoaders: [
-						{
-							loader: 'postcss-loader',
-							options: {
-								postcssOptions: { config: path.join( __dirname, 'postcss.config.js' ) },
-							},
-						},
-						'sass-loader',
-					],
-				} ),
-
-				// Handle images.
-				jetpackWebpackConfig.FileRule(),
-			],
-		},
 	},
 ];

From 19378d5faa7a36663c1d7351ebc00d2b2a5f8b80 Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Thu, 18 Jul 2024 10:50:49 +0530
Subject: [PATCH 27/37] Remove unnecessary css_dependencies

---
 projects/plugins/social/src/class-jetpack-social.php | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/projects/plugins/social/src/class-jetpack-social.php b/projects/plugins/social/src/class-jetpack-social.php
index 787ca4e40cf60..8f55725363dfd 100644
--- a/projects/plugins/social/src/class-jetpack-social.php
+++ b/projects/plugins/social/src/class-jetpack-social.php
@@ -176,9 +176,8 @@ public function enqueue_admin_scripts() {
 			'build/index.js',
 			JETPACK_SOCIAL_PLUGIN_ROOT_FILE,
 			array(
-				'in_footer'        => true,
-				'textdomain'       => 'jetpack-social',
-				'css_dependencies' => array( 'jetpack-publicize', 'jetpack-connection' ),
+				'in_footer'  => true,
+				'textdomain' => 'jetpack-social',
 			)
 		);
 

From 6f857e8aec1a328332f5e8ef3f38653ea26a7bfb Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Thu, 18 Jul 2024 10:44:54 +0530
Subject: [PATCH 28/37] Connection initial state is now handled by the package
 itself

---
 .../_inc/lib/admin-pages/class.jetpack-react-page.php        | 4 ----
 projects/plugins/jetpack/class.jetpack-gutenberg.php         | 4 ----
 projects/plugins/social/src/class-jetpack-social.php         | 5 -----
 3 files changed, 13 deletions(-)

diff --git a/projects/plugins/jetpack/_inc/lib/admin-pages/class.jetpack-react-page.php b/projects/plugins/jetpack/_inc/lib/admin-pages/class.jetpack-react-page.php
index 05f42d906e4e7..c5a3e418aa339 100644
--- a/projects/plugins/jetpack/_inc/lib/admin-pages/class.jetpack-react-page.php
+++ b/projects/plugins/jetpack/_inc/lib/admin-pages/class.jetpack-react-page.php
@@ -1,7 +1,6 @@
 <?php // phpcs:ignore WordPress.Files.FileName.InvalidClassFileName
 
 use Automattic\Jetpack\Assets\Logo;
-use Automattic\Jetpack\Connection\Initial_State as Connection_Initial_State;
 use Automattic\Jetpack\Connection\Manager as Connection_Manager;
 use Automattic\Jetpack\Status;
 
@@ -300,8 +299,5 @@ public function page_admin_scripts() {
 
 		// This will set the default URL of the jp_redirects lib.
 		wp_add_inline_script( $initial_state_handle, 'var jetpack_redirects = { currentSiteRawUrl: "' . $site_suffix . '"' . $blog_id_prop . ' };', 'before' );
-
-		// Adds Connection package initial state.
-		Connection_Initial_State::render_script( $initial_state_handle );
 	}
 }
diff --git a/projects/plugins/jetpack/class.jetpack-gutenberg.php b/projects/plugins/jetpack/class.jetpack-gutenberg.php
index 1f6239a49a3d5..b50710d04432d 100644
--- a/projects/plugins/jetpack/class.jetpack-gutenberg.php
+++ b/projects/plugins/jetpack/class.jetpack-gutenberg.php
@@ -8,7 +8,6 @@
 
 use Automattic\Jetpack\Assets;
 use Automattic\Jetpack\Blocks;
-use Automattic\Jetpack\Connection\Initial_State as Connection_Initial_State;
 use Automattic\Jetpack\Connection\Manager as Connection_Manager;
 use Automattic\Jetpack\Constants;
 use Automattic\Jetpack\Current_Plan as Jetpack_Plan;
@@ -774,9 +773,6 @@ public static function enqueue_block_editor_assets() {
 			'Jetpack_Editor_Initial_State',
 			$initial_state
 		);
-
-		// Adds Connection package initial state.
-		Connection_Initial_State::render_script( 'jetpack-publicize' );
 	}
 
 	/**
diff --git a/projects/plugins/social/src/class-jetpack-social.php b/projects/plugins/social/src/class-jetpack-social.php
index 8f55725363dfd..66dbe324864bf 100644
--- a/projects/plugins/social/src/class-jetpack-social.php
+++ b/projects/plugins/social/src/class-jetpack-social.php
@@ -11,7 +11,6 @@
 
 use Automattic\Jetpack\Admin_UI\Admin_Menu;
 use Automattic\Jetpack\Assets;
-use Automattic\Jetpack\Connection\Initial_State as Connection_Initial_State;
 use Automattic\Jetpack\Connection\Manager as Connection_Manager;
 use Automattic\Jetpack\Connection\Rest_Authentication as Connection_Rest_Authentication;
 use Automattic\Jetpack\Current_Plan;
@@ -182,8 +181,6 @@ public function enqueue_admin_scripts() {
 		);
 
 		Assets::enqueue_script( 'jetpack-social' );
-		// Initial JS state including JP Connection data.
-		Connection_Initial_State::render_script( 'jetpack-publicize' );
 		wp_add_inline_script( 'jetpack-publicize', $this->render_initial_state(), 'before' );
 	}
 
@@ -366,8 +363,6 @@ class_exists( 'Jetpack' ) ||
 			)
 		);
 
-		// Connection initial state is expected when the connection JS package is in the bundle
-		Connection_Initial_State::render_script( 'jetpack-publicize' );
 		// Conditionally load analytics scripts
 		// The only component using analytics in the editor at the moment is the review request
 		if ( ! in_array( get_post_status(), array( 'publish', 'private', 'trash' ), true ) && self::can_use_analytics() && ! self::is_review_request_dismissed() ) {

From df24001d2994bdf764076b49d7a666016904a860 Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Thu, 18 Jul 2024 10:53:52 +0530
Subject: [PATCH 29/37] Change initial state handle to connection

---
 .../jetpack/_inc/lib/admin-pages/class.jetpack-react-page.php   | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/projects/plugins/jetpack/_inc/lib/admin-pages/class.jetpack-react-page.php b/projects/plugins/jetpack/_inc/lib/admin-pages/class.jetpack-react-page.php
index c5a3e418aa339..c88797d7ea538 100644
--- a/projects/plugins/jetpack/_inc/lib/admin-pages/class.jetpack-react-page.php
+++ b/projects/plugins/jetpack/_inc/lib/admin-pages/class.jetpack-react-page.php
@@ -289,7 +289,7 @@ public function page_admin_scripts() {
 			wp_enqueue_script( 'jp-tracks', '//stats.wp.com/w.js', array(), gmdate( 'YW' ), true );
 		}
 		// The script handle for the initial state.
-		$initial_state_handle = 'jetpack-publicize';
+		$initial_state_handle = 'jetpack-connection';
 
 		wp_set_script_translations( $initial_state_handle, 'jetpack' );
 

From 9c1a53ed08bde3472d8cd1bb477cc57a95188bd9 Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Fri, 19 Jul 2024 11:29:06 +0530
Subject: [PATCH 30/37] Move files rule to shared config

---
 projects/packages/connection/webpack.config.js | 10 ++--------
 1 file changed, 2 insertions(+), 8 deletions(-)

diff --git a/projects/packages/connection/webpack.config.js b/projects/packages/connection/webpack.config.js
index 4079895fd2195..8bb5475de3c58 100644
--- a/projects/packages/connection/webpack.config.js
+++ b/projects/packages/connection/webpack.config.js
@@ -49,6 +49,8 @@ const sharedConfig = {
 				extensions: [ 'css', 'sass', 'scss' ],
 				extraLoaders: [ 'sass-loader' ],
 			} ),
+			// Handle images.
+			jetpackWebpackConfig.FileRule(),
 		],
 	},
 	externals: {
@@ -105,13 +107,5 @@ module.exports = [
 				},
 			} ),
 		],
-		module: {
-			...sharedConfig.module,
-			rules: [
-				...sharedConfig.module.rules,
-				// Handle images.
-				jetpackWebpackConfig.FileRule(),
-			],
-		},
 	},
 ];

From 1df8b6fd707ae64b14819a74eb00e906ef4716e6 Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Fri, 19 Jul 2024 17:11:25 +0530
Subject: [PATCH 31/37] Fix text domain

---
 projects/packages/connection/src/class-connection-assets.php | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/projects/packages/connection/src/class-connection-assets.php b/projects/packages/connection/src/class-connection-assets.php
index 30626e591137d..2e408574606b1 100644
--- a/projects/packages/connection/src/class-connection-assets.php
+++ b/projects/packages/connection/src/class-connection-assets.php
@@ -33,7 +33,7 @@ public static function register_assets() {
 				__FILE__,
 				array(
 					'in_footer'  => true,
-					'textdomain' => 'jetpack-idc',
+					'textdomain' => 'jetpack-connection',
 				)
 			);
 

From 9158440d259e70ed5dbcacf976329a8f9deb8c87 Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Fri, 16 Aug 2024 10:05:06 +0530
Subject: [PATCH 32/37] Update pnpm-lock.yaml

---
 pnpm-lock.yaml | 33 +++++++++++++++++++++++++++++++++
 1 file changed, 33 insertions(+)

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 24dd6e0ae6c0e..0616fa0b738f0 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -1942,6 +1942,9 @@ importers:
 
   projects/packages/connection:
     dependencies:
+      '@automattic/jetpack-connection':
+        specifier: workspace:*
+        version: link:../../js-packages/connection
       '@automattic/jetpack-idc':
         specifier: workspace:*
         version: link:../../js-packages/idc
@@ -2602,19 +2605,49 @@ importers:
 
   projects/packages/publicize:
     dependencies:
+      '@automattic/jetpack-publicize-components':
+        specifier: workspace:*
+        version: link:../../js-packages/publicize-components
       '@wordpress/i18n':
         specifier: 5.5.0
         version: 5.5.0
     devDependencies:
+      '@automattic/calypso-color-schemes':
+        specifier: 3.1.3
+        version: 3.1.3
+      '@automattic/color-studio':
+        specifier: 2.6.0
+        version: 2.6.0
       '@automattic/jetpack-webpack-config':
         specifier: workspace:*
         version: link:../../js-packages/webpack-config
+      '@csstools/postcss-global-data':
+        specifier: 2.1.1
+        version: 2.1.1(postcss@8.4.31)
       '@wordpress/browserslist-config':
         specifier: 6.5.0
         version: 6.5.0
+      autoprefixer:
+        specifier: 10.4.14
+        version: 10.4.14(postcss@8.4.31)
       concurrently:
         specifier: 7.6.0
         version: 7.6.0
+      postcss:
+        specifier: 8.4.31
+        version: 8.4.31
+      postcss-custom-properties:
+        specifier: 12.1.7
+        version: 12.1.7(postcss@8.4.31)
+      postcss-loader:
+        specifier: 6.2.0
+        version: 6.2.0(postcss@8.4.31)(webpack@5.76.0(webpack-cli@4.9.1))
+      sass:
+        specifier: 1.64.1
+        version: 1.64.1
+      sass-loader:
+        specifier: 12.4.0
+        version: 12.4.0(sass@1.64.1)(webpack@5.76.0(webpack-cli@4.9.1))
       webpack:
         specifier: 5.76.0
         version: 5.76.0(webpack-cli@4.9.1)

From 0ecb7708056dba89856f5366a9e9d3eb11db6f7f Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Tue, 3 Sep 2024 16:53:10 +0400
Subject: [PATCH 33/37] Remove unnecessary changes

---
 .../js-packages/webpack-config/src/webpack.js     | 12 ++++++------
 .../lib/admin-pages/class.jetpack-admin-page.php  |  2 +-
 .../lib/admin-pages/class.jetpack-react-page.php  | 12 +++++++-----
 .../plugins/jetpack/class.jetpack-gutenberg.php   |  8 ++++++--
 projects/plugins/jetpack/class.jetpack.php        |  4 ----
 .../plugins/social/src/class-jetpack-social.php   | 15 ++++++++-------
 6 files changed, 28 insertions(+), 25 deletions(-)

diff --git a/projects/js-packages/webpack-config/src/webpack.js b/projects/js-packages/webpack-config/src/webpack.js
index 9fa5ae103cb08..8ef5c200bb917 100644
--- a/projects/js-packages/webpack-config/src/webpack.js
+++ b/projects/js-packages/webpack-config/src/webpack.js
@@ -106,17 +106,17 @@ const DefinePlugin = defines => [
 ];
 
 const defaultRequestMap = {
-	'@automattic/jetpack-publicize-components': {
-		external: 'JetpackPublicize',
-		handle: 'jetpack-publicize',
+	'@automattic/jetpack-script-data': {
+		external: 'JetpackScriptDataModule',
+		handle: 'jetpack-script-data',
 	},
 	'@automattic/jetpack-connection': {
 		external: 'JetpackConnection',
 		handle: 'jetpack-connection',
 	},
-	'@automattic/jetpack-script-data': {
-		external: 'JetpackScriptDataModule',
-		handle: 'jetpack-script-data',
+	'@automattic/jetpack-publicize-components': {
+		external: 'JetpackPublicize',
+		handle: 'jetpack-publicize',
 	},
 };
 
diff --git a/projects/plugins/jetpack/_inc/lib/admin-pages/class.jetpack-admin-page.php b/projects/plugins/jetpack/_inc/lib/admin-pages/class.jetpack-admin-page.php
index 9cfc289f81269..6da8bf5eeded5 100644
--- a/projects/plugins/jetpack/_inc/lib/admin-pages/class.jetpack-admin-page.php
+++ b/projects/plugins/jetpack/_inc/lib/admin-pages/class.jetpack-admin-page.php
@@ -262,7 +262,7 @@ public function check_plan_deactivate_modules( $page ) {
 	 */
 	public static function load_wrapper_styles() {
 		$rtl = is_rtl() ? '.rtl' : '';
-		wp_enqueue_style( 'dops-css', plugins_url( "_inc/build/admin{$rtl}.css", JETPACK__PLUGIN_FILE ), array( 'jetpack-publicize', 'jetpack-connection' ), JETPACK__VERSION );
+		wp_enqueue_style( 'dops-css', plugins_url( "_inc/build/admin{$rtl}.css", JETPACK__PLUGIN_FILE ), array(), JETPACK__VERSION );
 		wp_enqueue_style( 'components-css', plugins_url( "_inc/build/style.min{$rtl}.css", JETPACK__PLUGIN_FILE ), array( 'wp-components' ), JETPACK__VERSION );
 	}
 
diff --git a/projects/plugins/jetpack/_inc/lib/admin-pages/class.jetpack-react-page.php b/projects/plugins/jetpack/_inc/lib/admin-pages/class.jetpack-react-page.php
index 8238c8300d99d..378fc8500610a 100644
--- a/projects/plugins/jetpack/_inc/lib/admin-pages/class.jetpack-react-page.php
+++ b/projects/plugins/jetpack/_inc/lib/admin-pages/class.jetpack-react-page.php
@@ -2,6 +2,7 @@
 
 use Automattic\Jetpack\Admin_UI\Admin_Menu;
 use Automattic\Jetpack\Assets\Logo;
+use Automattic\Jetpack\Connection\Initial_State as Connection_Initial_State;
 use Automattic\Jetpack\Connection\Manager as Connection_Manager;
 use Automattic\Jetpack\Status;
 
@@ -317,16 +318,17 @@ public function page_admin_scripts() {
 			// Required for Analytics.
 			wp_enqueue_script( 'jp-tracks', '//stats.wp.com/w.js', array(), gmdate( 'YW' ), true );
 		}
-		// The script handle for the initial state.
-		$initial_state_handle = 'jetpack-connection';
 
-		wp_set_script_translations( $initial_state_handle, 'jetpack' );
+		wp_set_script_translations( 'react-plugin', 'jetpack' );
 
 		// Add objects to be passed to the initial state of the app.
 		// Use wp_add_inline_script instead of wp_localize_script, see https://core.trac.wordpress.org/ticket/25280.
-		wp_add_inline_script( $initial_state_handle, 'var Initial_State=JSON.parse(decodeURIComponent("' . rawurlencode( wp_json_encode( Jetpack_Redux_State_Helper::get_initial_state() ) ) . '"));', 'before' );
+		wp_add_inline_script( 'react-plugin', 'var Initial_State=JSON.parse(decodeURIComponent("' . rawurlencode( wp_json_encode( Jetpack_Redux_State_Helper::get_initial_state() ) ) . '"));', 'before' );
 
 		// This will set the default URL of the jp_redirects lib.
-		wp_add_inline_script( $initial_state_handle, 'var jetpack_redirects = { currentSiteRawUrl: "' . $site_suffix . '"' . $blog_id_prop . ' };', 'before' );
+		wp_add_inline_script( 'react-plugin', 'var jetpack_redirects = { currentSiteRawUrl: "' . $site_suffix . '"' . $blog_id_prop . ' };', 'before' );
+
+		// Adds Connection package initial state.
+		Connection_Initial_State::render_script( 'react-plugin' );
 	}
 }
diff --git a/projects/plugins/jetpack/class.jetpack-gutenberg.php b/projects/plugins/jetpack/class.jetpack-gutenberg.php
index f2f065b6b7d81..a0e5d9042545d 100644
--- a/projects/plugins/jetpack/class.jetpack-gutenberg.php
+++ b/projects/plugins/jetpack/class.jetpack-gutenberg.php
@@ -8,6 +8,7 @@
 
 use Automattic\Jetpack\Assets;
 use Automattic\Jetpack\Blocks;
+use Automattic\Jetpack\Connection\Initial_State as Connection_Initial_State;
 use Automattic\Jetpack\Connection\Manager as Connection_Manager;
 use Automattic\Jetpack\Constants;
 use Automattic\Jetpack\Current_Plan as Jetpack_Plan;
@@ -667,7 +668,7 @@ public static function enqueue_block_editor_assets() {
 		// wp-edit-post but wp-edit-post's styles break the Widget Editor and
 		// Site Editor) until a real fix gets unblocked.
 		// @todo Remove this once #20357 is properly fixed.
-		wp_styles()->query( 'jetpack-blocks-editor', 'registered' )->deps = array( 'jetpack-publicize' );
+		wp_styles()->query( 'jetpack-blocks-editor', 'registered' )->deps = array();
 
 		Assets::enqueue_script( 'jetpack-blocks-editor' );
 
@@ -775,10 +776,13 @@ public static function enqueue_block_editor_assets() {
 		}
 
 		wp_localize_script(
-			'jetpack-publicize',
+			'jetpack-blocks-editor',
 			'Jetpack_Editor_Initial_State',
 			$initial_state
 		);
+
+		// Adds Connection package initial state.
+		Connection_Initial_State::render_script( 'jetpack-blocks-editor' );
 	}
 
 	/**
diff --git a/projects/plugins/jetpack/class.jetpack.php b/projects/plugins/jetpack/class.jetpack.php
index fb5f6d17d9789..7f83c85fdd490 100644
--- a/projects/plugins/jetpack/class.jetpack.php
+++ b/projects/plugins/jetpack/class.jetpack.php
@@ -905,10 +905,6 @@ public function configure() {
 			$this->connection_manager = new Connection_Manager( 'jetpack' );
 		}
 
-		// Assets should be registered regardless of connection status.
-		\Automattic\Jetpack\Publicize\Publicize_Assets::configure();
-		\Automattic\Jetpack\Connection\Connection_Assets::configure();
-
 		$modules = new Automattic\Jetpack\Modules();
 		if ( $modules->is_active( 'publicize' ) && $this->connection_manager->has_connected_user() ) {
 			$config->ensure( 'publicize' );
diff --git a/projects/plugins/social/src/class-jetpack-social.php b/projects/plugins/social/src/class-jetpack-social.php
index f49855773c02e..9a4954d4c55eb 100644
--- a/projects/plugins/social/src/class-jetpack-social.php
+++ b/projects/plugins/social/src/class-jetpack-social.php
@@ -11,6 +11,7 @@
 
 use Automattic\Jetpack\Admin_UI\Admin_Menu;
 use Automattic\Jetpack\Assets;
+use Automattic\Jetpack\Connection\Initial_State as Connection_Initial_State;
 use Automattic\Jetpack\Connection\Manager as Connection_Manager;
 use Automattic\Jetpack\Connection\Rest_Authentication as Connection_Rest_Authentication;
 use Automattic\Jetpack\Current_Plan;
@@ -77,10 +78,6 @@ function () {
 				// Identity crisis package.
 				$config->ensure( 'identity_crisis' );
 
-				// Assets should be registered regardless of connection status.
-				\Automattic\Jetpack\Publicize\Publicize_Assets::configure();
-				\Automattic\Jetpack\Connection\Connection_Assets::configure();
-
 				if ( ! $this->is_connected() ) {
 					return;
 				}
@@ -182,7 +179,9 @@ public function enqueue_admin_scripts() {
 		);
 
 		Assets::enqueue_script( 'jetpack-social' );
-		wp_add_inline_script( 'jetpack-publicize', $this->render_initial_state(), 'before' );
+		// Initial JS state including JP Connection data.
+		Connection_Initial_State::render_script( 'jetpack-social' );
+		wp_add_inline_script( 'jetpack-social', $this->render_initial_state(), 'before' );
 	}
 
 	/**
@@ -357,7 +356,7 @@ class_exists( 'Jetpack' ) ||
 		$initial_state['featureFlags'] = $social_state['featureFlags'];
 
 		wp_localize_script(
-			'jetpack-publicize',
+			'jetpack-social-editor',
 			'Jetpack_Editor_Initial_State',
 			array(
 				'siteFragment' => ( new Status() )->get_site_suffix(),
@@ -366,6 +365,8 @@ class_exists( 'Jetpack' ) ||
 			)
 		);
 
+		// Connection initial state is expected when the connection JS package is in the bundle
+		Connection_Initial_State::render_script( 'jetpack-social-editor' );
 		// Conditionally load analytics scripts
 		// The only component using analytics in the editor at the moment is the review request
 		if ( ! in_array( get_post_status(), array( 'publish', 'private', 'trash' ), true ) && self::can_use_analytics() && ! self::is_review_request_dismissed() ) {
@@ -388,7 +389,7 @@ public function add_review_initial_state() {
 		);
 
 		wp_add_inline_script(
-			'jetpack-publicize',
+			class_exists( 'Jetpack' ) ? 'jetpack-blocks-editor' : 'jetpack-social-editor',
 			sprintf( 'Object.assign( window.Jetpack_Editor_Initial_State.social, %s )', wp_json_encode( $review_state ) ),
 			'after'
 		);

From 846a317d7e072ea1cc175dfe2a7dd9340d1fd647 Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Tue, 3 Sep 2024 16:54:03 +0400
Subject: [PATCH 34/37] Update pnpm-lock.yaml

---
 pnpm-lock.yaml | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 1e13da856d44f..5902cc6ec2b4b 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -2647,13 +2647,13 @@ importers:
         version: 12.1.7(postcss@8.4.31)
       postcss-loader:
         specifier: 6.2.0
-        version: 6.2.0(postcss@8.4.31)(webpack@5.76.0(webpack-cli@4.9.1))
+        version: 6.2.0(postcss@8.4.31)(webpack@5.94.0(webpack-cli@4.9.1))
       sass:
         specifier: 1.64.1
         version: 1.64.1
       sass-loader:
         specifier: 12.4.0
-        version: 12.4.0(sass@1.64.1)(webpack@5.76.0(webpack-cli@4.9.1))
+        version: 12.4.0(sass@1.64.1)(webpack@5.94.0(webpack-cli@4.9.1))
       webpack:
         specifier: 5.94.0
         version: 5.94.0(webpack-cli@4.9.1)

From 52e6104035d26458e1287c625cb19c4a99cb91e7 Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Tue, 3 Sep 2024 16:58:04 +0400
Subject: [PATCH 35/37] Remove unnecessary changelogs

---
 .../changelog/update-unbundle-publicize-from-jetpack#2       | 5 -----
 .../changelog/update-unbundle-publicize-from-jetpack#2       | 5 -----
 2 files changed, 10 deletions(-)
 delete mode 100644 projects/plugins/jetpack/changelog/update-unbundle-publicize-from-jetpack#2
 delete mode 100644 projects/plugins/social/changelog/update-unbundle-publicize-from-jetpack#2

diff --git a/projects/plugins/jetpack/changelog/update-unbundle-publicize-from-jetpack#2 b/projects/plugins/jetpack/changelog/update-unbundle-publicize-from-jetpack#2
deleted file mode 100644
index a1c1831fa1ef7..0000000000000
--- a/projects/plugins/jetpack/changelog/update-unbundle-publicize-from-jetpack#2
+++ /dev/null
@@ -1,5 +0,0 @@
-Significance: patch
-Type: other
-Comment: Updated composer.lock.
-
-
diff --git a/projects/plugins/social/changelog/update-unbundle-publicize-from-jetpack#2 b/projects/plugins/social/changelog/update-unbundle-publicize-from-jetpack#2
deleted file mode 100644
index 9aa70e3ec1f75..0000000000000
--- a/projects/plugins/social/changelog/update-unbundle-publicize-from-jetpack#2
+++ /dev/null
@@ -1,5 +0,0 @@
-Significance: patch
-Type: changed
-Comment: Updated composer.lock.
-
-

From 0996ca2dceec0c186c90c26de60b52841dc8dad8 Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Tue, 3 Sep 2024 17:05:02 +0400
Subject: [PATCH 36/37] Fix lints

---
 projects/packages/publicize/webpack.config.js | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/projects/packages/publicize/webpack.config.js b/projects/packages/publicize/webpack.config.js
index ca2d5832dcace..a7bfd562c1bab 100644
--- a/projects/packages/publicize/webpack.config.js
+++ b/projects/packages/publicize/webpack.config.js
@@ -6,8 +6,8 @@ const jetpackWebpackConfig = require( '@automattic/jetpack-webpack-config/webpac
  */
 const sharedConfig = {
 	entry: {
-		[ 'classic-editor-share-limits' ]: './src/js/classic-editor-share-limits.js',
-		[ 'classic-editor-connections' ]: './src/js/classic-editor-connections.js',
+		'classic-editor-share-limits': './src/js/classic-editor-share-limits.js',
+		'classic-editor-connections': './src/js/classic-editor-connections.js',
 	},
 	mode: jetpackWebpackConfig.mode,
 	devtool: jetpackWebpackConfig.devtool,
@@ -71,7 +71,7 @@ module.exports = [
 	{
 		...sharedConfig,
 		entry: {
-			[ 'jetpack-publicize' ]: {
+			'jetpack-publicize': {
 				import: './src/js/jetpack-publicize.js',
 				library: {
 					name: 'JetpackPublicize',

From b48f61c9ec5a62a25bd44fe6d2836501d58bb6ae Mon Sep 17 00:00:00 2001
From: Manzoor Wani <manzoorwani.jk@gmail.com>
Date: Thu, 5 Sep 2024 09:46:51 +0400
Subject: [PATCH 37/37] Update pnpm-lock.yaml

---
 pnpm-lock.yaml | 30 ++++++++++++++++++++++++++++++
 1 file changed, 30 insertions(+)

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 2806a378eb7dc..e30402ec30763 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -2611,19 +2611,49 @@ importers:
 
   projects/packages/publicize:
     dependencies:
+      '@automattic/jetpack-publicize-components':
+        specifier: workspace:*
+        version: link:../../js-packages/publicize-components
       '@wordpress/i18n':
         specifier: 5.6.0
         version: 5.6.0
     devDependencies:
+      '@automattic/calypso-color-schemes':
+        specifier: 3.1.3
+        version: 3.1.3
+      '@automattic/color-studio':
+        specifier: 2.6.0
+        version: 2.6.0
       '@automattic/jetpack-webpack-config':
         specifier: workspace:*
         version: link:../../js-packages/webpack-config
+      '@csstools/postcss-global-data':
+        specifier: 2.1.1
+        version: 2.1.1(postcss@8.4.31)
       '@wordpress/browserslist-config':
         specifier: 6.6.0
         version: 6.6.0
+      autoprefixer:
+        specifier: 10.4.14
+        version: 10.4.14(postcss@8.4.31)
       concurrently:
         specifier: 7.6.0
         version: 7.6.0
+      postcss:
+        specifier: 8.4.31
+        version: 8.4.31
+      postcss-custom-properties:
+        specifier: 12.1.7
+        version: 12.1.7(postcss@8.4.31)
+      postcss-loader:
+        specifier: 6.2.0
+        version: 6.2.0(postcss@8.4.31)(webpack@5.94.0(webpack-cli@4.9.1))
+      sass:
+        specifier: 1.64.1
+        version: 1.64.1
+      sass-loader:
+        specifier: 12.4.0
+        version: 12.4.0(sass@1.64.1)(webpack@5.94.0(webpack-cli@4.9.1))
       webpack:
         specifier: 5.94.0
         version: 5.94.0(webpack-cli@4.9.1)