ordering-ui-react-native 0.22.47-map → 0.22.47-test

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ordering-ui-react-native",
-  "version": "0.22.47-map",
+  "version": "0.22.47-test",
   "description": "Reusable components made in react native",
   "main": "src/index.tsx",
   "author": "ordering.inc",
@@ -46,7 +46,7 @@
     "@react-native-firebase/app": "^12.9.3",
     "@react-native-google-signin/google-signin": "^7.0.1",
     "@react-navigation/drawer": "^5.10.2",
-    "@react-navigation/material-bottom-tabs": "^5.3.14",
+    "@react-navigation/material-bottom-tabs": "^6.2.17",
     "@react-navigation/native": "^5.7.6",
     "@react-navigation/stack": "^5.9.3",
     "@segment/analytics-react-native": "2.1.11",
@@ -86,7 +86,7 @@
     "react-native-gesture-handler": "^1.8.0",
     "react-native-get-random-values": "1.8.0",
     "react-native-gifted-chat": "^0.16.3",
-    "react-native-google-places-autocomplete": "^2.1.3",
+    "react-native-google-places-autocomplete": "2.1.3",
     "react-native-html-to-pdf": "^0.10.0",
     "react-native-image-picker": "^4.0.6",
     "react-native-intersection-observer": "^0.0.9",
@@ -94,7 +94,7 @@
     "react-native-linear-gradient": "^2.5.6",
     "react-native-loading-spinner-overlay": "^2.0.0",
     "react-native-map-link": "^2.8.2",
-    "react-native-maps": "0.31.0",
+    "react-native-maps": "^0.28.0",
     "react-native-modal-dropdown": "^1.0.1",
     "react-native-onesignal": "^4.1.1",
     "react-native-paper": "^4.7.2",

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

@@ -31,6 +31,7 @@ export const AcceptOrRejectOrder = (props: AcceptOrRejectOrderParams) => {
     notShowCustomerPhone,
     orderTitle,
     appTitle,
+    isLoadingOrder
   } = props;
 
   const [, t] = useLanguage();
@@ -277,7 +278,7 @@ export const AcceptOrRejectOrder = (props: AcceptOrRejectOrderParams) => {
     }
 
     bodyToSend.id = orderId;
