ordering-ui-react-native 0.22.75 → 0.22.76-release

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

@@ -1,6 +1,6 @@
 import React, { useState } from 'react';
-import { OText, OIconButton } from '../shared';
-import { StyleSheet, View, Platform, Alert } from 'react-native';
+import { OText, OIcon } from '../shared';
+import { StyleSheet, View, Platform, Alert, TouchableOpacity } from 'react-native';
 import {
   Content,
   OrderCustomer,
@@ -15,7 +15,7 @@ import {
   ContentInfo,
 } from './styles';
 import { useUtils, useLanguage, useConfig } from 'ordering-components/native';
-import { verifyDecimals, getProductPrice } from '../../utils';
+import { verifyDecimals, getProductPrice, getCurrenySymbol } from '../../utils';
 import { FloatingButton } from '../FloatingButton';
 import RNHTMLtoPDF from 'react-native-html-to-pdf';
 import RNPrint from 'react-native-print';
@@ -152,14 +152,14 @@ export const OrderSummary = ({ order, navigation, orderStatus, askBluetoothPermi
           </br>
 
           ${!!order?.delivery_option
-            ? `${t('DELIVERY_PREFERENCE', 'Delivery Preference')}: ${t(order?.delivery_option?.name?.toUpperCase()?.replace(/ /g, '_'), order?.delivery_option?.name)
-            } </br>`
-            : ''
-          }
+        ? `${t('DELIVERY_PREFERENCE', 'Delivery Preference')}: ${t(order?.delivery_option?.name?.toUpperCase()?.replace(/ /g, '_'), order?.delivery_option?.name)
+        } </br>`
+        : ''
+      }
 
           ${t('DELIVERY_DATE', 'Delivery Date')}: ${deliveryDate(order)}
           </br>
-          ${t(paymethodsLength > 1 ? 'PAYMENT_METHODS' : 'PAYMENT_METHOD', paymethodsLength > 1 ? 'Payment methods' : 'Payment method')}: ${handlePaymethodsListString()}
+          ${t(paymethodsLength > 1 ? 'PAYMENT_METHODS' : 'PAYMENT_METHOD', paymethodsLength > 1 ? 'Payment methods' : 'Payment method')}: ${order?.payment_events?.length > 0 ? handlePaymethodsListString() : t(order?.paymethod?.gateway?.toUpperCase(), order?.paymethod?.name)}
         </p>
 
         <h1>${t('CUSTOMER_DETAILS', 'Customer details')}</h1>
@@ -168,9 +168,9 @@ export const OrderSummary = ({ order, navigation, orderStatus, askBluetoothPermi
         ${t('EMAIL', 'Email')}: ${order?.customer?.email}
         </br>
          ${!!order?.customer?.cellphone
-          ? `${t('MOBILE_PHONE', 'Mobile Phone')}: ${order?.customer?.cellphone
-          } </br>`
-          : ''}
+        ? `${t('MOBILE_PHONE', 'Mobile Phone')}: ${order?.customer?.cellphone
+        } </br>`
+        : ''}
 
          ${!!order?.customer?.phone
         ? `${t('MOBILE_PHONE', 'Mobile Phone')}: ${order?.customer?.phone
@@ -196,10 +196,10 @@ export const OrderSummary = ({ order, navigation, orderStatus, askBluetoothPermi
         ${order?.business?.email}
         </br>
         ${!!order?.business?.cellphone
-          ? `${t('BUSINESS_PHONE', 'Business Phone')}: ${order?.business?.cellphone
-          } </br>`
-          : ''
-        }
+        ? `${t('BUSINESS_PHONE', 'Business Phone')}: ${order?.business?.cellphone
+        } </br>`
+        : ''
+      }
         ${!!order?.business?.phone
         ? `${t('BUSINESS_PHONE', 'Business Phone')}: ${order?.business?.phone
         } </br>`
@@ -216,7 +216,7 @@ export const OrderSummary = ({ order, navigation, orderStatus, askBluetoothPermi
         </p>
         <h1> ${t('ORDER_DETAILS', 'Order Details')}</h1>
 
-        ${order?.comment ? ('</br>'+ t('ORDER_COMMENT', 'Order Comment') + ':' + order?.comment) : ''}
+        ${order?.comment ? ('</br>' + t('ORDER_COMMENT', 'Order Comment') + ':' + order?.comment) : ''}
 
         ${order?.products.length &&
       order?.products.map(
@@ -242,139 +242,174 @@ export const OrderSummary = ({ order, navigation, orderStatus, askBluetoothPermi
               </div>`
       )
       }
-        <div style="display: flex;">
-
-            <div style="display:flex; justify-content: flex-start; font-size: 26px; width: 70%">
-            ${t('SUBTOTAL', 'Subtotal')}
-            </div>
-
-            <div style="display:flex; justify-content: flex-end; font-size: 26px; width: 30%">
-              ${parsePrice(
-        order.tax_type === 1
-          ? order?.summary?.subtotal + order?.summary?.tax ?? 0
-          : order?.summary?.subtotal ?? 0,
-      )}
-            </div>
+      <div style="display: flex;">
+        <div style="display:flex; justify-content: flex-start; font-size: 26px; width: 70%">
+          ${t('SUBTOTAL', 'Subtotal')}
+        </div>
 
+        <div style="display:flex; justify-content: flex-end; font-size: 26px; width: 30%">
+          ${parsePrice(((order?.summary?.subtotal ?? order?.subtotal) + getIncludedTaxes()), { currency: getCurrenySymbol(order?.currency) })}
         </div>
+      </div>
 
-        <div style="display: flex">
+      <div style="display: flex">
         ${order?.summary?.discount > 0
         ? order?.offer_type === 1
           ? `<div style="display:flex; justify-content: flex-start; font-size: 26px; width: 70%">
-                  ${t('DISCOUNT', 'Discount')} (${verifyDecimals(
-            order?.offer_rate,
-            parsePrice,
-          )}%)
-                </div>`
-          : `<div style="display:flex; justify-content: flex-start; font-size: 26px; width: 70%"> ${t(
-            'DISCOUNT',
-            'Discount',
-          )}
-                 </div>`
-        : ''
-      }
-        ${order?.summary?.discount > 0
-        ? `<div style="display:flex; justify-content: flex-end; font-size: 26px; width: 30%">- ${parsePrice(
-          order?.summary?.discount,
-        )}
+                ${t('DISCOUNT', 'Discount')} (${verifyDecimals(order?.offer_rate, parsePrice)}%)
               </div>`
+          : `<div style="display:flex; justify-content: flex-start; font-size: 26px; width: 70%"> ${t('DISCOUNT', 'Discount')}</div>`
         : ''
       }
-        </div>
-
-        ${order?.tax_type !== 1
-        ? `<div style="font-size: 25px">
-                ${t('TAX', 'Tax')}
-                ${verifyDecimals(order?.summary?.tax_rate, parseNumber)}%
-                ${parsePrice(order?.summary?.tax ?? 0)}
-                ${t('TAX', 'Tax')}
-                ${verifyDecimals(order?.summary?.tax_rate, parseNumber)}%
-              </div>`
+          ${order?.summary?.discount > 0
+        ? `<div style="display:flex; justify-content: flex-end; font-size: 26px; width: 30%">
+              - ${parsePrice(order?.summary?.discount ?? order?.discount, { currency: getCurrenySymbol(order?.currency) })}
+            </div>`
         : ''
       }
+      </div>
 
-      ${order?.summary?.delivery_price > 0 && order.delivery_type !== 2 ?
-        ` <div style="display: flex">
-          <div style="font-size: 26px; width: 70%; display: flex; justify-content: flex-start">
-            ${t('DELIVERY_FEE', 'Delivery Fee')}
-          </div>
-
-          <div style="font-size: 26px; width: 30%; display: flex; justify-content: flex-end">
-            ${parsePrice(order?.summary?.delivery_price ?? 0)}
-          </div>` :
-        ''}
-
-        </div>
-        <div style="display: flex">
-
-          <div style="font-size: 26px; width: 70%; display: flex; justify-content: flex-start">
-            ${t('DRIVER_TIP', 'Driver tip')}
-            ${percentTip ? `(${percentTip}%)` : ''}
-          </div>
-
-          <div style="font-size: 26px; width: 30%; display: flex; justify-content: flex-end">
-            ${parsePrice(order?.summary?.driver_tip ?? 0)}
+      ${order?.offers?.length > 0 ? order?.offers?.filter((offer: any) => offer?.target === 1)?.map((offer: any) => (
+        `<div style="display: flex">
+          ${order?.rate_type === 1
+          ? `<div style="display:flex; justify-content: flex-start; font-size: 26px; width: 70%">
+                  ${t(offer.name?.toUpperCase?.()?.replace(/ /g, '_'), offer.name)} (${verifyDecimals(offer?.rate, parsePrice)}%)
+                </div>`
+          : `<div style="display:flex; justify-content: flex-start; font-size: 26px; width: 70%">${t(offer.name?.toUpperCase?.()?.replace(/ /g, '_'), offer.name)}</div>`}
+          <div style="display:flex; justify-content: flex-end; font-size: 26px; width: 30%">
+            - ${parsePrice(offer?.summary?.discount, { currency: getCurrenySymbol(order?.currency) })}
           </div>
+        </div>`
+      )) : ''}
 
-        </div>
-
-        ${order?.summary?.service_fee > 0 && `
-          <div style="display: flex">
-            <div style="font-size: 26px; width: 70%; display: flex; justify-content: flex-start">
-              ${t('SERVICE_FEE', 'Service Fee')}
-            (${verifyDecimals(order?.summary?.service_fee, parseNumber)}%)
+      ${order?.taxes?.length === 0 && order?.tax_type === 2
+        ? `<div style="display: flex;">
+            <div style="display:flex; justify-content: flex-start; font-size: 26px; width: 70%">
+              ${t('TAX', 'Tax')} (${verifyDecimals(order?.tax, parseNumber)}%)}
             </div>
+            <div style="display:flex; justify-content: flex-end; font-size: 26px; width: 30%">
+              ${parsePrice(order?.summary?.tax ?? 0, { currency: getCurrenySymbol(order?.currency) })}
+            </div>
+          </div>`
+        : ''}
 
-            <div style="font-size: 26px; width: 30%; display: flex; justify-content: flex-end">
-              ${parsePrice(order?.summary?.service_fee ?? 0)}
+      ${order?.fees?.length === 0 && order?.summary?.service_fee > 0 ? (
+        `<div style="display: flex;">
+            <div style="display:flex; justify-content: flex-start; font-size: 26px; width: 70%">
+              ${t('SERVICE_FEE', 'Service fee')} (${verifyDecimals(order?.service_fee, parseNumber)}%)}
             </div>
+            <div style="display:flex; justify-content: flex-end; font-size: 26px; width: 30%">
+              ${parsePrice(order?.summary?.service_fee ?? 0, { currency: getCurrenySymbol(order?.currency) })}
+            </div>
+          </div>`
+      ) : ''}
 
-          </div>
-        `}
+      ${order?.taxes?.length > 0 ? order?.taxes?.filter((tax: any) => tax?.type === 2 && tax?.rate !== 0 && tax?.target === 'product').map((tax: any) => (
+        `<div style="display: flex;">
+            <div style="display:flex; justify-content: flex-start; font-size: 26px; width: 70%">
+              ${t(tax?.name?.toUpperCase?.()?.replace(/ /g, '_'), tax?.name) || t('INHERIT_FROM_BUSINESS', 'Inherit from business')} (${verifyDecimals(tax?.rate, parseNumber)}%)
+            </div>
+            <div style="display:flex; justify-content: flex-end; font-size: 26px; width: 30%">
+              ${parsePrice(tax?.summary?.tax_after_discount ?? tax?.summary?.tax ?? 0, { currency: getCurrenySymbol(order?.currency) })}
+            </div>
+          </div>`
+      )) : ''}
 
-        <div style="display: flex">
+      ${order?.offers?.length > 0 ? order?.offers?.filter((offer: any) => offer?.target === 3)?.map((offer: any) => (
+        `<div style="display: flex;">
+            <div style="display:flex; justify-content: flex-start; font-size: 26px; width: 70%">
+              ${t(offer.name?.toUpperCase?.()?.replace(/ /g, '_'), offer.name)} ${offer.rate_type === 1 ? `(${verifyDecimals(offer?.rate, parsePrice)}%)` : ''}
+            </div>
+            <div style="display:flex; justify-content: flex-end; font-size: 26px; width: 30%">
+              - ${parsePrice(offer?.summary?.discount, { currency: getCurrenySymbol(order?.currency) })}
+            </div>
+          </div>`
+      )) : ''}
 
-          <div style="font-size: 26px; width: 70%; display: flex; justify-content: flex-start; font-weight: bold">
-            ${t('TOTAL', 'Total')}
+      ${order?.summary?.delivery_price > 0 && order.delivery_type !== 2 ?
+        ` <div style="display: flex">
+          <div style="font-size: 26px; width: 70%; display: flex; justify-content: flex-start">
+            ${t('DELIVERY_FEE', 'Delivery Fee')}
           </div>
 
           <div style="font-size: 26px; width: 30%; display: flex; justify-content: flex-end">
-            ${parsePrice(order?.summary?.total ?? 0)}
-          </div>
-
+            ${parsePrice(order?.summary?.delivery_price + getIncludedTaxes(true), { currency: getCurrenySymbol(order?.currency) })}
+          </div>` :
+        ''
+      }
+    </div>
+
+    <div style="display: flex">
+      <div style="font-size: 26px; width: 70%; display: flex; justify-content: flex-start">
+        ${t('DRIVER_TIP', 'Driver tip')}
+        ${percentTip ? `(${percentTip}%)` : ''}
+      </div>
+      <div style="font-size: 26px; width: 30%; display: flex; justify-content: flex-end">
+        ${parsePrice(order?.summary?.driver_tip ?? order?.totalDriverTip, { currency: getCurrenySymbol(order?.currency) })}
+      </div>
+    </div>
+
+    ${order?.taxes?.length > 0 ? order?.taxes?.filter((tax: any) => tax?.type === 2 && tax?.rate !== 0 && tax?.target === 'delivery_fee').map((tax: any, i: number) => (
+        `<div style="display: flex;">
+        <div style="display:flex; justify-content: flex-start; font-size: 26px; width: 70%">
+          ${tax.name || t('INHERIT_FROM_BUSINESS', 'Inherit from business')} (${verifyDecimals(tax?.rate, parsePrice)}%)
         </div>
+        <div style="display:flex; justify-content: flex-end; font-size: 26px; width: 30%">
+          ${parsePrice(tax?.summary?.tax_after_discount ?? tax?.summary?.tax ?? 0, { currency: getCurrenySymbol(order?.currency) })}
+        </div>
+      </div>`
+      )) : ''}
 
-        ${order?.payment_events.length && `
-          <div style="font-size: 26px; width: 70%; display: flex; justify-content: flex-start; font-weight: bold">
-            ${t('PAYMENTS', 'Payments')}
-          </div>
-        `}
-
-        ${order?.payment_events.length &&
-          order?.payment_events.map(
-            (event: any, i: number) =>
-              `<div style="display: flex;flexDirection:row;flex-wrap:wrap">
+    ${order?.offers?.length > 0 ? order?.offers?.filter((offer: any) => offer?.target === 2)?.map((offer: any) => (
+        `<div style="display: flex;">
+        <div style="display:flex; justify-content: flex-start; font-size: 26px; width: 70%">
+          ${t(offer.name?.toUpperCase?.()?.replace(/ /g, '_'), offer.name)} ${offer.rate_type === 1 ? `(${verifyDecimals(offer?.rate, parsePrice, { currency: getCurrenySymbol(order?.currency) })}%)` : ''}
+        </div>
+        <div style="display:flex; justify-content: flex-end; font-size: 26px; width: 30%">
+          - ${parsePrice(offer?.summary?.discount, { currency: getCurrenySymbol(order?.currency) })}
+        </div>
+      </div>`
+      )) : ''}
+
+    <div style="display: flex">
+      <div style="font-size: 26px; width: 70%; display: flex; justify-content: flex-start; font-weight: bold">
+        ${t('TOTAL', 'Total')}
+      </div>
+      <div style="font-size: 26px; width: 30%; display: flex; justify-content: flex-end">
+        ${parsePrice(order?.summary?.total ?? 0)}
+      </div>
+    </div>
+
+    ${order?.payment_events.length && `
+      <div style="font-size: 26px; width: 70%; display: flex; justify-content: flex-start; font-weight: bold">
+        ${t('PAYMENTS', 'Payments')}
+      </div>
+    `}
+
+    ${order?.payment_events.length &&
+      order?.payment_events.map(
+        (event: any, i: number) =>
+          `<div style="display: flex;flexDirection:row;flex-wrap:wrap">
                     <div style="display:flex;width:100%">
                       <div style="display:flex; justify-content: flex-start; font-size: 26px; width: 70%">
                       ${event?.wallet_event
-                        ? walletName[event?.wallet_event?.wallet?.type]?.name
-                        : event?.paymethod?.gateway && event?.paymethod?.gateway === 'cash' && order?.cash > 0
-                          ? `${t(event?.paymethod?.gateway?.toUpperCase(), event?.paymethod?.name)} (${t('CASH_CHANGE_OF', 'Change of :amount:').replace(':amount:', parsePrice(order?.cash))})`
-                          : event?.paymethod?.gateway
-                            ? t(event?.paymethod?.gateway?.toUpperCase(), event?.paymethod?.name)
-                            : t(order?.paymethod?.gateway?.toUpperCase(), order?.paymethod?.name)}
+            ? walletName[event?.wallet_event?.wallet?.type]?.name
+            : event?.paymethod?.gateway && event?.paymethod?.gateway === 'cash' && order?.cash > 0
+              ? `${t(event?.paymethod?.gateway?.toUpperCase(), event?.paymethod?.name)} (${t('CASH_CHANGE_OF', 'Change of :amount:').replace(':amount:', parsePrice(order?.cash))})`
+              : event?.paymethod?.gateway
+                ? t(event?.paymethod?.gateway?.toUpperCase(), event?.paymethod?.name)
+                : t(order?.paymethod?.gateway?.toUpperCase(), order?.paymethod?.name)}
                       </div>
 
                       <div style="display:flex; justify-content: flex-end; font-size: 26px; width: 30%">
                         ${(event?.paymethod?.gateway === 'cash' && order?.cash)
-                          ? parsePrice(order?.cash, { currency: order?.currency })
-                          : `-${parsePrice(event?.amount, { currency: order?.currency })}`}
+            ? parsePrice(order?.cash, { currency: order?.currency })
+            : `-${parsePrice(event?.amount, { currency: order?.currency })}`}
                       </div>
                     </div>
                   </div>`
-        )}
-    </div>`;
+      )}
+      </div> `;
   };
 
   const deliveryStatus: any = {
@@ -418,8 +453,16 @@ export const OrderSummary = ({ order, navigation, orderStatus, askBluetoothPermi
 
   const styles = StyleSheet.create({
     btnBackArrow: {
-      maxWidth: 40,
-      height: 25,
+      borderWidth: 0,
+      width: 32,
+      height: 32,
+      tintColor: theme.colors.textGray,
+      backgroundColor: theme.colors.clear,
+      borderColor: theme.colors.clear,
+      shadowColor: theme.colors.clear,
+      paddingLeft: 0,
+      paddingRight: 0,
+      marginTop: 10
     },
     textBold: {
       fontWeight: '600',
@@ -445,18 +488,27 @@ export const OrderSummary = ({ order, navigation, orderStatus, askBluetoothPermi
     }
   };
 
+  const getIncludedTaxes = (isDeliveryFee?: boolean) => {
+    if (!order?.taxes) return 0
+    if (order?.taxes?.length === 0) {
+      return order.tax_type === 1 ? order?.summary?.tax ?? 0 : 0
+    } else {
+      return order?.taxes.reduce((taxIncluded: number, tax: any) => {
+        return taxIncluded +
+          (((!isDeliveryFee && tax.type === 1 && tax.target === 'product') ||
+            (isDeliveryFee && tax.type === 1 && tax.target === 'delivery_fee')) ? tax.summary?.tax : 0)
+      }, 0)
+    }
+  }
+
   return (
     <>
       <Content>
         <OrderContent>
           <OrderHeader>
-            <OIconButton
-              icon={theme.images.general.arrow_left}
-              iconStyle={{ width: 20, height: 20 }}
-              borderColor={theme.colors.clear}
-              style={{ maxWidth: 40, justifyContent: 'flex-end' }}
-              onClick={() => handleArrowBack()}
-            />
+            <TouchableOpacity onPress={() => handleArrowBack()} style={styles.btnBackArrow}>
+              <OIcon src={theme.images.general.arrow_left} color={theme.colors.textGray} />
+            </TouchableOpacity>
             <OText
               style={{ marginBottom: 5 }}
               size={15}
@@ -488,7 +540,9 @@ export const OrderSummary = ({ order, navigation, orderStatus, askBluetoothPermi
               {`${t('DELIVERY_DATE', 'Delivery Date')}: ${deliveryDate(order)}`}
             </OText>
 
-            <OText style={{ marginBottom: 5 }}>{`${t(`${paymethodsLength > 1 ? 'PAYMENT_METHODS' : 'PAYMENT_METHOD'}`, `${paymethodsLength > 1 ? 'Payment methods' : 'Payment method'}`)}: ${handlePaymethodsListString()}`}</OText>
+            <OText style={{ marginBottom: 5 }}>
+              {`${t(`${paymethodsLength > 1 ? 'PAYMENT_METHODS' : 'PAYMENT_METHOD'}`, `${paymethodsLength > 1 ? 'Payment methods' : 'Payment method'}`)}: ${order?.payment_events?.length > 0 ? handlePaymethodsListString() : t(order?.paymethod?.gateway?.toUpperCase(), order?.paymethod?.name)}`}
+            </OText>
 
           </OrderHeader>
 
@@ -564,7 +618,7 @@ export const OrderSummary = ({ order, navigation, orderStatus, askBluetoothPermi
               </OText>
             )}
 
-            {order?.customer?.address_notes && (
+            {!!order?.customer?.address_notes && (
               <OText style={{ marginBottom: 5 }}>
                 {`${t('NOTES', 'Notes')}: ${order?.customer?.address_notes}`}
               </OText>
@@ -663,7 +717,7 @@ export const OrderSummary = ({ order, navigation, orderStatus, askBluetoothPermi
               {t('ORDER_DETAILS', 'Order Details')}
             </OText>
 
-            {order?.comment && (
+            {!!order?.comment && (
               <OText style={{ marginBottom: 5 }}>
                 {`${t('ORDER_COMMENT', 'Order Comment')}: ${order?.comment}`}
               </OText>
@@ -690,38 +744,17 @@ export const OrderSummary = ({ order, navigation, orderStatus, askBluetoothPermi
               </OText>
 
               <OText style={{ marginBottom: 5 }}>
-                {parsePrice(
-                  order.tax_type === 1
-                    ? order?.summary?.subtotal + order?.summary?.tax ?? 0
-                    : order?.summary?.subtotal ?? 0,
-                )}
+                {parsePrice(((order?.summary?.subtotal ?? order?.subtotal) + getIncludedTaxes()), { currency: getCurrenySymbol(order?.currency) })}
               </OText>
             </Table>
 
-            {order?.tax_type !== 1 && (
-              <Table>
-                <OText style={{ marginBottom: 5 }}>
-                  {t('TAX', 'Tax')}
-                  {`(${verifyDecimals(
-                    order?.summary?.tax_rate,
-                    parseNumber,
-                  )}%)`}
-                </OText>
-
-                <OText style={{ marginBottom: 5 }}>
-                  {parsePrice(order?.summary?.tax ?? 0)}
-                </OText>
-              </Table>
-            )}
-
-            {order?.summary?.discount > 0 && (
+            {(order?.summary?.discount > 0 ?? order?.discount > 0) && order?.offers?.length === 0 && (
               <Table>
                 {order?.offer_type === 1 ? (
                   <OText style={{ marginBottom: 5 }}>
                     <OText>{t('DISCOUNT', 'Discount')}</OText>
-
                     <OText>
-                      {`(${verifyDecimals(order?.offer_rate, parsePrice)}%)`}
+                      {`(${verifyDecimals(order?.offer_rate, parsePrice)} %)`}
                     </OText>
                   </OText>
                 ) : (
@@ -731,55 +764,117 @@ export const OrderSummary = ({ order, navigation, orderStatus, askBluetoothPermi
                 )}
 
                 <OText style={{ marginBottom: 5 }}>
-                  - {parsePrice(order?.summary?.discount)}
+                  - {parsePrice(order?.summary?.discount ?? order?.discount, { currency: getCurrenySymbol(order?.currency) })}
                 </OText>
               </Table>
             )}
 
-            {order?.summary?.delivery_price > 0 && order.delivery_type !== 2 && (
+            {order?.offers?.length > 0 && order?.offers?.filter((offer: any) => offer?.target === 1)?.map((offer: any) => (
+              <Table key={offer.id}>
+                <OText mBottom={4}>
+                  {t(offer.name?.toUpperCase?.()?.replace(/ /g, '_'), offer.name)}
+                  {offer.rate_type === 1 && (
+                    <OText>{`(${verifyDecimals(offer?.rate, parsePrice)} %)`}</OText>
+                  )}
+                </OText>
+                <OText mBottom={4}>- {parsePrice(offer?.summary?.discount, { currency: getCurrenySymbol(order?.currency) })}</OText>
+              </Table>
+            ))}
+
+            {order?.taxes?.length === 0 && order?.tax_type === 2 && order?.summary?.tax > 0 && (
               <Table>
-                <OText style={{ marginBottom: 5 }}>
+                <OText mBottom={4}>
+                  {t('TAX', 'Tax')} {`(${verifyDecimals(order?.tax, parseNumber)} %)`}
+                </OText>
+                <OText mBottom={4}>
+                  {parsePrice(order?.summary?.tax ?? 0, { currency: getCurrenySymbol(order?.currency) })}
+                </OText>
+              </Table>
+            )}
+
+            {order?.fees?.length === 0 && order?.summary?.service_fee > 0 && (
+              <Table>
+                <OText mBottom={4}>
+                  {t('SERVICE_FEE', 'Service fee')}
+                  {`(${verifyDecimals(order?.service_fee, parseNumber)} %)`}
+                </OText>
+                <OText mBottom={4}>{parsePrice(order?.summary?.service_fee ?? 0, { currency: getCurrenySymbol(order?.currency) })}</OText>
+              </Table>
+            )}
+
+            {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}>
+                <OText mBottom={4}>
+                  {t(tax?.name?.toUpperCase?.()?.replace(/ /g, '_'), tax?.name) || t('INHERIT_FROM_BUSINESS', 'Inherit from business')}
+                  {`(${verifyDecimals(tax?.rate, parseNumber)} %)`}{' '}
+                </OText>
+                <OText mBottom={4}>
+                  {parsePrice(tax?.summary?.tax_after_discount ?? tax?.summary?.tax ?? 0, { currency: getCurrenySymbol(order?.currency) })}
+                </OText>
+              </Table>
+            ))}
+
+            {order?.offers?.length > 0 && order?.offers?.filter((offer: any) => offer?.target === 3)?.map((offer: any) => (
+              <Table key={offer.id}>
+                <OText mBottom={4}>
+                  {t(offer.name?.toUpperCase?.()?.replace(/ /g, '_'), offer.name)}
+                  {offer.rate_type === 1 && (
+                    <OText>{`(${verifyDecimals(offer?.rate, parsePrice)} %)`}</OText>
+                  )}
+                </OText>
+                <OText mBottom={4}>- {parsePrice(offer?.summary?.discount, { currency: getCurrenySymbol(order?.currency) })}</OText>
+              </Table>
+            ))}
+
+            {typeof order?.summary?.delivery_price === 'number' && order.delivery_type !== 2 && (
+              <Table>
+                <OText mBottom={4}>
                   {t('DELIVERY_FEE', 'Delivery Fee')}
                 </OText>
 
-                <OText>{parsePrice(order?.summary?.delivery_price)}</OText>
+                <OText mBottom={4}>
+                  {parsePrice(order?.summary?.delivery_price + getIncludedTaxes(true), { currency: getCurrenySymbol(order?.currency) })}
+                </OText>
               </Table>
             )}
 
             {(order?.summary?.driver_tip > 0 || order?.driver_tip > 0) && order.delivery_type !== 2 && (
               <Table>
-                <OText style={{ marginBottom: 5 }}>
+                <OText mBottom={4}>
                   {t('DRIVER_TIP', 'Driver tip')}
-                  {order?.summary?.driver_tip > 0 &&
-                    parseInt(configs?.driver_tip_type?.value, 10) === 2 &&
+                  {order?.driver_tip > 0 && parseInt(configs?.driver_tip_type?.value, 10) === 2 &&
                     !parseInt(configs?.driver_tip_use_custom?.value, 10) &&
-                    `(${verifyDecimals(
-                      order?.summary?.driver_tip,
-                      parseNumber,
-                    )}%)`}
+                    (
+                      `(${verifyDecimals(order?.driver_tip, parseNumber)} %)`
+                    )}
                 </OText>
-
-                <OText style={{ marginBottom: 5 }}>
-                  {parsePrice(order?.summary?.driver_tip ?? 0)}
+                <OText mBottom={4}>
+                  {parsePrice(order?.summary?.driver_tip ?? order?.totalDriverTip, { currency: getCurrenySymbol(order?.currency) })}
                 </OText>
               </Table>
             )}
 
-            {order?.summary?.service_fee > 0 && (
-              <Table>
-                <OText style={{ marginBottom: 5 }}>
-                  {t('SERVICE_FEE', 'Service Fee')}
-                  {`(${verifyDecimals(
-                    order?.summary?.service_fee,
-                    parseNumber,
-                  )}%)`}
+            {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} `}>
+                <OText mBottom={4}>
+                  {tax.name || t('INHERIT_FROM_BUSINESS', 'Inherit from business')}
+                  {`(${verifyDecimals(tax?.rate, parseNumber)} %)`}
                 </OText>
