ordering-ui-react-native 0.16.36 → 0.16.37-release

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

@@ -1,17 +1,105 @@
+import React, { useState, useEffect } from 'react'
+import { useOrder, useSession, useLanguage, useConfig } from 'ordering-components/native';
 
-import React from 'react'
 import { useTheme } from 'styled-components/native'
 import { BusinessesListing as OriginalBusinessListing } from './Layout/Original'
 import { BusinessesListing as AppointmentBusinessListing } from './Layout/Appointment'
+import { OBottomPopup } from '../shared';
+import { ReviewTrigger } from '../ReviewTrigger';
+import { NotificationSetting } from '../../../../../src/components/NotificationSetting';
 
 export const BusinessesListing = (props: any) => {
-	const theme = useTheme()
-	const layout = theme?.layout?.businessListing?.layout?.type || 'original'
+  const { logosLayout } = props
+  const theme = useTheme()
+  const layout = theme?.business_listing_view?.components?.layout?.type || 'original'
+  const [, t] = useLanguage();
+  const [{ auth }] = useSession()
+  const [, { getLastOrderHasNoReview }] = useOrder();
+  const [{ configs }] = useConfig()
+  const isShowReviewsPopupEnabled = configs?.show_reviews_popups_enabled?.value === '1'
 
-	return (
+  const [, setIsReviewed] = useState()
+  const [checkNotificationStatus, setCheckNotificationStatus] = useState({ open: false, checked: false })
+  const defaultOrder = {
+    id: 0,
+    business_id: 0,
+    business_name: '',
+    logo: '',
+    driver: {},
+    products: [],
+    review: {},
+    user_review: {},
+    delivery_datetime: ''
+  }
+  const [lastOrderReview, setLastOrderReview] = useState({
+    isReviewOpen: false,
+    order: defaultOrder,
+    defaultStar: 5,
+  })
+
+  const _getLastOrderHasNoReview = async () => {
+    const lastOrderHasNoReview = await getLastOrderHasNoReview()
+    lastOrderHasNoReview && OrderReviewRequired(lastOrderHasNoReview)
+  }
+
+  const OrderReviewRequired = (order: any) => {
+    setLastOrderReview({
+      isReviewOpen: true,
+      order: {
+        id: order?.id,
+        business_id: order?.business_id,
+        business_name: order?.business?.name,
+        logo: order.business?.logo,
+        driver: order?.driver,
+        products: order?.products,
+        review: order?.review,
+        user_review: order?.user_review,
+        delivery_datetime: order?.delivery_datetime_utc
+      },
+      defaultStar: 5
+    })
+  }
+
+  const handleOpenOrderReview = (star: number) => {
+    setLastOrderReview({
+      ...lastOrderReview, isReviewOpen: false, order: defaultOrder
+    })
+    props?.navigation && props.navigation.navigate(
+      'ReviewOrder',
+      {
+        order: lastOrderReview.order,
+        defaultStar: star || 5,
+        setIsReviewed
+      }
+    )
+  }
+
+  useEffect(() => {
+    if (!isShowReviewsPopupEnabled) return
+    (checkNotificationStatus?.checked && auth) && _getLastOrderHasNoReview()
+  }, [checkNotificationStatus, auth, isShowReviewsPopupEnabled])
+
+  return (
     <>
-      {(layout === 'original') && <OriginalBusinessListing {...props} />}
-      {(layout === 'appointment') && <AppointmentBusinessListing {...props} />}
+      {((layout === 'original') || logosLayout) && <OriginalBusinessListing {...props} />}
+      {(layout === 'appointments') && !logosLayout && <AppointmentBusinessListing {...props} />}
+
+      {lastOrderReview?.isReviewOpen && (
+        <OBottomPopup
+          open={lastOrderReview?.isReviewOpen}
+          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', borderRadius: 10 }}
+          titleStyle={{ textAlign: 'center' }}
+          closeIcon={theme.images.general.close}
+          presentationStyle='overFullScreen'
+        >
+          {lastOrderReview?.order && <ReviewTrigger order={lastOrderReview?.order} handleOpenOrderReview={handleOpenOrderReview} />}
+        </OBottomPopup>
+      )}
+      <NotificationSetting checkNotificationStatus={checkNotificationStatus}
+        setCheckNotificationStatus={setCheckNotificationStatus} />
     </>
-	)
+  )
 }

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

