react-native-ui-lib 7.46.3-snapshot.7379 → 7.46.3-snapshot.7383

package/lib/package.json

@@ -1,6 +1,6 @@
 {
   "name": "uilib-native",
-  "version": "5.0.0-snapshot.7379",
+  "version": "5.0.0-snapshot.7383",
   "homepage": "https://github.com/wix/react-native-ui-lib",
   "description": "uilib native components (separated from js components)",
   "main": "components/index",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-ui-lib",
-  "version": "7.46.3-snapshot.7379",
+  "version": "7.46.3-snapshot.7383",
   "main": "src/index.js",
   "types": "src/index.d.ts",
   "author": "Ethan Sharabi <ethan.shar@gmail.com>",
@@ -14,7 +14,7 @@
     "url": "https://github.com/wix/react-native-ui-lib"
   },
   "scripts": {
-    "start": "watchman watch-del-all && react-native start",
+    "start": "watchman watch-del-all && react-native start --client-logs",
     "start:web": "npm --prefix webDemo run start",
     "ios": "react-native run-ios",
     "android": "react-native run-android",

package/src/components/animatedImage/index.js

@@ -5,6 +5,7 @@ import Animated, { useSharedValue, useAnimatedStyle, withTiming } from 'react-na
 import View from "../../components/view";
 import Image from "../../components/image";
 import { useDidUpdate } from "../../hooks";
+import Constants from "../../commons/Constants";
 const UIAnimatedImage = Animated.createAnimatedComponent(Image);
 /**
  * @description: Image component that fades-in the image with animation once it's loaded
@@ -32,8 +33,10 @@ const AnimatedImage = props => {
     }
   }, [loader]);
   useEffect(() => {
-    setIsLoading(true);
-    propsOnLoadStart?.();
+    if (Constants.isIOS) {
+      setIsLoading(true);
+      propsOnLoadStart?.();
+    }
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [source]);
   const onLoad = useCallback(event => {
@@ -50,11 +53,10 @@ const AnimatedImage = props => {
   [setIsLoading, propsOnLoad, animationDuration]);
 
   // TODO: RN 77 - revert to this solution when iOS is fixed in future RN releases
-  // const onLoadStart = useCallback(() => {
-  //   setIsLoading(true);
-  //   propsOnLoadStart?.();
-  // }, [setIsLoading, propsOnLoadStart, animationDuration]);
-
+  const onLoadStart = useCallback(() => {
+    setIsLoading(true);
+    propsOnLoadStart?.();
+  }, [setIsLoading, propsOnLoadStart, animationDuration]);
   const fadeInStyle = useAnimatedStyle(() => {
     return {
       opacity: opacity.value
@@ -64,9 +66,7 @@ const AnimatedImage = props => {
   // eslint-disable-next-line react-hooks/exhaustive-deps
   const _style = useMemo(() => [style, fadeInStyle], [style]);
   return <View style={containerStyle}>
-      <UIAnimatedImage {...others} style={_style} source={source} onLoad={onLoad}
-    // onLoadStart={onLoadStart}
-    testID={testID} imageStyle={undefined} />
+      <UIAnimatedImage {...others} style={_style} source={source} onLoad={onLoad} onLoadStart={Constants.isAndroid ? onLoadStart : undefined} testID={testID} imageStyle={undefined} />
       {isLoading && loader && <View style={styles.loader}>{loader}</View>}
     </View>;
 };