-
-                <OText style={{ marginBottom: 5 }}>
-                  {parsePrice(order?.summary?.service_fee)}
+                <OText mBottom={4}>{parsePrice(tax?.summary?.tax_after_discount ?? tax?.summary?.tax ?? 0, { currency: getCurrenySymbol(order?.currency) })}</OText>
+              </Table>
+            ))}
+
+            {order?.offers?.length > 0 && order?.offers?.filter((offer: any) => offer?.target === 2)?.map((offer: any) => (
+              <Table key={offer.id}>
+                <OText mBottom={4}>
+                  {t(offer.name?.toUpperCase?.()?.replace(/ /g, '_'), offer.name)}
+                  {offer.rate_type === 1 && (
+                    <OText>{`(${verifyDecimals(offer?.rate, parsePrice, { currency: getCurrenySymbol(order?.currency) })}%)`}</OText>
+                  )}
                 </OText>
+                <OText mBottom={4}>- {parsePrice(offer?.summary?.discount, { currency: getCurrenySymbol(order?.currency) })}</OText>
               </Table>
-            )}
+            ))}
 
             <Total>
               <Table>

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

@@ -846,6 +846,18 @@ export const OrdersListManager = (props: OrdersOptionParams) => {
       {
         key: 23,
         text: t('ORDER_DRIVER_ON_WAY', 'Driver on way')
+      },
+      {
+        key: 24,
+        text: t('ORDER_DRIVER_WAITING_FOR_ORDER', 'Driver waiting for order')
+      },
+      {
+        key: 25,
+        text: t('ORDER_ACCEPTED_BY_DRIVER_COMPANY', 'Accepted by driver company')
+      },
+      {
+        key: 26,
+        text: t('ORDER_DRIVER_ARRIVED_CUSTOMER', 'Driver arrived to customer')
       }
     ],
     tabs: [
@@ -858,7 +870,7 @@ export const OrdersListManager = (props: OrdersOptionParams) => {
       {
         key: 1,
         text: t('IN_PROGRESS', 'In Progress'),
-        tags: props?.orderGroupStatusCustom?.inProgress ?? [3, 4, 7, 8, 9, 14, 18, 19, 20, 21, 22, 23],
+        tags: props?.orderGroupStatusCustom?.inProgress ?? [3, 4, 7, 8, 9, 14, 18, 19, 20, 21, 22, 23, 24, 25, 26],
         title: 'inProgress',
       },
       {