ordering-ui-react-native 0.18.11 → 0.18.13

package/package.json

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

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

@@ -7,13 +7,14 @@ import {
   View,
   KeyboardAvoidingView,
   TextInput,
-  StyleSheet
+  StyleSheet,
+  TouchableOpacity
 } from 'react-native';
 import { useTheme } from 'styled-components/native';
 import SelectDropdown from 'react-native-select-dropdown'
 import { useLanguage } from 'ordering-components/native';
 import { Content, Timer, TimeField, Header, Comments, CommentsButtonGroup, TopActions } from './styles';
-import { OText, OButton, OTextarea, OIconButton } from '../shared';
+import { OText, OButton, OTextarea, OIcon } from '../shared';
 import { AcceptOrRejectOrderParams } from '../../types';
 
 import { orderCommentList } from '../../../../../src/utils'
@@ -95,7 +96,7 @@ export const AcceptOrRejectOrder = (props: AcceptOrRejectOrderParams) => {
     upper: {
       flex: 1,
       zIndex: 1001,
-      paddingTop: isPage ? 30 : 50,
+      paddingTop: isPage ? 30 : 40,
       marginBottom: 10,
       backgroundColor: theme.colors.backgroundPage
     },
@@ -109,7 +110,18 @@ export const AcceptOrRejectOrder = (props: AcceptOrRejectOrderParams) => {
     bottom: {
       textAlignVertical: "center",
       textAlign: "center",
-    }
+    },
+    btnBackArrow: {
+      borderWidth: 0,
+      width: 32,
+      height: 32,
+      tintColor: theme.colors.textGray,
+      backgroundColor: theme.colors.clear,
+      borderColor: theme.colors.clear,
+      shadowColor: theme.colors.clear,
+      paddingLeft: 0,
+      paddingRight: 0
+    },
   })
 
   const handleFocus = () => {
@@ -299,18 +311,9 @@ export const AcceptOrRejectOrder = (props: AcceptOrRejectOrderParams) => {
       <View style={styles.parent}>
         <View style={styles.upper}>
           <TopActions>
-            <OIconButton
-              icon={theme.images.general.arrow_left}
-              borderColor={theme.colors.clear}
-              iconStyle={{ width: 20, height: 20 }}
-              style={{
-                maxWidth: 40,
-                height: 35,
-                justifyContent: 'flex-end',
-                marginBottom: 10,
-              }}
-              onClick={() => handleArrowBack()}
-            />
+            <TouchableOpacity onPress={() => handleArrowBack()} style={styles.btnBackArrow}>
+              <OIcon src={theme.images.general.arrow_left} color={theme.colors.textGray} />
+            </TouchableOpacity>
             <OText
               size={20}
               color={theme.colors.textGray}
@@ -518,7 +521,7 @@ export const AcceptOrRejectOrder = (props: AcceptOrRejectOrderParams) => {
             imgRightSrc={null}
             style={{ borderRadius: 7, height: 45 }}
             parentStyle={{ width: '100%' }}
-            textStyle={{color: '#FFF', fontSize: 18 }}
+            textStyle={{ color: '#FFF', fontSize: 18 }}
             isDisabled={!rejectReason && showTextArea}
             onClick={() => handleAcceptOrReject()}
           />

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

@@ -285,8 +285,8 @@ export const BusinessBasicInformation = (
 							: { ...styles.headerStyle, backgroundColor: theme.colors.backgroundGray }
 					}
 					{...(!loading && {
-						source: (header || businessState?.business?.header) ? {
-							uri: optimizeImage(businessState?.business?.header, 'h_250,c_limit') || header
+						source: (header || businessState?.business?.header || typeof theme?.images?.dummies?.businessHeader === 'string') ? {
+							uri: optimizeImage(businessState?.business?.header, 'h_250,c_limit') || header || theme?.images?.dummies?.businessHeader
 						} : theme?.images?.dummies?.businessHeader
 					})}
 					imageStyle={{ opacity: isChewLayout ? 0.5 : 1 }}
@@ -317,11 +317,11 @@ export const BusinessBasicInformation = (
 				{!hideLogo && (
 					<BusinessLogo isChewLayout={isChewLayout}>
 						{!isBusinessInfoShow && (
-							logo || businessState?.business?.logo ?
+							logo || businessState?.business?.logo || typeof theme.images.dummies.businessLogo === 'string' ?
 								<FastImage
 									style={styles.logoStyle}
 									source={{
-										uri: logo || optimizeImage(businessState?.business?.logo, 'h_70,c_limit'),
+										uri: logo || optimizeImage(businessState?.business?.logo, 'h_70,c_limit') || theme.images.dummies.businessLogo,
 										priority: FastImage.priority.high,
 										cache: FastImage.cacheControl.web
 									}}

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

@@ -204,10 +204,10 @@ export const BusinessControllerUI = (props: BusinessControllerParams) => {
 						{!hideBusinessHeader && (
 							<FastImage
 								style={{ height: isCustomLayout ? cardHeight * 0.66 : 120 }}
-								source={(businessHeader || business?.header) ? {
-									uri: optimizeImage(businessHeader || business?.header, 'h_500,c_limit'),
+								source={(businessHeader || business?.header || typeof theme.images.dummies.businessHeader === 'string') ? {
+									uri: optimizeImage(businessHeader || business?.header || theme.images.dummies.businessHeader, 'h_500,c_limit'),
 									priority: FastImage.priority.normal,
-								} : theme.images.dummies.businessHeader}
+								} : theme.images.dummies.businessHeader}								
 								resizeMode={FastImage.resizeMode.cover}
 							/>
 						)}
@@ -247,8 +247,8 @@ export const BusinessControllerUI = (props: BusinessControllerParams) => {
 								<BusinessLogo style={styles.businessLogo}>
 									<FastImage
 										style={{ width: 56, height: 56 }}
-										source={(businessLogo || business?.logo) ? {
-											uri: optimizeImage(businessLogo || business?.logo, 'h_150,c_limit'),
+										source={(businessLogo || business?.logo || typeof theme.images.dummies.businessLogo === 'string') ? {
+											uri: optimizeImage(businessLogo || business?.logo || theme.images.dummies.businessLogo, 'h_150,c_limit'),
 											priority: FastImage.priority.normal,
 										} : theme.images.dummies.businessLogo}
 										resizeMode={FastImage.resizeMode.cover}

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

@@ -123,7 +123,9 @@ const OrderMessageUI = (props: any) => {
 		setMessages,
 		readMessages,
 		messagesReadList,
-		setOpenMessges
+		setOpenMessges,
+		setSeletedOrder,
+		setSelectedOrderId
 	} = props;
 	const [openModalForBusiness, setOpenModalForBusiness] = useState(false);
 	const [openModalForDriver, setOpenModalForDriver] = useState(false);
@@ -140,6 +142,8 @@ const OrderMessageUI = (props: any) => {
 
 	const handleClose = () => {
 		setOpenMessges(false)
+		setSeletedOrder(null)
+		setSelectedOrderId(null)
 	}
 
 	const handleOpenMessages = (data: any) => {
@@ -269,7 +273,7 @@ export const MessageListing = (props: MessageListingParams) => {
 				setOpenMessges={setOpenMessges}
 				franchiseId={props.franchiseId}
 			/>
-			{openMessages && seletedOrder && (
+			{openMessages && !!seletedOrder?.id && (
 				<OModal
 					open={openMessages}
 					entireModal
@@ -278,7 +282,10 @@ export const MessageListing = (props: MessageListingParams) => {
 				>
 					<MessagesView
 						order={seletedOrder}
+						orderId={seletedOrder?.id}
 						setOpenMessges={setOpenMessges}
+						setSeletedOrder={setSeletedOrder}
+						setSelectedOrderId={setSelectedOrderId}
 					/>
 				</OModal>
 			)}

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

@@ -412,6 +412,11 @@ const MessagesUI = (props: MessagesParams) => {
 		);
 	}
 
+	useEffect(() => {
+		if (!order?.id || messages?.loading) return
+		readMessages && readMessages()
+	}, [order?.id, messages?.loading])
+
 	return (
 		<View style={{ height: getViewHeight(), width: '100%', paddingTop: 12, backgroundColor: 'white' }}>
 			<Wrapper>
@@ -450,7 +455,7 @@ const MessagesUI = (props: MessagesParams) => {
 										active={business}
 									>
 										<OIcon
-											url={order?.business?.logo}
+											url={order?.business?.logo || theme.images.dummies.businessLogo}
 											width={32}
 											height={32}
 											style={{ borderRadius: 32 }}

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

@@ -280,7 +280,9 @@ const MultiCheckoutUI = (props: any) => {
                     hideDriverTip={configs?.multi_business_checkout_show_combined_driver_tip?.value === '1'}
                     onNavigationRedirect={(route: string, params: any) => props.navigation.navigate(route, params)}
                   />
-                  <View style={{ height: 8, backgroundColor: theme.colors.backgroundGray100, marginTop: 13, marginHorizontal: -40 }} />
+                  {openCarts.length > 1 && (
+                    <View style={{ height: 8, backgroundColor: theme.colors.backgroundGray100, marginTop: 13, marginHorizontal: -40 }} />
+                  )}
                 </React.Fragment>
               ))}
               {!cartGroup?.loading && openCarts.length === 0 && (
@@ -295,7 +297,7 @@ const MultiCheckoutUI = (props: any) => {
                   {t('WARNING_PARTIAL_WALLET_CARTS', 'Important: One or more carts can`t be completed due a partial payment with cash/points wallet and requires to be paid individually')}
                 </OText>
               )}
-              {openCarts.length > 0 && (
+              {openCarts.length > 1 && (
                 <ChCartsTotal>
                   {totalCartsFee && configs?.multi_business_checkout_show_combined_delivery_fee?.value === '1' && (
                     <View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>

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

@@ -192,7 +192,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
         order: {
           id: order?.id,
           business_id: order?.business_id,
-          logo: order.business?.logo,
+          logo: order.business?.logo || theme.images.dummies.businessLogo,
           driver: order?.driver,
           products: order?.products,
           review: order?.review,

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

@@ -283,8 +283,8 @@ const SingleProductCardUI = React.memo((props: SingleProductCardParams) => {
 							{!hideProductLogo && (
 								<FastImage
 									style={styles.productStyle}
-									source={product?.images ? {
-										uri: optimizeImage(product?.images, 'h_250,c_limit'),
+									source={product?.images || typeof theme?.images?.dummies?.product === 'string' ? {
+										uri: optimizeImage(product?.images || theme?.images?.dummies?.products, 'h_250,c_limit'),
 										priority: FastImage.priority.normal,
 									} : theme?.images?.dummies?.product}
 									resizeMode={FastImage.resizeMode.cover}

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

@@ -52,7 +52,7 @@ const OModal = (props: Props): React.ReactElement => {
 
 	const theme = useTheme();
 
-	const RenderSafeAreaView = () => (
+	const renderSafeAreaView = () => (
 		<SafeAreaView style={styles.container}>
 			{!entireModal ? (
 				<View style={styles.centeredView}>
@@ -101,10 +101,10 @@ const OModal = (props: Props): React.ReactElement => {
 					enabled
 					behavior={Platform.OS === 'ios' ? 'padding' : 'height'}
 				>
-					<RenderSafeAreaView/>
+					{renderSafeAreaView()}
 				</KeyboardView>
 			) : (
-				<RenderSafeAreaView/>
+				renderSafeAreaView()
 			)}
 		</Modal>
 	);