Remove "show more" button step

WordPress · Jan 21, 2021 · 0b63df0 · 0b63df0
1 parent c57a260
commit 0b63df0
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 57 deletions.
diff --git a/packages/block-directory/src/components/downloadable-blocks-panel/index.js b/packages/block-directory/src/components/downloadable-blocks-panel/index.js
@@ -16,7 +16,6 @@ import { store as blockDirectoryStore } from '../../store';
 
 function DownloadableBlocksPanel( {
 	downloadableItems,
-	filterValue,
 	onSelect,
 	onHover,
 	hasLocalBlocks,
@@ -26,10 +25,8 @@ function DownloadableBlocksPanel( {
 } ) {
 	if ( typeof hasPermission === 'undefined' || isLoading || isTyping ) {
 		return (
-			<div className="block-directory-downloadable-blocks-panel__heading">
-				<p className="block-directory-downloadable-blocks-panel__description has-blocks-loading">
-					<Spinner />
-				</p>
+			<div className="block-directory-downloadable-blocks-panel has-blocks-loading">
+				<Spinner />
 			</div>
 		);
 	}
@@ -45,7 +42,6 @@ function DownloadableBlocksPanel( {
 	return !! downloadableItems.length ? (
 		<DownloadableBlocksInserterPanel
 			downloadableItems={ downloadableItems }
-			filterValue={ filterValue }
 			hasLocalBlocks={ hasLocalBlocks }
 		>
 			<DownloadableBlocksList

diff --git a/packages/block-directory/src/components/downloadable-blocks-panel/inserter-panel.js b/packages/block-directory/src/components/downloadable-blocks-panel/inserter-panel.js
@@ -2,20 +2,14 @@
  * WordPress dependencies
  */
 import { __, _n, sprintf } from '@wordpress/i18n';
-import { Button } from '@wordpress/components';
 import { useDebounce } from '@wordpress/compose';
-import { useEffect, useState } from '@wordpress/element';
 import { speak } from '@wordpress/a11y';
 
 function DownloadableBlocksInserterPanel( {
 	children,
 	downloadableItems,
-	filterValue,
 	hasLocalBlocks,
 } ) {
-	// The panel should default to "open" if there are no local blocks found.
-	const [ isPanelOpen, setPanelOpen ] = useState( ! hasLocalBlocks );
-	useEffect( () => setPanelOpen( ! hasLocalBlocks ), [ filterValue ] );
 	const debouncedSpeak = useDebounce( speak, 500 );
 	debouncedSpeak(
 		sprintf(
@@ -36,43 +30,17 @@ function DownloadableBlocksInserterPanel( {
 			) }
 
 			<div className="block-directory-downloadable-blocks-panel">
-				<div className="block-directory-downloadable-blocks-panel__heading">
+				<div className="block-directory-downloadable-blocks-panel__header">
 					<h2 className="block-directory-downloadable-blocks-panel__title">
-						{ ! isPanelOpen || hasLocalBlocks
-							? __( 'More blocks to use' )
-							: __( 'No installed blocks found' ) }
+						{ __( 'Available to install' ) }
 					</h2>
 					<p className="block-directory-downloadable-blocks-panel__description">
-						{ isPanelOpen
-							? __(
-									'These blocks can be downloaded and installed.'
-							  )
-							: sprintf(
-									/* translators: %d: number of available blocks. */
-									_n(
-										'%d additional block is available to install.',
-										'%d additional blocks are available to install.',
-										downloadableItems.length
-									),
-									downloadableItems.length
-							  ) }
+						{ __(
+							'Select a block to install and add it to your post.'
+						) }
 					</p>
 				</div>
-				{ isPanelOpen ? (
-					children
-				) : (
-					<Button isPrimary onClick={ () => setPanelOpen( true ) }>
-						{ sprintf(
-							/* translators: %d: number of available blocks. */
-							_n(
-								'Show %d block',
-								'Show %d blocks',
-								downloadableItems.length
-							),
-							downloadableItems.length
-						) }
-					</Button>
-				) }
+				{ children }
 			</div>
 		</>
 	);

diff --git a/packages/block-directory/src/components/downloadable-blocks-panel/style.scss b/packages/block-directory/src/components/downloadable-blocks-panel/style.scss
@@ -1,19 +1,6 @@
 
 .block-directory-downloadable-blocks-panel {
 	padding: $grid-unit-20;
-}
-
-.block-directory-downloadable-blocks-panel__heading {
-	margin: $grid-unit-20 0;
-}
-
-.block-directory-downloadable-blocks-panel__title {
-	margin: 0 0 0.5em;
-	font-size: 1.1em;
-}
-
-.block-directory-downloadable-blocks-panel__description {
-	margin-top: 0;
 
 	&.has-blocks-loading {
 		$no-result-padding: $grid-unit-20 * 7;
@@ -29,6 +16,22 @@
 	}
 }
 
+.block-directory-downloadable-blocks-panel__header {
+	margin: $grid-unit-20 0;
+}
+
+.block-directory-downloadable-blocks-panel__title {
+	margin: 0 $grid-unit-15 0 0;
+	color: $gray-700;
+	text-transform: uppercase;
+	font-size: 11px;
+	font-weight: 500;
+}
+
+.block-directory-downloadable-blocks-panel__description {
+	margin-top: 0;
+}
+
 .block-directory-downloadable-blocks-panel button {
 	margin-top: $grid-unit-10;
 }