[RNMobile] Remove opacity change when images are being uploaded (Word…

…Press#59264) * Remove opacity when media is being uploaded * Update CHANGELOG Co-authored-by: derekblank <[email protected]> Co-authored-by: SiobhyB <[email protected]>
gaambo · Feb 23, 2024 · 57470e9 · 57470e9
1 parent 908e3ed
commit 57470e9
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 16 deletions.
diff --git a/packages/components/src/mobile/image/index.native.js b/packages/components/src/mobile/image/index.native.js
@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { Animated, Image as RNImage, Text, View } from 'react-native';
+import { Image as RNImage, Text, View } from 'react-native';
 import FastImage from 'react-native-fast-image';
 
 /**
@@ -11,7 +11,7 @@ import { __ } from '@wordpress/i18n';
 import { Icon } from '@wordpress/components';
 import { image, offline } from '@wordpress/icons';
 import { usePreferredColorSchemeStyle } from '@wordpress/compose';
-import { useEffect, useState, useRef, Platform } from '@wordpress/element';
+import { useEffect, useState, Platform } from '@wordpress/element';
 
 /**
  * Internal dependencies
@@ -218,19 +218,8 @@ const ImageComponent = ( {
 		focalPoint && styles.focalPointContainer,
 	];
 
-	const opacityValue = useRef( new Animated.Value( 1 ) ).current;
-
-	useEffect( () => {
-		Animated.timing( opacityValue, {
-			toValue: isUploadInProgress ? 0.3 : 1,
-			duration: 100,
-			useNativeDriver: true,
-		} ).start();
-	}, [ isUploadInProgress, opacityValue ] );
-
 	const imageStyles = [
 		{
-			opacity: opacityValue,
 			height: containerSize?.height,
 		},
 		! resizeMode && {
@@ -319,7 +308,7 @@ const ImageComponent = ( {
 						{ Platform.isAndroid && (
 							<>
 								{ networkImageLoaded && networkURL && (
-									<Animated.Image
+									<Image
 										style={ imageStyles }
 										fadeDuration={ 0 }
 										source={ { uri: networkURL } }
@@ -331,7 +320,7 @@ const ImageComponent = ( {
 									/>
 								) }
 								{ ! networkImageLoaded && ! networkURL && (
-									<Animated.Image
+									<Image
 										style={ imageStyles }
 										fadeDuration={ 0 }
 										source={ { uri: localURL } }
@@ -345,7 +334,7 @@ const ImageComponent = ( {
 						) }
 						{ Platform.isIOS && (
 							<>
-								<Animated.Image
+								<Image
 									style={ imageStyles }
 									source={ {
 										uri:

diff --git a/packages/react-native-editor/CHANGELOG.md b/packages/react-native-editor/CHANGELOG.md
@@ -11,6 +11,7 @@ For each user feature we should also add a importance categorization label  to i
 
 ## Unreleased
 -   [*] Prevent crash when autoscrolling to blocks [#59110]
+-   [*] Remove opacity change when images are being uploaded [#59264]
 -   [*] Media & Text blocks correctly show an error message when the attached video upload fails [#59288]
 
 ## 1.112.0