ordering-ui-react-native 0.17.26 → 0.17.28

package/package.json

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

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

@@ -23,6 +23,7 @@ import { BusinessProductsList } from '../BusinessProductsList'
 import { BusinessProductsListingParams } from '../../types'
 import { _retrieveStoreData, _removeStoreData } from '../../providers/StoreUtil';
 import IconAntDesign from 'react-native-vector-icons/AntDesign';
+import { useIsFocused } from '@react-navigation/native';
 
 import {
 	TopHeader,
@@ -77,6 +78,7 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
 	const [{ parsePrice }] = useUtils()
 	const [, { showToast }] = useToast()
 	const [{ configs }] = useConfig()
+	const isFocused = useIsFocused();
 	const isPreOrder = configs?.preorder_status_enabled?.value === '1'
 
 	const isChewLayout = theme?.business_view?.components?.header?.components?.layout?.type === 'chew'
@@ -245,6 +247,13 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
 		removeCartByReOrder()
 	}, [currentCart])
 
+	useEffect(() => {
+		if (!isFocused) {
+			handleChangeSearch('')
+			setIsOpenSearchBar(false)
+		}
+	}, [isFocused])
+
 	return (
 		<>
 			<View style={{ flex: 1 }}>

package/themes/original/src/components/FloatingButton/styles.tsx

@@ -12,7 +12,7 @@ export const Container = styled.View`
   width: 100%;
   justify-content: space-between;
   background-color: #FFF;
-  z-index: 1000;
+  z-index: 9999;
   justify-content: space-between;
 `
 

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

@@ -719,8 +719,9 @@ const LoginFormUI = (props: LoginParams) => {
 					)}
 
 				{configs && Object.keys(configs).length > 0 ? (
-					(((configs?.facebook_login?.value === 'true' || configs?.facebook_login?.value === '1') && configs?.facebook_id?.value) ||
-						(configs?.google_login_client_id?.value !== '' && configs?.google_login_client_id?.value !== null)) &&
+					(((configs?.facebook_login?.value === 'true' || configs?.facebook_login?.value === '1') && configs?.facebook_id?.value && facebookLoginEnabled) ||
+					((configs?.google_login_client_id?.value !== '' && configs?.google_login_client_id?.value !== null) && googleLoginEnabled) ||
+					((configs?.apple_login_client_id?.value !== '' && configs?.apple_login_client_id?.value !== null) && appleLoginEnabled)) &&
 					(
 						<>
 							<View

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

@@ -95,7 +95,7 @@ const OrderTypeSelectorUI = (props: OrderTypeSelectParams) => {
 				<>
 					<NavBar
 						onActionLeft={() => goToBack()}
-						btnStyle={{ paddingLeft: 0 }}
+						btnStyle={{ paddingLeft: 0, width: 50 }}
 						paddingTop={0}
 						style={{ paddingBottom: 0 }}
 						title={t('HOW_WILL_YOU_DELIVERY_TYPE', 'How will your order type?')}

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

@@ -262,38 +262,7 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
 					)}
 				</>
 			)}
