Fix: Don't render drop zone bellow the default block appender. (#16119)

WordPress · Aug 29, 2019 · f87ac4a · f87ac4a
1 parent 4590c0b
commit f87ac4a
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 8 deletions.
diff --git a/packages/block-editor/src/components/block-drop-zone/index.js b/packages/block-editor/src/components/block-drop-zone/index.js
@@ -58,7 +58,7 @@ class BlockDropZone extends Component {
 		const { clientId, rootClientId, getBlockIndex } = this.props;
 		if ( clientId !== undefined ) {
 			const index = getBlockIndex( clientId, rootClientId );
-			return position.y === 'top' ? index : index + 1;
+			return ( position && position.y === 'top' ) ? index : index + 1;
 		}
 	}
 
@@ -111,10 +111,12 @@ class BlockDropZone extends Component {
 	}
 
 	render() {
-		const { isLockedAll, index } = this.props;
+		const { isLockedAll } = this.props;
 		if ( isLockedAll ) {
 			return null;
 		}
+
+		const index = this.getInsertIndex();
 		const isAppender = index === undefined;
 
 		return (

diff --git a/packages/block-editor/src/components/block-drop-zone/style.scss b/packages/block-editor/src/components/block-drop-zone/style.scss
@@ -8,16 +8,20 @@
 		display: none;
 	}
 
-	&.is-close-to-bottom {
+	&.is-close-to-bottom,
+	&.is-close-to-top {
 		background: none;
-		border-bottom: 3px solid theme(primary);
 	}
 
-	&.is-close-to-top,
-	&.is-appender.is-close-to-top,
-	&.is-appender.is-close-to-bottom {
-		background: none;
+	&.is-close-to-top {
 		border-top: 3px solid theme(primary);
+	}
+
+	&.is-close-to-bottom {
+		border-bottom: 3px solid theme(primary);
+	}
+
+	&.is-appender.is-active.is-dragging-over-document {
 		border-bottom: none;
 	}
 }