ordering-ui-react-native 0.22.49 → 0.22.50-release

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

@@ -1,3 +1,6 @@
+
+
+
 import * as React from 'react'
 import styled, { useTheme } from 'styled-components/native'
 import { OButton, OIcon, OText } from '../shared'
@@ -44,7 +47,6 @@ interface Props {
 	isVertical?: boolean,
 	noMargin?: any
 	hideArrowLeft?: boolean
-	buttonProps?: any
 }
 
 const NavBar = (props: Props) => {
@@ -65,7 +67,7 @@ const NavBar = (props: Props) => {
 		<Wrapper style={{ paddingTop: props.paddingTop, ...{ flexDirection: props.isVertical ? 'column' : 'row', alignItems: props.isVertical ? 'flex-start' : 'center' }, ...props.style }}>
 			{!props.hideArrowLeft && (
 				<OButton
-					{...props.buttonProps}
+					useArrow
 					iconProps={{
 						name: 'arrowleft',
 						size: 26
@@ -116,8 +118,6 @@ const NavBar = (props: Props) => {
 			{props.showCall
 				? (<OButton
 					isCircle={true}
-					bgColor={theme.colors.primary}
-					borderColor={theme.colors.primary}
 					imgRightSrc={null}
 					imgLeftStyle={{ tintColor: 'white', width: 30, height: 30 }}
 					imgLeftSrc={theme.images.general.support}
@@ -133,8 +133,9 @@ NavBar.defaultProps = {
 	textAlign: 'center'
 };
 
-const areEqual = (prevProps: { route?: any; }, nextProps: { route?: any; }) => {
-	return prevProps.route === nextProps.route
+const areEqual = (prevProps: { route?: any, title?: string }, nextProps: { route?: any, title?: string }) => {
+	return prevProps.route === nextProps.route && 
+	JSON.stringify(prevProps.title) === JSON.stringify(nextProps.title)
 	return true
 }
 

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

@@ -45,15 +45,10 @@ export const NetworkError = (props: NoNetworkParams) => {
         />
         <OButton
           text={t('REFRESH', 'Refresh')}
-          bgColor={theme.colors.primary}
-          borderColor={theme.colors.primary}
           style={{
             borderRadius: 8,
             marginTop: 45
           }}
-          textStyle={{
-            color: theme.colors.white
-          }}
           onClick={() => RNRestart.Restart()}
         />
       </ImageContainer>

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

@@ -42,11 +42,8 @@ export const NotFoundSource = (props: NotFoundSourceParams) => {
 				<View style={{ marginTop: 10, width: '100%' }}>
 					<OButton
 						style={{ width: '100%', height: 50, ...btnStyle }}
-						bgColor={theme.colors.primary}
-						borderColor={theme.colors.primary}
 						onClick={() => onClickButton()}
 						text={btnTitle}
-						textStyle={{ color: theme.colors.white }}
 					/>
 				</View>
 			)}

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

@@ -75,11 +75,6 @@ const NotificationsUI = (props: any) => {
 				showCall={false}
 				style={{ paddingVertical: 0 }}
 				btnStyle={{ paddingLeft: 0 }}
-        buttonProps={{
-          bgColor: theme.colors.white,
-          borderColor: theme.colors.white,
-          textStyle: { color: theme.colors.btnFont }
-        }}
 			/>
 			{showCustomerPromotions && showNotifications && (
 				<>

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

@@ -10,13 +10,14 @@ export const OrderEta = (props: any) => {
 
   const [{ parseDate }] = useUtils()
   const [estimatedDeliveryTime, setEstimatedDeliveryTime] = useState(null)
-
+  const deliveryTypes = [1, 7]
+  
   const getEstimatedDeliveryTime = () => {
     let estimatedUtcTime = null
     let totalEta = 0
     if (order?.delivered_in) totalEta += order?.delivered_in
     if (order?.prepared_in) totalEta += order?.prepared_in
-    if (order?.delivery_type === 1 && order?.eta_drive_time) {
+    if (deliveryTypes?.includes?.(order?.delivery_type) && order?.eta_drive_time) {
       totalEta += order?.eta_drive_time
     }
 
@@ -57,7 +58,7 @@ export const OrderEta = (props: any) => {
     }
     estimatedUtcTime = moment.utc(_delivery).add(totalEta, 'minutes')
     const _estimatedTime = outputFormat ? moment(estimatedUtcTime).local().format(outputFormat) : parseDate(estimatedUtcTime, { utc: false })
-    setEstimatedDeliveryTime(_estimatedTime)
+    setEstimatedDeliveryTime(order?.status === 13 ? parseDate(_delivery, { utc: !!order?.delivery_datetime_utc, outputFormat: outputFormat }) : _estimatedTime)
   }
 
   useEffect(() => {

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

@@ -1,7 +1,7 @@
 import React from 'react'
 import { useTheme } from 'styled-components/native'
 import { ScrollView, StyleSheet, View } from 'react-native'
-import { useLanguage, useUtils } from 'ordering-components/native'
+import { useLanguage, useUtils, useConfig } from 'ordering-components/native'
 import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityIcons'
 import { OText, OButton } from '../shared'
 import { formatSeconds } from '../../utils'
@@ -17,8 +17,12 @@ export const OrderHistory = (props: any) => {
 
   const [, t] = useLanguage()
   const [{ parseDate }] = useUtils()
+  const [{ configs }] = useConfig();
   const theme = useTheme()
 
+  const excludedMessages = ['manual_driver_assignment_comment', 'driver_group_id', 'manual_driver_assignment_author_id']
+  const changeIdToExternalId = configs?.change_order_id?.value === '1'
+
   const styles = StyleSheet.create({
     historyItem: {
       display: 'flex',
@@ -62,7 +66,10 @@ export const OrderHistory = (props: any) => {
     20: 'ORDER_CUSTOMER_ALMOST_ARRIVED_BUSINESS',
     21: 'ORDER_CUSTOMER_ARRIVED_BUSINESS',
     22: 'ORDER_LOOKING_FOR_DRIVER',
-    23: 'ORDER_DRIVER_ON_WAY'
+    23: 'ORDER_DRIVER_ON_WAY',
+    24: 'ORDER_DRIVER_WAITING_FOR_ORDER',
+    25: 'ORDER_ACCEPTED_BY_DRIVER_COMPANY',
+    26: 'ORDER_DRIVER_ARRIVED_CUSTOMER'
   }
 
   const getLogisticTagStatus = (status: any) => {
@@ -90,7 +97,7 @@ export const OrderHistory = (props: any) => {
   return (
     <ScrollView contentContainerStyle={styles.container}>
       <OText size={20} style={{ alignSelf: 'center', textAlign: 'center' }} mBottom={10}>
-        {t('DETAILS_OF_ORDER', 'Details of Order_NUMBER_').replace('_NUMBER_', ` # ${order?.id}`)}
+        {t('DETAILS_OF_ORDER', 'Details of Order_NUMBER_').replace('_NUMBER_', (changeIdToExternalId && order?.external_id) || `# ${order?.id}`)}
       </OText>
       {!messages?.loading && order && (
         <View style={styles.historyItem}>
@@ -118,7 +125,7 @@ export const OrderHistory = (props: any) => {
           </View>
         </View>
       )}
-      {messages && messages?.messages.map((message: any, i: number) => message.type === 1 && (
+      {messages && messages?.messages.map((message: any, i: number) => (message.type === 1 && !excludedMessages.includes(message?.change?.attribute)) &&  (
         <View
           style={styles.historyItem}
           key={i}
@@ -145,10 +152,10 @@ export const OrderHistory = (props: any) => {
                     </>
                   )
                     : message.change?.attribute === 'prepared_in' ? (
-                    <>
-                      {t('TIME_ADDED_BY_BUSINESS', 'Time added by business')}{'\n'}
-                      {formatSeconds(parseInt(message.change.new, 10))}
-                    </>
+                      <>
+                        {t('TIME_ADDED_BY_BUSINESS', 'Time added by business')}{'\n'}
+                        {formatSeconds(parseInt(message.change.new, 10))}
+                      </>
                     ) : t(ORDER_STATUS[parseInt(message.change.new, 10)])
                 }
               </OText>
@@ -170,11 +177,9 @@ export const OrderHistory = (props: any) => {
       ))}
       <OButton
         text={enableReview ? t('REVIEW_ORDER', 'Review order') : t('CONTINUE', 'Continue')}
-        textStyle={{ fontSize: 14, color: theme.colors.white }}
+        textStyle={{ fontSize: 14 }}
         imgRightSrc={theme.images.general.arrow_right}
         imgRightStyle={{ tintColor: theme.colors.white, right: 5, margin: 5 }}
-        borderColor='transparent'
-        bgColor={theme.colors.primary}
         style={{ borderRadius: 7.6, borderWidth: 1, height: 44, shadowOpacity: 0, marginBottom: 30, marginTop: 20 }}
         onClick={() => handleReview()}
       />

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

@@ -129,11 +129,13 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
   const [showTitle, setShowTitle] = useState(false)
 
   const { order, businessData } = props.order;
-  const mapValidStatuses = [9, 19, 23]
+  const mapValidStatuses = [9, 19, 23, 26]
   const placeSpotTypes = [3, 4, 5]
   const directionTypes = [2, 3, 4, 5]
-  const activeStatus = [0, 3, 4, 7, 8, 9, 13, 14, 18, 19, 20, 21, 22, 23]
+  const activeStatus = [0, 3, 4, 7, 8, 9, 13, 14, 18, 19, 20, 21, 22, 23, 24, 25, 26]
   const reorderStatus = [1, 2, 5, 6, 10, 11, 12]
+  const cateringTypes = [7, 8]
+  const deliveryTypes = [1, 7]
   const [isPickup, setIsPickup] = useState(order?.delivery_type === 2)
   const enabledPoweredByOrdering = configs?.powered_by_ordering_module?.value
   const isGiftCardOrder = !order?.business_id
@@ -148,6 +150,8 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
   const hideDriverMessages = theme?.confirmation?.components?.driver?.components?.messages?.hidden
   const hideCustomerPhone = theme?.confirmation?.components?.customer?.components?.phone?.hidden
   const hideCustomerAddress = theme?.confirmation?.components?.customer?.components?.address?.hidden
+  const changeIdToExternalId = configs?.change_order_id?.value === '1'
+
   const progressBarObjt = isPickup ? getOrderStatuPickUp : getOrderStatus
   const walletName: any = {
     cash: {
@@ -185,18 +189,18 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
     navigation.navigate('BottomTab');
   };
 
-  const getIncludedTaxes = () => {
+  const getIncludedTaxes = (isDeliveryFee?: boolean) => {
     if (order?.taxes?.length === 0 || !order?.taxes) {
       return order.tax_type === 1 ? order?.summary?.tax ?? 0 : 0
     } else {
       return order?.taxes.reduce((taxIncluded: number, tax: any) => {
-        return taxIncluded + (tax.type === 1 ? tax.summary?.tax : 0)
+        return taxIncluded + (((!isDeliveryFee && tax.type === 1 && tax.target === 'product') || (isDeliveryFee && tax.type === 1 && tax.target === 'delivery_fee')) ? tax.summary?.tax : 0)
       }, 0)
     }
   }
 
   const getIncludedTaxesDiscounts = () => {
-    return order?.taxes?.filter((tax: any) => tax?.type === 1)?.reduce((carry: number, tax: any) => carry + (tax?.summary?.tax_after_discount ?? tax?.summary?.tax), 0)
+    return order?.taxes?.filter((tax: any) => tax?.type === 1 && tax?.target === 'product')?.reduce((carry: number, tax: any) => carry + (tax?.summary?.tax_after_discount ?? tax?.summary?.tax), 0)
   }
 
   const handleClickOrderReview = (order: any) => {
@@ -361,7 +365,6 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
     }
   }, [props?.order?.error, props?.order?.loading])
 
-
   useEffect(() => {
     if (!order?.delivery_type) return
     setIsPickup(order?.delivery_type === 2)
@@ -386,7 +389,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
                 numberOfLines={2}
                 ellipsizeMode='tail'
               >
-                {`${t('ORDER', 'Order')} #${order?.id}`}
+                {`${t('ORDER', 'Order')} ${(changeIdToExternalId && order?.external_id) || `#${order?.id}`}`}
               </OText>
             )}
           </>
@@ -460,18 +463,21 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
             <Header>
               <NavBar
                 hideArrowLeft
-                title={`${t('ORDER', 'Order')} #${order?.id}`}
-                titleAlign={'center'}
+                title={`${t('ORDER', 'Order')} ${(changeIdToExternalId && order?.external_id) || `#${order?.id}`}`}
+                titleAlign={'left'}
                 showCall={false}
                 btnStyle={{ paddingLeft: 0 }}
                 style={{ marginTop: Platform.OS === 'ios' ? 0 : 20 }}
                 titleWrapStyle={{ paddingHorizontal: 0 }}
-                titleStyle={{ marginRight: 0, marginLeft: 0 }}
+                titleStyle={{ marginRight: 0, marginLeft: 0, paddingHorizontal: 0 }}
                 subTitle={!hideDeliveryDate && <OText size={12} lineHeight={18} color={theme.colors.textNormal}>
                   {activeStatus.includes(order?.status) ? (
-                    <OrderEta order={order} />
+                    <>
+                      {cateringTypes.includes(order?.delivery_type) ? `${t('CREATED_AT', 'Created at')}: ${parseDate(order?.created_at)}\n` : ''}
+                      {cateringTypes.includes(order?.delivery_type) ? `${t('PLACED_TO', 'Placed to')}:` : ''} <OrderEta order={order} outputFormat={`YYYY-MM-DD ${configs?.general_hour_format?.value}`}  />
+                    </>
                   ) : (
-                    parseDate(order?.reporting_data?.at[`status:${order.status}`])
+                    parseDate(order?.reporting_data?.at[`status:${order.status}`], { outputFormat: `YYYY-MM-DD ${configs?.general_hour_format?.value}` })
                   )}
                 </OText>}
               />
@@ -643,7 +649,6 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
                     <OButton
                       text={t('GET_DIRECTIONS', 'Get Directions')}
                       imgRightSrc=''
-                      textStyle={{ color: theme.colors.white }}
                       style={{
                         alignSelf: 'center',
                         borderRadius: 10,
@@ -708,18 +713,18 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
                         {order?.customer?.address}
                       </OText>
                     )}
-                    {(!!order?.customer?.cellphone && !hideCustomerPhone) && (
+                    {(!!(order?.customer?.cellphone || order?.customer?.guest_cellphone) && !hideCustomerPhone) && (
                       <OText
                         size={12}
                         lineHeight={18}
                         color={theme.colors.textNormal}
                         mBottom={2}>
-                        {`${!!order?.customer?.country_phone_code ? '+' + order?.customer?.country_phone_code : ''} ${order?.customer?.cellphone}`}
+                        {`${!!order?.customer?.country_phone_code ? '+' + order?.customer?.country_phone_code : ''} ${order?.customer?.guest_id ? order?.customer?.guest_cellphone : order?.customer?.cellphone}`}
                       </OText>
                     )}
                   </InfoBlock>
                 </Customer>
-                {!isGiftCardOrder && order?.delivery_option !== undefined && order?.delivery_type === 1 && (
+                {!isGiftCardOrder && order?.delivery_option !== undefined && deliveryTypes?.includes?.(order?.delivery_type) && (
                   <View style={{ marginTop: 15 }}>
                     <OText size={16} style={{ textAlign: 'left' }} color={theme.colors.textNormal}>
                       {t('DELIVERY_PREFERENCE', 'Delivery Preference')}
@@ -750,6 +755,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
                           }
                           locations={parsedLocations}
                           readOnly
+                          manualZoom
                         />
                       </Map>
                     )}
@@ -832,9 +838,8 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
                   <OButton
                     text={t('YOUR_ORDERS', 'Your Orders')}
                     textStyle={{ fontSize: 14, color: theme.colors.primary }}
+                    bgColor={theme.colors.white}
                     imgRightSrc={null}
-                    borderColor={theme.colors.primary}
-                    bgColor={theme.colors.clear}
                     style={{ borderRadius: 7.6, borderWidth: 1, height: 44, shadowOpacity: 0 }}
                     parentStyle={{ marginTop: 29, marginEnd: 15 }}
                     onClick={() => navigation.navigate('BottomTab', { screen: 'MyOrders' })}
@@ -934,7 +939,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
                   )
                 }
                 {
-                  order?.taxes?.length > 0 && order?.taxes?.filter((tax: any) => tax?.type === 2 && tax?.rate !== 0).map((tax: any) => (
+                  order?.taxes?.length > 0 && order?.taxes?.filter((tax: any) => tax?.type === 2 && tax?.rate !== 0 && tax?.target === 'product').map((tax: any) => (
                     <Table key={tax.id}>
                       <OSRow>
                         <OText size={12} lineHeight={18} weight={'400'} color={theme.colors.textNormal} numberOfLines={1}>
@@ -983,12 +988,30 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
                     </Table>
                   ))
                 }
-                {typeof order?.summary?.delivery_price === 'number' && (
+                {typeof order?.summary?.delivery_price === 'number' && !isPickup && (
                   <Table>
                     <OText size={12} lineHeight={18} weight={'400'} color={theme.colors.textNormal}>{t('DELIVERY_FEE', 'Delivery Fee')}</OText>
-                    <OText size={12} lineHeight={18} weight={'400'} color={theme.colors.textNormal}>{parsePrice(order?.summary?.delivery_price)}</OText>
+                    <OText size={12} lineHeight={18} weight={'400'} color={theme.colors.textNormal}>{parsePrice(order?.summary?.delivery_price + getIncludedTaxes(true))}</OText>
                   </Table>
                 )}
+                {
+                  order?.taxes?.length > 0 && order?.taxes?.filter((tax: any) => tax?.type === 2 && tax?.rate !== 0 && tax?.target === 'delivery_fee').map((tax: any, i: number) => (
+                    <Table key={`${tax?.description}_${i}`}>
+                      <OSRow>
+                        <OText size={12} lineHeight={18} weight={'400'} color={theme.colors.textNormal} numberOfLines={1}>
+                          {t(tax?.name?.toUpperCase()?.replace(/ /g, '_'), tax?.name) || t('INHERIT_FROM_BUSINESS', 'Inherit from business')}
+                          {`(${verifyDecimals(tax?.rate, parseNumber)}%)`}
+                        </OText>
+                        {setOpenTaxModal && (
+                          <TouchableOpacity onClick={() => setOpenTaxModal({ open: true, data: tax, type: 'tax' })}>
+                            <AntIcon name='infocirlceo' size={16} color={theme.colors.primary} />
+                          </TouchableOpacity>
+                        )}
+                      </OSRow>
+                      <OText size={12} lineHeight={18} weight={'400'} color={theme.colors.textNormal}>{parsePrice(tax?.summary?.tax_after_discount ?? tax?.summary?.tax ?? 0)}</OText>
+                    </Table>
+                  ))
+                }
                 {
                   order?.offers?.length > 0 && order?.offers?.filter((offer: any) => offer?.target === 2)?.map((offer: any) => (
                     <Table key={offer.id}>

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

@@ -5,7 +5,6 @@ export const OrderDetailsContainer = styled.ScrollView`
 `
 
 export const NavBack = styled.TouchableOpacity`
-
 `
 
 

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

@@ -41,7 +41,8 @@ const OrderProgressUI = (props: any) => {
   const [lastOrder, setLastOrder] = useState<any>(null)
   const imageFails = theme.images.general.emptyActiveOrders
   const [initialLoaded, setInitialLoaded] = useState(false)
-  const statusToShow = [0, 3, 4, 7, 8, 9, 13, 14, 18, 19, 20, 21, 22, 23]
+  const statusToShow = [0, 3, 4, 7, 8, 9, 13, 14, 18, 19, 20, 21, 22, 23, 24, 25, 26]
+  const deliveryTypes = [1, 7]
 
   const styles = StyleSheet.create({
     main: {
@@ -172,7 +173,7 @@ const OrderProgressUI = (props: any) => {
               <ProgressTextWrapper>
                 <OText size={12} style={{ width: '50%' }}>{progressBarObjt(lastOrder.status)?.value}</OText>
                 <TimeWrapper>
-                  <OText size={11}>{lastOrder?.delivery_type === 1 ? t('ESTIMATED_DELIVERY', 'Estimated delivery') : t('ESTIMATED_TIME', 'Estimated time')}</OText>
+                  <OText size={11}>{deliveryTypes?.includes?.(lastOrder?.delivery_type) ? t('ESTIMATED_DELIVERY', 'Estimated delivery') : t('ESTIMATED_TIME', 'Estimated time')}</OText>
                   <OText size={11}>
                     {lastOrder?.delivery_datetime_utc
                       ? parseTime(lastOrder?.delivery_datetime_utc, { outputFormat: configs?.general_hour_format?.value || 'HH:mm' })
@@ -205,7 +206,7 @@ export const OrderProgress = (props: any) => {
   const orderProgressProps = {
     ...props,
     UIComponent: OrderProgressUI,
-    orderStatus: [0, 3, 4, 7, 8, 9, 13, 14, 18, 19, 20, 21, 22, 23],
+    orderStatus: [0, 3, 4, 7, 8, 9, 13, 14, 18, 19, 20, 21, 22, 23, 24, 25, 26],
     useDefualtSessionManager: true,
     paginationSettings: {
       initialPage: 1,

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

@@ -47,7 +47,9 @@ const OrderSummaryUI = (props: any) => {
     cateringTypes,
     hideDeliveryFee,
     loyaltyRewardRate,
-    maxDate
+    maxDate,
+    hideCommentsByValidationCheckout,
+    hideCouponByValidationCheckout
   } = props;
 
   const theme = useTheme()
@@ -55,11 +57,11 @@ const OrderSummaryUI = (props: any) => {
   const [{ configs }] = useConfig();
   const [orderState] = useOrder();
   const [{ parsePrice, parseNumber }] = useUtils();
-  const [validationFields] = useValidationFields();
   const commentRef = useRef()
   const [openTaxModal, setOpenTaxModal] = useState<any>({ open: false, data: null, type: '' })
-  const isCouponEnabled = validationFields?.fields?.checkout?.coupon?.enabled;
-  const hideCartComments = !validationFields?.fields?.checkout?.comments?.enabled
+  const [comment] = useState<any>(orderState?.carts?.[`businessId:${props.cart.business_id}`]?.comment ?? '')
+  const hideCartDiscount = hideCouponByValidationCheckout
+  const hideCartComments = hideCommentsByValidationCheckout
 
   const cart = orderState?.carts?.[`businessId:${props.cart.business_id}`]
 
@@ -72,12 +74,14 @@ const OrderSummaryUI = (props: any) => {
     }
   }
 
-  const getIncludedTaxes = () => {
+  const getIncludedTaxes = (isDeliveryFee?: boolean) => {
     if (cart?.taxes === null || !cart?.taxes) {
       return cart?.business?.tax_type === 1 ? cart?.tax : 0
     } else {
       return cart?.taxes.reduce((taxIncluded: number, tax: any) => {
-        return taxIncluded + (tax.type === 1 ? tax.summary?.tax : 0)
+        return taxIncluded +
+          (((!isDeliveryFee && tax.type === 1 && tax.target === 'product') ||
+            (isDeliveryFee && tax.type === 1 && tax.target === 'delivery_fee')) ? tax.summary?.tax : 0)
       }, 0)
     }
   }
@@ -102,7 +106,7 @@ const OrderSummaryUI = (props: any) => {
   }
 
   const getIncludedTaxesDiscounts = () => {
-    return cart?.taxes?.filter((tax: any) => tax?.type === 1)?.reduce((carry: number, tax: any) => carry + (tax?.summary?.tax_after_discount ?? tax?.summary?.tax), 0)
+    return cart?.taxes?.filter((tax: any) => (tax?.type === 1 && tax?.target === 'product'))?.reduce((carry: number, tax: any) => carry + (tax?.summary?.tax_after_discount ?? tax?.summary?.tax), 0)
   }
 
   const OfferAlert = ({ offerId }: any) => {
@@ -194,7 +198,7 @@ const OrderSummaryUI = (props: any) => {
                 </OSTable>
               )}
               {
-                cart.taxes?.length > 0 && cart.taxes.filter((tax: any) => tax.type === 2 && tax?.rate !== 0).map((tax: any) => (
+                cart.taxes?.length > 0 && cart.taxes.filter((tax: any) => tax.type === 2 && tax?.rate !== 0 && tax?.target === 'product').map((tax: any, i: number) => (
                   <OSTable key={tax.id}>
                     <OSRow>
                       <OText size={12} numberOfLines={1} >
@@ -249,9 +253,25 @@ const OrderSummaryUI = (props: any) => {
               {orderState?.options?.type === 1 && !hideDeliveryFee && (
                 <OSTable>
                   <OText size={12}>{t('DELIVERY_FEE', 'Delivery Fee')}</OText>
-                  <OText size={12}>{parsePrice(cart?.delivery_price_with_discount)}</OText>
+                  <OText size={12}>{parsePrice(cart?.delivery_price_with_discount + getIncludedTaxes(true))}</OText>
                 </OSTable>
               )}
+              {
+                cart?.taxes?.length > 0 && cart?.taxes?.filter((tax: any) => tax?.type === 2 && tax?.rate !== 0 && tax?.target === 'delivery_fee').map((tax: any, i: number) => (
+                  <OSTable key={`${tax.description}_${i}`}>
+                    <OSRow>
+                      <OText size={12} numberOfLines={1}>
+                        {tax.name || t('INHERIT_FROM_BUSINESS', 'Inherit from business')}
+                        {`(${verifyDecimals(tax?.rate, parseNumber)}%)`}
+                      </OText>
+                      <TouchableOpacity onPress={() => setOpenTaxModal({ open: true, data: tax, type: 'tax' })}>
+                        <AntIcon name='infocirlceo' size={16} color={theme.colors.primary} />
+                      </TouchableOpacity>
+                    </OSRow>
+                    <OText size={12}>{parsePrice(tax?.summary?.tax_after_discount ?? tax?.summary?.tax ?? 0)}</OText>
+                  </OSTable>
+                ))
+              }
               {
                 cart?.offers?.length > 0 && cart?.offers?.filter((offer: any) => offer?.target === 2)?.map((offer: any) => (
                   <OSTable key={offer.id}>
@@ -295,7 +315,7 @@ const OrderSummaryUI = (props: any) => {
                   <OText size={12}>-{parsePrice(event.amount, { isTruncable: true })}</OText>
                 </OSTable>
               ))}
-              {isCouponEnabled && !isCartPending && cart?.business_id && (
+              {!hideCartDiscount && !isCartPending && cart?.business_id && (
                 <View>
                   <View style={{ paddingVertical: 5 }}>
                     <CouponControl
@@ -330,7 +350,7 @@ const OrderSummaryUI = (props: any) => {
                     <OText size={12}>{t('COMMENTS', 'Comments')}</OText>
                     <View style={{ flex: 1, width: '100%' }}>
                       <OInput
-                        value={cart?.comment}
+                        value={comment || cart?.comment}
                         placeholder={t('SPECIAL_COMMENTS', 'Special Comments')}
                         onChange={(value: string) => handleChangeComment(value)}
                         style={{
@@ -397,6 +417,7 @@ const OrderSummaryUI = (props: any) => {
 export const OrderSummary = (props: any) => {
   const orderSummaryProps = {
     ...props,
+    disablePreviousComment: true,
     UIComponent: OrderSummaryUI
   }
 

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

@@ -31,14 +31,14 @@ const OrderTypeSelectorUI = (props: OrderTypeSelectParams) => {
 	const [orderState] = useOrder();
 	const [, t] = useLanguage();
 	const _orderTypes = orderTypes.filter((type: any) => configTypes?.includes(type.value));
-	const orderTypeTitle = (type : string) => theme?.header?.components?.order_types?.components?.[type]?.components?.title
-	const orderTypeDescription = (type : string) => theme?.header?.components?.order_types?.components?.[type]?.components?.description
-	const orderTypeCallAction = (type : string) => theme?.header?.components?.order_types?.components?.[type]?.components?.call_to_action
+	const orderTypeTitle = (type: string) => theme?.header?.components?.order_types?.components?.[type]?.components?.title
+	const orderTypeDescription = (type: string) => theme?.header?.components?.order_types?.components?.[type]?.components?.description
+	const orderTypeCallAction = (type: string) => theme?.header?.components?.order_types?.components?.[type]?.components?.call_to_action
 	const items = _orderTypes.map((type) => {
 		return {
 			value: type.value,
-			label: orderTypeTitle(type.value) || t(type.content, type.content),
-			description: orderTypeDescription(type.value) || t(type.description, 'Lorem ipsum dolor sit amet, consectetur.')
+			label: t(type.content, type.content),
+			description: t(type.description, 'Lorem ipsum dolor sit amet, consectetur.')
 		}
 	})
 
@@ -102,12 +102,8 @@ const OrderTypeSelectorUI = (props: OrderTypeSelectParams) => {
 						style={{ paddingBottom: 0 }}
 						title={t('HOW_WILL_YOU_DELIVERY_TYPE', 'How will your order type?')}
 						titleAlign={'center'}
+						titleStyle={{ fontSize: 14 }}
 						noMargin
-            buttonProps={{
-              bgColor: theme.colors.white,
-              borderColor: theme.colors.white,
-              textStyle: { color: theme.colors.btnFont }
-            }}
 					/>
 					{
 						items.length > 0 && (
@@ -120,7 +116,7 @@ const OrderTypeSelectorUI = (props: OrderTypeSelectParams) => {
 													<OText size={12} lineHeight={18} color={theme.colors.white} weight={Platform.OS === 'android' ? 'bold' : '600'}>{item?.label}</OText>
 													<OText size={10} lineHeight={15} color={theme.colors.white}>{item?.description}</OText>
 													<View style={{ flexDirection: 'row', alignItems: 'center' }}>
-														<OText size={10} lineHeight={15} color={theme.colors.white}>{orderTypeCallAction(item?.value) || t('START_MY_ORDER', 'Start my order')}</OText>
+														<OText size={10} lineHeight={15} color={theme.colors.white}>{t('START_MY_ORDER', 'Start my order')}</OText>
 														<AntDesignIcon name='arrowleft' size={26} color={theme.colors.white} style={{ transform: [{ rotate: '180deg' }], marginStart: 4 }} />
 													</View>
 												</MaskCont>

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

@@ -159,10 +159,7 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
 
 	useEffect(() => {
 		if (reorderState?.error) {
-			const errorMessage = (Array.isArray(reorderState?.result) || typeof reorderState?.result === 'string')
-				? reorderState?.result
-				: t('CANT_REORDER_FOR_THIS_BUSINESS', 'Can’t reorder for this store, please create order manually.')
-			showToast(ToastType.Error, errorMessage)
+			showToast(ToastType.Error, reorderState?.result)
 		}
 	}, [reorderState])
 
@@ -355,9 +352,9 @@ export const OrdersOption = (props: OrdersOptionParams) => {
 		UIComponent: OrdersOptionUI,
 		noGiftCardOrders: true,
 		orderStatus: getAllOrders
-			? [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23]
+			? [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26]
 			: props.preOrders ? [13] : props.activeOrders
-				? [0, 3, 4, 7, 8, 9, 14, 18, 19, 20, 21, 22, 23]
+				? [0, 3, 4, 7, 8, 9, 14, 18, 19, 20, 21, 22, 23, 24, 25, 26]
 				: [1, 2, 5, 6, 10, 11, 12, 15, 16, 17],
 		useDefualtSessionManager: true,
 		paginationSettings: {

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

@@ -131,7 +131,6 @@ const PaymentOptionStripeUI = (props: any) => {
 						bgColor={theme.colors.backgroundGray}
 						borderColor={theme.colors.backgroundGray}
 						style={styles.btnAddStyle}
-						textStyle={{ color: 'white' }}
 						imgRightSrc={null}
 						onClick={() => setAddCardOpen(true)}
 					/>
@@ -141,7 +140,6 @@ const PaymentOptionStripeUI = (props: any) => {
 								text={t('CANCEL', 'Cancel')}
 								bgColor={theme.colors.backgroundGray}
 								borderColor={theme.colors.backgroundGray}
-								textStyle={{ color: 'white' }}
 								style={styles.btnAction}
 								imgRightSrc={null}
 								onClick={() => onCancel()}
@@ -150,9 +148,6 @@ const PaymentOptionStripeUI = (props: any) => {
 						<View style={{ width: '48%' }}>
 							<OButton
 								text={t('ACCEPT', 'Accept')}
-								bgColor={theme.colors.primary}
-								borderColor={theme.colors.primary}
-								textStyle={{ color: 'white' }}
 								style={styles.btnAction}
 								imgRightSrc={null}
 								isDisabled={!cardSelected || cardsList?.cards?.length === 0}