From 0e53ba04c759bebb58eb109ce31c4a7109e6d0fb Mon Sep 17 00:00:00 2001
From: Andrei Draganescu <andrei.draganescu@automattic.com>
Date: Fri, 14 Oct 2022 19:27:31 +0300
Subject: [PATCH] makes the navigation list view implementation a gutenberg
 experiment

---
 lib/experimental/editor-settings.php            | 12 ++++++++++++
 lib/experiments-page.php                        | 11 +++++++++++
 .../block-library/src/navigation/edit/index.js  | 17 +++++++++++++++--
 3 files changed, 38 insertions(+), 2 deletions(-)

diff --git a/lib/experimental/editor-settings.php b/lib/experimental/editor-settings.php
index 2b46a401d4b0e..3849bdfe5f4d2 100644
--- a/lib/experimental/editor-settings.php
+++ b/lib/experimental/editor-settings.php
@@ -83,3 +83,15 @@ function gutenberg_enable_zoomed_out_view() {
 }
 
 add_action( 'admin_init', 'gutenberg_enable_zoomed_out_view' );
+
+/**
+ * Sets a global JS variable used to trigger the availability of zoomed out view.
+ */
+function gutenberg_enable_off_canvas_navigation_editor() {
+	$gutenberg_experiments = get_option( 'gutenberg-experiments' );
+	if ( $gutenberg_experiments && array_key_exists( 'gutenberg-off-canvas-navigation-editor', $gutenberg_experiments ) ) {
+		wp_add_inline_script( 'wp-block-editor', 'window.__experimentalEnableOffCanvasNavigationEditor = true', 'before' );
+	}
+}
+
+add_action( 'admin_init', 'gutenberg_enable_off_canvas_navigation_editor' );
diff --git a/lib/experiments-page.php b/lib/experiments-page.php
index 3d09f05bd655c..d925b77925cfd 100644
--- a/lib/experiments-page.php
+++ b/lib/experiments-page.php
@@ -52,6 +52,17 @@ function gutenberg_initialize_experiments_settings() {
 			'id'    => 'gutenberg-zoomed-out-view',
 		)
 	);
+	add_settings_field(
+		'gutenberg-off-canvas-navigation-editor',
+		__( 'Off canvas navigation editor ', 'gutenberg' ),
+		'gutenberg_display_experiment_field',
+		'gutenberg-experiments',
+		'gutenberg_experiments_section',
+		array(
+			'label' => __( 'Test a new off canvas editor for navigation block', 'gutenberg' ),
+			'id'    => 'gutenberg-off-canvas-navigation-editor',
+		)
+	);
 	register_setting(
 		'gutenberg-experiments',
 		'gutenberg-experiments'
diff --git a/packages/block-library/src/navigation/edit/index.js b/packages/block-library/src/navigation/edit/index.js
index f5ba0d522bc29..c2cc65004a88b 100644
--- a/packages/block-library/src/navigation/edit/index.js
+++ b/packages/block-library/src/navigation/edit/index.js
@@ -83,6 +83,9 @@ function Navigation( {
 	hasColorSettings = true,
 	customPlaceholder: CustomPlaceholder = null,
 } ) {
+	const isOffCanvasNavigationEditorEnabled =
+		window?.__experimentalEnableOffCanvasNavigationEditor === true;
+
 	const {
 		openSubmenusOnClick,
 		overlayMenu,
@@ -658,7 +661,12 @@ function Navigation( {
 							/* translators: %s: The name of a menu. */
 							actionLabel={ __( "Switch to '%s'" ) }
 						/>
-						<ListView blocks={ innerBlocks } isExpanded={ true } />
+						{ isOffCanvasNavigationEditorEnabled && (
+							<ListView
+								blocks={ innerBlocks }
+								isExpanded={ true }
+							/>
+						) }
 					</PanelBody>
 				</InspectorControls>
 				{ stylingInspectorControls }
@@ -832,7 +840,12 @@ function Navigation( {
 							/* translators: %s: The name of a menu. */
 							actionLabel={ __( "Switch to '%s'" ) }
 						/>
-						<ListView blocks={ innerBlocks } isExpanded={ true } />
+						{ isOffCanvasNavigationEditorEnabled && (
+							<ListView
+								blocks={ innerBlocks }
+								isExpanded={ true }
+							/>
+						) }
 					</PanelBody>
 				</InspectorControls>
 				{ stylingInspectorControls }