From df1e67c373c01b1b4f73a5cc033d6f177dbe6d96 Mon Sep 17 00:00:00 2001
From: JustinyAhin <justiny.ahinon@gmail.com>
Date: Tue, 1 Jun 2021 12:15:50 +0100
Subject: [PATCH 1/5] Add an error notice to the editor when the theme.json is
 not parsed correctly

---
 lib/class-wp-theme-json-resolver-gutenberg.php | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/lib/class-wp-theme-json-resolver-gutenberg.php b/lib/class-wp-theme-json-resolver-gutenberg.php
index 987f3e5400fc26..a086faaeae5582 100644
--- a/lib/class-wp-theme-json-resolver-gutenberg.php
+++ b/lib/class-wp-theme-json-resolver-gutenberg.php
@@ -75,6 +75,7 @@ private static function read_json_file( $file_path ) {
 			$json_decoding_error = json_last_error();
 			if ( JSON_ERROR_NONE !== $json_decoding_error ) {
 				error_log( 'Error when decoding file schema: ' . json_last_error_msg() );
+				add_action( 'admin_footer', array( $this, '_json_decoding_error_notice' ) );
 				return $config;
 			}
 
@@ -530,6 +531,10 @@ public static function clean_cached_data() {
 		self::$theme_json_i18n          = null;
 	}
 
+	public function _js_v_json_decoding_error_noticears() {
+		echo "Error message";
+	}
+
 }
 
 add_action( 'switch_theme', array( 'WP_Theme_JSON_Resolver_Gutenberg', 'clean_cached_data' ) );

From 8c747a985c732cbc1bb056e2313797cffc949897 Mon Sep 17 00:00:00 2001
From: JustinyAhin <justiny.ahinon@gmail.com>
Date: Tue, 1 Jun 2021 12:16:34 +0100
Subject: [PATCH 2/5] Update class-wp-theme-json-resolver-gutenberg.php

---
 lib/class-wp-theme-json-resolver-gutenberg.php | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/lib/class-wp-theme-json-resolver-gutenberg.php b/lib/class-wp-theme-json-resolver-gutenberg.php
index a086faaeae5582..5caa877bff3ebe 100644
--- a/lib/class-wp-theme-json-resolver-gutenberg.php
+++ b/lib/class-wp-theme-json-resolver-gutenberg.php
@@ -531,7 +531,7 @@ public static function clean_cached_data() {
 		self::$theme_json_i18n          = null;
 	}
 
-	public function _js_v_json_decoding_error_noticears() {
+	public function _json_decoding_error_notice() {
 		echo "Error message";
 	}
 

From 5a7ac2d7538fa5ba56f9c669050e96d654b2f908 Mon Sep 17 00:00:00 2001
From: JustinyAhin <justiny.ahinon@gmail.com>
Date: Tue, 1 Jun 2021 16:01:58 +0100
Subject: [PATCH 3/5] Update the error notice message

---
 ...class-wp-theme-json-resolver-gutenberg.php | 23 ++++++++++++++++---
 1 file changed, 20 insertions(+), 3 deletions(-)

diff --git a/lib/class-wp-theme-json-resolver-gutenberg.php b/lib/class-wp-theme-json-resolver-gutenberg.php
index 5caa877bff3ebe..66f9919743ca47 100644
--- a/lib/class-wp-theme-json-resolver-gutenberg.php
+++ b/lib/class-wp-theme-json-resolver-gutenberg.php
@@ -75,7 +75,7 @@ private static function read_json_file( $file_path ) {
 			$json_decoding_error = json_last_error();
 			if ( JSON_ERROR_NONE !== $json_decoding_error ) {
 				error_log( 'Error when decoding file schema: ' . json_last_error_msg() );
-				add_action( 'admin_footer', array( $this, '_json_decoding_error_notice' ) );
+				add_action( 'admin_footer', array( __CLASS__, '_json_decoding_error_notice' ) );
 				return $config;
 			}
 
@@ -531,8 +531,25 @@ public static function clean_cached_data() {
 		self::$theme_json_i18n          = null;
 	}
 
-	public function _json_decoding_error_notice() {
-		echo "Error message";
+	/**
+	 * Print a notice if there was an error decoding the theme.json file.
+	 *
+	 * @return void
+	 */
+	public static function _json_decoding_error_notice() {
+		?>
+		<div id="theme-json-notice" class="notice notice-error is-dismissible">
+			<p>
+				<?php
+				printf(
+					/* translators: theme.json. */
+					esc_html__( 'There was an error decoding the %s file from your theme.', 'gutenberg' ),
+					'<code>theme.json</code>'
+				);
+				?>
+			</p>
+		</div>
+		<?php
 	}
 
 }

From 1a454384318a5ae2eaa7a3766244cbb491e344db Mon Sep 17 00:00:00 2001
From: JustinyAhin <justiny.ahinon@gmail.com>
Date: Wed, 2 Jun 2021 08:58:44 +0100
Subject: [PATCH 4/5] Update style.scss

---
 packages/edit-site/src/components/editor/style.scss | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/packages/edit-site/src/components/editor/style.scss b/packages/edit-site/src/components/editor/style.scss
index 1b8283f3d1a159..7e96b3be719876 100644
--- a/packages/edit-site/src/components/editor/style.scss
+++ b/packages/edit-site/src/components/editor/style.scss
@@ -42,4 +42,8 @@
 	padding-left: 16px;
 	padding-right: 16px;
 }
-@include editor-left(".edit-site .components-editor-notices__snackbar")
+@include editor-left(".edit-site .components-editor-notices__snackbar");
+
+#theme-json-notice {
+	margin: 0;
+}

From 3437f5a076be76f72a0f90dd8e1790d2f938643c Mon Sep 17 00:00:00 2001
From: JustinyAhin <justiny.ahinon@gmail.com>
Date: Wed, 2 Jun 2021 11:47:41 +0100
Subject: [PATCH 5/5] Move the error notice under next the editor header
 element

---
 lib/class-wp-theme-json-resolver-gutenberg.php | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/lib/class-wp-theme-json-resolver-gutenberg.php b/lib/class-wp-theme-json-resolver-gutenberg.php
index 66f9919743ca47..6e8dbdf2de588c 100644
--- a/lib/class-wp-theme-json-resolver-gutenberg.php
+++ b/lib/class-wp-theme-json-resolver-gutenberg.php
@@ -538,7 +538,7 @@ public static function clean_cached_data() {
 	 */
 	public static function _json_decoding_error_notice() {
 		?>
-		<div id="theme-json-notice" class="notice notice-error is-dismissible">
+		<div id="theme-json-notice" class="notice notice-error is-dismissible hidden">
 			<p>
 				<?php
 				printf(
@@ -549,6 +549,13 @@ public static function _json_decoding_error_notice() {
 				?>
 			</p>
 		</div>
+		<script>
+			setTimeout( function() {
+				document.getElementById( 'theme-json-notice' ).classList.remove( 'hidden' );
+				document.querySelector( '.interface-interface-skeleton__header' )
+					.insertAdjacentElement('afterend', document.getElementById( 'theme-json-notice' ) );
+			}, 3000 );
+		</script>
 		<?php
 	}