Podcast Player: Fix missing replace button (#15508)

* Podcast Player: Fix missing replace button * Add fallback for pre-5.4 WP installs Props @jeherve Co-authored-by: Konstantin Obenland <[email protected]>
Automattic · Apr 23, 2020 · c9b52ff · c9b52ff
1 parent fda0d83
commit c9b52ff
Showing 1 changed file with 24 additions and 11 deletions.
diff --git a/extensions/blocks/podcast-player/edit.js b/extensions/blocks/podcast-player/edit.js
@@ -15,6 +15,7 @@ import {
 	RangeControl,
 	TextControl,
 	Toolbar,
+	ToolbarGroup,
 	withNotices,
 	ToggleControl,
 	Spinner,
@@ -235,16 +236,6 @@ const PodcastPlayerEdit = ( {
 		);
 	}
 
-	const toolbarControls = [
-		{
-			title: __( 'Edit Podcast Feed URL', 'jetpack' ),
-			onClick: () => setIsEditing( true ),
-			extraProps: {
-				children: __( 'Replace', 'jetpack' ),
-			},
-		},
-	];
-
 	// Loading state for fetching the feed.
 	if ( ! feedData.tracks || ! feedData.tracks.length ) {
 		return (
@@ -266,7 +257,29 @@ const PodcastPlayerEdit = ( {
 	return (
 		<>
 			<BlockControls>
-				<Toolbar controls={ toolbarControls } />
+				{ /* @todo Fallback can be removed when WP 5.4 is the minimum supported version. */ }
+				{ ToolbarGroup ? (
+					<ToolbarGroup>
+						<Button
+							aria-label={ __( 'Edit Podcast Feed URL', 'jetpack' ) }
+							onClick={ () => setIsEditing( true ) }
+						>
+							{ __( 'Replace', 'jetpack' ) }
+						</Button>
+					</ToolbarGroup>
+				) : (
+					<Toolbar
+						controls={ [
+							{
+								title: __( 'Edit Podcast Feed URL', 'jetpack' ),
+								onClick: () => setIsEditing( true ),
+								extraProps: {
+									children: __( 'Replace', 'jetpack' ),
+								},
+							},
+						] }
+					/>
+				) }
 			</BlockControls>
 			<InspectorControls>
 				<PanelBody title={ __( 'Podcast settings', 'jetpack' ) }>