@@ -8,7 +8,7 @@ import {
   useValidationFields,
 } from 'ordering-components/native';
 import { useTheme } from 'styled-components/native';
-import { CContainer, CheckoutAction, Divider } from './styles';
+import { CContainer, CheckoutAction, Divider, DriverTipsContainer } from './styles';
 
 import { OSBill, OSTable, OSCoupon, OSTotal, OSRow } from '../OrderSummary/styles';
 
@@ -25,6 +25,7 @@ import { TaxInformation } from '../TaxInformation';
 import { CartStoresListing } from '../CartStoresListing';
 import { OAlert } from '../../../../../src/components/shared'
 import { PlaceSpot } from '../PlaceSpot'
+import { DriverTips } from '../DriverTips'
 
 const CartUI = (props: any) => {
   const {
@@ -60,11 +61,16 @@ const CartUI = (props: any) => {
 
   const isCartPending = cart?.status === 2
   const isCouponEnabled = validationFields?.fields?.checkout?.coupon?.enabled
-	const isCheckoutMultiBusinessEnabled: Boolean = configs?.checkout_multi_business_enabled?.value === '1'
+  const isCheckoutMultiBusinessEnabled: Boolean = configs?.checkout_multi_business_enabled?.value === '1'
+  const openCarts = (Object.values(orderState?.carts)?.filter((cart: any) => cart?.products && cart?.products?.length && cart?.status !== 2 && cart?.valid_schedule && cart?.valid_products && cart?.valid_address && cart?.valid_maximum && cart?.valid_minimum && !cart?.wallets) || null) || []
 
   const business: any = (orderState?.carts && Object.values(orderState.carts).find((_cart: any) => _cart?.uuid === props.cartuuid)) ?? {}
   const businessId = business?.business_id ?? null
-  const placeSpotTypes = [3, 4]
+  const placeSpotTypes = [4]
+
+  const driverTipsOptions = typeof configs?.driver_tip_options?.value === 'string'
+    ? JSON.parse(configs?.driver_tip_options?.value) || []
+    : configs?.driver_tip_options?.value || []
 
   const momentFormatted = !orderState?.option?.moment
     ? t('RIGHT_NOW', 'Right Now')
@@ -98,11 +104,11 @@ const CartUI = (props: any) => {
   const handleUpsellingPage = () => {
     setOpenUpselling(false)
     setCanOpenUpselling(false)
-    if (isCheckoutMultiBusinessEnabled) {
-			props.onNavigationRedirect('CheckoutNavigator', {
-				screen: 'MultiCheckout'
-			})
-		} else {
+    if (isCheckoutMultiBusinessEnabled && openCarts.length > 1) {
+      props.onNavigationRedirect('CheckoutNavigator', {
+        screen: 'MultiCheckout'
+      })
+    } else {
       props.onNavigationRedirect('CheckoutNavigator', {
         screen: 'CheckoutPage',
         cartUuid: cart?.uuid,
@@ -148,6 +154,12 @@ const CartUI = (props: any) => {
     }
   }
 
+  const subtotalWithTaxes = cart?.taxes?.reduce((acc: any, item: any) => {
+    if (item?.type === 1)
+      return acc = acc + item?.summary?.tax
+    return acc = acc
+  }, cart?.subtotal)
+
   return (
     <CContainer>
       {openUpselling && (
@@ -172,7 +184,7 @@ const CartUI = (props: any) => {
         onNavigationRedirect={props.onNavigationRedirect}
         handleChangeStore={() => setOpenChangeStore(true)}
         handleClickCheckout={() => setOpenUpselling(true)}
-        checkoutButtonDisabled={(openUpselling && !canOpenUpselling) || cart?.subtotal < cart?.minimum || !cart?.valid_address}
+        checkoutButtonDisabled={(openUpselling && !canOpenUpselling) || subtotalWithTaxes < cart?.minimum || !cart?.valid_address}
         isMultiCheckout={isMultiCheckout}
       >
         {cart?.products?.length > 0 && cart?.products.map((product: any, i: number) => (
@@ -355,13 +367,39 @@ const CartUI = (props: any) => {
               </OSTable>
             )}
 
+            {isMultiCheckout &&
+              cart &&
+              cart?.valid &&
+              orderState?.options?.type === 1 &&
+              cart?.status !== 2 &&
+              validationFields?.fields?.checkout?.driver_tip?.enabled &&
+              driverTipsOptions && driverTipsOptions?.length > 0 &&
+              (
+                <DriverTipsContainer>
+                  <OText size={14} lineHeight={20} color={theme.colors.textNormal}>
+                    {t('DRIVER_TIPS', 'Driver Tips')}
+                  </OText>
+                  <DriverTips
+                    uuid={cart?.uuid}
+                    businessId={cart?.business_id}
+                    driverTipsOptions={driverTipsOptions}
+                    isFixedPrice={parseInt(configs?.driver_tip_type?.value, 10) === 1 || !!parseInt(configs?.driver_tip_use_custom?.value, 10)}
+                    isDriverTipUseCustom={!!parseInt(configs?.driver_tip_use_custom?.value, 10)}
+                    driverTip={parseInt(configs?.driver_tip_type?.value, 10) === 1 || !!parseInt(configs?.driver_tip_use_custom?.value, 10)
+                      ? cart?.driver_tip
+                      : cart?.driver_tip_rate}
+                    useOrderContext
+                  />
+                </DriverTipsContainer>
+              )}
+
             <OSTotal>
               <OSTable style={{ marginTop: 15 }}>
-                <OText size={14} lineHeight={21} weight={'600'}>
+                <OText size={14} lineHeight={21} weight={'bold'} color={theme.colors.textNormal}>
                   {t('TOTAL', 'Total')}
                 </OText>
-                <OText size={14} lineHeight={21} weight={'600'}>
-                  {parsePrice(cart?.total >= 0 ? cart?.total : 0)}
+                <OText size={14} lineHeight={21} weight={'bold'} color={theme.colors.textNormal}>
+                  {parsePrice(cart?.balance >= 0 ? cart?.balance : 0)}
                 </OText>
               </OSTable>
             </OSTotal>
@@ -423,15 +461,15 @@ const CartUI = (props: any) => {
             {cart?.valid_products ? (
               <CheckoutAction>
                 <OButton
-                  text={(cart?.subtotal >= cart?.minimum || !cart?.minimum) && cart?.valid_address ? (
+                  text={(subtotalWithTaxes >= 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}
+                  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: 'white', textAlign: 'center', flex: 1 }}
@@ -446,7 +484,7 @@ const CartUI = (props: any) => {
                 </OText>
               </View>
             )}
-          </>          
+          </>
         )}
       </BusinessItemAccordion>
 

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

@@ -33,3 +33,7 @@ export const Divider = styled.View`
   margin-top: 5px;
   margin-bottom: 10px;
 `
+
+export const DriverTipsContainer = styled.View`
+  padding: 5px 0;
+`

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

@@ -1,17 +1,18 @@
-import React, { useEffect, useState } from 'react';
-import { useLanguage, useOrder } from 'ordering-components/native';
+import React, { useState } from 'react';
+import { View } from 'react-native';
+import { useLanguage } from 'ordering-components/native';
 import { useTheme } from 'styled-components/native';
 import { CCContainer, CCNotCarts, CCList } from './styles';
 
 import { Cart } from '../Cart';
-import { OIcon, OText } from '../shared';
+import { OButton, OText } from '../shared';
 import Spinner from 'react-native-loading-spinner-overlay';
-import { View } from 'react-native';
 
 export const CartContent = (props: any) => {
 	const {
 		carts,
-		isOrderStateCarts
+		isOrderStateCarts,
+		onNavigationRedirect
 	} = props
 
 	const theme = useTheme();
@@ -22,18 +23,15 @@ export const CartContent = (props: any) => {
 		<CCContainer>
 			{isOrderStateCarts && carts?.length > 0 && (
 				<>
-					{/* <OText size={24} lineHeight={36} weight={'600'} style={{ marginBottom: 20 }}>
-						{carts.length > 1 ? t('MY_CARTS', 'My Carts') : t('CART', 'Cart')}
-					</OText> */}
 					{carts.map((cart: any, i: number) => (
 						<CCList key={i} style={{ overflow: 'visible' }}>
 							{cart.products.length > 0 && (
 								<>
 									<Cart
-                    singleBusiness={props.singleBusiness}
-                    isFranchiseApp={props.isFranchiseApp}
+										singleBusiness={props.singleBusiness}
+										isFranchiseApp={props.isFranchiseApp}
 										cart={cart}
-                    cartuuid={cart.uuid}
+										cartuuid={cart.uuid}
 										onNavigationRedirect={props.onNavigationRedirect}
 										isCartsLoading={isCartsLoading}
 										setIsCartsLoading={setIsCartsLoading}
@@ -48,14 +46,22 @@ export const CartContent = (props: any) => {
 			)}
 			{(!carts || carts?.length === 0) && (
 				<CCNotCarts>
-					{/* <OIcon
-            url={props.icon}
-            width={200}
-            height={122}
-          /> */}
 					<OText size={24} style={{ textAlign: 'center' }}>
 						{t('CARTS_NOT_FOUND', 'You don\'t have carts available')}
 					</OText>
+					<OButton
+						text={t('START_SHOPPING', 'Start shopping')}
+						bgColor={theme.colors.primary}
+						borderColor={theme.colors.primary}
+						textStyle={{
+							color: theme.colors.white,
+							fontSize: 14,
+							paddingRight: 0
+						}}
+						style={{ height: 35, marginVertical: 20, borderRadius: 8 }}
+						imgRightSrc={null}
+						onClick={() => onNavigationRedirect('BusinessList')}
+					/>
 				</CCNotCarts>
 			)}
 			<Spinner visible={isCartsLoading} />

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

@@ -24,6 +24,7 @@ import { DriverTips } from '../DriverTips';
 import { NotFoundSource } from '../NotFoundSource';
 import { UserDetails } from '../UserDetails';
 import { PaymentOptionWallet } from '../PaymentOptionWallet';
+import { PlaceSpot } from '../PlaceSpot'
 
 import {
 	ChContainer,
@@ -105,8 +106,7 @@ const CheckoutUI = (props: any) => {
 			padding: 20
 		},
 		pagePadding: {
-			paddingLeft: 40,
-			paddingRight: 40
+			paddingHorizontal: 40
 		},
 		icon: {
 			top: 15,
@@ -118,9 +118,11 @@ const CheckoutUI = (props: any) => {
 			paddingHorizontal: 40,
 			width: '100%'
 		},
-		wrapperNavbar: Platform.OS === 'ios'
-			? { paddingVertical: 0, paddingHorizontal: 40 }
-			: { paddingVertical: 20, paddingHorizontal: 40 }
+		wrapperNavbar: {
+			paddingVertical: 0,
+			paddingHorizontal: 40,
+			marginVertical: 2
+		}
 	})
 
 	const [, { showToast }] = useToast();
@@ -141,9 +143,10 @@ const CheckoutUI = (props: any) => {
 	const [showGateway, setShowGateway] = useState<any>({ closedByUsed: false, open: false });
 	const [webviewPaymethod, setWebviewPaymethod] = useState<any>(null)
 	const [isOpen, setIsOpen] = useState(false)
-  const [requiredFields, setRequiredFields] = useState<any>([])
+	const [requiredFields, setRequiredFields] = useState<any>([])
 
-	const placeSpotTypes = [3, 4]
+	const placeSpotTypes = [3, 4, 5]
+	const placeSpotsEnabled = placeSpotTypes.includes(options?.type)
 	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'
@@ -151,8 +154,14 @@ const CheckoutUI = (props: any) => {
 	const isBusinessChangeEnabled = configs?.cart_change_business_validation?.value === '1'
 
 	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) ||
+	const subtotalWithTaxes = cart?.taxes?.reduce((acc: any, item: any) => {
+		if (item?.type === 1)
+			return acc = acc + item?.summary?.tax
+		return acc = acc
+	}, cart?.subtotal)
+	const isDisabledButtonPlace = loading || !cart?.valid || (!paymethodSelected && cart?.balance > 0) ||
+		placing || errorCash || subtotalWithTaxes < cart?.minimum ||
+		// (placeSpotTypes.includes(options?.type) && !cart?.place) ||
 		(options.type === 1 &&
 			validationFields?.fields?.checkout?.driver_tip?.enabled &&
 			validationFields?.fields?.checkout?.driver_tip?.required &&
@@ -178,15 +187,15 @@ const CheckoutUI = (props: any) => {
 		}
 	}
 
-	const handlePlaceOrder = (confirmPayment) => {
-		if (!userErrors.length && !requiredFields?.length) {
+	const handlePlaceOrder = (confirmPayment: any, forcePlace: boolean = false) => {
+		if (!userErrors.length && !requiredFields?.length || forcePlace) {
 			handlerClickPlaceOrder && handlerClickPlaceOrder(null, null, confirmPayment)
 			return
 		}
 		if (requiredFields?.length) {
-      setIsOpen(true)
-      return
-    }
+			setIsOpen(true)
+			return
+		}
 		let stringError = ''
 		Object.values(userErrors).map((item: any, i: number) => {
 			stringError += (i + 1) === userErrors.length ? `- ${item?.message || item}` : `- ${item?.message || item}\n`
@@ -217,7 +226,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)
 				}
@@ -282,7 +291,6 @@ const CheckoutUI = (props: any) => {
 						onActionLeft={() => navigation?.canGoBack() && navigation.goBack()}
 						showCall={false}
 						btnStyle={{ paddingLeft: 0 }}
-						style={{ marginTop: Platform.OS === 'ios' ? 0 : 30 }}
 						titleWrapStyle={{ paddingHorizontal: 0 }}
 						titleStyle={{ marginRight: 0, marginLeft: 0 }}
 					/>
@@ -327,10 +335,10 @@ const CheckoutUI = (props: any) => {
 								!businessDetails?.error &&
 								(
 									<Placeholder Animation={Fade}>
-										<PlaceholderLine height={20} width={70} />
-										<PlaceholderLine height={10} width={60} />
-										<PlaceholderLine height={10} width={60} />
-										<PlaceholderLine height={10} width={80} style={{ marginBottom: 20 }} />
+										<PlaceholderLine height={20} />
+										<PlaceholderLine height={12} />
+										<PlaceholderLine height={12} />
+										<PlaceholderLine height={12} style={{ marginBottom: 20 }} />
 									</Placeholder>
 								)}
 							{
@@ -339,7 +347,7 @@ const CheckoutUI = (props: any) => {
 								Object.values(businessDetails?.business).length > 0 &&
 								(
 									<>
-										<OText size={16} lineHeight={24} weight={'500'} mBottom={10}>
+										<OText size={16} lineHeight={24} weight={'500'} mBottom={10} color={theme.colors.textNormal}>
 											{t('BUSINESS_DETAILS', 'Business Details')}
 										</OText>
 										<View>
@@ -360,7 +368,7 @@ const CheckoutUI = (props: any) => {
 								)}
 							{businessDetails?.error && businessDetails?.error?.length > 0 && (
 								<View>
-									<OText size={16} lineHeight={24} weight={'500'}>
+									<OText size={16} lineHeight={24} weight={'500'} color={theme.colors.textNormal}>
 										{t('BUSINESS_DETAILS', 'Business Details')}
 									</OText>
 									<NotFoundSource
@@ -376,10 +384,10 @@ const CheckoutUI = (props: any) => {
 						<ChUserDetails>
 							{cartState.loading ? (
 								<Placeholder Animation={Fade}>
-									<PlaceholderLine height={20} width={70} />
-									<PlaceholderLine height={10} width={60} />
-									<PlaceholderLine height={10} width={60} />
-									<PlaceholderLine height={10} width={80} style={{ marginBottom: 20 }} />
+									<PlaceholderLine height={20} />
+									<PlaceholderLine height={12} />
+									<PlaceholderLine height={12} />
+									<PlaceholderLine height={12} style={{ marginBottom: 20 }} />
 								</Placeholder>
 							) : (
 								<UserDetails
@@ -403,13 +411,13 @@ const CheckoutUI = (props: any) => {
 							{cartState.loading || deliveryOptionSelected === undefined ? (
 								<View style={{ height: 110 }}>
 									<Placeholder Animation={Fade}>
-										<PlaceholderLine height={20} width={70} />
-										<PlaceholderLine height={40} width={100} />
+										<PlaceholderLine height={20} />
+										<PlaceholderLine height={40} />
 									</Placeholder>
 								</View>
 							) : (
 								<>
-									<OText size={16}>{t('DELIVERY_OPTIONS', 'Delivery options')}</OText>
+									<OText size={16} color={theme.colors.textNormal} mBottom={10}>{t('DELIVERY_OPTIONS', 'Delivery options')}</OText>
 									<View
 										style={{
 											backgroundColor: theme.colors.inputDisabled,
@@ -595,6 +603,20 @@ const CheckoutUI = (props: any) => {
 					)}
 
 
+					{!cartState.loading && placeSpotsEnabled && (
+						<>
+							<View style={{ height: 8, backgroundColor: theme.colors.backgroundGray100, marginTop: 30, marginHorizontal: -40 }} />
+							<PlaceSpot
+								isCheckout
+								isInputMode
+								cart={cart}
+								spotNumberDefault={cartState?.cart?.spot_number ?? cart?.spot_number}
+								vehicleDefault={cart?.vehicle}
+							/>
+							<View style={{ height: 8, backgroundColor: theme.colors.backgroundGray100, marginHorizontal: -40 }} />
+						</>
+					)}
+
 					{!cartState.loading && cart && (
 						<ChSection>
 							<ChCart>
@@ -610,7 +632,6 @@ const CheckoutUI = (props: any) => {
 												size={16}
 												lineHeight={24}
 												color={theme.colors.textNormal}
-												style={{ fontWeight: '500' }}
 											>
 												{t('MOBILE_FRONT_YOUR_ORDER', 'Your order')}
 											</OText>
@@ -618,7 +639,7 @@ const CheckoutUI = (props: any) => {
 												onPress={() => onNavigationRedirect('Business', { store: cart?.business?.slug })}
 											>
 												<OText
-													size={10}
+													size={12}
 													lineHeight={15}
 													color={theme.colors.primary}
 													style={{ textDecorationLine: 'underline' }}
@@ -635,7 +656,7 @@ const CheckoutUI = (props: any) => {
 												<OText
 													size={12}
 													lineHeight={18}
-													color={theme.colors.textSecondary}
+													color={theme.colors.primary}
 													style={{ textDecorationLine: 'underline' }}
 												>
 													{t('CHANGE_STORE', 'Change store')}
@@ -646,6 +667,7 @@ const CheckoutUI = (props: any) => {
 											cart={cart}
 											isCartPending={cart?.status === 2}
 											onNavigationRedirect={onNavigationRedirect}
+											placeSpotTypes={placeSpotTypes}
 										/>
 									</>
 								)}
@@ -682,14 +704,6 @@ const CheckoutUI = (props: any) => {
 										{t('WARNING_INVALID_PRODUCTS_CHECKOUT', 'To continue with your checkout, please remove from your cart the products that are not available.')}
 									</OText>
 								)}
-								{placeSpotTypes.includes(options?.type) && !cart?.place && (
-									<OText
-										color={theme.colors.error}
-										size={12}
-									>
-										{t('WARNING_PLACE_SPOT', 'Please, select your spot to place order.')}
-									</OText>
-								)}
 								{options.type === 1 &&
 									validationFields?.fields?.checkout?.driver_tip?.enabled &&
 									validationFields?.fields?.checkout?.driver_tip?.required &&
@@ -733,7 +747,10 @@ const CheckoutUI = (props: any) => {
 								togglePhoneUpdate={togglePhoneUpdate}
 								requiredFields={requiredFields}
 								hideUpdateButton
-								onClose={() => setIsOpen(false)}
+								onClose={() => {
+									setIsOpen(false)
+									handlePlaceOrder(null, true)
+								}}
 							/>
 						</View>
 					</OModal>
@@ -741,10 +758,10 @@ const CheckoutUI = (props: any) => {
 			</Container>
 			{!cartState.loading && cart && cart?.status !== 2 && (
 				<FloatingButton
-					handleClick={() => handlePlaceOrder()}
+					handleClick={() => handlePlaceOrder(null)}
 					isSecondaryBtn={isDisabledButtonPlace}
 					disabled={isDisabledButtonPlace}
-					btnText={cart?.subtotal >= cart?.minimum
+					btnText={subtotalWithTaxes >= cart?.minimum
 						? (
 							placing
 								? t('PLACING', 'Placing')
@@ -755,7 +772,7 @@ const CheckoutUI = (props: any) => {
 						: (`${t('MINIMUN_SUBTOTAL_ORDER', 'Minimum subtotal order:')} ${parsePrice(cart?.minimum)}`)
 					}
 					btnRightValueShow
-					btnRightValue={parsePrice(cart?.total)}
+					btnRightValue={parsePrice(cart?.balance)}
 					iosBottom={30}
 				/>
 			)}
@@ -771,19 +788,6 @@ const CheckoutUI = (props: any) => {
 					setShowGateway={setShowGateway}
 				/>
 			)}
-			{webviewPaymethod?.gateway === 'square' && showGateway.open && (
-				<PaymentOptionsWebView
-					onNavigationRedirect={onNavigationRedirect}
-					uri={`https://test-square-f50f7.web.app`}
-					user={user}
-					token={token}
-					cart={cart}
-					currency={currency}
-					webviewPaymethod={webviewPaymethod}
-					setShowGateway={setShowGateway}
-					locationId={'L1NGAY5M6KJRX'}
-				/>
-			)}
 		</>
 	)
 }
@@ -809,16 +813,23 @@ export const Checkout = (props: any) => {
 
 	const getOrder = async (cartId: any) => {
 		try {
-			setCartState({ ...cartState, loading: true })
-			const url = `${ordering.root}/carts/${cartId}`
-			const response = await fetch(url, {
-				method: 'GET',
-				headers: {
-					'Content-Type': 'application/json',
-					Authorization: `Bearer ${token}`
-				}
-			})
-			const { result } = await response.json();
+			let result: any = {}
+			const cart = orderState?.carts.find((cart: any) => cart.uuid === cartId)
+			if (cart) {
+				result = { ...cart }
+			} else {
+				setCartState({ ...cartState, loading: true })
+				const url = `${ordering.root}/carts/${cartId}`
+				const response = await fetch(url, {
+					method: 'GET',
+					headers: {
+						'Content-Type': 'application/json',
+						Authorization: `Bearer ${token}`
+					}
+				})
+				const content = await response.json();
+				result = content.result
+			}
 
 			let publicKey = null
 			try {

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

@@ -76,7 +76,6 @@ export const ChCart = styled(ChPaymethods)``
 
 export const WalletPaymentOptionContainer = styled(ChPaymethods)`
   padding-bottom: 0;
-  margin-left: -20px;
 `
 
 export const ChPlaceOrderBtn = styled.View`