ordering-ui-react-native 0.16.55 → 0.16.58

package/package.json

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

package/src/components/BusinessInformation/index.tsx

@@ -48,6 +48,20 @@ const BusinessInformationUI = (props: BusinessInformationParams) => {
       />
       <WrapMainContent>
         <InnerContent>
+          {(!!businessState?.business?.email || !!businessState?.business?.cellphone) && (
+            <>
+              <GrayBackground>
+                <OText size={16} weight='bold'>{t('BUSINESS_DETAILS', 'Business Details')}</OText>
+              </GrayBackground>
+              {!!businessState?.business?.email && (
+                <OText size={14} mBottom={5} mLeft={15} style={{ marginTop: 10 }}>{t('EMAIL', 'Email')}: <OText color={theme.colors.textSecondary}>{businessState?.business?.email}</OText></OText>
+              )}
+              {!!businessState?.business?.cellphone && (
+                <OText size={14} mBottom={20} mLeft={15}>{t('CELLPHONE', 'Cellphone')}: <OText color={theme.colors.textSecondary}>{businessState?.business?.cellphone}</OText></OText>
+              )}
+            </>
+          )}
+
           <GrayBackground>
             <OText size={16} weight='bold'>{t('BUSINESS_LOCATION', 'Business Location')}</OText>
           </GrayBackground>

package/src/components/PaymentOptionsWebView/index.tsx

@@ -59,7 +59,7 @@ export const PaymentOptionsWebView = (props: PaymentOptionsWebViewParams) => {
     if (e?.nativeEvent?.data && e?.nativeEvent?.data !== 'undefined') {
       let payment = JSON.parse(e.nativeEvent.data);
 
-      if (payment === 'api error') {
+      if (payment === 'api error' || payment === 'Cancelled by user') {
         setShowGateway({ closedByUser: true, open: false })
         setProg(true);
       }

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

@@ -31,8 +31,8 @@ export const PreviousOrders = (props: any) => {
   const theme = useTheme();
   const [, setCurrentTime] = useState()
   const [allowColumns, setAllowColumns] = useState({
-    timer: true,
-    slaBar: true,
+    timer: configState?.configs?.order_deadlines_enabled?.value === '1',
+    slaBar: configState?.configs?.order_deadlines_enabled?.value === '1',
   })
 
   const [orientationState] = useDeviceOrientation();

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

@@ -85,7 +85,7 @@ export const BusinessesListing = (props: any) => {
           transparent={true}
           onClose={() => setLastOrderReview({ ...lastOrderReview, isReviewOpen: false, order: defaultOrder })}
           title={t('HEY', 'Hey! ') + t('HOW_WAS_YOUR_ORDER', 'How was your order?')}
-          bottomContainerStyle={{ height: 'auto' }}
+          bottomContainerStyle={{ height: 'auto', borderRadius: 10 }}
           titleStyle={{ textAlign: 'center' }}
           closeIcon={theme.images.general.close}
         >

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

@@ -217,7 +217,7 @@ const CheckoutUI = (props: any) => {
 		const _requiredFields: any = []
 
 		Object.values(validationFields?.fields?.checkout).map((field: any) => {
-			if (field?.required && !notFields.includes(field.code)) {
+			if (field?.required && !notFields.includes(field.code) && field?.enabled) {
 				if (!user[field?.code]) {
 					_requiredFields.push(field?.code)
 				}

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

@@ -1,5 +1,5 @@
 import React, { useState, useEffect } from 'react';
-import { View, StyleSheet, BackHandler, Platform, Linking } from 'react-native';
+import { View, StyleSheet, BackHandler, Platform, Linking, RefreshControl } from 'react-native';
 import LinearGradient from 'react-native-linear-gradient';
 import { _setStoreData } from '../../providers/StoreUtil';
 import {
@@ -54,7 +54,8 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
     driverLocation,
     onNavigationRedirect,
     reorderState,
-    handleReorder
+    handleReorder,
+    getOrder
   } = props;
 
   const theme = useTheme();
@@ -101,6 +102,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
   const [isReviewed, setIsReviewed] = useState(false)
   const [isOrderHistory, setIsOrderHistory] = useState(false)
   const [openTaxModal, setOpenTaxModal] = useState<any>({ open: false, tax: null, type: '' })
+  const [refreshing] = useState(false);
   const { order, businessData } = props.order;
   const mapValidStatuses = [9, 19, 23]
 
@@ -380,6 +382,11 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
     ) && !order.review && !isReviewed && handleClickOrderReview(order)
   }
 
+  
+  const resfreshOrder = () => {
+    getOrder()
+  }
+
   useEffect(() => {
     const _businessId = 'businessId:' + businessData?.id
     if (reorderState?.error) {
@@ -447,7 +454,15 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
   }, [driverLocation]);
 
   return (
-    <OrderDetailsContainer keyboardShouldPersistTaps="handled">
+    <OrderDetailsContainer 
+      keyboardShouldPersistTaps="handled"
+      refreshControl={
+        <RefreshControl
+          refreshing={refreshing}
+          onRefresh={() => resfreshOrder()}
+        />
+      }
+    >
       {(!order || Object.keys(order).length === 0) && (
         <Placeholder style={{ marginTop: 30 }}>
           <Header>

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

@@ -101,7 +101,7 @@ export const ReviewTrigger = (props: any) => {
           </FormReviews>
         </View>
       </ReviewOrderContainer>
-      <FloatingBottomContainer>
+      <FloatingBottomContainer borderTopWidth={0} borderRadius={10}>
         <ActionContainer>
           <OButton
             textStyle={{ color: theme.colors.white, paddingRight: 10 }}

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

@@ -1,7 +1,7 @@
 import styled from 'styled-components/native'
 
 export const ReviewOrderContainer = styled.ScrollView`
-  padding: 20px 40px;
+  padding: 0 25px;
   margin-bottom: 100px;
 `
 
@@ -13,7 +13,7 @@ export const BusinessLogo = styled.View`
 export const FormReviews = styled.View`
   flex: 1;
   height: 100%;
-  margin-top: 30px;
+  margin-top: 10px;
 `
 
 export const ActionContainer = styled.View`

package/themes/original/src/components/shared/OBottomPopup.tsx

@@ -47,19 +47,21 @@ const OBottomPopup = (props: Props) => {
 				</TouchableWithoutFeedback>
 				<View style={{ ...styles.bottomContainer, ...bottomContainerStyle }}>
 					<View style={{ paddingTop: top, paddingBottom: bottom }}>
-						{closeIcon && (
-							<TouchableOpacity onPress={onClose} style={styles.closeIconStyle}>
-								<OIcon
-									src={closeIcon}
-									width={30}
-								/>
-							</TouchableOpacity>
-						)}
-						{!!title && (
-							<Text style={{ ...styles.titleStyle, ...titleStyle }}>
-								{title}
-							</Text>
-						)}
+						<View style={styles.modalTitleStyle}>
+							{closeIcon && (
+								<TouchableOpacity onPress={onClose} style={styles.closeIconStyle}>
+									<OIcon
+										src={closeIcon}
+										width={30}
+									/>
+								</TouchableOpacity>
+							)}
+							{!!title && (
+								<Text style={{ ...styles.titleStyle, ...titleStyle }}>
+									{title}
+								</Text>
+							)}
+						</View>
 						{children}
 					</View>
 				</View>
@@ -86,12 +88,17 @@ const styles = StyleSheet.create({
 	},
 	titleStyle: {
 		fontSize: 20,
-		fontWeight: 'bold',
-		marginVertical: 10
+		fontWeight: 'bold'
 	},
 	closeIconStyle: {
-		paddingTop: 20,
-		paddingLeft: 20
+		position: 'absolute',
+		left: 25,
+		top: 22.5
+	},
+	modalTitleStyle: {
+		position: 'relative',
+		paddingHorizontal: 10,
+		paddingVertical: 20
 	}
 })
 

package/themes/original/src/layouts/FloatingBottomContainer.tsx

@@ -19,7 +19,11 @@ export const Container = styled.View`
 
 export const FloatingBottomContainer = (props: any) => {
   return (
-    <Container style={{ width: windowWidth }}>
+    <Container style={{
+      width: windowWidth,
+      borderTopWidth: props?.borderTopWidth ?? 1,
+      borderRadius: props?.borderRadius ?? 0
+    }}>
       {props.children}
     </Container>
   )