From f73d44ee99c0c8a09f75757b8a2d62d53ce4c3c7 Mon Sep 17 00:00:00 2001
From: Andrea Fercia <a.fercia@gmail.com>
Date: Sun, 12 May 2024 04:10:34 +0200
Subject: [PATCH] Fix the RSS block placeholder labeling and improve spacing
 (#61576)

* Fix labeling of the RSS block placeholder.

* Fix RSS placeholder spacing.

Co-authored-by: afercia <afercia@git.wordpress.org>
Co-authored-by: t-hamano <wildworks@git.wordpress.org>
---
 packages/block-library/src/rss/edit.js     | 47 +++++++++++++---------
 packages/block-library/src/rss/editor.scss |  4 +-
 2 files changed, 29 insertions(+), 22 deletions(-)

diff --git a/packages/block-library/src/rss/edit.js b/packages/block-library/src/rss/edit.js
index 7c35d63f4fc894..467b22e3e58835 100644
--- a/packages/block-library/src/rss/edit.js
+++ b/packages/block-library/src/rss/edit.js
@@ -14,7 +14,6 @@ import {
 	RangeControl,
 	ToggleControl,
 	ToolbarGroup,
-	__experimentalHStack as HStack,
 	__experimentalInputControl as InputControl,
 } from '@wordpress/components';
 import { useState } from '@wordpress/element';
@@ -59,32 +58,40 @@ export default function RSSEdit( { attributes, setAttributes } ) {
 
 	const blockProps = useBlockProps();
 
+	const label = __( 'RSS URL' );
+
 	if ( isEditing ) {
 		return (
 			<div { ...blockProps }>
-				<Placeholder icon={ rss } label="RSS">
+				<Placeholder
+					icon={ rss }
+					label={ label }
+					instructions={ __(
+						'Display entries from any RSS or Atom feed.'
+					) }
+				>
 					<form
 						onSubmit={ onSubmitURL }
 						className="wp-block-rss__placeholder-form"
 					>
-						<HStack wrap>
-							<InputControl
-								__next40pxDefaultSize
-								placeholder={ __( 'Enter URL here…' ) }
-								value={ feedURL }
-								onChange={ ( value ) =>
-									setAttributes( { feedURL: value } )
-								}
-								className="wp-block-rss__placeholder-input"
-							/>
-							<Button
-								__next40pxDefaultSize
-								variant="primary"
-								type="submit"
-							>
-								{ __( 'Use URL' ) }
-							</Button>
-						</HStack>
+						<InputControl
+							__next40pxDefaultSize
+							label={ label }
+							hideLabelFromVision
+							placeholder={ __( 'Enter URL here…' ) }
+							value={ feedURL }
+							onChange={ ( value ) =>
+								setAttributes( { feedURL: value } )
+							}
+							className="wp-block-rss__placeholder-input"
+						/>
+						<Button
+							__next40pxDefaultSize
+							variant="primary"
+							type="submit"
+						>
+							{ __( 'Apply' ) }
+						</Button>
 					</form>
 				</Placeholder>
 			</div>
diff --git a/packages/block-library/src/rss/editor.scss b/packages/block-library/src/rss/editor.scss
index 9b4bac2874ad5b..095da46973509d 100644
--- a/packages/block-library/src/rss/editor.scss
+++ b/packages/block-library/src/rss/editor.scss
@@ -14,8 +14,8 @@
 	}
 
 	.wp-block-rss__placeholder-input {
-		flex: 1;
-		min-width: 80%;
+		margin: 0 8px 0 0;
+		flex: 1 1 auto;
 	}
 }