ordering-ui-react-native 0.18.38 → 0.18.40

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

@@ -106,7 +106,7 @@ const BusinessProductsListUI = (props: BusinessProductsListParams) => {
             <SingleProductCard
               key={'prod_' + product.id + `_${i}`}
               isSoldOut={product.inventoried && !product.quantity}
-              enableIntersection={!isFiltMode && categoryState.products?.length < 80}
+              enableIntersection={!isFiltMode}
               product={product}
               businessId={businessId}
               categoryState={categoryState}
@@ -135,7 +135,7 @@ const BusinessProductsListUI = (props: BusinessProductsListParams) => {
                       key={'feat_' + product.id + `_${i}`}
                       isSoldOut={product.inventoried && !product.quantity}
                       product={product}
-                      enableIntersection={!isFiltMode && categoryState.products?.length < 80}
+                      enableIntersection={!isFiltMode}
                       businessId={businessId}
                       categoryState={categoryState}
                       onProductClick={onProductClick}
@@ -237,7 +237,7 @@ const BusinessProductsListUI = (props: BusinessProductsListParams) => {
                   {products.sort((a: any, b: any) => a.rank - b.rank).map((product: any, i: any) => (
                     <SingleProductCard
                       key={`${product?.id}_${i}`}
-                      enableIntersection={!isFiltMode && categoryState.products?.length < 80}
+                      enableIntersection={!isFiltMode}
                       isSoldOut={product.inventoried && !product.quantity}
                       businessId={businessId}
                       product={product}

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

@@ -13,7 +13,7 @@ const UpsellingRedirectUI = (props: any) => {
     if (!upsellingProducts.loading) {
       if (upsellingProducts?.products?.length) {
         onRedirect &&
-          onRedirect('UpsellingPage', props)
+          onRedirect('UpsellingPage', {...props, products: upsellingProducts?.products })
       } else {
         handleUpsellingPage && handleUpsellingPage()
       }

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

@@ -1,5 +1,5 @@
 import React, { useCallback, useEffect, useRef, useState } from 'react'
-import { View, TouchableOpacity, StyleSheet, SafeAreaView, Dimensions, Platform, KeyboardAvoidingViewBase, KeyboardAvoidingView, Vibration, BackHandler } from 'react-native'
+import { View, TouchableOpacity, StyleSheet, SafeAreaView, Dimensions, Platform, KeyboardAvoidingViewBase, KeyboardAvoidingView, Keyboard, KeyboardEvent, BackHandler } from 'react-native'
 import { IOScrollView } from 'react-native-intersection-observer'
 import { useSafeAreaInsets } from 'react-native-safe-area-context'
 import { useTheme } from 'styled-components/native';
@@ -25,6 +25,7 @@ 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 AntDesignIcon from 'react-native-vector-icons/AntDesign'
 
 import {
   TopHeader,
@@ -43,6 +44,7 @@ import { ProfessionalFilter } from '../ProfessionalFilter';
 import { ServiceForm } from '../ServiceForm';
 import { BusinessesListing } from '../BusinessesListing/Layout/Original'
 import { PageBanner } from '../PageBanner'
+import { vibrateApp } from '../../utils';
 
 const PIXELS_TO_SCROLL = 2000
 
@@ -135,20 +137,23 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
   const [openService, setOpenService] = useState(false)
   const [currentProduct, setCurrentProduct] = useState(null)
   const [searchBarHeight, setSearchBarHeight] = useState(60)
+  const [keyboardHeight, setKeyboardHeight] = useState(0);
   const [viewedCategory, setViewedCategory] = useState<any>(null)
+  const [showTitle, setShowTitle] = useState(false)
 
   const isCheckoutMultiBusinessEnabled: Boolean = configs?.checkout_multi_business_enabled?.value === '1'
   const isQuickAddProduct = configs?.add_product_with_one_click?.value === '1'
   const openCarts = (Object.values(orderState?.carts)?.filter((cart: any) => cart?.products && cart?.products?.length && cart?.status !== 2 && cart?.valid_schedule && cart?.valid_products && cart?.valid_address && cart?.valid_maximum && cart?.valid_minimum && !cart?.wallets) || null) || []
-
   const currentCart: any = Object.values(orderState.carts).find((cart: any) => cart?.business?.slug === business?.slug) ?? {}
   const isOpenFiltProducts = isOpenSearchBar && !!searchValue
   const filtProductsHeight = Platform.OS === 'ios' ? 165 : 100
+  const viewOrderButtonVisible = !loading && auth && currentCart?.products?.length > 0 && categoryState.products.length !== 0 
+
   const onRedirect = (route: string, params?: any) => {
     navigation.navigate(route, params)
   }
   const onProductClick = async (product: any) => {
-    if (product.extras.length === 0 && !product.inventoried && auth && isQuickAddProduct) {
+    if (product.ingredients?.length === 0 && product.extras.length === 0 && !product.inventoried && auth && isQuickAddProduct) {
       const isProductAddedToCart = currentCart?.products?.find((Cproduct: any) => Cproduct.id === product.id)
       const productQuantity = isProductAddedToCart?.quantity
       const addCurrentProduct = {
@@ -156,11 +161,12 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
         quantity: 1
       }
       const updateCurrentProduct = {
+        name: product?.name,
         id: product.id,
         code: isProductAddedToCart?.code,
         quantity: productQuantity + 1
       }
-      Vibration.vibrate()
+      vibrateApp()
       const cartData = currentCart?.business_id ? currentCart : { business_id: business.id }
       if (isProductAddedToCart) {
         await updateProduct(updateCurrentProduct, cartData, isQuickAddProduct)
@@ -239,6 +245,8 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
 
   const handlePageScroll = useCallback(({ nativeEvent }: any) => {
     const scrollOffset = nativeEvent.contentOffset.y
+    setShowTitle(scrollOffset > 30)
+
     if (businessState?.business?.lazy_load_products_recommended) {
       const height = nativeEvent.contentSize.height
       const hasMore = !(categoryState.pagination.totalPages === categoryState.pagination.currentPage)
@@ -307,6 +315,24 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
     }
   }, [isFocused])
 
+  
+  useEffect(() => {
+    function onKeyboardDidShow(e: KeyboardEvent) {
+      setKeyboardHeight(e?.endCoordinates?.height);
+    }
+
+    function onKeyboardDidHide() {
+      setKeyboardHeight(0);
+    }
+
+    const showSubscription = Keyboard.addListener('keyboardDidShow', onKeyboardDidShow);
+    const hideSubscription = Keyboard.addListener('keyboardDidHide', onKeyboardDidHide);
+    return () => {
+      showSubscription.remove();
+      hideSubscription.remove();
+    };
+  }, []);
+
   const subtotalWithTaxes = currentCart?.taxes?.reduce((acc: any, item: any) => {
     if (item?.type === 1)
       return acc = acc + item?.summary?.tax
@@ -369,9 +395,23 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
               <>
                 {!(businessSingleId && auth) && (
                   <TopActions onPress={() => handleBackNavigation()}>
-                    <OIcon src={theme.images.general.arrow_left} color={theme.colors.textNormal} />
+                    <AntDesignIcon 
+                      name='arrowleft'
+                      size={26}
+                    />
                   </TopActions>
                 )}
+                {showTitle && (
+                  <OText
+                    size={16}
+                    style={{ flex: 1, textAlign: 'center' }}
+                    weight={Platform.OS === 'ios' ? '600' : 'bold'}
+                    numberOfLines={2}
+                    ellipsizeMode='tail'
+                  >
+                    {business?.name}
+                  </OText>
+                )}
                 {!errorQuantityProducts && (
                   <View style={{ ...styles.headerItem }}>
                     <TouchableOpacity
@@ -427,8 +467,8 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
         {business?.categories?.length > 0 && isOpenFiltProducts && (
           <FiltProductsContainer
             style={{
-              height: Dimensions.get('window').height - filtProductsHeight,
-              top: Platform.OS === 'ios' ? (searchBarHeight - 10) + insets.top : searchBarHeight
+              height: Dimensions.get('window').height - filtProductsHeight - keyboardHeight - (keyboardHeight > 0 && viewOrderButtonVisible ? 55 : 0),
+              top: Platform.OS === 'ios' ? (searchBarHeight - 10) + insets.top : searchBarHeight,
             }}
             contentContainerStyle={{ flexGrow: 1 }}
           >
@@ -593,7 +633,7 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
             </>
           )}
         </IOScrollView>
-        {!loading && auth && currentCart?.products?.length > 0 && categoryState.products.length !== 0 && (
+        {viewOrderButtonVisible && (
           <View style={{ marginBottom: 0 }}>
             <FloatingButton
               btnText={
@@ -649,6 +689,7 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
           professionalList={business?.professionals}
           professionalSelected={professionalSelected}
           handleChangeProfessional={handleChangeProfessionalSelected}
+          handleChangeProfessional={handleChangeProfessionalSelected}
           handleUpdateProfessionals={handleUpdateProfessionals}
           onSave={() => setOpenService(false)}
           onClose={() => setOpenService(false)}

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

@@ -1,8 +1,8 @@
 import React, { useState } from 'react';
 import { View } from 'react-native';
-import { useLanguage, useConfig } from 'ordering-components/native';
+import { useLanguage, useConfig, useUtils } from 'ordering-components/native';
 import { useTheme } from 'styled-components/native';
-import { CCContainer, CCNotCarts, CCList, CheckoutAction } from './styles';
+import { CCContainer, CCNotCarts, CCList, CheckoutAction, ChCartsTotal } from './styles';
 
 import { Cart } from '../Cart';
 import { OButton, OText } from '../shared';
@@ -19,12 +19,18 @@ export const CartContent = (props: any) => {
 	const theme = useTheme();
 	const [, t] = useLanguage()
 	const [{ configs }] = useConfig()
+	const [{ parsePrice }] = useUtils();
 	const [isCartsLoading, setIsCartsLoading] = useState(false)
 
 	const isChewLayout = theme?.header?.components?.layout?.type === 'chew'
 	const isMultiCheckout = configs?.checkout_multi_business_enabled?.value === '1'
 	const cartsAvailable: any = Object.values(carts)?.filter((cart: any) => cart?.valid && cart?.status !== 2)
 
+	const totalCartsPrice = cartsAvailable?.length && cartsAvailable.reduce((total: any, cart: any) => { return total + cart?.total }, 0)
+	const totalCartsFee = cartsAvailable?.length && cartsAvailable
+		?.filter((cart: any) => cart?.status !== 1 && cart?.valid && cart?.products?.length)
+		?.reduce((total: any, cart: any) => { return total + (cart?.delivery_price_with_discount) }, 0)
+
 	const handleCheckoutRedirect = () => {
 		if (cartsAvailable.length === 1) {
 			onNavigationRedirect('CheckoutNavigator', {
@@ -80,6 +86,9 @@ export const CartContent = (props: any) => {
 										isMultiCheckout={isMultiCheckout}
 										hideUpselling
 										businessConfigs={cart?.business?.configs}
+										hideCouponInput={configs?.multi_business_checkout_coupon_input_style?.value === 'group'}
+                    hideDeliveryFee={configs?.multi_business_checkout_show_combined_delivery_fee?.value === '1'}
+										hideDriverTip={configs?.multi_business_checkout_show_combined_driver_tip?.value === '1'}
 									/>
 									<View style={{ height: 8, backgroundColor: theme.colors.backgroundGray100, marginHorizontal: -40, marginTop: 20 }} />
 								</>
@@ -87,18 +96,51 @@ export const CartContent = (props: any) => {
 						</CCList>
 					))}
 					{isMultiCheckout && (
-						<CheckoutAction style={{ marginTop: 0 }}>
-							<OButton
-								text={t('CHECKOUT', 'Checkout')}
-								bgColor={!cartsAvailable.length ? theme.colors.secundary : theme.colors.primary}
-								isDisabled={!cartsAvailable.length}
-								borderColor={theme.colors.primary}
-								imgRightSrc={null}
-								textStyle={{ color: 'white', textAlign: 'center', flex: 1 }}
-								onClick={() => handleCheckoutRedirect()}
-								style={{ width: '100%', flexDirection: 'row', justifyContent: 'center', borderRadius: 7.6, shadowOpacity: 0 }}
-							/>
-						</CheckoutAction>
+						<>
+							{!!cartsAvailable.length && (
+								<ChCartsTotal>
+									{!!totalCartsFee && configs?.multi_business_checkout_show_combined_delivery_fee?.value === '1' && (
+                    <View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>
+                      <OText size={14} lineHeight={24} color={theme.colors.textNormal} weight={'400'}>
+                        {t('TOTAL_DELIVERY_FEE', 'Total delivery fee')}
+                      </OText>
+                      <OText size={14} lineHeight={24} color={theme.colors.textNormal} weight={'400'}>
+                        {parsePrice(totalCartsFee)}
+                      </OText>
+                    </View>
+                  )}
+                  {cartsAvailable.reduce((sum: any, cart: any) => sum + cart?.driver_tip, 0) > 0 &&
+                    configs?.multi_business_checkout_show_combined_driver_tip?.value === '1' && (
+                    <View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>
+                      <OText size={14} lineHeight={24} color={theme.colors.textNormal} weight={'400'}>
+                        {t('DRIVER_TIP', 'Driver tip')}
+                      </OText>
+                      <OText size={14} lineHeight={24} color={theme.colors.textNormal} weight={'400'}>
+                        {parsePrice(cartsAvailable.reduce((sum: any, cart: any) => sum + cart?.driver_tip, 0))}
+                      </OText>
+                    </View>
+                  )}
+                  <View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>
+                    <OText size={16} lineHeight={24} color={theme.colors.textNormal} weight={'500'}>
+                      {t('TOTAL_FOR_ALL_CARTS', 'Total for all Carts')}
+                    </OText>
+                    <OText size={16} lineHeight={24} color={theme.colors.textNormal} weight={'500'}>{parsePrice(totalCartsPrice)}</OText>
+                  </View>
+								</ChCartsTotal>
+							)}
+							<CheckoutAction style={{ marginTop: 0 }}>
+								<OButton
+									text={t('CHECKOUT', 'Checkout')}
+									bgColor={!cartsAvailable.length ? theme.colors.secundary : theme.colors.primary}
+									isDisabled={!cartsAvailable.length}
+									borderColor={theme.colors.primary}
+									imgRightSrc={null}
+									textStyle={{ color: 'white', textAlign: 'center', flex: 1 }}
+									onClick={() => handleCheckoutRedirect()}
+									style={{ width: '100%', flexDirection: 'row', justifyContent: 'center', borderRadius: 7.6, shadowOpacity: 0 }}
+								/>
+							</CheckoutAction>
+						</>
 					)}
 				</>
 			)}

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

@@ -23,3 +23,7 @@ export const CheckoutAction = styled.View`
   margin-top: 10px;
   margin-bottom: 10px;
 `
+
+export const ChCartsTotal = styled.View`
+  margin-bottom: 16px;
+`

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

@@ -1,5 +1,5 @@
 import React, { useState, useEffect } from 'react';
-import { View, StyleSheet, TouchableOpacity, Platform, I18nManager, Vibration, ScrollView } from 'react-native';
+import { View, StyleSheet, TouchableOpacity, Platform, I18nManager, ScrollView } from 'react-native';
 import { initStripe, useConfirmPayment } from '@stripe/stripe-react-native';
 import Picker from 'react-native-country-picker-modal';
 import MaterialIcons from 'react-native-vector-icons/MaterialIcons'
@@ -52,7 +52,7 @@ import { FloatingButton } from '../FloatingButton';
 import { Container } from '../../layouts/Container';
 import NavBar from '../NavBar';
 import { OrderSummary } from '../OrderSummary';
-import { getTypesText } from '../../utils';
+import { getTypesText, vibrateApp } from '../../utils';
 import { CartStoresListing } from '../CartStoresListing';
 import { PaymentOptionsWebView } from '../../../../../src/components/PaymentOptionsWebView';
 
@@ -222,7 +222,7 @@ const CheckoutUI = (props: any) => {
 
 	const handlePlaceOrder = (confirmPayment: any, forcePlace: boolean = false) => {
 		if (!userErrors.length && (!requiredFields?.length || allowedGuest) || forcePlace) {
-			Vibration.vibrate()
+			vibrateApp()
 			handlerClickPlaceOrder && handlerClickPlaceOrder(null, null, confirmPayment)
 			return
 		}
@@ -351,6 +351,7 @@ const CheckoutUI = (props: any) => {
 						btnStyle={{ paddingLeft: 0, paddingTop: Platform.OS == 'ios' ? 0 : 2 }}
 						titleWrapStyle={{ paddingHorizontal: 0 }}
 						titleStyle={{ marginRight: 0, marginLeft: 0 }}
+						style={{ marginTop: 20 }}
 					/>
 				</View>
 				<ChContainer style={styles.pagePadding}>
@@ -755,7 +756,7 @@ const CheckoutUI = (props: any) => {
 
 					{!cartState.loading && cart && (
 						<View>
-							<ChErrors style={{ marginBottom: 30 }}>
+							<ChErrors style={{ marginBottom: Platform.OS === 'ios' ? 35 : 10 }}>
 								{!cart?.valid_address && cart?.status !== 2 && (
 									<OText
 										color={theme.colors.error}
@@ -882,7 +883,7 @@ const CheckoutUI = (props: any) => {
 			</Container>
 			{!cartState.loading && cart && cart?.status !== 2 && (
 				<FloatingButton
-					handleClick={isDisabledButtonPlace ? () => Vibration.vibrate() : () => handlePlaceOrder(null)}
+					handleClick={isDisabledButtonPlace ? () => vibrateApp() : () => handlePlaceOrder(null)}
 					isSecondaryBtn={isDisabledButtonPlace}
 					disabled={isDisabledButtonPlace}
 					btnText={subtotalWithTaxes >= cart?.minimum

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

@@ -43,7 +43,7 @@ export const GoogleMap = (props: GoogleMapsParams) => {
     ERROR_MAX_LIMIT_LOCATION: `Sorry, You can only set the position to ${maxLimitLocation}m`
   }
 
-  const geocodePosition = (pos: { latitude: number, longitude: number }) => {
+  const geocodePosition = (pos: { latitude: number, longitude: number }, isMovingRegion ?: boolean) => {
     Geocoder.from({
       latitude: pos.latitude,
       longitude: pos.longitude
@@ -68,7 +68,9 @@ export const GoogleMap = (props: GoogleMapsParams) => {
         }
         handleChangeAddressMap && handleChangeAddressMap(address, details)
         setSaveLocation && setSaveLocation(false)
-        handleToggleMap && handleToggleMap()
+        if(!isMovingRegion){ 
+          handleToggleMap && handleToggleMap()
+        }
       } else {
         setMapErrors && setMapErrors('ERROR_NOT_FOUND_ADDRESS')
       }
@@ -92,6 +94,9 @@ export const GoogleMap = (props: GoogleMapsParams) => {
     const _maxLimitLocation = typeof maxLimitLocation === 'string' ? parseInt(maxLimitLocation, 10) : maxLimitLocation
 
     if (distance <= _maxLimitLocation) {
+      if (!aproxEqual(curPos.latitude, center.lat) || !aproxEqual(curPos.longitude, center.lng)){
+        geocodePosition(curPos, true)
+      }
       setMarkerPosition(curPos)
       setRegion({ ...region, longitude: curPos.longitude, latitude: curPos.latitude })
     } else {
@@ -100,6 +105,10 @@ export const GoogleMap = (props: GoogleMapsParams) => {
     }
   }
 
+  const aproxEqual = (n1 : number, n2 : number, epsilon = 0.000001) => {
+    return Math.abs(n1 - n2) < epsilon
+  }
+
   const calculateDistance = (pointA: { lat: number, lng: number }, pointB: { latitude: number, longitude: number }) => {
 
     const lat1 = pointA.lat;

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

@@ -1,5 +1,5 @@
 import React, { useEffect, useState, useRef } from 'react';
-import { StyleSheet, View, Keyboard, Vibration } from 'react-native';
+import { StyleSheet, View, Keyboard } from 'react-native';
 import Spinner from 'react-native-loading-spinner-overlay';
 import { useForm, Controller } from 'react-hook-form';
 import { PhoneInputNumber } from '../PhoneInputNumber';
@@ -45,6 +45,7 @@ import { AppleLogin } from '../AppleLogin';
 import { Otp } from './Otp'
 import { TouchableOpacity } from 'react-native-gesture-handler';
 import Alert from '../../../../../src/providers/AlertProvider'
+import { vibrateApp } from '../../utils';
 
 const LoginFormUI = (props: LoginParams) => {
 	const {
@@ -166,7 +167,7 @@ const LoginFormUI = (props: LoginParams) => {
 		if (loginTab === 'otp') {
 			if (phoneInputData.error && (loginTab !== 'otp' || (otpType === 'cellphone' && loginTab === 'otp'))) {
 				showToast(ToastType.Error, t('INVALID_PHONE_NUMBER', 'Invalid phone number'));
-				Vibration.vibrate()
+				vibrateApp()
 				return
 			}
 			if (loginTab === 'otp') {
@@ -179,7 +180,7 @@ const LoginFormUI = (props: LoginParams) => {
 		} else {
 			if (phoneInputData.error) {
 				showToast(ToastType.Error, phoneInputData.error);
-				Vibration.vibrate()
+				vibrateApp()
 				return;
 			}
 			handleButtonLoginClick({
@@ -192,7 +193,7 @@ const LoginFormUI = (props: LoginParams) => {
 	const handleVerifyCodeClick = () => {
 		if (phoneInputData.error) {
 			showToast(ToastType.Error, phoneInputData.error);
-			Vibration.vibrate()
+			vibrateApp()
 			return;
 		}
 		if (
@@ -207,7 +208,7 @@ const LoginFormUI = (props: LoginParams) => {
 					'The field Mobile phone is required.',
 				),
 			);
-			Vibration.vibrate()
+			vibrateApp()
 			return;
 		}
 		handleSendVerifyCode && handleSendVerifyCode(phoneInputData.phone);
@@ -229,12 +230,12 @@ const LoginFormUI = (props: LoginParams) => {
 		setRecaptchaVerified(false)
 		if (!recaptchaConfig?.siteKey) {
 			showToast(ToastType.Error, t('NO_RECAPTCHA_SITE_KEY', 'The config doesn\'t have recaptcha site key'));
-			Vibration.vibrate()
+			vibrateApp()
 			return
 		}
 		if (!recaptchaConfig?.baseUrl) {
 			showToast(ToastType.Error, t('NO_RECAPTCHA_BASE_URL', 'The config doesn\'t have recaptcha base url'));
-			Vibration.vibrate()
+			vibrateApp()
 			return
 		}
 
@@ -311,7 +312,7 @@ const LoginFormUI = (props: LoginParams) => {
 					baseUrl: configs?.security_recaptcha_base_url?.value || null
 				})
 				showToast(ToastType.Info, t('TRY_AGAIN', 'Please try again'))
-				Vibration.vibrate()
+				vibrateApp()
 				return
 			}
 			formState.result?.result &&
@@ -321,7 +322,7 @@ const LoginFormUI = (props: LoginParams) => {
 						? formState.result?.result
 						: formState.result?.result[0],
 				);
-			formState.result?.result && Vibration.vibrate()
+			formState.result?.result && vibrateApp()
 		}
 	}, [formState]);
 
@@ -333,7 +334,7 @@ const LoginFormUI = (props: LoginParams) => {
 						? verifyPhoneState?.result?.result
 						: verifyPhoneState?.result?.result[0];
 				verifyPhoneState.result?.result && showToast(ToastType.Error, message);
-				verifyPhoneState.result?.result && Vibration.vibrate();
+				verifyPhoneState.result?.result && vibrateApp();
 				setIsLoadingVerifyModal(false);
 				return;
 			}
@@ -374,7 +375,7 @@ const LoginFormUI = (props: LoginParams) => {
 	}, [checkPhoneCodeState])
 
 	useEffect(() => {
-		if (!!Object.values(errors)?.length) Vibration.vibrate()
+		if (!!Object.values(errors)?.length) vibrateApp()
 	}, [errors])
 
 	return (
@@ -766,7 +767,7 @@ const LoginFormUI = (props: LoginParams) => {
 										facebookLoginEnabled && (
 											<FacebookLogin
 												notificationState={notificationState}
-												handleErrors={(err: any) => { showToast(ToastType.Error, err), Vibration.vibrate() }}
+												handleErrors={(err: any) => { showToast(ToastType.Error, err), vibrateApp() }}
 												handleLoading={(val: boolean) => setIsFBLoading(val)}
 												handleSuccessFacebookLogin={handleSuccessFacebook}
 											/>
@@ -775,7 +776,7 @@ const LoginFormUI = (props: LoginParams) => {
 										<GoogleLogin
 											notificationState={notificationState}
 											webClientId={configs?.google_login_client_id?.value}
-											handleErrors={(err: any) => { showToast(ToastType.Error, err), Vibration.vibrate() }}
+											handleErrors={(err: any) => { showToast(ToastType.Error, err), vibrateApp() }}
 											handleLoading={(val: boolean) => setIsFBLoading(val)}
 											handleSuccessGoogleLogin={handleSuccessFacebook}
 										/>
@@ -783,7 +784,7 @@ const LoginFormUI = (props: LoginParams) => {
 									{(configs?.apple_login_client_id?.value !== '' && configs?.google_login_client_id?.value !== null) && appleLoginEnabled && (
 										<AppleLogin
 											notificationState={notificationState}
-											handleErrors={(err: any) => { showToast(ToastType.Error, err), Vibration.vibrate() }}
+											handleErrors={(err: any) => { showToast(ToastType.Error, err), vibrateApp() }}
 											handleLoading={(val: boolean) => setIsFBLoading(val)}
 											handleSuccessAppleLogin={handleSuccessFacebook}
 										/>

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

@@ -115,11 +115,12 @@ const MultiCheckoutUI = (props: any) => {
     }
   }
 
-  const loyaltyRewardValue = creditPointPlanOnBusiness?.accumulation_rate
-    ? Math.round(
-      openCarts.reduce((sum: any, cart: any) => sum + cart?.subtotal + getIncludedTaxes(cart), 0) /
-      creditPointPlanOnBusiness?.accumulation_rate
-    ) : 0
+  const subtotalAmount = openCarts.reduce((sum: any, cart: any) => sum + (cart?.subtotal + getIncludedTaxes(cart)), 0) *
+    creditPointPlanOnBusiness?.accumulation_rate
+
+  const loyaltyRewardValue = (creditPointPlanOnBusiness?.accumulation_rate
+    ? (Math.trunc(subtotalAmount * 100) / 100).toFixed(configs.format_number_decimal_length?.value ?? 2)
+    : 0)
 
   const handleMomentClick = () => {
     if (isPreOrder) {

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

@@ -25,11 +25,12 @@ export const MyOrders = (props: any) => {
   const [ordersLength, setOrdersLength] = useState({
     activeOrdersLength: null,
     previousOrdersLength: 0,
+    preordersLength: 0
   });
   const [selectedOption, setSelectedOption] = useState(!hideOrders ? 'orders' : 'business')
 
   const notOrderOptions = ['business', 'products']
-  const allEmpty = (ordersLength?.activeOrdersLength === 0 && ordersLength?.previousOrdersLength === 0) || ((isEmptyBusinesses || businessOrderIds?.length === 0) && hideOrders)
+  const allEmpty = (ordersLength?.activeOrdersLength === 0 && ordersLength?.previousOrdersLength === 0 && ordersLength?.preordersLength === 0) || ((isEmptyBusinesses || businessOrderIds?.length === 0) && hideOrders)
 
   const isChewLayout = theme?.header?.components?.layout?.type?.toLowerCase() === 'chew'
   const showNavbar = theme?.bar_menu?.components?.orders?.hidden
@@ -147,6 +148,18 @@ export const MyOrders = (props: any) => {
       )}
       {selectedOption === 'orders' && (
         <>
+          {ordersLength?.preordersLength > 0 && (
+            <View style={{ paddingHorizontal: isChewLayout ? 20 : 40 }}>
+              <OrdersOption
+                {...props}
+                preOrders
+                ordersLength={ordersLength}
+                setOrdersLength={setOrdersLength}
+                setRefreshOrders={setRefreshOrders}
+                refreshOrders={refreshOrders}
+              />
+            </View>
+          )}
           <View style={{ paddingHorizontal: isChewLayout ? 20 : 40 }}>
             <OrdersOption
               {...props}

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

@@ -17,8 +17,10 @@ const TitleTopWrapper = styled.View`
 const btnBackArrow = {
 	borderWidth: 0,
 	backgroundColor: '#FFF',
-	borderColor: '#FFF',
-	shadowColor: '#FFF'
+	borderColor: '#fff',
+	shadowColor: '#FFF',
+	paddingLeft: 30,
+	paddingRight: 30
 }
 
 interface Props {
@@ -63,8 +65,11 @@ const NavBar = (props: Props) => {
 	return (
 		<Wrapper style={{ paddingTop: props.paddingTop, ...{ flexDirection: props.isVertical ? 'column' : 'row', alignItems: props.isVertical ? 'flex-start' : 'center' }, ...props.style }}>
 			<OButton
-				imgLeftSrc={theme.images.general.arrow_left}
-				imgLeftStyle={{ width: 26 }}
+				iconProps={{
+					name: 'arrowleft',
+					size: 26
+				}}
+				icon={AntDesignIcon}
 				imgRightSrc={null}
 				style={{ ...btnBackArrow, ...props.btnStyle, ...props.isVertical ? (I18nManager.isRTL ? { paddingRight: 0 } : { paddingLeft: 0 }) : {} }}
 				onClick={props?.onActionLeft}

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

@@ -75,7 +75,7 @@ const OrderSummaryUI = (props: any) => {
 
   const getIncludedTaxes = () => {
     if (cart?.taxes === null || !cart?.taxes) {
-      return cart.business.tax_type === 1 ? cart?.tax : 0
+      return cart?.business?.tax_type === 1 ? cart?.tax : 0
     } else {
       return cart?.taxes.reduce((taxIncluded: number, tax: any) => {
         return taxIncluded + (tax.type === 1 ? tax.summary?.tax : 0)
@@ -83,7 +83,9 @@ const OrderSummaryUI = (props: any) => {
     }
   }
 
-  const loyaltyRewardValue = Math.round((cart?.subtotal + getIncludedTaxes()) / loyaltyRewardRate)
+  const loyaltyRewardValue = ((
+    Math.trunc(((cart?.subtotal + getIncludedTaxes()) * loyaltyRewardRate) * 100) / 100
+  ).toFixed(configs.format_number_decimal_length?.value ?? 2), 10)
 
   const handleDeleteClick = (product: any) => {
     removeProduct(product, cart)

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

@@ -99,7 +99,7 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
 			return false
 		})
 		setOrders(orders)
-	}, [_orders?.length])
+	}, [JSON.stringify(_orders)])
 
 	const onProductClick = (product: any) => {
 		if (product?.product_id && product?.category_id && product?.businessId &&
@@ -167,6 +167,8 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
 			setOrdersLength && setOrdersLength({ ...ordersLength, activeOrdersLength: updateOrders?.length })
 		} else if (!preOrders) {
 			setOrdersLength && setOrdersLength({ ...ordersLength, previousOrdersLength: updateOrders?.length })
+		} else {
+			setOrdersLength && setOrdersLength({ ...ordersLength, preordersLength: updateOrders?.length })
 		}
 	}, [_orders, activeOrders, preOrders])