From 1e6580a969edd8a5173460774d3362a2aaf49b4c Mon Sep 17 00:00:00 2001
From: Andrew Serong <14988353+andrewserong@users.noreply.github.com>
Date: Tue, 14 Feb 2023 12:15:44 +1100
Subject: [PATCH] Revert placeholder component, update showBlock logic so that
 selected blocks are rendered as real ListViewBlock components

---
 .../src/components/list-view/branch.js        | 11 ++---
 .../components/list-view/leaf-placeholder.js  | 41 -------------------
 2 files changed, 4 insertions(+), 48 deletions(-)
 delete mode 100644 packages/block-editor/src/components/list-view/leaf-placeholder.js

diff --git a/packages/block-editor/src/components/list-view/branch.js b/packages/block-editor/src/components/list-view/branch.js
index d6bd5f944d34d..83fc99dca2450 100644
--- a/packages/block-editor/src/components/list-view/branch.js
+++ b/packages/block-editor/src/components/list-view/branch.js
@@ -8,7 +8,6 @@ import { AsyncModeProvider, useSelect } from '@wordpress/data';
  * Internal dependencies
  */
 import ListViewBlock from './block';
-import ListViewLeafPlaceholder from './leaf-placeholder';
 import { useListViewContext } from './context';
 import { isClientIdSelected } from './utils';
 import { store as blockEditorStore } from '../../store';
@@ -156,8 +155,6 @@ function ListViewBranch( props ) {
 
 				const isDragged = !! draggedClientIds?.includes( clientId );
 
-				const showBlock = isDragged || blockInView;
-
 				// Make updates to the selected or dragged blocks synchronous,
 				// but asynchronous for any other block.
 				const isSelected = isClientIdSelected(
@@ -166,6 +163,7 @@ function ListViewBranch( props ) {
 				);
 				const isSelectedBranch =
 					isBranchSelected || ( isSelected && hasNestedBlocks );
+				const showBlock = isDragged || blockInView || isSelected;
 				return (
 					<AsyncModeProvider key={ clientId } value={ ! isSelected }>
 						{ showBlock && (
@@ -188,10 +186,9 @@ function ListViewBranch( props ) {
 							/>
 						) }
 						{ ! showBlock && (
-							<ListViewLeafPlaceholder
-								isSelected={ isSelected }
-								selectedClientIds={ selectedClientIds }
-							/>
+							<tr>
+								<td className="block-editor-list-view-placeholder" />
+							</tr>
 						) }
 						{ hasNestedBlocks && shouldExpand && ! isDragged && (
 							<ListViewBranch
diff --git a/packages/block-editor/src/components/list-view/leaf-placeholder.js b/packages/block-editor/src/components/list-view/leaf-placeholder.js
deleted file mode 100644
index 8220f0ba4732e..0000000000000
--- a/packages/block-editor/src/components/list-view/leaf-placeholder.js
+++ /dev/null
@@ -1,41 +0,0 @@
-/**
- * WordPress dependencies
- */
-import { useRef } from '@wordpress/element';
-
-/**
- * Internal dependencies
- */
-import useListViewScrollIntoView from './use-list-view-scroll-into-view';
-
-/**
- * Renders a placeholder row with a single cell. This is used within the list view
- * branch to render a placeholder for the leaf row, which is only rendered when
- * the leaf is not visible. This results in simpler rendering logic for the leaf
- * when it is outside of the currently visible area of the list view, while
- * ensuring that the vertical space is reserved for the leaf.
- *
- * @param {Object}   props                   Component props.
- * @param {boolean}  props.isSelected        Whether the leaf is selected.
- * @param {string[]} props.selectedClientIds A list of selected block client ids.
- */
-export default function ListViewLeafPlaceholder( {
-	isSelected,
-	selectedClientIds,
-} ) {
-	// For long lists where the selected item may fall outside of the current window,
-	// pass a reference to the corresponding placeholder row for the selected item.
-	// The "real" selected item is also observed in ListViewBlock, when rendered.
-	const rowItemRef = useRef();
-	useListViewScrollIntoView( {
-		isSelected,
-		rowItemRef,
-		selectedClientIds,
-	} );
-
-	return (
-		<tr ref={ rowItemRef }>
-			<td className="block-editor-list-view-placeholder" />
-		</tr>
-	);
-}