From 267165ca9c795937fdbe30013154b1c858891b78 Mon Sep 17 00:00:00 2001
From: Ben Dwyer <ben@scruffian.com>
Date: Wed, 4 Sep 2024 10:37:23 +0100
Subject: [PATCH] Zoom Out: Add a new experiment for zoom out

---
 lib/experimental/editor-settings.php          |  3 ++
 lib/experiments-page.php                      | 13 +++++++++
 .../src/components/preview-dropdown/index.js  | 28 ++++++++++---------
 3 files changed, 31 insertions(+), 13 deletions(-)

diff --git a/lib/experimental/editor-settings.php b/lib/experimental/editor-settings.php
index c6bd99a18bf4c7..18b3b709ac6707 100644
--- a/lib/experimental/editor-settings.php
+++ b/lib/experimental/editor-settings.php
@@ -40,6 +40,9 @@ function gutenberg_enable_experiments() {
 	if ( $gutenberg_experiments && array_key_exists( 'gutenberg-media-processing', $gutenberg_experiments ) ) {
 		wp_add_inline_script( 'wp-block-editor', 'window.__experimentalMediaProcessing = true', 'before' );
 	}
+	if ( $gutenberg_experiments && array_key_exists( 'gutenberg-zoom-out-experiment', $gutenberg_experiments ) ) {
+		wp_add_inline_script( 'wp-block-editor', 'window.__experimentalEnableZoomOutExperiment = true', 'before' );
+	}
 }
 
 add_action( 'admin_init', 'gutenberg_enable_experiments' );
diff --git a/lib/experiments-page.php b/lib/experiments-page.php
index f76dcdca7d18cb..c7e0d9e93ea65f 100644
--- a/lib/experiments-page.php
+++ b/lib/experiments-page.php
@@ -199,6 +199,19 @@ function gutenberg_initialize_experiments_settings() {
 		)
 	);
 
+	add_settings_field(
+		'gutenberg-zoom-out-experiment',
+		__( 'Zoom out experiments', 'gutenberg' ),
+		'gutenberg_display_experiment_field',
+		'gutenberg-experiments',
+		'gutenberg_experiments_section',
+		array(
+			'label' => __( 'Enable zoom out experiments; shows zoom out in the device preview and other zoom out experiments.', 'gutenberg' ),
+			'id'    => 'gutenberg-zoom-out-experiment',
+		)
+	);
+
+
 	register_setting(
 		'gutenberg-experiments',
 		'gutenberg-experiments'
diff --git a/packages/editor/src/components/preview-dropdown/index.js b/packages/editor/src/components/preview-dropdown/index.js
index 8b51bb79bc8873..5acaa351c9bb7e 100644
--- a/packages/editor/src/components/preview-dropdown/index.js
+++ b/packages/editor/src/components/preview-dropdown/index.js
@@ -112,22 +112,24 @@ export default function PreviewDropdown( { forceIsAutosaveable, disabled } ) {
 			label: __( 'Desktop' ),
 			icon: desktop,
 		},
-		{
+	];
+	if ( window.__experimentalEnableZoomOutExperiment ) {
+		choices.push( {
 			value: 'ZoomOut',
 			label: __( 'Desktop (50%)' ),
 			icon: desktop,
-		},
-		{
-			value: 'Tablet',
-			label: __( 'Tablet' ),
-			icon: tablet,
-		},
-		{
-			value: 'Mobile',
-			label: __( 'Mobile' ),
-			icon: mobile,
-		},
-	];
+		} );
+	}
+	choices.push( {
+		value: 'Tablet',
+		label: __( 'Tablet' ),
+		icon: tablet,
+	} );
+	choices.push( {
+		value: 'Mobile',
+		label: __( 'Mobile' ),
+		icon: mobile,
+	} );
 
 	const previewValue = editorMode === 'zoom-out' ? 'ZoomOut' : deviceType;