Mobile - Disable long press event in media blocks (#40651)

* Mobile - Disable long press event in media blocks * Mobile - Media & Text - Remove extra param * Mobile - Media & Text - Show replace media button for both Image and video
WordPress · Apr 28, 2022 · d0f14ba · d0f14ba
1 parent fa3d10b
commit d0f14ba
Show file tree

Hide file tree

Showing 6 changed files with 5 additions and 9 deletions.
diff --git a/packages/block-library/src/cover/controls.native.js b/packages/block-library/src/cover/controls.native.js
@@ -167,7 +167,6 @@ function Controls( {
 							styles.mediaPreview,
 							mediaBackground,
 						] }
-						onLongPress={ openMediaOptions }
 					>
 						<View style={ styles.mediaInner }>
 							{ IMAGE_BACKGROUND_TYPE === backgroundType && (

diff --git a/packages/block-library/src/cover/edit.native.js b/packages/block-library/src/cover/edit.native.js
@@ -375,7 +375,6 @@ const Cover = ( {
 		<TouchableWithoutFeedback
 			accessible={ ! isParentSelected }
 			onPress={ onMediaPressed }
-			onLongPress={ openMediaOptionsRef.current }
 			disabled={ ! isParentSelected }
 		>
 			<View style={ [ styles.background, backgroundColor ] }>

diff --git a/packages/block-library/src/file/edit.native.js b/packages/block-library/src/file/edit.native.js
@@ -452,7 +452,6 @@ export class FileEdit extends Component {
 						<TouchableWithoutFeedback
 							accessible={ ! isSelected }
 							onPress={ this.onFilePressed }
-							onLongPress={ openMediaOptions }
 							disabled={ ! isSelected }
 						>
 							<View

diff --git a/packages/block-library/src/image/edit.native.js b/packages/block-library/src/image/edit.native.js
@@ -757,7 +757,6 @@ export class ImageEdit extends Component {
 				<TouchableWithoutFeedback
 					accessible={ ! isSelected }
 					onPress={ this.onImagePressed }
-					onLongPress={ openMediaOptions }
 					disabled={ ! isSelected }
 				>
 					<View style={ styles.content }>

diff --git a/packages/block-library/src/media-text/edit.native.js b/packages/block-library/src/media-text/edit.native.js
@@ -275,6 +275,8 @@ class MediaTextEdit extends Component {
 		const widthString = `${ temporaryMediaWidth }%`;
 		const innerBlockWidth = shouldStack ? 100 : 100 - temporaryMediaWidth;
 		const innerBlockWidthString = `${ innerBlockWidth }%`;
+		const hasMedia =
+			mediaType === MEDIA_TYPE_IMAGE || mediaType === MEDIA_TYPE_VIDEO;
 
 		const innerBlockContainerStyle = [
 			{ width: innerBlockWidthString },
@@ -344,7 +346,7 @@ class MediaTextEdit extends Component {
 			<>
 				{ mediaType === MEDIA_TYPE_IMAGE && this.getControls() }
 				<BlockControls>
-					{ ( isMediaSelected || mediaType === MEDIA_TYPE_VIDEO ) && (
+					{ hasMedia && (
 						<ToolbarGroup>
 							<Button
 								label={ __( 'Edit media' ) }

diff --git a/packages/block-library/src/media-text/media-container.native.js b/packages/block-library/src/media-text/media-container.native.js
@@ -191,7 +191,6 @@ class MediaContainer extends Component {
 				<TouchableWithoutFeedback
 					accessible={ ! isSelected }
 					onPress={ this.onMediaPressed }
-					onLongPress={ openMediaOptions }
 					disabled={ ! isSelected }
 				>
 					<View
@@ -222,7 +221,7 @@ class MediaContainer extends Component {
 		);
 	}
 
-	renderVideo( params, openMediaOptions ) {
+	renderVideo( params ) {
 		const {
 			aligmentStyles,
 			mediaUrl,
@@ -251,7 +250,6 @@ class MediaContainer extends Component {
 				<TouchableWithoutFeedback
 					accessible={ ! isSelected }
 					onPress={ this.onMediaPressed }
-					onLongPress={ openMediaOptions }
 					disabled={ ! isSelected }
 				>
 					<View style={ [ styles.videoContainer, aligmentStyles ] }>
@@ -305,7 +303,7 @@ class MediaContainer extends Component {
 				mediaElement = this.renderImage( params, openMediaOptions );
 				break;
 			case MEDIA_TYPE_VIDEO:
-				mediaElement = this.renderVideo( params, openMediaOptions );
+				mediaElement = this.renderVideo( params );
 				break;
 		}
 		return mediaElement;