-			{loading && !hideOrders && (
-				<>
-					{!activeOrders ? (
-						<Placeholder style={{ marginTop: 30 }} Animation={Fade}>
-							<View style={{ width: '100%', flexDirection: 'row' }}>
-								<PlaceholderLine width={20} height={70} style={{ marginRight: 20, marginBottom: 35 }} />
-								<Placeholder>
-									<PlaceholderLine width={30} style={{ marginTop: 5 }} />
-									<PlaceholderLine width={50} />
-									<PlaceholderLine width={70} />
-								</Placeholder>
-							</View>
-						</Placeholder>
-					) : (
-						<View style={{ marginTop: 30 }}>
-							{[...Array(5)].map((item, i) => (
-								<Placeholder key={i} Animation={Fade}>
-									<View style={{ width: '100%', flexDirection: 'row' }}>
-										<PlaceholderLine width={20} height={70} style={{ marginRight: 20, marginBottom: 20 }} />
-										<Placeholder>
-											<PlaceholderLine width={30} style={{ marginTop: 5 }} />
-											<PlaceholderLine width={50} />
-											<PlaceholderLine width={20} />
-										</Placeholder>
-									</View>
-								</Placeholder>
-							))}
-						</View>
-					)}
-				</>
-			)}
-			{!loading && !error && orders.length > 0 && !hideOrders && (
+			{!error && orders.length > 0 && !hideOrders && (
 				preOrders ? (
 					<ActiveOrders
 						orders={orders.filter((order: any) => orderStatus.includes(order.status))}
@@ -325,9 +294,41 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
 						onNavigationRedirect={onNavigationRedirect}
 						handleReorder={handleReorder}
 						handleUpdateOrderList={handleUpdateOrderList}
+						loading={loading}
 					/>
 				)
 			)}
+			{loading && !hideOrders && (
+				<>
+					{!activeOrders ? (
+						<Placeholder style={{ marginTop: 30 }} Animation={Fade}>
+							<View style={{ width: '100%', flexDirection: 'row' }}>
+								<PlaceholderLine width={20} height={70} style={{ marginRight: 20, marginBottom: 35 }} />
+								<Placeholder>
+									<PlaceholderLine width={30} style={{ marginTop: 5 }} />
+									<PlaceholderLine width={50} />
+									<PlaceholderLine width={70} />
+								</Placeholder>
+							</View>
+						</Placeholder>
+					) : (
+						<View style={{ marginTop: 30 }}>
+							{[...Array(5)].map((item, i) => (
+								<Placeholder key={i} Animation={Fade}>
+									<View style={{ width: '100%', flexDirection: 'row' }}>
+										<PlaceholderLine width={20} height={70} style={{ marginRight: 20, marginBottom: 20 }} />
+										<Placeholder>
+											<PlaceholderLine width={30} style={{ marginTop: 5 }} />
+											<PlaceholderLine width={50} />
+											<PlaceholderLine width={20} />
+										</Placeholder>
+									</View>
+								</Placeholder>
+							))}
+						</View>
+					)}
+				</>
+			)}
 		</>
 	)
 }

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

@@ -19,7 +19,8 @@ export const PreviousOrders = (props: PreviousOrdersParams) => {
 		handleReorder,
 		reorderLoading,
 		orderID,
-		handleUpdateOrderList
+		handleUpdateOrderList,
+		loading
 	} = props;
 
 	const theme = useTheme();
@@ -42,7 +43,7 @@ export const PreviousOrders = (props: PreviousOrdersParams) => {
 					handleUpdateOrderList={handleUpdateOrderList}
 				/>
 			))}
