fix: handle deeply nested image blocks

Automattic · Jul 9, 2020 · d846beb · d846beb
1 parent 0bbe397
commit d846beb
Showing 1 changed file with 6 additions and 3 deletions.
diff --git a/src/editor/blocks/posts-inserter/index.js b/src/editor/blocks/posts-inserter/index.js
@@ -46,13 +46,16 @@ const PostsInserterBlock = ( {
 	removeBlock,
 } ) => {
 	const [ isReady, setIsReady ] = useState( ! attributes.displayFeaturedImage );
+	const stringifiedPostList = JSON.stringify( postList );
 
 	// Stringify added to minimize flicker.
 	const templateBlocks = useMemo( () => getTemplateBlocks( postList, attributes ), [
-		JSON.stringify( postList ),
+		stringifiedPostList,
 		attributes,
 	] );
 
+	const stringifiedTemplateBlocks = JSON.stringify( templateBlocks );
+
 	useEffect(() => {
 		const { isDisplayingSpecificPosts, specificPosts } = attributes;
 
@@ -81,14 +84,14 @@ const PostsInserterBlock = ( {
 			}
 
 			// Wait for image blocks to be added to the BlockPreview.
-			const imageBlocks = templateBlocks.filter( block => 'core/image' === block.name );
+			const imageBlocks = stringifiedTemplateBlocks.match( /\"name\":\"core\/image\"/g ) || [];
 
 			// Preview is ready once all image blocks are accounted for.
 			if ( imageBlocks.length === images.length ) {
 				setIsReady( true );
 			}
 		}
-	}, [ JSON.stringify( postList ), JSON.stringify( templateBlocks ) ]);
+	}, [ stringifiedPostList, stringifiedTemplateBlocks ]);
 
 	const innerBlocksToInsert = templateBlocks.map( convertBlockSerializationFormat );
 	useEffect(() => {