ordering-ui-react-native 0.15.80-release → 0.15.81-release

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ordering-ui-react-native",
-  "version": "0.15.80-release",
+  "version": "0.15.81-release",
   "description": "Reusable components made in react native",
   "main": "src/index.tsx",
   "author": "ordering.inc",

package/themes/original/src/components/BusinessController/index.tsx

@@ -1,4 +1,4 @@
-import React, { useState, useRef, useEffect } from 'react';
+import React, { useState } from 'react';
 import { Fade, Placeholder, PlaceholderLine } from 'rn-placeholder';
 import {
 	BusinessController as BusinessSingleCard,
@@ -59,7 +59,6 @@ export const BusinessControllerUI = (props: BusinessControllerParams) => {
 	const [, t] = useLanguage();
 	const theme = useTheme()
 	const [isIntersectionObserver, setIsIntersectionObserver] = useState(!enableIntersection)
-	const fadeAnim = useRef(new Animated.Value(0)).current;
 
 	const styles = StyleSheet.create({
 		headerStyle: {
@@ -146,23 +145,10 @@ export const BusinessControllerUI = (props: BusinessControllerParams) => {
 		}
 	}
 
-	const fadeIn = () => {
-    Animated.timing(fadeAnim, {
-      toValue: 1,
-      duration: 500,
-			useNativeDriver: true
-    }).start();
-  };
-
 	const handleChangeInterSection = (inView: boolean) => {
 		setIsIntersectionObserver(inView)
-		fadeIn()
 	}
 
-	useEffect(() => {
-		if (!enableIntersection) fadeIn()
-	}, [enableIntersection])
-
 	return (
 		<InView style={{ minHeight: 200 }} triggerOnce={true} onChange={(inView: boolean) => handleChangeInterSection(inView)}>
 			{isIntersectionObserver ? (
@@ -186,13 +172,6 @@ export const BusinessControllerUI = (props: BusinessControllerParams) => {
 						</RibbonBox>
 					)}
 					<BusinessHero>
-					<Animated.View
-						style={[
-							{
-								opacity: fadeAnim
-							}
-						]}
-					>
 						<FastImage
 							style={{ height: 120 }}
 							source={{
@@ -201,7 +180,6 @@ export const BusinessControllerUI = (props: BusinessControllerParams) => {
 							}}
 							resizeMode={FastImage.resizeMode.cover}
 						/>
-					</Animated.View>
 						{(businessFeatured ?? business?.featured) && (
 							<View style={styles.featured}>
 								<FontAwesomeIcon name="crown" size={26} color="gold" />

package/themes/original/src/components/SingleProductCard/index.tsx

@@ -1,4 +1,4 @@
-import React, { useState, useRef, useEffect } from 'react';
+import React, { useState } from 'react';
 import {
 	useLanguage,
 	useConfig,
@@ -42,8 +42,6 @@ const SingleProductCardUI = React.memo((props: SingleProductCardParams) => {
 	const theme = useTheme();
 	const hideAddButton = theme?.business_view?.components?.products?.components?.add_to_cart_button?.hidden ?? true
 
-	const fadeAnim = useRef(new Animated.Value(enableIntersection ? 0 : 1)).current;
-
 	const styles = StyleSheet.create({
 		container: {
 			borderWidth: 1,
@@ -123,14 +121,6 @@ const SingleProductCardUI = React.memo((props: SingleProductCardParams) => {
 		maxCartProductConfig,
 		maxCartProductInventory,
 	);
-	
-	const fadeIn = () => {
-		Animated.timing(fadeAnim, {
-			toValue: 1,
-			duration: 500,
-			useNativeDriver: true
-		}).start();
-	};
 
 	const handleChangeFavorite = () => {
 		if (auth) {
@@ -143,14 +133,9 @@ const SingleProductCardUI = React.memo((props: SingleProductCardParams) => {
 	const handleChangeIntersection = () => {
 		if (enableIntersection) {
 			setIsIntersectionObserver(true);
-			fadeIn();
 		}
 	}
 
-	useEffect(() => {
-		if (enableIntersection) fadeIn()
-	}, [enableIntersection])
-
 	return (
 		<InView style={{ minHeight: hideAddButton ? 125 : 165 }} triggerOnce={true} onChange={(inView: boolean) => handleChangeIntersection()}>
 			{isIntersectionObserver ? (
@@ -238,23 +223,14 @@ const SingleProductCardUI = React.memo((props: SingleProductCardParams) => {
 								</RibbonBox>
 							)}
 							{product?.images && (
-								<Animated.View
-									style={[
-										{
-											// Bind opacity to animated value
-											opacity: fadeAnim
-										}
-									]}
-								>
-									<FastImage
-										style={styles.productStyle}
-										source={{
-											uri: optimizeImage(product?.images, 'h_250,c_limit'),
-											priority: FastImage.priority.normal,
-										}}
-										resizeMode={FastImage.resizeMode.cover}
-									/>
-								</Animated.View>
+								<FastImage
+									style={styles.productStyle}
+									source={{
+										uri: optimizeImage(product?.images, 'h_250,c_limit'),
+										priority: FastImage.priority.normal,
+									}}
+									resizeMode={FastImage.resizeMode.cover}
+								/>
 							)}
 						</LogoWrapper>