diff --git a/projects/packages/jetpack-mu-wpcom/changelog/feat-introduce-wpcom-external-media-import-page b/projects/packages/jetpack-mu-wpcom/changelog/feat-introduce-wpcom-external-media-import-page new file mode 100644 index 0000000000000..a2aefd2a0c34c --- /dev/null +++ b/projects/packages/jetpack-mu-wpcom/changelog/feat-introduce-wpcom-external-media-import-page @@ -0,0 +1,4 @@ +Significance: minor +Type: added + +Import Media: Introduce the Import Media page diff --git a/projects/packages/jetpack-mu-wpcom/src/class-jetpack-mu-wpcom.php b/projects/packages/jetpack-mu-wpcom/src/class-jetpack-mu-wpcom.php index cebbfe5b39b7a..ec3435b3fbc18 100644 --- a/projects/packages/jetpack-mu-wpcom/src/class-jetpack-mu-wpcom.php +++ b/projects/packages/jetpack-mu-wpcom/src/class-jetpack-mu-wpcom.php @@ -151,6 +151,7 @@ public static function load_wpcom_user_features() { require_once __DIR__ . '/features/wpcom-command-palette/wpcom-command-palette.php'; require_once __DIR__ . '/features/wpcom-dashboard-widgets/wpcom-dashboard-widgets.php'; require_once __DIR__ . '/features/wpcom-locale/sync-locale-from-calypso-to-atomic.php'; + require_once __DIR__ . '/features/wpcom-media/wpcom-external-media-import.php'; require_once __DIR__ . '/features/wpcom-plugins/wpcom-plugins.php'; require_once __DIR__ . '/features/wpcom-profile-settings/profile-settings-link-to-wpcom.php'; require_once __DIR__ . '/features/wpcom-profile-settings/profile-settings-notices.php'; diff --git a/projects/packages/jetpack-mu-wpcom/src/features/wpcom-media/wpcom-external-media-import.js b/projects/packages/jetpack-mu-wpcom/src/features/wpcom-media/wpcom-external-media-import.js new file mode 100644 index 0000000000000..33af2ef7b8be1 --- /dev/null +++ b/projects/packages/jetpack-mu-wpcom/src/features/wpcom-media/wpcom-external-media-import.js @@ -0,0 +1 @@ +console.log( 'Hello, Import Media Page' ); // eslint-disable-line no-console diff --git a/projects/packages/jetpack-mu-wpcom/src/features/wpcom-media/wpcom-external-media-import.php b/projects/packages/jetpack-mu-wpcom/src/features/wpcom-media/wpcom-external-media-import.php new file mode 100644 index 0000000000000..9cd499bf138bb --- /dev/null +++ b/projects/packages/jetpack-mu-wpcom/src/features/wpcom-media/wpcom-external-media-import.php @@ -0,0 +1,98 @@ + Import. + * + * @package automattic/jetpack-mu-wpcom + */ + +if ( empty( $_GET['wpcom_external_media_import_page'] ) ) { // phpcs:disable WordPress.Security.NonceVerification.Recommended + return; +} + +/** + * Register the WordPress.com-specific external media page to Media > Import. + */ +function add_wpcom_external_media_import_page() { + $wpcom_external_media_import_page_hook = add_submenu_page( + 'upload.php', + __( 'Import Media', 'jetpack-mu-wpcom' ), + __( 'Import Media', 'jetpack-mu-wpcom' ), + 'upload_files', + 'wpcom_external_media_import_page', + 'render_wpcom_external_media_import_page' + ); + + add_action( "load-$wpcom_external_media_import_page_hook", 'enqueue_wpcom_external_media_import_page' ); +} +add_action( 'admin_menu', 'add_wpcom_external_media_import_page' ); + +/** + * Enqueue the assets of the wpcom external media page. + */ +function enqueue_wpcom_external_media_import_page() { + jetpack_mu_wpcom_enqueue_assets( 'wpcom-external-media-import-page', array( 'js' ) ); +} + +/** + * Render the container of the wpcom external media page. + */ +function render_wpcom_external_media_import_page() { + $title = __( 'Import Media', 'jetpack-mu-wpcom' ); + $description = __( 'WordPress.com allows you to import media from various platforms directly into the Media Library. To begin, select a platform from the options below:', 'jetpack-mu-wpcom' ); + $external_media_sources = array( + array( + 'id' => 'google_photos', + 'name' => __( 'Google Photos', 'jetpack-mu-wpcom' ), + 'description' => __( 'Import media from your Google Photos account.', 'jetpack-mu-wpcom' ), + ), + array( + 'id' => 'pexels', + 'name' => __( 'Pexels free photos', 'jetpack-mu-wpcom' ), + 'description' => __( 'Free stock photos, royalty free images shared by creators.', 'jetpack-mu-wpcom' ), + ), + array( + 'id' => 'openverse', + 'name' => __( 'Openverse', 'jetpack-mu-wpcom' ), + 'description' => __( 'Explore more than 800 million creative works.', 'jetpack-mu-wpcom' ), + ), + ); + + ?> +
+

+

+ + %3$s', + esc_attr( $id ), + /* translators: %s: The name of the external media source. */ + esc_attr( sprintf( __( 'Import %s', 'jetpack-mu-wpcom' ), $name ) ), + __( 'Import now', 'jetpack-mu-wpcom' ) + ); + + ?> + + + + + +
+ + + + + + +
+
+