-			{pagination.totalPages && pagination.currentPage < pagination.totalPages && (
+			{!loading && pagination.totalPages && pagination.currentPage < pagination.totalPages && (
 				<WrappButton>
 					<OButton
 						onClick={loadMoreOrders}

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

@@ -1,15 +1,15 @@
 import React, { useEffect, useRef, useState, useCallback } from 'react';
 import {
-  View,
-  Keyboard,
-  TextInput,
-  TouchableOpacity,
-  StyleSheet,
-  Dimensions,
-  I18nManager,
-  SafeAreaView,
-  Platform,
-  Button
+	View,
+	Keyboard,
+	TextInput,
+	TouchableOpacity,
+	StyleSheet,
+	Dimensions,
+	I18nManager,
+	SafeAreaView,
+	Platform,
+	Button
 } from 'react-native';
 import {
 	ProductForm as ProductOptions,
@@ -459,13 +459,13 @@ export const ProductOptionsUI = (props: any) => {
 	}
 
 	useEffect(() => {
-    const keyboardDidShowListener = Keyboard.addListener('keyboardDidShow', () => {
+		const keyboardDidShowListener = Keyboard.addListener('keyboardDidShow', () => {
 			scrollViewRef.current.scrollToEnd({ animated: true })
-    })
-    return () => {
-      keyboardDidShowListener.remove()
-    }
-  }, [])
+		})
+		return () => {
+			keyboardDidShowListener.remove()
+		}
+	}, [])
 
 
 	return (
@@ -530,7 +530,7 @@ export const ProductOptionsUI = (props: any) => {
 										>
 											{String(img).includes('image') ? (
 												<FastImage
-													style={{ height: '100%', opacity: isSoldOut ? 0.5 : 1 }}
+													style={{ height: '100%', opacity: isSoldOut ? 0.5 : 1, aspectRatio: 3 / 2 }}
 													source={{
 														uri: optimizeImage(img, 'h_1024,c_limit'),
 														priority: FastImage.priority.normal,
@@ -1054,7 +1054,7 @@ export const ProductOptionsUI = (props: any) => {
 											width={16}
 											color={
 												maxProductQuantity <= 0 ||
-												(productCart?.quantity + productAddedToCartLength) >= maxProductQuantity ||
+													(productCart?.quantity + productAddedToCartLength) >= maxProductQuantity ||
 													((productCart?.quantity + productAddedToCartLength) >= product?.maximum_per_order && product?.maximum_per_order) ||
 													isSoldOut
 													? theme.colors.backgroundGray
@@ -1108,20 +1108,20 @@ export const ProductOptionsUI = (props: any) => {
 
 
 export const ProductForm = (props: any) => {
-  const productOptionsProps = {
-    ...props,
-    productCart: {
-      ...props.productCart,
-      quantity: props.productCart?.code
-        ? props.productCart?.quantity
-        : props?.product?.minimum_per_order || 1
-    },
-    UIComponent: ProductOptionsUI
-  }
+	const productOptionsProps = {
+		...props,
+		productCart: {
+			...props.productCart,
+			quantity: props.productCart?.code
+				? props.productCart?.quantity
+				: props?.product?.minimum_per_order || 1
+		},
+		UIComponent: ProductOptionsUI
+	}
 
-  return <ProductOptions {...productOptionsProps} />
+	return <ProductOptions {...productOptionsProps} />
 };
 
 ProductForm.defaultProps = {
-  productAddedToCartLength: 0
+	productAddedToCartLength: 0
 }

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

@@ -886,64 +886,65 @@ const SignupFormUI = (props: SignupParams) => {
 						</View>
 					)
 				}
-				<View
-					style={{
-						flexDirection: 'row',
-						width: '100%',
-						justifyContent: 'space-between',
-						alignItems: 'center',
-						marginVertical: 30,
-					}}>
-					<View style={style.line} />
-					<OText
-						size={14}
-						mBottom={10}
-						style={{ paddingHorizontal: 19 }}
-						color={theme.colors.disabled}>
-						{t('OR', 'or')}
-					</OText>
-					<View style={style.line} />
-				</View>
-
 				{configs && Object.keys(configs).length > 0 && (
-					(((configs?.facebook_login?.value === 'true' || configs?.facebook_login?.value === '1') && configs?.facebook_id?.value) ||
-						(configs?.google_login_client_id?.value !== '' && configs?.google_login_client_id?.value !== null)) &&
+					(((configs?.facebook_login?.value === 'true' || configs?.facebook_login?.value === '1') && configs?.facebook_id?.value && facebookLoginEnabled) ||
+						((configs?.google_login_client_id?.value !== '' && configs?.google_login_client_id?.value !== null) && googleLoginEnabled) ||
+						((configs?.apple_login_client_id?.value !== '' && configs?.apple_login_client_id?.value !== null) && appleLoginEnabled)) &&
 					(
-						<ButtonsWrapper>
-							<SocialButtons>
-								{(configs?.facebook_login?.value === 'true' || configs?.facebook_login?.value === '1') &&
-									configs?.facebook_id?.value &&
-									facebookLoginEnabled &&
-									(
-										<FacebookLogin
+						<>
+							<View
+								style={{
+									flexDirection: 'row',
+									width: '100%',
+									justifyContent: 'space-between',
+									alignItems: 'center',
+									marginVertical: 30,
+								}}>
+								<View style={style.line} />
+								<OText
+									size={14}
+									mBottom={10}
+									style={{ paddingHorizontal: 19 }}
+									color={theme.colors.disabled}>
+									{t('OR', 'or')}
+								</OText>
+								<View style={style.line} />
+							</View>
+							<ButtonsWrapper>
+								<SocialButtons>
+									{(configs?.facebook_login?.value === 'true' || configs?.facebook_login?.value === '1') &&
+										configs?.facebook_id?.value &&
+										facebookLoginEnabled &&
+										(
+											<FacebookLogin
+												notificationState={notificationState}
+												handleErrors={(err: any) => showToast(ToastType.Error, err)}
+												handleLoading={(val: boolean) => setIsFBLoading(val)}
+												handleSuccessFacebookLogin={handleSuccessFacebook}
+											/>
+										)}
+									{(configs?.google_login_client_id?.value !== '' && configs?.google_login_client_id?.value !== null) && googleLoginEnabled && (
+										<GoogleLogin
 											notificationState={notificationState}
+											webClientId={configs?.google_login_client_id?.value}
 											handleErrors={(err: any) => showToast(ToastType.Error, err)}
 											handleLoading={(val: boolean) => setIsFBLoading(val)}
-											handleSuccessFacebookLogin={handleSuccessFacebook}
+											handleSuccessGoogleLogin={handleSuccessFacebook}
 										/>
 									)}
-								{(configs?.google_login_client_id?.value !== '' && configs?.google_login_client_id?.value !== null) && googleLoginEnabled && (
-									<GoogleLogin
-										notificationState={notificationState}
-										webClientId={configs?.google_login_client_id?.value}
-										handleErrors={(err: any) => showToast(ToastType.Error, err)}
-										handleLoading={(val: boolean) => setIsFBLoading(val)}
-										handleSuccessGoogleLogin={handleSuccessFacebook}
-									/>
-								)}
-								{(configs?.apple_login_client_id?.value !== '' && configs?.apple_login_client_id?.value !== null) && appleLoginEnabled && (
-									<AppleLogin
-										notificationState={notificationState}
-										handleErrors={(err: any) => showToast(ToastType.Error, err)}
-										handleLoading={(val: boolean) => setIsFBLoading(val)}
-										handleSuccessAppleLogin={handleSuccessFacebook}
-									/>
-								)}
-							</SocialButtons>
-						</ButtonsWrapper>
+									{(configs?.apple_login_client_id?.value !== '' && configs?.apple_login_client_id?.value !== null) && appleLoginEnabled && (
+										<AppleLogin
+											notificationState={notificationState}
+											handleErrors={(err: any) => showToast(ToastType.Error, err)}
+											handleLoading={(val: boolean) => setIsFBLoading(val)}
+											handleSuccessAppleLogin={handleSuccessFacebook}
+										/>
+									)}
+								</SocialButtons>
+							</ButtonsWrapper>
+						</>
 					)
 				)}
-
 			</FormSide>
 			<OModal
 				open={willVerifyOtpState}

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

@@ -64,6 +64,12 @@ export const SingleProductReview = (props: SingleProductReviewParams) => {
     return found
   }
 
+  const handleChangeQualification = (index: number) => {
+    if (qualification === index) return
+    setQualification(index)
+    setComments([])
+  }
+
   const handleChangeComment = (commentItem: any) => {
     const found = comments.find((comment: any) => comment?.key === commentItem.key)
     if (found) {
@@ -132,11 +138,11 @@ export const SingleProductReview = (props: SingleProductReviewParams) => {
           <LikeHandsActionContainer>
             <LikeHandsButton
               isLike
-              onPress={() => setQualification(5)}
+              onPress={() => handleChangeQualification(5)}
             >
               <AntDesignIcons name='like2' size={20} color={qualification === 5 ? theme.colors.primary : theme.colors.lightGray} />
             </LikeHandsButton>
-            <LikeHandsButton onPress={() => setQualification(1)}>
+            <LikeHandsButton onPress={() => handleChangeQualification(1)}>
               <AntDesignIcons name='dislike2' size={20} color={qualification === 1 ? theme.colors.primary : theme.colors.lightGray} />
             </LikeHandsButton>
           </LikeHandsActionContainer>

package/themes/original/src/types/index.tsx

@@ -396,6 +396,7 @@ export interface PreviousOrdersParams {
 	getOrderStatus?: any,
 	orderID?: number
 	reorderLoading?: boolean,
+	loading?: boolean,
 	loadMoreOrders?: () => {},
 	handleReorder?: (orderId: number) => {},
 	onNavigationRedirect?: (route: string, params?: any) => {}