From c6b019b6f7bc46847e45d9f664c749540a1fb9b6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Dami=C3=A1n=20Su=C3=A1rez?= <rdsuarez@gmail.com>
Date: Fri, 7 Feb 2020 07:23:49 -0800
Subject: [PATCH] BlockEditor: refactoring getBlockParentsByBlockName()
 selector (#20057)

* block-editor: refact getBlockParentsByBlockName
It re implements the getBlockParentsByBlockName() selector using the createSelector() function to memoize what the selector returns in order to avoid performance issues.

block-editor: update dependant references in getBlockParentsByBlockName()

block-editor: fix

* block-editor: add unit test for getBlockParents

* block-editor: add getBlockParentsByBlockName test
---
 packages/block-editor/src/store/selectors.js  |  34 +++--
 .../block-editor/src/store/test/selectors.js  | 118 ++++++++++++++++++
 2 files changed, 134 insertions(+), 18 deletions(-)

diff --git a/packages/block-editor/src/store/selectors.js b/packages/block-editor/src/store/selectors.js
index 9d71c1c29c3fd2..52be22ab843fee 100644
--- a/packages/block-editor/src/store/selectors.js
+++ b/packages/block-editor/src/store/selectors.js
@@ -470,24 +470,22 @@ export const getBlockParents = createSelector(
  *
  * @return {Array} ClientIDs of the parent blocks.
  */
-export const getBlockParentsByBlockName = (
-	state,
-	clientId,
-	blockName,
-	ascending = false
-) => {
-	const parents = getBlockParents( state, clientId, ascending );
-	return map(
-		filter(
-			map( parents, ( id ) => ( {
-				id,
-				name: getBlockName( state, id ),
-			} ) ),
-			{ name: blockName }
-		),
-		( { id } ) => id
-	);
-};
+export const getBlockParentsByBlockName = createSelector(
+	( state, clientId, blockName, ascending = false ) => {
+		const parents = getBlockParents( state, clientId, ascending );
+		return map(
+			filter(
+				map( parents, ( id ) => ( {
+					id,
+					name: getBlockName( state, id ),
+				} ) ),
+				{ name: blockName }
+			),
+			( { id } ) => id
+		);
+	},
+	( state ) => [ state.blocks.parents ]
+);
 
 /**
  * Given a block client ID, returns the root of the hierarchy from which the block is nested, return the block itself for root level blocks.
diff --git a/packages/block-editor/src/store/test/selectors.js b/packages/block-editor/src/store/test/selectors.js
index d6f4cfaac20e17..3cff15b7c922bc 100644
--- a/packages/block-editor/src/store/test/selectors.js
+++ b/packages/block-editor/src/store/test/selectors.js
@@ -22,6 +22,8 @@ const {
 	getBlockName,
 	getBlock,
 	getBlocks,
+	getBlockParents,
+	getBlockParentsByBlockName,
 	getBlockCount,
 	getClientIdsWithDescendants,
 	getClientIdsOfDescendants,
@@ -329,6 +331,122 @@ describe( 'selectors', () => {
 		} );
 	} );
 
+	describe( 'getBlockParents', () => {
+		it( 'should return parent blocks', () => {
+			const state = {
+				blocks: {
+					parents: {
+						'client-id-01': '',
+						'client-id-02': 'client-id-01',
+						'client-id-03': 'client-id-02',
+						'client-id-04': 'client-id-03',
+					},
+					byClientId: {
+						'client-id-01': {
+							clientId: 'client-id-01',
+							name: 'core/columns',
+						},
+						'client-id-02': {
+							clientId: 'client-id-02',
+							name: 'core/navigation',
+						},
+						'client-id-03': {
+							clientId: 'client-id-03',
+							name: 'core/navigation-link',
+						},
+						'client-id-04': {
+							clientId: 'client-id-04',
+							name: 'core/paragraph',
+						},
+					},
+					cache: {
+						'client-id-01': {},
+						'client-id-02': {},
+						'client-id-03': {},
+						'client-id-04': {},
+					},
+				},
+			};
+
+			expect( getBlockParents( state, 'client-id-04' ) ).toEqual( [
+				'client-id-01',
+				'client-id-02',
+				'client-id-03',
+			] );
+
+			expect( getBlockParents( state, 'client-id-0' ) ).toEqual( [] );
+		} );
+	} );
+
+	describe( 'getBlockParentsByBlockName', () => {
+		it( 'should return parent blocks', () => {
+			const state = {
+				blocks: {
+					parents: {
+						'client-id-01': '',
+						'client-id-02': 'client-id-01',
+						'client-id-03': 'client-id-02',
+						'client-id-04': 'client-id-03',
+						'client-id-05': 'client-id-04',
+					},
+					byClientId: {
+						'client-id-01': {
+							clientId: 'client-id-01',
+							name: 'core/navigation',
+						},
+						'client-id-02': {
+							clientId: 'client-id-02',
+							name: 'core/columns',
+						},
+						'client-id-03': {
+							clientId: 'client-id-03',
+							name: 'core/navigation',
+						},
+						'client-id-04': {
+							clientId: 'client-id-04',
+							name: 'core/navigation-link',
+						},
+						'client-id-05': {
+							clientId: 'client-id-05',
+							name: 'core/navigation-link',
+						},
+					},
+					cache: {
+						'client-id-01': {},
+						'client-id-02': {},
+						'client-id-03': {},
+						'client-id-04': {},
+						'client-id-05': {},
+					},
+				},
+			};
+
+			expect(
+				getBlockParentsByBlockName(
+					state,
+					'client-id-05',
+					'core/navigation'
+				)
+			).toEqual( [ 'client-id-01', 'client-id-03' ] );
+
+			expect(
+				getBlockParentsByBlockName(
+					state,
+					'client-id-05',
+					'core/columns'
+				)
+			).toEqual( [ 'client-id-02' ] );
+
+			expect(
+				getBlockParentsByBlockName(
+					state,
+					'client-id-5',
+					'core/unknown-block'
+				)
+			).toEqual( [] );
+		} );
+	} );
+
 	describe( 'getClientIdsOfDescendants', () => {
 		it( 'should return the ids of any descendants, given an array of clientIds', () => {
 			const state = {