ordering-ui-react-native 0.16.16 → 0.16.17

package/package.json

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

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

@@ -418,31 +418,35 @@ const CartUI = (props: any) => {
             )}
           </OSBill>
         )}
-        {cart?.valid_products ? (
-          <CheckoutAction>
-            <OButton
-              text={(cart?.subtotal >= cart?.minimum || !cart?.minimum) && cart?.valid_address ? (
-                !openUpselling !== canOpenUpselling ? t('CHECKOUT', 'Checkout') : t('LOADING', 'Loading')
-              ) : !cart?.valid_address ? (
-                `${t('OUT_OF_COVERAGE', 'Out of Coverage')}`
-              ) : (
-                `${t('MINIMUN_SUBTOTAL_ORDER', 'Minimum subtotal order:')} ${parsePrice(cart?.minimum)}`
-              )}
-              bgColor={(cart?.subtotal < cart?.minimum || !cart?.valid_address) ? theme.colors.secundary : theme.colors.primary}
-              isDisabled={(openUpselling && !canOpenUpselling) || cart?.subtotal < cart?.minimum || !cart?.valid_address}
-              borderColor={theme.colors.primary}
-              imgRightSrc={null}
-              textStyle={{ color: 'white', textAlign: 'center', flex: 1 }}
-              onClick={() => setOpenUpselling(true)}
-              style={{ width: '100%', flexDirection: 'row', justifyContent: 'center', borderRadius: 7.6, shadowOpacity: 0 }}
-            />
-          </CheckoutAction>
-        ) : (
-          <View style={{ alignItems: 'center', width: '100%' }}>
-            <OText size={12} color={theme.colors.red} style={{ textAlign: 'center', marginTop: 5 }}>
-              {t('WARNING_INVALID_PRODUCTS_CHECKOUT', 'To continue with your checkout, please remove from your cart the products that are not available.')}
-            </OText>
-          </View>
+        {!isMultiCheckout && (
+          <>
+            {cart?.valid_products ? (
+              <CheckoutAction>
+                <OButton
+                  text={(cart?.subtotal >= cart?.minimum || !cart?.minimum) && cart?.valid_address ? (
+                    !openUpselling !== canOpenUpselling ? t('CHECKOUT', 'Checkout') : t('LOADING', 'Loading')
+                  ) : !cart?.valid_address ? (
+                    `${t('OUT_OF_COVERAGE', 'Out of Coverage')}`
+                  ) : (
+                    `${t('MINIMUN_SUBTOTAL_ORDER', 'Minimum subtotal order:')} ${parsePrice(cart?.minimum)}`
+                  )}
+                  bgColor={(cart?.subtotal < cart?.minimum || !cart?.valid_address) ? theme.colors.secundary : theme.colors.primary}
+                  isDisabled={(openUpselling && !canOpenUpselling) || cart?.subtotal < cart?.minimum || !cart?.valid_address}
+                  borderColor={theme.colors.primary}
+                  imgRightSrc={null}
+                  textStyle={{ color: 'white', textAlign: 'center', flex: 1 }}
+                  onClick={() => setOpenUpselling(true)}
+                  style={{ width: '100%', flexDirection: 'row', justifyContent: 'center', borderRadius: 7.6, shadowOpacity: 0 }}
+                />
+              </CheckoutAction>
+            ) : (
+              <View style={{ alignItems: 'center', width: '100%' }}>
+                <OText size={12} color={theme.colors.red} style={{ textAlign: 'center', marginTop: 5 }}>
+                  {t('WARNING_INVALID_PRODUCTS_CHECKOUT', 'To continue with your checkout, please remove from your cart the products that are not available.')}
+                </OText>
+              </View>
+            )}
+          </>          
         )}
       </BusinessItemAccordion>
 

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

@@ -107,7 +107,7 @@ const MultiCartsPaymethodsAndWalletsUI = (props: any) => {
         {t('PAYMENT_METHODS', 'Payment Methods')}
       </OText>
       {paymethodsAndWallets.loading ? (
-        <Placeholder style={{ marginTop: 10 }} Animation={Fade}>
+        <Placeholder style={{ marginTop: 10, marginBottom: 10 }} Animation={Fade}>
           <View style={{ display: 'flex', flexDirection: 'row' }}>
             {[...Array(3)].map((_, i) => (
               <PlaceholderLine
@@ -115,7 +115,7 @@ const MultiCartsPaymethodsAndWalletsUI = (props: any) => {
                 width={37}
                 height={80}
                 noMargin
-                style={{ borderRadius: 10, marginRight: 10 }}
+                style={{ borderRadius: 10, marginRight: 10, }}
               />
             ))}
           </View>

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

@@ -240,6 +240,7 @@ const MultiCheckoutUI = (props: any) => {
                     cart={cart}
                     cartuuid={cart.uuid}
                     isMultiCheckout
+                    onNavigationRedirect={(route: string, params: any) => props.navigation.navigate(route, params)}
                   />
                   <View style={{ height: 8, backgroundColor: theme.colors.backgroundGray100, marginTop: 13, marginHorizontal: -40 }} />
                 </React.Fragment>

package/themes/original/src/components/MultiOrdersDetails/SingleOrderCard.tsx

@@ -258,25 +258,27 @@ const SingleOrderCardUI = (props: any) => {
   return (
     <SingleOrderContainer>
       <View style={{ flexDirection: 'row', justifyContent: 'space-between', marginBottom: 35 }}>
-        <View>
+        <View style={{ flex: 1, marginRight: 10 }}>
           <OText size={16} lineHeight={24} mBottom={5} weight={'500'} color={theme.colors.textNormal}>
             {t('ORDER', 'Order')} #{order.id}
           </OText>
-          <View style={{ flexDirection: 'row', alignItems: 'center' }}>
+          <View style={{ flexDirection: 'row' }}>
             <OText size={12} lineHeight={18} color={theme.colors.textNormal}>{orderTypes?.find((type: any) => order?.delivery_type === type?.value)?.text}:</OText>
-            <OText mLeft={10} size={12} lineHeight={18} color={theme.colors.textNormal}>
-              {
-                order?.delivery_datetime_utc
-                  ? parseDate(order?.delivery_datetime_utc)
-                  : parseDate(order?.delivery_datetime, { utc: false })
-              }
-            </OText>
+            <View style={{ flex: 1 }}>
+              <OText mLeft={5} size={12} lineHeight={18} color={theme.colors.textNormal}>
+                {
+                  order?.delivery_datetime_utc
+                    ? parseDate(order?.delivery_datetime_utc)
+                    : parseDate(order?.delivery_datetime, { utc: false })
+                }
+              </OText>
+            </View>
           </View>
         </View>
         <OButton
           onClick={() => handleGoToOrderDetails(order?.uuid)}
-          textStyle={{ color: theme.colors.primary, textAlign: 'center' }}
-          style={{ flexDirection: 'row', justifyContent: 'center', borderRadius: 7.6, shadowOpacity: 0 }}
+          textStyle={{ color: theme.colors.primary, textAlign: 'center', fontSize: 14 }}
+          style={{ flexDirection: 'row', justifyContent: 'center', borderRadius: 7.6, shadowOpacity: 0, paddingLeft: 5, paddingRight: 5, height: 44 }}
           text={t('ORDER_DETAILS', 'Order Details')}
           bgColor={theme.colors.white}
           borderColor={theme.colors.primary}

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

@@ -1,6 +1,6 @@
 import React, { useEffect } from 'react'
 import { useLanguage, useUtils, useToast,	ToastType, MultiOrdersDetails as MultiOrdersDetailsController } from 'ordering-components/native'
-import { View, StyleSheet } from 'react-native'
+import { View, StyleSheet, BackHandler } from 'react-native'
 import { useTheme } from 'styled-components/native'
 import { OText, OButton } from '../shared'
 import { Container } from '../../layouts/Container'
@@ -53,12 +53,13 @@ export const MultiOrdersDetailsUI = (props: any) => {
     }
   }
 
-  const handleBackNavigation = () => {
+  const handleArrowBack: any = () => {
     if (!isFromMultiCheckout) {
       navigation?.canGoBack() && navigation.goBack();
       return;
     }
     navigation.navigate('BottomTab');
+    return true
 	}
 
   const handleGoToOrderDetails = (uuid: any) => {
@@ -71,6 +72,13 @@ export const MultiOrdersDetailsUI = (props: any) => {
     }
   }, [error])
 
+  useEffect(() => {
+    BackHandler.addEventListener('hardwareBackPress', handleArrowBack)
+    return () => {
+      BackHandler.removeEventListener('hardwareBackPress', handleArrowBack)
+    }
+  }, [])
+
   return (
     <OrdersDetailsContainer keyboardShouldPersistTaps="handled" contentContainerStyle={{ paddingHorizontal: 40 }}>
       <View style={{ flexDirection: 'row' }}>
@@ -78,7 +86,7 @@ export const MultiOrdersDetailsUI = (props: any) => {
           imgLeftSrc={theme.images.general.arrow_left}
           imgRightSrc={null}
           style={styles.btnBackArrow}
-          onClick={() => handleBackNavigation()}
+          onClick={() => handleArrowBack()}
           imgLeftStyle={{ tintColor: theme.colors.textNormal, width: 16 }}
         />
       </View>