ordering-ui-react-native 0.17.97 → 0.17.98-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'
@@ -9,7 +12,6 @@ const TitleWrapper = styled.View`
   padding-horizontal: 10px;
 `
 const TitleTopWrapper = styled.View`
-  flex: 1;
   flex-direction: row;
   align-items: center;
 `
@@ -17,8 +19,10 @@ const TitleTopWrapper = styled.View`
 const btnBackArrow = {
 	borderWidth: 0,
 	backgroundColor: '#FFF',
-	borderColor: '#FFF',
-	shadowColor: '#FFF'
+	borderColor: '#fff',
+	shadowColor: '#FFF',
+	paddingLeft: 30,
+	paddingRight: 30
 }
 
 interface Props {
@@ -42,6 +46,7 @@ interface Props {
 	paddingTop?: number,
 	isVertical?: boolean,
 	noMargin?: any
+	hideArrowLeft?: boolean
 }
 
 const NavBar = (props: Props) => {
@@ -52,8 +57,6 @@ const NavBar = (props: Props) => {
 		background-color: ${theme.colors.white};
 		padding: 10px 20px 20px 0px;
 		flex-direction: row;
-		justify-content: center;
-		align-items: center;
 		position: relative;
 	`
 
@@ -62,13 +65,18 @@ const NavBar = (props: Props) => {
 	}
 	return (
 		<Wrapper style={{ paddingTop: props.paddingTop, ...{ flexDirection: props.isVertical ? 'column' : 'row', alignItems: props.isVertical ? 'flex-start' : 'center' }, ...props.style }}>
-			<OButton
-				imgLeftSrc={theme.images.general.arrow_left}
-				imgLeftStyle={{ width: 26 }}
-				imgRightSrc={null}
-				style={{ ...btnBackArrow, ...props.btnStyle, ...props.isVertical ? (I18nManager.isRTL ? { paddingRight: 0 } : { paddingLeft: 0 }) : {} }}
-				onClick={props?.onActionLeft}
-			/>
+			{!props.hideArrowLeft && (
+				<OButton
+					iconProps={{
+						name: 'arrowleft',
+						size: 26
+					}}
+					icon={AntDesignIcon}
+					imgRightSrc={null}
+					style={{ ...btnBackArrow, ...props.btnStyle, ...props.isVertical ? (I18nManager.isRTL ? { paddingRight: 0 } : { paddingLeft: 0 }) : {} }}
+					onClick={props?.onActionLeft}
+				/>
+			)}
 			<TitleTopWrapper>
 				{props.withIcon
 					? (
@@ -87,7 +95,6 @@ const NavBar = (props: Props) => {
 				<TitleWrapper style={{ ...{ paddingHorizontal: props.isVertical ? 0 : 10 }, ...props.titleWrapStyle }}>
 					<OText
 						size={20}
-						lineHeight={36}
 						weight={Platform.OS === 'ios' ? '600' : 'bold'}
 						style={
 							{

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

@@ -1,8 +1,9 @@
 import React from 'react'
 import { View } from 'react-native'
-import { OButton, OIcon, OText } from '../shared'
+import { OButton, OText } from '../shared'
 import { NotFoundSourceParams } from '../../types'
 import { useTheme } from 'styled-components/native';
+import Foundation from 'react-native-vector-icons/Foundation'
 import {
 	NotFound,
 	NotFoundImage
@@ -10,34 +11,37 @@ import {
 
 export const NotFoundSource = (props: NotFoundSourceParams) => {
 	const {
-		image,
+		hideImage,
 		content,
 		btnTitle,
+		btnStyle,
 		conditioned,
 		onClickButton
 	} = props
 
 	const theme = useTheme();
 
-	const errorImage = image || theme.images.general.notFound
-	const isUrl = typeof errorImage === 'string' && errorImage.includes('http')
-
 	return (
 		<NotFound>
-			{errorImage && (
+			{!hideImage && (
 				<NotFoundImage>
-					<OIcon url={isUrl && errorImage} src={!isUrl && errorImage} width={260} height={220} />
+					<Foundation
+						name='page-search'
+						color={theme.colors.primary}
+						size={60}
+						style={{ marginBottom: 10 }}
+					/>
 				</NotFoundImage>
 			)}
-			{content && conditioned && !errorImage && <OText color={theme.colors.disabled} size={18} style={{ textAlign: 'center' }}>{content}</OText>}
-			{content && !conditioned && <OText color={theme.colors.disabled} size={18} style={{ textAlign: 'center' }}>{content}</OText>}
+			{content && conditioned && <OText color={theme.colors.disabled} size={16} style={{ textAlign: 'center' }}>{content}</OText>}
+			{content && !conditioned && <OText color={theme.colors.disabled} size={16} style={{ textAlign: 'center' }}>{content}</OText>}
 			{!onClickButton && props.children && (
 				props.children
 			)}
 			{onClickButton && (
 				<View style={{ marginTop: 10, width: '100%' }}>
 					<OButton
-						style={{ width: '100%', height: 50 }}
+						style={{ width: '100%', height: 50, ...btnStyle }}
 						bgColor={theme.colors.primary}
 						borderColor={theme.colors.primary}
 						onClick={() => onClickButton()}

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

@@ -0,0 +1,76 @@
+import React, { useEffect, useState } from 'react'
+import { useUtils } from 'ordering-components/native'
+import moment from 'moment'
+
+export const OrderEta = (props: any) => {
+  const {
+    order,
+    outputFormat
+  } = props
+
+  const [{ parseDate }] = useUtils()
+  const [estimatedDeliveryTime, setEstimatedDeliveryTime] = useState(null)
+
+  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) {
+      totalEta += order?.eta_drive_time
+    }
+
+    const _delivery = order?.delivery_datetime_utc
+      ? order?.delivery_datetime_utc
+      : order?.delivery_datetime
+
+    if (order?.eta_current_status_time) {
+      const currentStatueEta = order?.eta_current_status_time
+      totalEta += currentStatueEta
+      let previousStatusTimes = 0
+      if (order?.eta_previous_status_times) {
+        Object.keys(order.eta_previous_status_times).map(key => {
+          if (!key.includes('status_penalty')) {
+            previousStatusTimes += order.eta_previous_status_times[key]
+          }
+        })
+      }
+      totalEta += previousStatusTimes
+
+      let nextStatusTimes = 0
+      if (order?.eta_next_status_times) {
+        Object.keys(order.eta_next_status_times).map(key => {
+          if (!key.includes('status_penalty')) {
+            nextStatusTimes += order.eta_next_status_times[key]
+          }
+        })
+      }
+      totalEta += nextStatusTimes
+
+      const diffTimeAsSeconds = moment.utc(order?.reporting_data?.at[`status:${order.status}`]).add(order?.eta_current_status_time, 'minutes').diff(moment().utc(), 'seconds')
+      const diffTimeAsMinutes = Math.ceil(diffTimeAsSeconds / 60)
+      if (diffTimeAsMinutes <= 0) {
+        totalEta += (Math.floor(Math.abs(diffTimeAsMinutes / order?.eta_current_status_time) + 1) * order?.eta_current_status_penalty_time)
+      }
+    } else {
+      totalEta = order?.eta_time + totalEta
+    }
+    estimatedUtcTime = moment.utc(_delivery).add(totalEta, 'minutes')
+    const _estimatedTime = outputFormat ? moment(estimatedUtcTime).local().format(outputFormat) : parseDate(estimatedUtcTime, { utc: false })
+    setEstimatedDeliveryTime(_estimatedTime)
+  }
+
+  useEffect(() => {
+    getEstimatedDeliveryTime()
+    const interval = setInterval(() => {
+      getEstimatedDeliveryTime()
+    }, 1000)
+    return () => clearInterval(interval)
+  }, [order, outputFormat])
+
+  return (
+    <>
+      {estimatedDeliveryTime}
+    </>
+  )
+}

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

@@ -4,6 +4,7 @@ import { ScrollView, StyleSheet, View } from 'react-native'
 import { useLanguage, useUtils } from 'ordering-components/native'
 import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityIcons'
 import { OText, OButton } from '../shared'
+import { formatSeconds } from '../../utils'
 
 export const OrderHistory = (props: any) => {
   const {
@@ -61,7 +62,7 @@ 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'
   }
 
   const getLogisticTagStatus = (status: any) => {
@@ -106,8 +107,12 @@ export const OrderHistory = (props: any) => {
               ellipsizeMode='tail'
             >
               {t('ORDER_PLACED', 'Order placed')} {' '}
-              {t('VIA', 'Via')}{' '}
-              {order.app_id ? t(order.app_id.toUpperCase(), order.app_id) : t('OTHER', 'Other')}
+              {!props.hideViaText && (
+                <>
+                  {t('VIA', 'Via')}{' '}
+                  {order.app_id ? t(order.app_id.toUpperCase(), order.app_id) : t('OTHER', 'Other')}
+                </>
+              )}
             </OText>
             <OText size={12}>{parseDate(order?.created_at, { outputFormat: 'MMM DD, hh:mm A' })}</OText>
           </View>
@@ -128,12 +133,23 @@ export const OrderHistory = (props: any) => {
               <OText
                 size={14}
                 weight='bold'
-                numberOfLines={1}
+                numberOfLines={message.change?.attribute.includes(['delivered_in', 'prepared_in']) ? 2 : 1}
                 ellipsizeMode='tail'
               >
                 {message.change?.attribute === 'logistic_status'
                   ? getLogisticTagStatus(parseInt(message.change.new, 10))
-                  : t(ORDER_STATUS[parseInt(message.change.new, 10)])
+                  : message.change?.attribute === 'delivered_in' ? (
+                    <>
+                      {t('TIME_ADDED_BY_DRIVER', 'Time added by driver')}{'\n'}
+                      {formatSeconds(parseInt(message.change.new, 10))}
+                    </>
+                  )
+                    : message.change?.attribute === 'prepared_in' ? (
+                    <>
+                      {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>
             ) : (

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

@@ -7,7 +7,9 @@ import {
   OrderDetails as OrderDetailsConTableoller,
   useUtils,
   useOrder,
-  useConfig
+  useConfig,
+  useToast,
+  ToastType
 } from 'ordering-components/native';
 import { useTheme } from 'styled-components/native';
 import { showLocation } from 'react-native-map-link';
@@ -40,7 +42,7 @@ import { ProductItemAccordion } from '../ProductItemAccordion';
 import { TouchableOpacity } from 'react-native-gesture-handler';
 import { OrderDetailsParams } from '../../types';
 import { GoogleMap } from '../GoogleMap';
-import { verifyDecimals, getOrderStatus } from '../../utils';
+import { verifyDecimals, getOrderStatus, getOrderStatuPickUp } from '../../utils';
 import { OSRow } from '../OrderSummary/styles';
 import AntIcon from 'react-native-vector-icons/AntDesign'
 import { TaxInformation } from '../TaxInformation';
@@ -49,6 +51,7 @@ import NavBar from '../NavBar'
 import { OrderHistory } from './OrderHistory';
 import { PlaceSpot } from '../PlaceSpot'
 import { SendGiftCard } from '../GiftCard/SendGiftCard'
+import { OrderEta } from './OrderEta'
 export const OrderDetailsUI = (props: OrderDetailsParams) => {
   const {
     navigation,
@@ -64,7 +67,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
   } = props;
 
   const theme = useTheme();
-
+  const [, { showToast }] = useToast()
   const styles = StyleSheet.create({
     rowDirection: {
       flexDirection: 'row',
@@ -120,7 +123,9 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
   const mapValidStatuses = [9, 19, 23]
   const placeSpotTypes = [3, 4, 5]
   const directionTypes = [2, 3, 4, 5]
-  const activeStatus = [0, 3, 4, 7, 8, 9, 14, 18, 19, 20, 21, 22, 23]
+  const activeStatus = [0, 3, 4, 7, 8, 9, 13, 14, 18, 19, 20, 21, 22, 23]
+  const reorderStatus = [1, 2, 5, 6, 10, 11, 12]
+  const [isPickup, setIsPickup] = useState(order?.delivery_type === 2)
   const enabledPoweredByOrdering = configs?.powered_by_ordering_module?.value
   const isGiftCardOrder = !order?.business_id
   const hideDeliveryDate = theme?.confirmation?.components?.order?.components?.date?.hidden
@@ -134,6 +139,7 @@ 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 progressBarObjt = isPickup ? getOrderStatuPickUp : getOrderStatus
   const walletName: any = {
     cash: {
       name: t('PAY_WITH_CASH_WALLET', 'Pay with Cash Wallet'),
@@ -191,7 +197,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
         order: {
           id: order?.id,
           business_id: order?.business_id,
-          logo: order.business?.logo,
+          logo: order.business?.logo || theme.images.dummies.businessLogo,
           driver: order?.driver,
           products: order?.products,
           review: order?.review,
@@ -335,6 +341,19 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
     }
   }, [driverLocation]);
 
+  useEffect(() => {
+    if (props?.order?.error && !props?.order?.loading) {
+      showToast(ToastType.Error, props?.order?.error)
+      navigation.navigate('BusinessList')
+    }
+  }, [props?.order?.error, props?.order?.loading])
+
+
+  useEffect(() => {
+    if (!order?.delivery_type) return
+    setIsPickup(order?.delivery_type === 2)
+  }, [order?.delivery_type])
+
   return (
     <OrderDetailsContainer
       keyboardShouldPersistTaps="handled"
@@ -410,13 +429,11 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
               titleWrapStyle={{ paddingHorizontal: 0 }}
               titleStyle={{ marginRight: 0, marginLeft: 0 }}
               subTitle={!hideDeliveryDate && <OText size={12} lineHeight={18} color={theme.colors.textNormal}>
-                {
-                  activeStatus.includes(order?.status)
-                    ? order?.eta_time + 'min'
-                    : order?.delivery_datetime_utc
-                      ? parseDate(order?.delivery_datetime_utc)
-                      : parseDate(order?.delivery_datetime, { utc: false })
-                }
+                {activeStatus.includes(order?.status) ? (
+                  <OrderEta order={order} />
+                ) : (
+                  parseDate(order?.reporting_data?.at[`status:${order.status}`])
+                )}
               </OText>}
             />
             {enabledPoweredByOrdering && (
@@ -472,7 +489,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
                         <LinearGradient
                           start={{ x: 0.0, y: 0.0 }}
                           end={{
-                            x: getOrderStatus(order?.status)?.percentage || 0,
+                            x: progressBarObjt(order?.status)?.percentage || 0,
                             y: 0,
                           }}
                           locations={[0.9999, 0.9999]}
@@ -485,7 +502,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
                         lineHeight={24}
                         weight={'600'}
                         color={theme.colors.textNormal}>
-                        {getOrderStatus(order?.status)?.value}
+                        {progressBarObjt(order?.status)?.value}
                       </OText>
                     </>
                   )}
@@ -783,25 +800,17 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
                   parentStyle={{ marginTop: 29, marginEnd: 15 }}
                   onClick={() => navigation.navigate('BottomTab', { screen: 'MyOrders' })}
                 />
-                {(
-                  parseInt(order?.status) === 1 ||
-                  parseInt(order?.status) === 2 ||
-                  parseInt(order?.status) === 5 ||
-                  parseInt(order?.status) === 6 ||
-                  parseInt(order?.status) === 10 ||
-                  parseInt(order?.status) === 11 ||
-                  parseInt(order?.status) === 12
-                ) && (
-                    <OButton
-                      text={order.id === reorderState?.loading ? t('LOADING', 'Loading..') : t('REORDER', 'Reorder')}
-                      textStyle={{ fontSize: 14, color: theme.colors.primary }}
-                      imgRightSrc={null}
-                      borderColor='transparent'
-                      bgColor={theme.colors.primary + 10}
-                      style={{ borderRadius: 7.6, borderWidth: 1, height: 44, shadowOpacity: 0, marginTop: 29 }}
-                      onClick={() => handleReorder && handleReorder(order.id)}
-                    />
-                  )}
+                {(reorderStatus?.includes(parseInt(order?.status)) && order?.cart) && !isGiftCardOrder && (
+                  <OButton
+                    text={order.id === reorderState?.loading ? t('LOADING', 'Loading..') : t('REORDER', 'Reorder')}
+                    textStyle={{ fontSize: 14, color: theme.colors.primary }}
+                    imgRightSrc={null}
+                    borderColor='transparent'
+                    bgColor={theme.colors.primary + 10}
+                    style={{ borderRadius: 7.6, borderWidth: 1, height: 44, shadowOpacity: 0, marginTop: 29 }}
+                    onClick={() => handleReorder && handleReorder(order.id)}
+                  />
+                )}
               </OrderAction>
             </HeaderInfo>
             <OrderProducts>
@@ -935,7 +944,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
                   </Table>
                 ))
               }
-              {order?.summary?.delivery_price > 0 && (
+              {typeof order?.summary?.delivery_price === 'number' && (
                 <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>
@@ -1010,16 +1019,18 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
                           <OText>
                             {event?.wallet_event
                               ? walletName[event?.wallet_event?.wallet?.type]?.name
-                              : event?.paymethod?.name}
+                              : t(event?.paymethod?.name.toUpperCase()?.replace(/ /g, '_'), event?.paymethod?.name)}
                           </OText>
-                          {event?.data?.charge_id && (
+                          {/* {event?.data?.charge_id && (
                             <OText>
                               {`${t('CODE', 'Code')}: ${event?.data?.charge_id}`}
                             </OText>
-                          )}
+                          )} */}
                         </View>
                         <OText>
-                          -{parsePrice(event.amount, { isTruncable: true })}
+                          {configs.currency_position?.value === 'left'
+                            ? `${configs.format_number_currency?.value} -${parseNumber(event.amount, { isTruncable: true })}`
+                            : `-${parsePrice(event.amount, { isTruncable: true })}`}
                         </OText>
                       </View>
                     ))}
@@ -1065,6 +1076,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
       >
         <OrderHistory
           order={order}
+          hideViaText={props.hideViaText}
           messages={messages}
           enableReview={(
             parseInt(order?.status) === 1 ||

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/OrderItAgain/index.tsx

@@ -20,7 +20,8 @@ export const OrderItAgain = (props: OrderItAgainParams) => {
     currentCart,
     handleUpdateProducts,
     navigation,
-    searchValue
+    searchValue,
+    businessSingleId
   } = props
 
   const [, t] = useLanguage()
@@ -65,6 +66,7 @@ export const OrderItAgain = (props: OrderItAgainParams) => {
                 handleUpdateProducts={handleUpdateProducts}
                 navigation={navigation}
                 isPreviously
+                businessSingleId={businessSingleId}
               />
             </ProductWrapper>
           ))}

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

@@ -2,7 +2,8 @@ import React, { useEffect, useState } from 'react'
 import {
   OrderList,
   useLanguage,
-  useUtils
+  useUtils,
+  useConfig
 } from 'ordering-components/native'
 import { useTheme } from 'styled-components/native';
 import IconAntDesign from 'react-native-vector-icons/AntDesign'
@@ -12,6 +13,7 @@ import { NotFoundSource } from '../NotFoundSource'
 import { View, StyleSheet, TouchableOpacity, Platform } from 'react-native'
 import { Placeholder, Fade, PlaceholderLine } from "rn-placeholder";
 import FastImage from 'react-native-fast-image'
+import { OrderEta } from '../OrderDetails/OrderEta'
 import {
   ProgressContentWrapper,
   ProgressBar,
@@ -20,7 +22,7 @@ import {
   OrderInfoWrapper,
   OrderProgressWrapper
 } from './styles'
-import { getOrderStatus } from '../../utils'
+import { getOrderStatuPickUp, getOrderStatus } from '../../utils'
 
 const OrderProgressUI = (props: any) => {
   const {
@@ -33,10 +35,12 @@ const OrderProgressUI = (props: any) => {
   const theme = useTheme();
 
   const [, t] = useLanguage()
-  const [{ optimizeImage, parseDate, parseTime }] = useUtils()
+  const [{ optimizeImage, parseTime, parseDate }] = useUtils()
+  const [{ configs }] = useConfig()
   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 styles = StyleSheet.create({
     main: {
@@ -76,15 +80,6 @@ const OrderProgressUI = (props: any) => {
     }
   });
 
-  const convertDiffToHours = (order: any) => {
-    const minute = order?.eta_time
-    const deliveryTime = order?.delivery_datetime_utc
-      ? parseDate(order?.delivery_datetime_utc, { outputFormat: 'YYYY-MM-DD HH:mm' })
-      : parseDate(order?.delivery_datetime, { utc: false, outputFormat: 'YYYY-MM-DD HH:mm' })
-    const returnedDate = moment(deliveryTime).add(minute, 'minutes').format('hh:mm A')
-    return returnedDate
-  }
-
   const handleGoToOrder = (index: string) => {
     navigation && navigation.navigate(index)
   }
@@ -92,7 +87,15 @@ const OrderProgressUI = (props: any) => {
   useEffect(() => {
     if (orderList?.orders.length > 0) {
       const sortedOrders = orderList.orders.sort((a: any, b: any) => a.id > b.id ? -1 : 1)
-      setLastOrder(sortedOrders[0])
+      const orderInProgress = sortedOrders.find((order: any) => (statusToShow.includes(order.status)))
+
+      let _lastOrder = null
+      if (orderInProgress) {
+        _lastOrder = orderInProgress
+      } else {
+        _lastOrder = sortedOrders[0]
+      }
+      setLastOrder(_lastOrder)
     }
   }, [orderList?.orders])
 
@@ -107,6 +110,8 @@ const OrderProgressUI = (props: any) => {
     setInitialLoaded(true)
   }, [orderList.loading, initialLoaded])
 
+  const progressBarObjt = lastOrder?.delivery_type && lastOrder?.delivery_type === 2 ? getOrderStatuPickUp : getOrderStatus
+
   return (
     <>
       {(orderList?.loading && !initialLoaded) && (
@@ -125,11 +130,11 @@ const OrderProgressUI = (props: any) => {
               <View style={styles.logoWrapper}>
                 <FastImage
                   style={{ width: 50, height: 50 }}
-                  source={{
+                  source={orderList?.orders.length === 1 ? {
                     uri: optimizeImage(lastOrder?.business?.logo, 'h_50,c_limit'),
                     priority: FastImage.priority.normal,
-                  }}
-                  resizeMode={FastImage.resizeMode.cover}
+                  } : theme.images.logos.logotype}
+                  resizeMode={FastImage.resizeMode.contain}
                 />
               </View>
               <View style={{
@@ -143,8 +148,7 @@ const OrderProgressUI = (props: any) => {
                     fontWeight: 'bold',
                     marginBottom: 3
                   }}
-                >{t('ORDER_IN_PROGRESS', 'Order in progress')}</OText>
-                <OText size={11} numberOfLines={1} ellipsizeMode='tail'>{t('RESTAURANT_PREPARING_YOUR_ORDER', 'The restaurant is preparing your order')}</OText>
+                >{statusToShow.includes(lastOrder?.status) ? t('ORDER_IN_PROGRESS', 'Order in progress') : t('ORDER', 'Order')}</OText>
                 <TouchableOpacity onPress={() => handleGoToOrder('MyOrders')}>
                   <View style={styles.navigationButton}>
                     <OText size={11} color={theme.colors.primary}>{t('GO_TO_MY_ORDERS', 'Go to my orders')}</OText>
@@ -160,18 +164,22 @@ const OrderProgressUI = (props: any) => {
             </OrderInfoWrapper>
             <View style={{ flex: 1 }}>
               <ProgressContentWrapper>
-                <ProgressBar style={{ width: getOrderStatus(lastOrder.status)?.percentage ? `${getOrderStatus(lastOrder.status)?.percentage}%` : '0%' }} />
+                <ProgressBar style={{ width: progressBarObjt(lastOrder.status)?.percentage ? `${(progressBarObjt(lastOrder.status) as any).percentage * 100}%` : '0%' }} />
               </ProgressContentWrapper>
               <ProgressTextWrapper>
-                <OText size={12} style={{ width: '50%' }}>{getOrderStatus(lastOrder.status)?.value}</OText>
+                <OText size={12} style={{ width: '50%' }}>{progressBarObjt(lastOrder.status)?.value}</OText>
                 <TimeWrapper>
-                  <OText size={11}>{t('ESTIMATED_DELIVERY', 'Estimated delivery')}</OText>
+                  <OText size={11}>{lastOrder?.delivery_type === 1 ? t('ESTIMATED_DELIVERY', 'Estimated delivery') : t('ESTIMATED_TIME', 'Estimated time')}</OText>
                   <OText size={11}>
                     {lastOrder?.delivery_datetime_utc
-                      ? parseTime(lastOrder?.delivery_datetime_utc, { outputFormat: 'hh:mm A' })
+                      ? parseTime(lastOrder?.delivery_datetime_utc, { outputFormat: configs?.general_hour_format?.value || 'HH:mm' })
                       : parseTime(lastOrder?.delivery_datetime, { utc: false })}
                     &nbsp;-&nbsp;
-                    {convertDiffToHours(lastOrder)}
+                    {statusToShow.includes(lastOrder?.status) ? (
+                      <OrderEta order={lastOrder} outputFormat={configs?.general_hour_format?.value || 'HH:mm'} />
+                    ) : (
+                      parseDate(lastOrder?.reporting_data?.at[`status:${lastOrder.status}`], { outputFormat: configs?.general_hour_format?.value })
+                    )}
                   </OText>
                 </TimeWrapper>
               </ProgressTextWrapper>
@@ -198,9 +206,10 @@ export const OrderProgress = (props: any) => {
     useDefualtSessionManager: true,
     paginationSettings: {
       initialPage: 1,
-      pageSize: 1,
+      pageSize: 10,
       controlType: 'infinity'
-    }
+    },
+    noGiftCardOrders: true
   }
 
   return <OrderList {...orderProgressProps} />