ordering-ui-react-native 0.12.51 → 0.12.52

package/package.json

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

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

@@ -1,6 +1,6 @@
 //React & React Native
 import React, { useState, useEffect } from 'react';
-import { StyleSheet, View, Platform } from 'react-native';
+import { StyleSheet, View, Platform, ScrollView } from 'react-native';
 
 // Thirds
 import { Placeholder, PlaceholderLine, Fade } from 'rn-placeholder';
@@ -50,9 +50,9 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
     setDriverUpdateLocation,
     orderTitle,
     appTitle,
-    handleClickLogisticOrder
-  } = props;
+    handleClickLogisticOrder,
 
+  } = props;
   const [, { showToast }] = useToast();
   const { order } = props.order
   const theme = useTheme();
@@ -141,6 +141,13 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
     handleArrowBack()
   }
 
+  const handleAcceptLogisticOrder = (order : any) => {
+    handleClickLogisticOrder?.(1, order?.logistic_order_id)
+    if(order?.order_group){
+      handleArrowBack()
+    }
+  }
+
   const locations = [
     {
       ...order?.business?.location,
@@ -243,107 +250,54 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
     );
   }
 
-  const OrderDetailsInformation = (_order: any, isOrderGroup: boolean) => {
-    const { order } = _order
+  const OrderDetailsInformation = (props : {order: any, isOrderGroup?: boolean, lastOrder?: boolean}) => {
+    const {
+      order,
+      isOrderGroup,
+      lastOrder,
+    } = props
     return (
       <>
-        <OrderDetailsContainer
-          keyboardShouldPersistTaps="handled"
-          showsVerticalScrollIndicator={false}
-        >
-          <>
-            <OrderContentComponent
-              order={order}
-              logisticOrderStatus={logisticOrderStatus}
-              isOrderGroup={isOrderGroup}
+        <OrderContentComponent
+          order={order}
+          logisticOrderStatus={logisticOrderStatus}
+          isOrderGroup={isOrderGroup}
+          lastOrder={lastOrder}
+        />
+        {(order?.status === 8 || order?.status === 18) && order?.delivery_type === 1 && (
+          <Pickup>
+            <OButton
+              style={styles.btnPickUp}
+              textStyle={{ color: theme.colors.primary }}
+              text={t('ARRIVED_TO_BUSINESS', 'Arrived to bussiness')}
+              onClick={() =>
+                handleChangeOrderStatus && handleChangeOrderStatus(3)
+              }
+              imgLeftStyle={{ tintColor: theme.colors.backArrow }}
             />
-            {(order?.status === 8 || order?.status === 18) && order?.delivery_type === 1 && (
-              <Pickup>
-                <OButton
-                  style={styles.btnPickUp}
-                  textStyle={{ color: theme.colors.primary }}
-                  text={t('ARRIVED_TO_BUSINESS', 'Arrived to bussiness')}
-                  onClick={() =>
-                    handleChangeOrderStatus && handleChangeOrderStatus(3)
-                  }
-                  imgLeftStyle={{ tintColor: theme.colors.backArrow }}
-                />
-              </Pickup>
-            )}
-            {order?.status === 3 && order?.delivery_type === 1 && (
-              <View style={{ paddingVertical: 20, marginBottom: 20 }}>
-                <OButton
-                  style={styles.btnPickUp}
-                  textStyle={{ color: theme.colors.white }}
-                  text={t('ORDER_NOT_READY', 'Order not ready')}
-                  onClick={() =>
-                    handleViewActionOrder && handleViewActionOrder('notReady')
-                  }
-                  imgLeftStyle={{ tintColor: theme.colors.backArrow }}
-                  bgColor={theme.colors.red}
-                />
-              </View>
-            )}
-          </>
-          <View
-            style={{
-              height:
-                order?.status === 8 && order?.delivery_type === 1 ? 50 : 35,
-            }}
-          />
-        </OrderDetailsContainer>
-
-        {showFloatButtonsPickUp[order?.status] && (
-          <FloatingButton
-            disabled={props.order?.loading}
-            btnText={t('PICKUP_FAILED', 'Pickup failed')}
-            isSecondaryBtn={false}
-            secondButtonClick={() =>
-              handleChangeOrderStatus && handleChangeOrderStatus(9)
-            }
-            firstButtonClick={() =>
-              handleViewActionOrder && handleViewActionOrder('pickupFailed')
-            }
-            secondBtnText={t('PICKUP_COMPLETE', 'Pickup complete')}
-            secondButton={true}
-            firstColorCustom={theme.colors.red}
-            secondColorCustom={theme.colors.green}
-            widthButton={'45%'}
-          />
+          </Pickup>
         )}
-        {(order?.status === 9 || order?.status === 19) && (
-          <>
-            <FloatingButton
-              disabled={props.order?.loading}
-              btnText={t('DELIVERY_FAILED', 'Delivery Failed')}
-              isSecondaryBtn={false}
-              secondButtonClick={() =>
-                handleChangeOrderStatus && handleChangeOrderStatus(11)
+        {order?.status === 3 && order?.delivery_type === 1 && (
+          <View style={{ paddingVertical: 20, marginBottom: 20 }}>
+            <OButton
+              style={styles.btnPickUp}
+              textStyle={{ color: theme.colors.white }}
+              text={t('ORDER_NOT_READY', 'Order not ready')}
+              onClick={() =>
+                handleViewActionOrder && handleViewActionOrder('notReady')
               }
-              firstButtonClick={() =>
-                handleViewActionOrder && handleViewActionOrder('deliveryFailed')
-              }
-              secondBtnText={t('DELIVERY_COMPLETE', 'Delivery complete')}
-              secondButton={true}
-              firstColorCustom={theme.colors.red}
-              secondColorCustom={theme.colors.green}
-              widthButton={'45%'}
+              imgLeftStyle={{ tintColor: theme.colors.backArrow }}
+              bgColor={theme.colors.red}
             />
-          </>
-        )}
-        {showFloatButtonsAcceptOrReject[order?.status] && (
-          <FloatingButton
-            btnText={t('REJECT', 'Reject')}
-            isSecondaryBtn={false}
-            secondButtonClick={() => order?.isLogistic && logisticOrderStatus.includes(order?.status) ? handleClickLogisticOrder?.(1, order?.logistic_order_id) : handleViewActionOrder('accept')}
-            firstButtonClick={() => order?.isLogistic && logisticOrderStatus.includes(order?.status) ? handleRejectLogisticOrder() : handleViewActionOrder('reject')}
-            secondBtnText={t('ACCEPT', 'Accept')}
-            secondButton={true}
-            firstColorCustom={theme.colors.red}
-            secondColorCustom={theme.colors.green}
-            widthButton={'45%'}
-          />
+          </View>
         )}
+        <View
+          style={{
+            height:
+              order?.status === 8 && order?.delivery_type === 1 ? 50 : 35,
+          }}
+        />
+
       </>
     )
   }
@@ -390,10 +344,66 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
         />
         {order && Object.keys(order).length > 0 && (props.order?.error?.length < 1 || !props.order?.error) && (
           <>
-            {order?.order_group && order?.order_group_id ? order?.order_group?.orders.map((order: any) => (
-              <OrderDetailsInformation order={order} />
-            )) : (
-              <OrderDetailsInformation order={order} />
+            <OrderDetailsContainer
+              keyboardShouldPersistTaps="handled"
+              showsVerticalScrollIndicator={false}
+            >
+              {order?.order_group && order?.order_group_id && order?.isLogistic ? order?.order_group?.orders.map((order: any, i: number, hash: any) => (
+                <OrderDetailsInformation key={order?.id} order={order} isOrderGroup lastOrder={hash?.length === i + 1} />
+              )) : (
+                <OrderDetailsInformation order={order} />
+              )}
+            </OrderDetailsContainer>
+            {showFloatButtonsPickUp[order?.status] && (
+              <FloatingButton
+                disabled={props.order?.loading}
+                btnText={t('PICKUP_FAILED', 'Pickup failed')}
+                isSecondaryBtn={false}
+                secondButtonClick={() =>
+                  handleChangeOrderStatus && handleChangeOrderStatus(9)
+                }
+                firstButtonClick={() =>
+                  handleViewActionOrder && handleViewActionOrder('pickupFailed')
+                }
+                secondBtnText={t('PICKUP_COMPLETE', 'Pickup complete')}
+                secondButton={true}
+                firstColorCustom={theme.colors.red}
+                secondColorCustom={theme.colors.green}
+                widthButton={'45%'}
+              />
+            )}
+            {(order?.status === 9 || order?.status === 19) && (
+              <>
+                <FloatingButton
+                  disabled={props.order?.loading}
+                  btnText={t('DELIVERY_FAILED', 'Delivery Failed')}
+                  isSecondaryBtn={false}
+                  secondButtonClick={() =>
+                    handleChangeOrderStatus && handleChangeOrderStatus(11)
+                  }
+                  firstButtonClick={() =>
+                    handleViewActionOrder && handleViewActionOrder('deliveryFailed')
+                  }
+                  secondBtnText={t('DELIVERY_COMPLETE', 'Delivery complete')}
+                  secondButton={true}
+                  firstColorCustom={theme.colors.red}
+                  secondColorCustom={theme.colors.green}
+                  widthButton={'45%'}
+                />
+              </>
+            )}
+            {showFloatButtonsAcceptOrReject[order?.status] && (
+              <FloatingButton
+                btnText={t('REJECT', 'Reject')}
+                isSecondaryBtn={false}
+                secondButtonClick={() => (order?.isLogistic && (order?.order_group || logisticOrderStatus.includes(order?.status))) ? handleAcceptLogisticOrder(order) : handleViewActionOrder('accept')}
+                firstButtonClick={() => order?.isLogistic && (order?.order_group || logisticOrderStatus.includes(order?.status)) ? handleRejectLogisticOrder() : handleViewActionOrder('reject')}
+                secondBtnText={t('ACCEPT', 'Accept')}
+                secondButton={true}
+                firstColorCustom={theme.colors.red}
+                secondColorCustom={theme.colors.green}
+                widthButton={'45%'}
+              />
             )}
           </>
         )}

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

@@ -27,14 +27,16 @@ import { ReviewCustomer } from '../ReviewCustomer'
 
 interface OrderContent {
   order: any,
-  logisticOrderStatus?: Array<number>
+  logisticOrderStatus?: Array<number>,
+  isOrderGroup?: boolean,
+  lastOrder?: boolean
 }
 
 export const OrderContentComponent = (props: OrderContent) => {
   const [, t] = useLanguage();
   const theme = useTheme()
 
-  const { order, logisticOrderStatus } = props;
+  const { order, logisticOrderStatus, isOrderGroup, lastOrder } = props;
   const [{ parsePrice, parseNumber }] = useUtils();
   const [{ configs }] = useConfig();
   const [openReviewModal, setOpenReviewModal] = useState(false)
@@ -69,7 +71,10 @@ export const OrderContentComponent = (props: OrderContent) => {
   }
 
   return (
-    <OrderContent>
+    <OrderContent isOrderGroup={isOrderGroup} lastOrder={lastOrder}>
+      {isOrderGroup && (
+        <OText size={18}>{t('ORDER', 'Order')} #{isOrderGroup ? order?.order_group_id : order?.id}</OText>
+      )}
       <OrderBusiness>
         <OText style={{ marginBottom: 5 }} size={16} weight="600">
           {t('BUSINESS_DETAILS', 'Business details')}
@@ -148,42 +153,52 @@ export const OrderContentComponent = (props: OrderContent) => {
         <OText style={{ marginBottom: 5 }} size={16} weight="600">
           {t('CUSTOMER_DETAILS', 'Customer details')}
         </OText>
-
-        <View style={{ flexDirection: 'row' }}>
-          <OText numberOfLines={2} mBottom={4}>
-            <OText
-              numberOfLines={1}
-              mBottom={4}
-              ellipsizeMode="tail"
-              space>
-              {order?.customer?.name}
-            </OText>
-
-            <OText
-              numberOfLines={1}
-              mBottom={4}
-              ellipsizeMode="tail"
-              space>
-              {order?.customer?.middle_name}
-            </OText>
-
-            <OText
-              numberOfLines={1}
-              mBottom={4}
-              ellipsizeMode="tail"
-              space>
-              {order?.customer?.lastname}
-            </OText>
-
-            <OText
-              numberOfLines={1}
-              mBottom={4}
-              ellipsizeMode="tail"
-              space>
-              {order?.customer?.second_lastname}
-            </OText>
-          </OText>
-        </View>
+        {
+          (order?.customer?.name || order?.customer?.lastname) && (
+            <View style={{ flexDirection: 'row' }}>
+              <OText numberOfLines={2} mBottom={4}>
+                {order?.customer?.name && (
+                  <OText
+                    numberOfLines={1}
+                    mBottom={4}
+                    ellipsizeMode="tail"
+                    space>
+                    {order?.customer?.name}
+                  </OText>
+                )}
+                {order?.customer?.middle_name && (
+                  <OText
+                    numberOfLines={1}
+                    mBottom={4}
+                    ellipsizeMode="tail"
+                    space>
+                    {order?.customer?.middle_name}
+                  </OText>
+                )}
+                {order?.customer?.lastname && (
+                  <OText
+                    numberOfLines={1}
+                    mBottom={4}
+                    ellipsizeMode="tail"
+                    space>
+                    {order?.customer?.lastname}
+                  </OText>
+                )}
+                {
+                  order?.customer?.second_lastname && (
+                    <OText
+                      numberOfLines={1}
+                      mBottom={4}
+                      ellipsizeMode="tail"
+                      space>
+                      {order?.customer?.second_lastname}
+                    </OText>
+                  )
+                }
+              </OText>
+            </View>
+          )
+        }
 
         {!!order?.customer?.email && (
           <View style={styles.linkWithIcons}>

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

@@ -28,8 +28,8 @@ interface OrderHeader {
   handleOpenMessagesForBusiness?: any,
   getOrderStatus?: any,
   logisticOrderStatus?: Array<number>,
-  handleViewSummaryOrder: any;
-  handleCopyClipboard: any
+  handleViewSummaryOrder?: any;
+  handleCopyClipboard?: any
 }
 
 export const OrderHeaderComponent = (props: OrderHeader) => {
@@ -96,7 +96,7 @@ export const OrderHeaderComponent = (props: OrderHeader) => {
         />
 
         {
-          (!order?.isLogistic || !logisticOrderStatus?.includes(order?.status)) && (
+          (!order?.isLogistic || (!logisticOrderStatus?.includes(order?.status) && !order?.order_group)) && (
             <Actions>
               {getOrderStatus(order?.status, t)?.value !==
                 t('PENDING', 'Pending') && (
@@ -111,7 +111,7 @@ export const OrderHeaderComponent = (props: OrderHeader) => {
                       }}
                       borderColor={theme.colors.clear}
                       style={styles.icons}
-                      onClick={() => handleCopyClipboard()}
+                      onClick={() => handleCopyClipboard?.()}
                     />
                     <OIconButton
                       icon={theme.images.general.print}
@@ -122,7 +122,7 @@ export const OrderHeaderComponent = (props: OrderHeader) => {
                       }}
                       borderColor={theme.colors.clear}
                       style={styles.icons}
-                      onClick={() => handleViewSummaryOrder()}
+                      onClick={() => handleViewSummaryOrder?.()}
                     />
                   </>
                 )}
@@ -162,7 +162,7 @@ export const OrderHeaderComponent = (props: OrderHeader) => {
         <OText numberOfLines={2} size={20} weight="600">
           <>
             {`${t('INVOICE_ORDER_NO', 'Order No.')} ${order.id} `}
-            {(!order?.isLogistic || !logisticOrderStatus?.includes(order?.status)) && (
+            {!order?.isLogistic && (!order?.order_group_id || !logisticOrderStatus?.includes(order?.status)) && (
               <>
                 {t('IS', 'is')}{' '}
                 <OText
@@ -175,7 +175,7 @@ export const OrderHeaderComponent = (props: OrderHeader) => {
             )}
           </>
         </OText>
-        {(!order?.isLogistic || !logisticOrderStatus?.includes(order?.status)) && (
+        {!order?.isLogistic && (!order?.order_group_id || !logisticOrderStatus?.includes(order?.status)) && (
           <OText size={13}>
             {`${order?.paymethod?.name} - ${order.delivery_type === 1
               ? t('DELIVERY', 'Delivery')

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

@@ -1,4 +1,4 @@
-import styled from 'styled-components/native';
+import styled, { css } from 'styled-components/native';
 
 export const OrderDetailsContainer = styled.ScrollView`
   flex: 1;
@@ -25,6 +25,15 @@ export const Logo = styled.View`
 
 export const OrderContent = styled.View`
   flex: 1;
+  ${(props : any) => props.isOrderGroup && css`
+    border-color: rgba(0, 0, 0, 0.2);
+    border-width: 1px;
+    padding: 10px;
+  `
+  }
+  ${(props : any) => props.lastOrder && css`
+    margin-bottom: 50px;
+  `}
 `;
 
 export const OrderHeader = styled.View`
@@ -45,7 +54,7 @@ export const OrderBusiness = styled.View`
 export const OrderCustomer = styled.View`
   border-bottom-width: 10px;
   border-bottom-color: ${(props: any) => props.theme.colors.inputChat};
-  padding-vertical: 20px;
+  padding-vertical: 10px;
 `;
 
 export const OrderProducts = styled(OrderCustomer)``;

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

@@ -187,7 +187,7 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
   };
 
   const getOrderStatus = (key: number) => {
-    return orderStatus.find((status: any) => status.key === key)?.text;
+    return orderStatus.find((status: any) => status?.key === key)?.text;
   };
 
   const applyFilters = () => {
@@ -454,7 +454,7 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
             currentTabSelected !== 'logisticOrders' &&
             (
               <PreviousOrders
-                orders={currentOrdersGroup.orders}
+                orders={currentOrdersGroup?.orders}
                 onNavigationRedirect={onNavigationRedirect}
                 getOrderStatus={getOrderStatus}
                 handleClickOrder={handleClickOrder}
@@ -464,7 +464,7 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
             logisticOrders?.orders?.length > 0 &&
             currentTabSelected === 'logisticOrders' && (
               <PreviousOrders
-                orders={logisticOrders.orders.filter((order: any) => !order?.expired).map((order: any) => ({ ...order, isLogistic: true }))}
+                orders={logisticOrders?.orders?.filter((order: any) => !order?.expired).map((order: any) => ({ ...order, isLogistic: true }))}
                 onNavigationRedirect={onNavigationRedirect}
                 getOrderStatus={getOrderStatus}
                 handleClickLogisticOrder={handleClickLogisticOrder}
@@ -528,13 +528,13 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
             (currentOrdersGroup?.error?.length ||
               currentOrdersGroup?.orders?.length === 0)) ||
             (currentTabSelected === 'logisticOrders' &&
-              (logisticOrders?.error?.length > 0 || logisticOrders?.orders?.length === 0))
+              (logisticOrders?.error?.length > 0 || logisticOrders?.orders?.length === 0 || !logisticOrders?.orders?.some(order => !order?.expired)))
           ) &&
             (
               <NotFoundSource
                 content={
                   ((currentTabSelected !== 'logisticOrders' && !currentOrdersGroup?.error?.length) ||
-                    (currentTabSelected === 'logisticOrders' && !logisticOrders?.error?.length))
+                    (currentTabSelected === 'logisticOrders' && (!logisticOrders?.error?.length || (logisticOrders?.orders?.length > 0 && !logisticOrders?.orders?.some(order => !order?.expired)))))
                     ? t('NO_RESULTS_FOUND', 'Sorry, no results found')
                     : currentOrdersGroup?.error?.[0]?.message ||
                     currentOrdersGroup?.error?.[0] ||

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

@@ -85,9 +85,9 @@ export const PreviousOrders = (props: any) => {
     <>
       {orders && orders?.length > 0 &&
         orders
-          .filter((order: any) => hash[order?.id] ? false : (hash[order?.id] = true))
-          .map((_order: any) => {
-            const order = _order?.isLogistic && !_order?.order_group ? _order?.order : _order
+          ?.filter((order: any) => hash[order?.id] ? false : (hash[order?.id] = true))
+          ?.map((_order: any) => {
+            const order = _order?.isLogistic && !_order?.order_group && isLogisticOrder ? _order?.order : _order
             return (
               <View
                 style={{
@@ -116,9 +116,9 @@ export const PreviousOrders = (props: any) => {
                         </Logo>
                       )}
                     <Information>
-                      {order?.order_group && order?.order_group_id && (
+                      {order?.order_group_id && (
                         <OText>
-                          <OText>{order?.order_group?.orders?.length} {t('ORDERS', 'Orders')}</OText>
+                          <OText>{(t('INVOICE_GROUP_NO', 'Group No.') + order?.order_group_id)}</OText>
                         </OText>
                       )}
                       {order.business?.name && (
@@ -140,7 +140,7 @@ export const PreviousOrders = (props: any) => {
                         numberOfLines={1}
                         adjustsFontSizeToFit
                         size={20}>
-                        {(order?.order_group && order?.order_group_id ? (t('INVOICE_GROUP_NO', 'Group No.') + order?.order_group_id) : (t('INVOICE_ORDER_NO', 'Order No.') + order.id)) + ' · '}
+                        {(order?.order_group_id && order?.order_group && isLogisticOrder ? `${order?.order_group?.orders?.length} ${t('ORDERS', 'Orders')}` : (t('INVOICE_ORDER_NO', 'Order No.') + order.id)) + ' · '}
                         {order?.delivery_datetime_utc
                           ? parseDate(order?.delivery_datetime_utc)
                           : parseDate(order?.delivery_datetime, { utc: false })}
@@ -171,26 +171,41 @@ export const PreviousOrders = (props: any) => {
                 </TouchableOpacity>
                 {isLogisticOrder && (
                   <AcceptOrRejectOrder>
-                    <OButton
-                      text={t('REJECT', 'Reject')}
-                      onClick={() => handleClickLogisticOrder(2, _order?.id)}
-                      bgColor={theme.colors.danger}
-                      borderColor={theme.colors.danger}
-                      imgRightSrc={null}
-                      style={{ borderRadius: 7, height: 40 }}
-                      parentStyle={{ width: '45%' }}
-                      textStyle={{ color: theme.colors.dangerText }}
-                    />
-                    <OButton
-                      text={t('ACCEPT', 'Accept')}
-                      onClick={() => handleClickLogisticOrder(1, _order?.id)}
-                      bgColor={theme.colors.successOrder}
-                      borderColor={theme.colors.successOrder}
-                      imgRightSrc={null}
-                      style={{ borderRadius: 7, height: 40 }}
-                      parentStyle={{ width: '45%' }}
-                      textStyle={{ color: theme.colors.successText }}
-                    />
+                    {order?.order_group_id && order?.order_group ? (
+                      <OButton
+                        text={t('VIEW_ORDER', 'View order')}
+                        onClick={() => handlePressOrder({ ...order, logistic_order_id: _order?.id })}
+                        bgColor={theme.colors.blueLight}
+                        borderColor={theme.colors.blueLight}
+                        imgRightSrc={null}
+                        style={{ borderRadius: 7, height: 40 }}
+                        parentStyle={{ width: '100%' }}
+                        textStyle={{ color: theme.colors.primary }}
+                      />
+                    ) : (
+                    <>
+                      <OButton
+                        text={t('REJECT', 'Reject')}
+                        onClick={() => handleClickLogisticOrder(2, _order?.id)}
+                        bgColor={theme.colors.danger}
+                        borderColor={theme.colors.danger}
+                        imgRightSrc={null}
+                        style={{ borderRadius: 7, height: 40 }}
+                        parentStyle={{ width: '45%' }}
+                        textStyle={{ color: theme.colors.dangerText }}
+                      />
+                      <OButton
+                        text={t('ACCEPT', 'Accept')}
+                        onClick={() => handleClickLogisticOrder(1, _order?.id)}
+                        bgColor={theme.colors.successOrder}
+                        borderColor={theme.colors.successOrder}
+                        imgRightSrc={null}
+                        style={{ borderRadius: 7, height: 40 }}
+                        parentStyle={{ width: '45%' }}
+                        textStyle={{ color: theme.colors.successText }}
+                      />
+                    </>
+                    )}
                   </AcceptOrRejectOrder>
                 )}
               </View>