ordering-ui-react-native 0.15.87 → 0.15.90

package/package.json

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

package/src/utils/index.tsx

@@ -408,49 +408,49 @@ export const orderCommentList = (value: string) => {
 
   const messages: any = {
     6: [// on reject order
-      'Very far away',
-      'Driver/ vehicle incident',
-      'Destination unreachable',
-      'Unavailable driver',
-      'Other'
+      'very_far_away',
+      'driver_vehicle_incident',
+      'destination_unreacheable',
+      'unavailable_driver',
+      'other'
     ],
     9: [// on force pickup status
-      'I forgot to complete it in the location',
-      'I didn\'t have internet connection',
-      'Other'
+      'forgot_complete_location',
+      'not_internet_conection',
+      'other'
     ],
     10: [// on pickup failed by driver
-      'Very far away',
-      'Driver/ vehicle incident',
-      'Destination unreachable',
-      'Store closed',
-      'Unavailable driver',
-      'Other'
+      'very_far_away',
+      'driver_vehicle_incident',
+      'destination_unreacheable',
+      'store_closed',
+      'unavailable_driver',
+      'other'
     ],
     11: [// on force delivery status
-      'I forgot to complete it in the location',
-      'I didn\'t have internet connection',
-      'Other'
+      'forgot_complete_location',
+      'not_internet_conection',
+      'other'
     ],
     12: [// on delivery failed by driver
-      'Very far away',
-      'Driver/ vehicle incident',
-      'Destination unreachable',
-      'Recipient unavailable',
-      'Refused- incorrect/ missing items',
-      'Refused- damage',
-      'Other'
+      'very_far_away',
+      'driver_vehicle_incident',
+      'destination_unreacheable',
+      'recipient_unavailable',
+      'incorrect_missing_items',
+      'refused_damage',
+      'other'
     ],
     14: [// on order not ready
-      'Store didn\'t receive the order on time',
-      'Store very busy',
-      'Other'
+      'store_recieve_order_late',
+      'store_busy',
+      'other'
     ]
   }
 
   if (!messages[status]) return null
 
-  const list = messages[status].map((val: any, i: number) => ({ key: i, content: t(`ORDER_STATUS_${status}_QUICK_COMMENT_${i}`, val) }))
+  const list = messages[status].map((val: any, i: number) => ({ key: i, value: val, content: t(`REJECT_REASON_${val.toUpperCase()}`, val.replaceAll('_', ' ')) }))
 
   return { list }
 }

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

@@ -1,14 +1,17 @@
 import React, { useState, useEffect, useRef } from 'react';
+import FeatherIcon from 'react-native-vector-icons/Feather';
 import {
   Linking,
   Keyboard,
   Platform,
   View,
   KeyboardAvoidingView,
-  TextInput
+  TextInput,
+  StyleSheet
 } from 'react-native';
 import { useTheme } from 'styled-components/native';
-import { useLanguage } from 'ordering-components/native';
+import SelectDropdown from 'react-native-select-dropdown'
+import { useLanguage, useSession } from 'ordering-components/native';
 import { Content, Timer, TimeField, Header, Action, Comments, CommentsButtonGroup } from './styles';
 import { FloatingButton } from '../FloatingButton';
 import { OText, OButton, OTextarea, OIconButton } from '../shared';
@@ -32,6 +35,7 @@ export const AcceptOrRejectOrder = (props: AcceptOrRejectOrderParams) => {
   } = props;
 
   const [, t] = useLanguage();
+  const [{ user }] = useSession();
   const theme = useTheme();
   const scrollViewRef = useRef<any>(null);
   const viewRef = useRef<any>(null);
