Patterns: Add handling of sync status to the wp-admin patterns list p…

…age (#52346)
WordPress · Jul 6, 2023 · 00cfeee · 00cfeee
1 parent f6efbc2
commit 00cfeee
Show file tree

Hide file tree

Showing 5 changed files with 14 additions and 8 deletions.
diff --git a/packages/list-reusable-blocks/src/components/import-form/index.js b/packages/list-reusable-blocks/src/components/import-form/index.js
@@ -49,8 +49,8 @@ function ImportForm( { instanceId, onUpload } ) {
 					case 'Invalid JSON file':
 						uiMessage = __( 'Invalid JSON file' );
 						break;
-					case 'Invalid Reusable block JSON file':
-						uiMessage = __( 'Invalid Reusable block JSON file' );
+					case 'Invalid Pattern JSON file':
+						uiMessage = __( 'Invalid Pattern JSON file' );
 						break;
 					default:
 						uiMessage = __( 'Unknown error' );

diff --git a/packages/list-reusable-blocks/src/index.js b/packages/list-reusable-blocks/src/index.js
@@ -31,9 +31,7 @@ document.addEventListener( 'DOMContentLoaded', () => {
 	const showNotice = () => {
 		const notice = document.createElement( 'div' );
 		notice.className = 'notice notice-success is-dismissible';
-		notice.innerHTML = `<p>${ __(
-			'Reusable block imported successfully!'
-		) }</p>`;
+		notice.innerHTML = `<p>${ __( 'Pattern imported successfully!' ) }</p>`;
 
 		const headerEnd = document.querySelector( '.wp-header-end' );
 		if ( ! headerEnd ) {

diff --git a/packages/list-reusable-blocks/src/utils/export.js b/packages/list-reusable-blocks/src/utils/export.js
@@ -25,11 +25,13 @@ async function exportReusableBlock( id ) {
 	} );
 	const title = post.title.raw;
 	const content = post.content.raw;
+	const syncStatus = post.wp_pattern_sync_status;
 	const fileContent = JSON.stringify(
 		{
 			__file: 'wp_block',
 			title,
 			content,
+			syncStatus,
 		},
 		null,
 		2

diff --git a/packages/list-reusable-blocks/src/utils/import.js b/packages/list-reusable-blocks/src/utils/import.js
@@ -27,9 +27,11 @@ async function importReusableBlock( file ) {
 		! parsedContent.title ||
 		! parsedContent.content ||
 		typeof parsedContent.title !== 'string' ||
-		typeof parsedContent.content !== 'string'
+		typeof parsedContent.content !== 'string' ||
+		( parsedContent.syncStatus &&
+			typeof parsedContent.syncStatus !== 'string' )
 	) {
-		throw new Error( 'Invalid Reusable block JSON file' );
+		throw new Error( 'Invalid Pattern JSON file' );
 	}
 	const postType = await apiFetch( { path: `/wp/v2/types/wp_block` } );
 	const reusableBlock = await apiFetch( {
@@ -38,6 +40,10 @@ async function importReusableBlock( file ) {
 			title: parsedContent.title,
 			content: parsedContent.content,
 			status: 'publish',
+			meta:
+				parsedContent.syncStatus === 'unsynced'
+					? { wp_pattern_sync_status: parsedContent.syncStatus }
+					: undefined,
 		},
 		method: 'POST',
 	} );

diff --git a/test/e2e/specs/editor/various/manage-reusable-blocks.spec.js b/test/e2e/specs/editor/various/manage-reusable-blocks.spec.js
@@ -35,7 +35,7 @@ test.describe( 'Managing reusable blocks', () => {
 
 		// Wait for the success notice.
 		await expect(
-			page.locator( 'text=Reusable block imported successfully!' )
+			page.locator( 'text=Pattern imported successfully!' )
 		).toBeVisible();
 
 		// Refresh the page.