Untangling: Update the WPCOM importer card

projects/packages/jetpack-mu-wpcom/changelog/update-wpcom-importer-banner

@@ -0,0 +1,5 @@
+Significance: patch
+Type: changed
+Comment: Update the WPCOM importer card in wp-admin/import for Simple and Atomic sites
+
+

projects/packages/jetpack-mu-wpcom/src/class-jetpack-mu-wpcom.php

@@ -274,7 +274,6 @@ public static function load_features() {
 		require_once __DIR__ . '/features/font-smoothing-antialiased/font-smoothing-antialiased.php';
 		require_once __DIR__ . '/features/google-analytics/google-analytics.php';
 		require_once __DIR__ . '/features/holiday-snow/class-holiday-snow.php';
-		require_once __DIR__ . '/features/import-customizations/import-customizations.php';
 		require_once __DIR__ . '/features/launch-button/index.php';
 		require_once __DIR__ . '/features/logo-tool/logo-tool.php';
 		require_once __DIR__ . '/features/marketplace-products-updater/class-marketplace-products-updater.php';

projects/packages/jetpack-mu-wpcom/src/features/wpcom-imports/wpcom-importer-entry.js

@@ -0,0 +1,45 @@
+/* global wp, wpcomImporterData */
+
+/**
+ * Create the HTML markup for the WPCOM Importer card.
+ *
+ * @param {number} width - The width in pixels for the import system cell.
+ * @return {string} HTML markup for the WPCOM Importer card table.
+ */
+function wpcomImporterEntry( width ) {
+	return (
+		'<table class="widefat importers striped" style="margin-bottom: 20px">' +
+		'<tbody><tr class="importer-item">' +
+		'<td class="import-system" style="width: ' +
+		width +
+		'px">' +
+		'<span class="importer-title">WordPress.com</span>' +
+		'<span class="importer-action"><a href="' +
+		wpcomImporterData.wpcomImporterUrl +
+		'" aria-label="' +
+		wp.i18n.__( 'Run WordPress.com Importer', 'jetpack-mu-wpcom' ) +
+		'">' +
+		wp.i18n.__( 'Run Importer', 'jetpack-mu-wpcom' ) +
+		'</a></span>' +
+		'</td>' +
+		'<td class="desc">' +
+		'<span class="importer-desc">' +
+		wp.i18n.__(
+			'Effortless WordPress migrations, plus content imports from platforms like Medium and Squarespace - no plugins or technical setup required.',
+			'jetpack-mu-wpcom'
+		) +
+		'</span>' +
+		'</td>' +
+		'</tr>' +
+		'</tbody></table>'
+	);
+}
+
+wp.domReady( function () {
+	const targetElement = document.querySelector( '.widefat.importers.striped' );
+	// 24 is the padding size.
+	const width = targetElement.rows[ 0 ].cells[ 0 ].clientWidth - 24;
+	if ( targetElement ) {
+		targetElement.insertAdjacentHTML( 'beforebegin', wpcomImporterEntry( width ) );
+	}
+} );

projects/packages/jetpack-mu-wpcom/src/features/wpcom-imports/wpcom-imports.php

@@ -107,3 +107,33 @@ function wpcom_import_update_wordpress_url_on_simple( $url, $importer_type ) {
  * Although the hook is prefixed with wp_*, it's actually a custom WPCOM one that's only executed on Simple Sites.
  */
 add_action( 'wp_import_run_import_url_filter', 'wpcom_import_update_wordpress_url_on_simple', 11, 2 );
+
+/**
+ * Enqueue the wpcom importer entry script.
+ */
+function wpcom_imports_enqueue_script() {
+	wp_enqueue_script(
+		'wpcom-importer-entry',
+		plugins_url( 'wpcom-importer-entry.js', __FILE__ ),
+		array( 'wp-i18n', 'wp-dom-ready' ),
+		'1.0.0',
+		true
+	);
+
+	$domain  = wp_parse_url( home_url(), PHP_URL_HOST );
+	$site_id = get_wpcom_blog_id();
+
+	$url = 'https://wordpress.com/setup/site-migration/site-migration-identify?hide_importer_link=true&siteSlug=' . $domain . '&siteId=' . $site_id;
+
+	wp_add_inline_script(
+		'wpcom-importer-entry',
+		'const wpcomImporterData = ' . wp_json_encode(
+			array(
+				'wpcomImporterUrl' => $url,
+			)
+		) . ';',
+		'before'
+	);
+}
+
+add_action( 'admin_print_styles-import.php', 'wpcom_imports_enqueue_script' );