-    handleUpdateOrder && handleUpdateOrder(bodyToSend.status, bodyToSend);
+    handleUpdateOrder?.(bodyToSend.status, bodyToSend);
   };
 
   useEffect(() => {
@@ -517,7 +518,7 @@ export const AcceptOrRejectOrder = (props: AcceptOrRejectOrderParams) => {
             ...styles.bottomParent,
             marginBottom: Platform.OS === 'ios'
               ? 30 : (keyboardState.height === 0)
-                ? isPage ? 0 : 30
+                ? isPage ? 0 : 40
                 : keyboardState.height - (isPage ? 20 : -10)
           }}
         >
@@ -529,7 +530,7 @@ export const AcceptOrRejectOrder = (props: AcceptOrRejectOrderParams) => {
             style={{ borderRadius: 7, height: 45 }}
             parentStyle={{ width: '100%' }}
             textStyle={{ color: '#FFF', fontSize: 18 }}
-            isDisabled={showTextArea && !comments}
+            isDisabled={(showTextArea && !comments) || isLoadingOrder}
             onClick={() => handleAcceptOrReject()}
           />
         </View>

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

@@ -75,7 +75,7 @@ const SoundPlayerComponent = (props: any) => {
         setIsEnabledReadStorage(true)
       }
     }
-    checkSoundMedia()
+    // checkSoundMedia()
 
   }, [])
   return (
@@ -152,12 +152,11 @@ const NewOrderNotificationUI = (props: any) => {
       } catch { }
       const duration = moment.duration(moment().diff(moment.utc(value?.last_driver_assigned_at)))
       const assignedSecondsDiff = duration.asSeconds()
-      if (assignedSecondsDiff < 5 && !isBusinessApp && !value?.logistic_status && orderStatus.includes(value.status)) {
+      if (assignedSecondsDiff < 5 && !isBusinessApp && !value?.logistic_status) {
         setCurrentEvent({ evt: 2, orderId: value?.id ?? value?.order_id })
       }
     }
-    if (!orderStatus.includes(value.status) || value?.author_id === user.id) return
-    setCurrentEvent({
+    if ((!orderStatus.includes(value.status) && evtType !== 1 && isBusinessApp) || value?.author_id === user.id) return    setCurrentEvent({
       evt: evtType,
       orderId: value?.driver
         ? value?.order_id ?? value?.id

package/themes/business/src/components/OrderDetails/Delivery.tsx

@@ -428,6 +428,16 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
     forceUpdate && handleViewActionOrder && handleViewActionOrder(forceUpdate === 9 ? 'forcePickUp' : 'forceDelivery')
   }, [forceUpdate])
 
+  useEffect(() => {
+    if (!!props.order?.error || props.order?.error?.length > 0) {
+      showToast(ToastType.Error,
+        props.order?.error?.[0] ||
+        props.order?.error ||
+        t('NETWORK_ERROR', 'Network Error'),
+        5000)
+    }
+  }, [props.order?.error])
+
   const styles = StyleSheet.create({
     btnPickUp: {
       borderWidth: 0,
@@ -478,7 +488,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
           isOrderGroup={isOrderGroup}
           lastOrder={lastOrder}
         />
-        {(order?.status === 8 || order?.status === 18) && order?.delivery_type === 1 && (
+        {(order?.status === 8 || order?.status === 18) && order?.delivery_type === 1 && !props.order?.loading && (
           <Pickup>
             <OButton
               style={styles.btnPickUp}
@@ -491,7 +501,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
             />
           </Pickup>
         )}
-        {order?.status === 3 && order?.delivery_type === 1 && !isHideRejectButtons && isEnabledOrderNotReady && (
+        {order?.status === 3 && order?.delivery_type === 1 && !isHideRejectButtons && isEnabledOrderNotReady && !props.order?.loading && (
           <View style={{ paddingVertical: 20, marginBottom: 20 }}>
             <OButton
               style={styles.btnPickUp}
@@ -613,6 +623,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
                 )}
                 {showFloatButtonsAcceptOrReject[order?.status] && (
                   <FloatingButton
+                    disabled={props.order?.loading}
                     btnText={t('REJECT', 'Reject')}
                     isSecondaryBtn={false}
                     secondButtonClick={() => hideTimer ? handleChangeOrderStatus && handleChangeOrderStatus(8) : (order?.isLogistic && (order?.order_group || logisticOrderStatus.includes(order?.status))) ? handleAcceptLogisticOrder(order) : handleViewActionOrder('accept')}
@@ -687,6 +698,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
                   actions={actions}
                   orderTitle={orderTitle}
                   appTitle={appTitle}
+                  isLoadingOrder={props.order?.loading}
                 />
               </OModal>
             )}

package/themes/business/src/components/OrderDetails/OrderContentComponent.tsx

@@ -230,7 +230,7 @@ export const OrderContentComponent = (props: OrderContent) => {
         )}
         {!!order?.business?.location && order?.customer?.location && (
           <OText>
-            {t('DISTANCE_TO_THE_BUSINESS', 'Distance to the business')}: {transformDistance(calculateDistance(order?.business?.location, { latitude: order?.customer?.location?.lat, longitude: order?.customer?.location?.lng }), distanceUnit)} {t(distanceUnit.toUpperCase(), distanceUnit)}
+            {t('DISTANCE_TO_THE_BUSINESS', 'Distance to the business')}: {transformDistance(calculateDistance(order?.business?.location, { latitude: order?.customer?.location?.lat, longitude: order?.customer?.location?.lng }), distanceUnit)} {t(distanceUnit?.toUpperCase?.(), distanceUnit)}
           </OText>
         )}
         {!!order?.business?.address_notes && (
@@ -412,7 +412,7 @@ export const OrderContentComponent = (props: OrderContent) => {
           <View style={{ marginTop: 10 }}>
             {order?.delivery_option !== undefined && order?.delivery_type === 1 && (
               <OText>
-                {t(order?.delivery_option?.name?.toUpperCase()?.replace(/ /g, '_'), order?.delivery_option?.name)}
+                {t(order?.delivery_option?.name?.toUpperCase?.()?.replace(/ /g, '_'), order?.delivery_option?.name)}
               </OText>
             )}
           </View>
@@ -474,7 +474,7 @@ export const OrderContentComponent = (props: OrderContent) => {
             <Table key={offer.id}>
               <OSRow>
                 <OText mBottom={4}>
-                  {t(offer.name?.toUpperCase()?.replace(/ /g, '_'), offer.name)}
+                  {t(offer.name?.toUpperCase?.()?.replace(/ /g, '_'), offer.name)}
                   {offer.rate_type === 1 && (
                     <OText>{`(${verifyDecimals(offer?.rate, parsePrice)}%)`}</OText>
                   )}
@@ -520,7 +520,7 @@ export const OrderContentComponent = (props: OrderContent) => {
             <Table key={tax.id}>
               <OSRow>
                 <OText mBottom={4}>
-                  {t(tax?.name?.toUpperCase()?.replace(/ /g, '_'), tax?.name) || t('INHERIT_FROM_BUSINESS', 'Inherit from business')}
+                  {t(tax?.name?.toUpperCase?.()?.replace(/ /g, '_'), tax?.name) || t('INHERIT_FROM_BUSINESS', 'Inherit from business')}
                   {`(${verifyDecimals(tax?.rate, parseNumber)}%)`}{' '}
                 </OText>
               </OSRow>
@@ -533,7 +533,7 @@ export const OrderContentComponent = (props: OrderContent) => {
             <Table key={fee.id}>
               <OSRow>
                 <OText mBottom={4}>
-                  {t(fee?.name?.toUpperCase()?.replace(/ /g, '_'), fee?.name) || t('INHERIT_FROM_BUSINESS', 'Inherit from business')}
+                  {t(fee?.name?.toUpperCase?.()?.replace(/ /g, '_'), fee?.name) || t('INHERIT_FROM_BUSINESS', 'Inherit from business')}
                   ({fee?.fixed > 0 && `${parsePrice(fee?.fixed, { currency: order?.currency })} + `}{fee.percentage}%){' '}
                 </OText>
               </OSRow>
@@ -546,7 +546,7 @@ export const OrderContentComponent = (props: OrderContent) => {
             <Table key={offer.id}>
               <OSRow>
                 <OText mBottom={4}>
-                  {t(offer.name?.toUpperCase()?.replace(/ /g, '_'), offer.name)}
+                  {t(offer.name?.toUpperCase?.()?.replace(/ /g, '_'), offer.name)}
                   {offer.rate_type === 1 && (
                     <OText>{`(${verifyDecimals(offer?.rate, parsePrice)}%)`}</OText>
                   )}
@@ -574,7 +574,7 @@ export const OrderContentComponent = (props: OrderContent) => {
             <Table key={offer.id}>
               <OSRow>
                 <OText mBottom={4}>
-                  {t(offer.name?.toUpperCase()?.replace(/ /g, '_'), offer.name)}
+                  {t(offer.name?.toUpperCase?.()?.replace(/ /g, '_'), offer.name)}
                   {offer.rate_type === 1 && (
                     <OText>{`(${verifyDecimals(offer?.rate, parsePrice)}%)`}</OText>
                   )}
@@ -643,9 +643,9 @@ export const OrderContentComponent = (props: OrderContent) => {
                       {event?.wallet_event
                         ? walletName[event?.wallet_event?.wallet?.type]?.name
                         : event?.paymethod?.gateway
-                          ? t(event?.paymethod?.gateway?.toUpperCase(), event?.paymethod?.name)
+                          ? t(event?.paymethod?.gateway?.toUpperCase?.(), event?.paymethod?.name)
                           : order?.paymethod?.id === event?.paymethod_id
-                            ? t(order?.paymethod?.gateway?.toUpperCase(), order?.paymethod?.name)
+                            ? t(order?.paymethod?.gateway?.toUpperCase?.(), order?.paymethod?.name)
                             : ''}
                     </OText>
                   </View>

package/themes/business/src/types/index.tsx

@@ -597,6 +597,7 @@ export interface AcceptOrRejectOrderParams {
   isPage?: boolean
   navigation?: any
   route?: any
+  isLoadingOrder?: boolean
 }
 
 export interface MapViewParams {

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

@@ -67,7 +67,8 @@ const AddressFormUI = (props: AddressFormParams) => {
 		hasAddressDefault,
 		afterSignup,
 		businessSlug,
-		isFromCheckout
+		isFromCheckout,
+		onNavigationRedirect
 	} = props;
 
 	const theme = useTheme();
@@ -173,6 +174,8 @@ const AddressFormUI = (props: AddressFormParams) => {
 	const isHideMap = theme?.address?.components?.map?.hidden
 	const isHideIcons = theme?.address?.components?.icons?.hidden
 	const continueAsGuest = () => navigation.navigate(!!businessSlug ? 'Business' : 'BusinessList', { isGuestUser: true });
+	const unaddressedTypes = configState?.configs?.unaddressed_order_types_allowed?.value.split('|').map((value: any) => Number(value)) || []
+	const isAllowUnaddressOrderType = unaddressedTypes.includes(orderState?.options?.type)
 	const goToBack = () => navigation?.canGoBack() && navigation.goBack();
 
 	const getAddressFormatted = (address: any) => {
@@ -527,6 +530,12 @@ const AddressFormUI = (props: AddressFormParams) => {
 		setIsSignUpEffect(true);
 	}, [orderState.loading]);
 
+	useEffect(() => {
+		if (isAllowUnaddressOrderType) {
+			onNavigationRedirect && onNavigationRedirect(!!businessSlug ? 'Business' : 'BusinessList')
+		}
+	}, [isAllowUnaddressOrderType])
+
 	return (
 		<ScrollView
 			keyboardShouldPersistTaps='always'
@@ -542,11 +551,6 @@ const AddressFormUI = (props: AddressFormParams) => {
 					style={{ marginTop: Platform.OS === 'ios' ? 0 : 10 }}
 					titleWrapStyle={{ paddingHorizontal: 0, width: '100%' }}
 					titleStyle={{ marginRight: 0, marginLeft: 0, paddingRight: 5 }}
-          buttonProps={{
-						bgColor: theme.colors.white,
-						borderColor: theme.colors.white,
-						textStyle: { color: theme.colors.btnFont }
-					}}
 				/>
 			</View>
 			<TouchableWithoutFeedback onPress={Keyboard.dismiss}>
@@ -857,9 +861,6 @@ const AddressFormUI = (props: AddressFormParams) => {
 										: t('LOADING', 'Loading')
 								}
 								onClick={handleSubmit(onSubmit)}
-								bgColor={theme.colors.primary}
-								borderColor={theme.colors.primary}
-								textStyle={{ color: theme.colors.white }}
 								isDisabled={formState.loading}
 								style={{ borderRadius: 7.6, shadowOpacity: 0 }}
 								showNextIcon
@@ -895,9 +896,6 @@ const AddressFormUI = (props: AddressFormParams) => {
 						)}
 						<OButton
 							text={t('SAVE', 'Save')}
-							textStyle={{ color: theme.colors.white }}
-							bgColor={theme.colors.primary}
-							borderColor={theme.colors.primary}
 							imgRightSrc={null}
 							style={{ marginHorizontal: 30, marginBottom: 10 }}
 							onClick={() => setSaveMapLocation(true)}

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

@@ -152,11 +152,6 @@ const AddressListUI = (props: AddressListParams) => {
 							showCall={false}
 							paddingTop={10}
 							btnStyle={{ paddingLeft: 0 }}
-              buttonProps={{
-                bgColor: theme.colors.white,
-                borderColor: theme.colors.white,
-                textStyle: { color: theme.colors.btnFont }
-              }}
 						/>
 					)}
 					{
@@ -178,11 +173,6 @@ const AddressListUI = (props: AddressListParams) => {
 								style={{ marginTop: 0 }}
 								titleWrapStyle={{ paddingHorizontal: 0 }}
 								titleStyle={{ marginLeft: 0, marginRight: 0 }}
-                buttonProps={{
-                  bgColor: theme.colors.white,
-                  borderColor: theme.colors.white,
-                  textStyle: { color: theme.colors.btnFont }
-                }}
 							/>
 						)}
 					{addressList.loading && addressList?.addresses?.length === 0 && (
@@ -305,10 +295,7 @@ const AddressListUI = (props: AddressListParams) => {
 							<OButton
 								text={t('ADD_NEW_ADDRESS', 'Add new Address')}
 								imgRightSrc=''
-								bgColor={theme.colors.primary}
-								textStyle={{ color: theme.colors.white }}
 								style={styles.button}
-								borderColor={theme.colors.primary}
 								onClick={() => !afterSignup ? onNavigationRedirect(
 									'AddressForm',
 									{

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

@@ -57,6 +57,8 @@ export const BusinessItemAccordion = (props: any) => {
 		return acc = acc
 	}, cart?.subtotal)
 
+	const bgStyle = (subtotalWithTaxes < cart?.minimum || !cart?.valid_address) ? theme.colors.secundary : theme.colors.primary
+
 	useEffect(() => {
 		if (isActive && !isFromUpselling) {
 			if (cart?.uuid !== viewedCart?.uuid) {
@@ -156,8 +158,8 @@ export const BusinessItemAccordion = (props: any) => {
 							textStyle={{ color: 'white', textAlign: 'center', flex: 1 }}
 							style={{ width: 180, flexDirection: 'row', justifyContent: 'center', borderRadius: 7.6, shadowOpacity: 0 }}
 							text={t('CHECKOUT', 'Checkout')}
-							bgColor={(subtotalWithTaxes < cart?.minimum || !cart?.valid_address) ? theme.colors.secundary : theme.colors.primary}
-							borderColor={theme.colors.primary}
+							bgColor={bgStyle}
+							borderColor={bgStyle}
 							isDisabled={checkoutButtonDisabled}
 						/>
 					)}

package/themes/original/src/components/BusinessListingSearch/BusinessSearchHeader.tsx

@@ -47,13 +47,11 @@ export const BusinessSearchHeader = (props: any) => {
                             borderWidth: 0,
                             width: 26,
                             height: 26,
-                            backgroundColor: '#FFF',
-                            borderColor: '#FFF',
-                            shadowColor: '#FFF',
                             paddingLeft: 0,
                             paddingRight: 0,
                             marginTop: 50,
                         }}
+                        useArrow
                         onClick={() => props.navigation.goBack()}
                         icon={AntDesignIcon}
                         iconProps={{

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

@@ -230,7 +230,7 @@ export const BusinessListingSearchUI = (props: BusinessSearchParams) => {
                 </BusinessInfoItem>
                 <OButton
                   onClick={() => onBusinessClick(business)}
-                  textStyle={{ color: theme.colors.primary, fontSize: 10 }}
+                  textStyle={{ fontSize: 10 }}
                   text={t('GO_TO_STORE', 'Go to store')}
                   style={{
                     borderRadius: 23,
@@ -238,7 +238,6 @@ export const BusinessListingSearchUI = (props: BusinessSearchParams) => {
                     paddingRight: 10,
                     height: 23,
                     shadowOpacity: 0,
-                    backgroundColor: theme.colors.primaryContrast,
                     borderWidth: 0
                   }}
                 />

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

@@ -11,6 +11,8 @@ import { BusinessMenuList } from '../BusinessMenuList'
 import Spinner from 'react-native-loading-spinner-overlay'
 import { BusinessPreorderParams } from '../../types'
 import moment from 'moment'
+import { setLocalMoment } from '../../utils';
+
 import SelectDropdown from 'react-native-select-dropdown'
 import {
   PreOrderContainer,
@@ -311,6 +313,10 @@ const BusinessPreorderUI = (props: BusinessPreorderParams) => {
     }
   }, [dateSelected])
 
+  useEffect(() => {
+		setLocalMoment(moment, t)
+	}, [])
+
   useFocusEffect(
     React.useCallback(() => {
       handleAsap && handleAsap()
@@ -527,9 +533,6 @@ const BusinessPreorderUI = (props: BusinessPreorderParams) => {
         )}
         <OButton
           text={t('GO_TO_MENU', 'Go to menu')}
-          textStyle={{ color: 'white' }}
-          bgColor={theme.colors.primary}
-          borderColor={theme.colors.primary}
           style={{ borderRadius: 7.6, marginBottom: 20, marginTop: 30 }}
           onClick={() => handleClickBusiness()}
           isDisabled={isAsap || !(dateSelected && timeSelected)}
@@ -555,21 +558,21 @@ export const BusinessPreorder = (props: any) => {
   currentDate.setMinutes(59)
 
   const cateringTypeString = orderState?.options?.type === 7
-  ? 'catering_delivery'
-  : orderState?.options?.type === 8
-    ? 'catering_pickup'
-    : null
+    ? 'catering_delivery'
+    : orderState?.options?.type === 8
+      ? 'catering_pickup'
+      : null
 
-const splitCateringValue = (configName : string) =>
-  Object.values(props?.business?.configs || {})
-    ?.find(config => config?.key === configName)
-    ?.value?.split('|')
-    ?.find(val => val.includes(cateringTypeString || ''))?.split(',')[1]
-const preorderSlotInterval = parseInt(splitCateringValue('preorder_slot_interval'))
-const preorderLeadTime = parseInt(splitCateringValue('preorder_lead_time'))
-const preorderTimeRange = parseInt(splitCateringValue('preorder_time_range'))
-const preorderMaximumDays = parseInt(splitCateringValue('preorder_maximum_days'))
-const preorderMinimumDays = parseInt(splitCateringValue('preorder_minimum_days'))
+  const splitCateringValue = (configName: string) =>
+    Object.values(props?.business?.configs || {})
+      ?.find(config => config?.key === configName)
+      ?.value?.split('|')
+      ?.find(val => val.includes(cateringTypeString || ''))?.split(',')[1]
+  const preorderSlotInterval = parseInt(splitCateringValue('preorder_slot_interval'))
+  const preorderLeadTime = parseInt(splitCateringValue('preorder_lead_time'))
+  const preorderTimeRange = parseInt(splitCateringValue('preorder_time_range'))
+  const preorderMaximumDays = parseInt(splitCateringValue('preorder_maximum_days'))
+  const preorderMinimumDays = parseInt(splitCateringValue('preorder_minimum_days'))
 
   const businessPreorderProps = {
     ...props,

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

@@ -558,9 +558,8 @@ const CartUI = (props: any) => {
                   )}
                   bgColor={(subtotalWithTaxes < cart?.minimum || !cart?.valid_address) ? theme.colors.secundary : theme.colors.primary}
                   isDisabled={(openUpselling && !canOpenUpselling) || subtotalWithTaxes < cart?.minimum || !cart?.valid_address}
-                  borderColor={theme.colors.primary}
                   imgRightSrc={null}
-                  textStyle={{ color: '#fff', textAlign: 'center', flex: 1 }}
+                  textStyle={{ textAlign: 'center', flex: 1 }}
                   onClick={() => handleClickCheckout()}
                   style={{ width: '100%', flexDirection: 'row', justifyContent: 'center', borderRadius: 7.6, shadowOpacity: 0 }}
                 />

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

@@ -175,9 +175,8 @@ export const CartContent = (props: any) => {
 											text={t('CHECKOUT', 'Checkout')}
 											bgColor={!cartsAvailable.length ? theme.colors.secundary : theme.colors.primary}
 											isDisabled={!cartsAvailable.length}
-											borderColor={theme.colors.primary}
+											borderColor={!cartsAvailable.length ? theme.colors.secundary : 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 }}
 										/>

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

@@ -1,4 +1,4 @@
-import React, { useState, useEffect, useCallback, useRef } from 'react';
+import React, { useState, useEffect, useCallback, useRef, useMemo } from 'react';
 import { View, StyleSheet, TouchableOpacity, Platform, I18nManager, ScrollView, Keyboard, BackHandler, SafeAreaView } from 'react-native';
 import { initStripe, useConfirmPayment } from '@stripe/stripe-react-native';
 import NativeStripeSdk from '@stripe/stripe-react-native/src/NativeStripeSdk'
@@ -168,6 +168,7 @@ const CheckoutUI = (props: any) => {
 	const [webviewPaymethod, setWebviewPaymethod] = useState<any>(null)
 	const [isOpen, setIsOpen] = useState(false)
 	const [requiredFields, setRequiredFields] = useState<any>([])
+	const [orderTypeValidationFields, setOrderTypeValidationFields] = useState<any>([])
 	const [openModal, setOpenModal] = useState({ login: false, signup: false, isGuest: false })
 	const [allowedGuest, setAllowedGuest] = useState(false)
 	const [placeByMethodPay, setPlaceByMethodPay] = useState(false)
@@ -180,6 +181,10 @@ const CheckoutUI = (props: any) => {
 	const cardsMethods = ['credomatic']
 	const stripePaymethods: any = ['stripe', 'stripe_direct', 'stripe_connect', 'stripe_redirect']
 	const notFields = ['coupon', 'driver_tip', 'mobile_phone', 'address', 'zipcode', 'address_notes', 'comments']
+
+	const guestCheckoutDriveTip = checkoutFieldsState?.fields?.find(field => field.order_type_id === 1 && field?.validation_field?.code === 'driver_tip')
+	const guestCheckoutComment = useMemo(() => checkoutFieldsState?.fields?.find(field => field.order_type_id === options?.type && field?.validation_field?.code === 'comments'), [checkoutFieldsState, options])
+
 	const placeSpotTypes = [3, 4, 5]
 	const placeSpotsEnabled = placeSpotTypes.includes(options?.type)
 	const businessConfigs = businessDetails?.business?.configs ?? []
@@ -204,7 +209,9 @@ const CheckoutUI = (props: any) => {
 		return acc = acc
 	}, cart?.subtotal)
 
-	const validateCommentsCartField = validationFields?.fields?.checkout?.comments?.enabled && validationFields?.fields?.checkout?.comments?.required && (cart?.comment === null || cart?.comment?.trim().length === 0)
+	const validateCommentsCartField = (!user?.guest_id ? (validationFields?.fields?.checkout?.comments?.enabled && validationFields?.fields?.checkout?.comments?.required) : (guestCheckoutComment?.enabled && guestCheckoutComment?.required_with_guest)) && (cart?.comment === null || cart?.comment?.trim().length === 0)
+	const validateDriverTipField = options.type === 1 && (!user?.guest_id ? (validationFields?.fields?.checkout?.driver_tip?.enabled && validationFields?.fields?.checkout?.driver_tip?.required) : (guestCheckoutDriveTip?.enabled && guestCheckoutDriveTip?.required_with_guest)) && (Number(cart?.driver_tip) <= 0)
+
 	const validateZipcodeCard = validationFields?.fields?.card?.zipcode?.enabled &&
 		validationFields?.fields?.card?.zipcode?.required &&
 		paymethodSelected?.data?.card &&
@@ -219,8 +226,9 @@ const CheckoutUI = (props: any) => {
 			validationFields?.fields?.checkout?.driver_tip?.required &&
 			(Number(cart?.driver_tip) <= 0)) ||
 		(validateCommentsCartField) ||
-		(validateZipcodeCard)
-		|| (methodsPay.includes(paymethodSelected?.gateway) && (!methodPaySupported.enabled || methodPaySupported.loading))
+		(validateDriverTipField && !isGiftCardCart) ||
+		(validateZipcodeCard) ||
+		(methodsPay.includes(paymethodSelected?.gateway) && (!methodPaySupported.enabled || methodPaySupported.loading))
 
 	const driverTipsOptions = typeof configs?.driver_tip_options?.value === 'string'
 		? JSON.parse(configs?.driver_tip_options?.value) || []
@@ -342,22 +350,22 @@ const CheckoutUI = (props: any) => {
 	const checkGuestValidationFields = () => {
 		const userSelected = user
 		const _requiredFields = checkoutFieldsState?.fields
-			.filter((field: any) => (field?.order_type_id === options?.type) && field?.enabled && field?.required &&
+			.filter((field: any) => (field?.order_type_id === options?.type) && field?.enabled && field?.required_with_guest &&
 				!notFields.includes(field?.validation_field?.code) &&
 				userSelected && !userSelected[field?.validation_field?.code])
-			.map((item: any) => item?.validation_field?.code)
+		const requiredFieldsCode = _requiredFields.map((item: any) => item?.validation_field?.code)
 		const guestCheckoutCellPhone = checkoutFieldsState?.fields?.find((field: any) => field.order_type_id === options?.type && field?.validation_field?.code === 'mobile_phone')
-
 		if (
 			userSelected &&
 			!userSelected?.cellphone &&
 			((guestCheckoutCellPhone?.enabled &&
-				guestCheckoutCellPhone?.required) ||
+				guestCheckoutCellPhone?.required_with_guest) ||
 				configs?.verification_phone_required?.value === '1')
 		) {
-			_requiredFields.push('cellphone')
+			requiredFieldsCode.push('cellphone')
 		}
-		setRequiredFields(_requiredFields)
+		setRequiredFields(requiredFieldsCode)
+		setOrderTypeValidationFields(_requiredFields)
 	}
 
 	const togglePhoneUpdate = (val: boolean) => {
@@ -646,17 +654,11 @@ const CheckoutUI = (props: any) => {
 											<HeaderTitle text={t('CUSTOMER_DETAILS', 'Customer details')} />
 											<OButton
 												text={t('SIGN_UP', 'Sign up')}
-												textStyle={{ color: theme.colors.white }}
-												bgColor={theme.colors.primary}
-												borderColor={theme.colors.primary}
 												style={{ borderRadius: 7.6, marginTop: 20 }}
 												onClick={() => setOpenModal({ ...openModal, signup: true })}
 											/>
 											<OButton
 												text={t('LOGIN', 'Login')}
-												textStyle={{ color: theme.colors.white }}
-												bgColor={theme.colors.primary}
-												borderColor={theme.colors.primary}
 												style={{ borderRadius: 7.6, marginTop: 20 }}
 												onClick={() => setOpenModal({ ...openModal, login: true })}
 											/>
@@ -1002,7 +1004,15 @@ const CheckoutUI = (props: any) => {
 											{t('WARNING_INVALID_DRIVER_TIP', 'Driver Tip is required.')}
 										</OText>
 									)}
-
+								{validateDriverTipField && !isGiftCardCart &&
+									(
+										<OText
+											color={theme.colors.error}
+											size={12}
+										>
+											{t('WARNING_INVALID_DRIVER_TIP', 'Driver Tip is required.')}
+										</OText>
+									)}
 								{validateCommentsCartField && (
 									<OText
 										color={theme.colors.error}
@@ -1051,8 +1061,10 @@ const CheckoutUI = (props: any) => {
 								phoneUpdate={phoneUpdate}
 								togglePhoneUpdate={togglePhoneUpdate}
 								requiredFields={requiredFields}
+								orderTypeValidationFields={orderTypeValidationFields}
 								hideUpdateButton
 								handlePlaceOrderAsGuest={handlePlaceOrderAsGuest}
+								isGuest={!!user?.guest_id}
 								onClose={() => {
 									setIsOpen(false)
 									if (paymethodClicked) {

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

@@ -69,10 +69,7 @@ export const CitiesControl = (props: any) => {
       </View>
       <OButton
         text={t('CONTINUE', 'Continue')}
-        bgColor={theme.colors.primary}
-        borderColor={theme.colors.primary}
         style={styles.btnStyle}
-        textStyle={{ color: 'white' }}
         onClick={() => handleClick()}
       />
     </Container>

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

@@ -102,9 +102,7 @@ const CouponControlUI = (props: any) => {
 					/>
 					<OButton
 						onClick={() => onButtonApplyClick()}
-						bgColor={theme.colors.primary}
-						borderColor={theme.colors.primary}
-						textStyle={{ color: 'white', fontSize: 12 }}
+						textStyle={{ fontSize: 12 }}
 						imgRightSrc={null}
 						text={t('APPLY', 'Apply')}
 						isDisabled={!couponInput}

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

@@ -125,9 +125,7 @@ const DriverTipsUI = (props: any) => {
 						/>
 						<OButton
 							text={t('APPLY_TIP', 'Apply Tip')}
-							bgColor={theme.colors.primary}
-							borderColor={theme.colors.primary}
-							textStyle={{ color: 'white', fontSize: 14 }}
+							textStyle={{ fontSize: 14 }}
 							imgRightSrc={null}
 							style={{ borderRadius: 5, height: 44 }}
 							isDisabled={parseFloat(value || '0') < 0 || parseFloat(value || '0') === driverTip || value === ''}

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

@@ -44,11 +44,6 @@ export const Favorite = (props: any) => {
         paddingTop={Platform.OS === 'ios' ? 20 : 10}
         style={{ paddingVertical: 0 }}
         btnStyle={{ paddingLeft: 0 }}
-        buttonProps={{
-          bgColor: theme.colors.white,
-          borderColor: theme.colors.white,
-          textStyle: { color: theme.colors.btnFont }
-        }}
       />
       <TabContainer>
         {tabList.map((menu, i) => (

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

@@ -270,7 +270,6 @@ const FavoriteListUI = (props: FavoriteParams) => {
             onClick={() => getFavoriteList(pagination?.currentPage + 1)}
             text={t('LOAD_MORE_ITEMS', 'Load more items')}
             imgRightSrc={null}
-            textStyle={{ color: theme.colors.white }}
             style={{ borderRadius: 7.6, shadowOpacity: 0, marginTop: 20 }}
           />
         </WrappButton>