@@ -41,10 +45,12 @@ export const AcceptOrRejectOrder = (props: AcceptOrRejectOrderParams) => {
   const [min, setMin] = useState('00');
   const [time, setTime] = useState('');
   const [comments, setComments] = useState('');
-  const [commentList, setCommentList] = useState<any>([]);
+  const [rejectReason, setRejectReason] = useState(null);
   const [isKeyboardShow, setIsKeyboardShow] = useState(false);
   const { top, bottom } = useSafeAreaInsets()
 
+  const isDriverApp = appTitle?.key === 'DELIVERY_APP'
+
   const orderCommentsList = orderCommentList(action)
 
   let codeNumberPhone, numberPhone, numberToShow;
@@ -53,20 +59,41 @@ export const AcceptOrRejectOrder = (props: AcceptOrRejectOrderParams) => {
   const buttonText = t(orderTitle[action]?.btnKey, orderTitle[action]?.btnText)
   const showTextArea = ['reject', 'deliveryFailed', 'pickupFailed', 'notReady', 'forcePickUp', 'forceDelivery'].includes(action)
 
-  const isSelectedComment = (commentKey: number) => {
-    const found = commentList.find((comment: any) => comment?.key === commentKey)
-    return found
-  }
-
-  const handleChangeComments = (commentItem: any) => {
-    const found = commentList.find((comment: any) => comment?.key === commentItem.key)
-    if (found) {
-      const _comments = commentList.filter((comment: any) => comment?.key !== commentItem.key)
-      setCommentList(_comments)
-    } else {
-      setCommentList([...commentList, commentItem])
-    }
-  }
+  const styles = StyleSheet.create({
+    selectOption: {
+      alignItems: 'center',
+      justifyContent: 'space-between',
+      minHeight: 40,
+      width: '100%',
+      paddingHorizontal: 15,
+      backgroundColor: theme.colors.inputChat,
+      borderRadius: 7.6,
+    },
+    buttonTextStyle: {
+      textAlign: 'left',
+      marginHorizontal: 0,
+      fontSize: 16,
+      lineHeight: 24,
+      color: '#748194',
+      textTransform: 'capitalize'
+    },
+    dropdownStyle: {
+      borderWidth: 1,
+      borderRadius: 8,
+      paddingTop: 5,
+      backgroundColor: '#fff',
+      borderColor: theme.colors.lightGray,
+      overflow: 'hidden',
+      minHeight: 155
+    },
+    rowStyle: {
+      display: 'flex',
+      borderBottomWidth: 0,
+      height: 36,
+      alignItems: 'center',
+      paddingHorizontal: 10
+    },
+  })
 
   const handleFocus = () => {
     viewRef?.current?.measure((x: any, y: any) => {
@@ -74,12 +101,6 @@ export const AcceptOrRejectOrder = (props: AcceptOrRejectOrderParams) => {
     });
   };
 
-  const handleFocusTimer = () => {
-    timerRef?.current?.measure((x: any, y: any) => {
-      scrollViewRef?.current?.scrollTo({ x: 0, y });
-    });
-  };
-
   useEffect(() => {
     const keyboardDidShowListener = Keyboard.addListener(
       'keyboardDidShow',
@@ -171,13 +192,6 @@ export const AcceptOrRejectOrder = (props: AcceptOrRejectOrderParams) => {
 
   const handleAcceptOrReject = () => {
     handleFixTime();
-
-    let _comments = ''
-    if (commentList.length > 0) {
-      commentList.map((comment: any) => (_comments += comment.content + '. '))
-    }
-    const _comment = _comments + comments
-
     let minsToSend = min;
 
     if (min > '60') minsToSend = '59';
@@ -191,7 +205,7 @@ export const AcceptOrRejectOrder = (props: AcceptOrRejectOrderParams) => {
         status: 7,
       },
       rejectByBusiness: {
-        comment: _comment,
+        comment: comments,
         status: 5,
       },
       acceptByDriver: {
@@ -199,28 +213,34 @@ export const AcceptOrRejectOrder = (props: AcceptOrRejectOrderParams) => {
         status: 8,
       },
       rejectByDriver: {
-        comment: _comment,
+        comment: comments,
         status: 6,
+        reject_reason: rejectReason
       },
       pickupFailedByDriver: {
-        comment: _comment,
-        status: 10
+        comment: comments,
+        status: 10,
+        reject_reason: rejectReason
       },
       deliveryFailedByDriver: {
-        comment: _comment,
-        status: 12
+        comment: comments,
+        status: 12,
+        reject_reason: rejectReason
       },
       orderNotReady: {
-        comment: _comment,
-        status: 14
+        comment: comments,
+        status: 14,
+        reject_reason: rejectReason
       },
       forcePickUp: {
-        reasons: _comment,
-        status: 9
+        reasons: comments,
+        status: 9,
+        reject_reason: rejectReason
       },
       forceDelivery: {
-        reasons: _comment,
-        status: 11
+        reasons: comments,
+        status: 11,
+        reject_reason: rejectReason
       }
     };
 
@@ -413,25 +433,45 @@ export const AcceptOrRejectOrder = (props: AcceptOrRejectOrderParams) => {
           onBlur={() => actions && action === 'accept' && timerRef?.current?.focus?.()}
         />
 
-        {orderCommentsList && (
+        {orderCommentsList && isDriverApp && (
           <CommentsButtonGroup>
-            {orderCommentsList?.list?.map((comment: any) => (
-              <OButton
-                key={comment.key}
-                text={comment.content}
-                bgColor={isSelectedComment(comment.key) ? theme.colors.primary : theme.colors.tabBar}
-                borderColor={isSelectedComment(comment.key) ? theme.colors.primary : theme.colors.tabBar}
-                textStyle={{
-                  color: isSelectedComment(comment.key) ? theme.colors.white : theme.colors.darkText,
-                  fontSize: 12,
-                  paddingRight: isSelectedComment(comment.key) ? 15 : 0
-                }}
-                style={{ height: 35, paddingLeft: 5, paddingRight: 5, marginHorizontal: 3, marginVertical: 10 }}
-                imgRightSrc={isSelectedComment(comment.key) ? theme.images.general.close : null}
-                imgRightStyle={{ tintColor: theme.colors.white, right: 5, margin: 5 }}
-                onClick={() => handleChangeComments(comment) }
-              />
-            ))}
+            <SelectDropdown
+              defaultButtonText={t('REJECT_REASONS_OPTIONS', 'Reject reasons')}
+              data={orderCommentsList?.list}
+              onSelect={(selectedItem) => {
+                setRejectReason(selectedItem?.value)
+              }}
+              buttonTextAfterSelection={(selectedItem) => selectedItem.content}
+              rowTextForSelection={(item) => item.key}
+              buttonStyle={styles.selectOption}
+              buttonTextStyle={styles.buttonTextStyle}
+              renderDropdownIcon={isOpened => {
+                return <FeatherIcon name={isOpened ? 'chevron-up' : 'chevron-down'} color={'#444'} size={18} />;
+              }}
+              dropdownStyle={styles.dropdownStyle}
+              dropdownOverlayColor='transparent'
+              rowStyle={styles.rowStyle}
+              renderCustomizedRowChild={(item) => {
+                return (
+                  <View
+                    style={{
+                      flexDirection: 'row',
+                      alignItems: 'center'
+                    }}
+                  >
+                    <View>
+                      <OText
+                        size={14}
+                        color={'#748194'}
+                        style={{ textTransform: 'capitalize' }}
+                      >
+                        {item?.content}
+                      </OText>
+                    </View>
+                  </View>
+                );
+              }}
+            />
           </CommentsButtonGroup>
         )}
 

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

@@ -39,4 +39,5 @@ export const Comments = styled.View`
 export const CommentsButtonGroup = styled.View`
   flex-direction: row;
   flex-wrap: wrap;
+  margin-top: 15px;
 `

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

@@ -14,7 +14,8 @@ Sound.setCategory('Playback')
 
 const windowWidth = Dimensions.get('screen').width
 
-const NewOrderNotificationUI = () => {
+const NewOrderNotificationUI = (props: any) => {
+  const { isBusinessApp } = props
   const [events] = useEvent()
   const theme = useTheme()
   const [, t] = useLanguage()
@@ -76,13 +77,14 @@ const NewOrderNotificationUI = () => {
         headers: { 'Content-Type': 'application/json', Authorization: `Bearer ${token}` }
       })
       const assignedTimeDiff = moment.utc(value?.driver?.last_order_assigned_at).local().fromNow()
-      if (assignedTimeDiff === 'a few seconds ago') {
+      if (assignedTimeDiff === 'a few seconds ago' && !isBusinessApp) {
         handlePlayNotificationSound()
         clearInterval(soundTimeout)
         setCurrentEvent({ evt: 2, orderId: value?.id })
       }
       return
     }
+    if (evtType === 3) return
     handlePlayNotificationSound()
     clearInterval(soundTimeout)
     setCurrentEvent({

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

@@ -617,7 +617,7 @@ const OrdersListManagerUI = (props: OrdersOptionParams) => {
         </RightSide>
       </Sides>
 
-      <NewOrderNotification />
+      <NewOrderNotification isBusinessApp={isBusinessApp} />
       {(openSearchModal || openSLASettingModal) && (
         <OModal open={openSearchModal || openSLASettingModal} entireModal customClose>
           <ModalContainer

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

@@ -726,7 +726,7 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
       </View>
       {/* </GestureRecognizer> */}
 
-      <NewOrderNotification />
+      <NewOrderNotification isBusinessApp={isBusinessApp} />
       {(openSearchModal || openSLASettingModal) && (
         <OModal open={openSearchModal || openSLASettingModal} entireModal customClose>
           <ModalContainer

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

@@ -438,7 +438,7 @@ const CartUI = (props: any) => {
       </BusinessItemAccordion>
 
       <OModal
-        open={openChangeStore && props.isFranchiseApp}
+        open={openChangeStore}
         entireModal
         customClose
         onClose={() => setOpenChangeStore(false)}

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

@@ -135,7 +135,11 @@ const CheckoutUI = (props: any) => {
 	const [webviewPaymethod, setWebviewPaymethod] = useState<any>(null)
 	
 	const placeSpotTypes = [3, 4]
-	const isWalletEnabled = configs?.wallet_enabled?.value === '1' && (configs?.wallet_cash_enabled?.value === '1' || configs?.wallet_credit_point_enabled?.value === '1')
+  const businessConfigs = businessDetails?.business?.configs ?? []
+  const isWalletCashEnabled = businessConfigs.find((config: any) => config.key === 'wallet_cash_enabled')?.value === '1'
+  const isWalletCreditPointsEnabled = businessConfigs.find((config: any) => config.key === 'wallet_credit_point_enabled')?.value === '1'
+  const isWalletEnabled = configs?.cash_wallet?.value && configs?.wallet_enabled?.value === '1' && (isWalletCashEnabled || isWalletCreditPointsEnabled)
+
 	const isPreOrder = configs?.preorder_status_enabled?.value === '1'
 	const isDisabledButtonPlace = loading || !cart?.valid || (!paymethodSelected && cart?.balance > 0) || placing || errorCash ||
 								cart?.subtotal < cart?.minimum || (placeSpotTypes.includes(options?.type) && !cart?.place) ||
@@ -244,7 +248,7 @@ const CheckoutUI = (props: any) => {
 
 	useEffect(() => {
 		if (cart?.products?.length === 0) {
-			onNavigationRedirect('Business', { store: cart?.business?.slug })
+			onNavigationRedirect('Business', { store: cart?.business?.slug, header: null, logo: null })
 		}
 	}, [cart?.products])
 

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

@@ -25,7 +25,8 @@ const ForgotPasswordUI = (props: any) => {
 		formState,
 		handleButtonForgotPasswordClick,
 		handleReCaptcha,
-		enableReCaptcha
+		enableReCaptcha,
+		reCaptchaValue
 	} = props;
 	const [, t] = useLanguage();
 	const [, { showToast }] = useToast();
@@ -58,9 +59,12 @@ const ForgotPasswordUI = (props: any) => {
 		onChange(value.toLowerCase().replace(/[&,()%";:ç?<>{}\\[\]\s]/g, ''))
 	}
 
-	  	const handleOpenRecaptcha = () => {
+	const handleOpenRecaptcha = () => {
 		setRecaptchaVerified(false)
-	  	if (!recaptchaConfig?.siteKey) {
+		handleReCaptcha(null)
+		if (reCaptchaValue) return
+
+	  if (!recaptchaConfig?.siteKey) {
 			showToast(ToastType.Error, t('NO_RECAPTCHA_SITE_KEY', 'The config doesn\'t have recaptcha site key'));
 			return
 		}
@@ -76,6 +80,11 @@ const ForgotPasswordUI = (props: any) => {
 		handleReCaptcha(token)
 	}
 
+	const handleRecaptchaExpire = () => {
+		setRecaptchaVerified(false)
+		handleReCaptcha(null)
+	}
+
 	useEffect(() => {
 		if (!formState.loading && emailSent) {
 			if (formState.result?.error) {
@@ -192,7 +201,7 @@ const ForgotPasswordUI = (props: any) => {
 								siteKey={recaptchaConfig?.siteKey}
 								baseUrl={recaptchaConfig?.baseUrl}
 								onVerify={onRecaptchaVerify}
-								onExpire={() => setRecaptchaVerified(false)}
+								onExpire={handleRecaptchaExpire}
 							/>
 						</>
 					)}

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

@@ -109,7 +109,7 @@ const ProfileListUI = (props: ProfileParams) => {
 
 	const [confirm, setConfirm] = useState<any>({ open: false, content: null, handleOnAccept: null, id: null, title: null })
 
-	const isWalletEnabled = configs?.wallet_enabled?.value === '1' && (configs?.wallet_cash_enabled?.value === '1' || configs?.wallet_credit_point_enabled?.value === '1')
+  const isWalletEnabled = configs?.cash_wallet?.value && configs?.wallet_enabled?.value === '1' && (configs?.wallet_cash_enabled?.value === '1' || configs?.wallet_credit_point_enabled?.value === '1')
 	const IsPromotionsEnabled = configs?.advanced_offers_module?.value === '1' || configs?.advanced_offers_module?.value === true
 	const onRedirect = (route: string, params?: any) => {
 		navigation.navigate(route, params)

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

@@ -61,7 +61,7 @@ const WalletsUI = (props: any) => {
 
   const [tabSelected, setTabSelected] = useState(isWalletCashEnabled ? 'cash' : 'credit_point')
 
-  const isWalletEnabled = configs?.wallet_enabled?.value === '1' && (isWalletCashEnabled || isWalletPointsEnabled)
+  const isWalletEnabled = configs?.cash_wallet?.value && configs?.wallet_enabled?.value === '1' && (isWalletCashEnabled || isWalletPointsEnabled)
 
   const currentWalletSelected = (walletList.wallets?.length > 0 && walletList.wallets?.find((w: any) => w.type === tabSelected)) ?? null