ordering-ui-react-native 0.14.84 → 0.14.87

package/package.json

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

package/src/components/OrderDetails/index.tsx

@@ -134,7 +134,9 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
       { key: 18, value: t('DRIVER_ALMOST_ARRIVED_TO_BUSINESS', 'Driver almost arrived to business'), slug: 'DRIVER_ALMOST_ARRIVED_TO_BUSINESS', percentage: 0.15, image: theme.images.order.status18 },
       { key: 19, value: t('DRIVER_ALMOST_ARRIVED_TO_CUSTOMER', 'Driver almost arrived to customer'), slug: 'DRIVER_ALMOST_ARRIVED_TO_CUSTOMER', percentage: 0.90, image: theme.images.order.status19 },
       { key: 20, value: t('ORDER_CUSTOMER_ALMOST_ARRIVED_BUSINESS', 'Customer almost arrived to business'), slug: 'ORDER_CUSTOMER_ALMOST_ARRIVED_BUSINESS', percentage: 90, image: theme.images.order.status20 },
-      { key: 21, value: t('ORDER_CUSTOMER_ARRIVED_BUSINESS', 'Customer arrived to business'), slug: 'ORDER_CUSTOMER_ARRIVED_BUSINESS', percentage: 95, image: theme.images.order.status21 }
+      { key: 21, value: t('ORDER_CUSTOMER_ARRIVED_BUSINESS', 'Customer arrived to business'), slug: 'ORDER_CUSTOMER_ARRIVED_BUSINESS', percentage: 95, image: theme.images.order.status21 },
+      { key: 22, value: t('ORDER_LOOKING_FOR_DRIVER', 'Looking for driver'), slug: 'ORDER_LOOKING_FOR_DRIVER', percentage: 35, image: theme.images.order.status22 },
+      { key: 23, value: t('ORDER_DRIVER_ON_WAY', 'Driver on way'), slug: 'ORDER_DRIVER_ON_WAY', percentage: 45, image: theme.images.order.status23 }
     ]
 
 

package/src/components/OrdersOption/index.tsx

@@ -91,7 +91,9 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
       { key: 18, value: t('DRIVER_ALMOST_ARRIVED_TO_BUSINESS', 'Driver almost arrived to business') },
       { key: 19, value: t('DRIVER_ALMOST_ARRIVED_TO_CUSTOMER', 'Driver almost arrived to customer') },
       { key: 20, value: t('ORDER_CUSTOMER_ALMOST_ARRIVED_BUSINESS', 'Customer almost arrived to business') },
-      { key: 21, value: t('ORDER_CUSTOMER_ARRIVED_BUSINESS', 'Customer arrived to business') }
+      { key: 21, value: t('ORDER_CUSTOMER_ARRIVED_BUSINESS', 'Customer arrived to business') },
+      { key: 22, value: t('ORDER_LOOKING_FOR_DRIVER', 'Looking for driver') },
+      { key: 23, value: t('ORDER_DRIVER_ON_WAY', 'Driver on way') }
     ]
 
     const objectStatus = orderStatus.find((o) => o.key === status)
@@ -213,7 +215,7 @@ export const OrdersOption = (props: OrdersOptionParams) => {
     ...props,
     UIComponent: OrdersOptionUI,
     orderStatus: props.activeOrders
-      ? [0, 3, 4, 7, 8, 9, 13, 14, 15, 18, 19, 20, 21]
+      ? [0, 3, 4, 7, 8, 9, 13, 14, 15, 18, 19, 20, 21, 22, 23]
       : [1, 2, 5, 6, 10, 11, 12, 16, 17],
     useDefualtSessionManager: true,
     paginationSettings: {

package/src/utils/index.tsx

@@ -191,3 +191,71 @@ export const transformCountryCode = (countryCode : number) => {
   const c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a))
   return R * c
 }
+
+/**
+ * function to manage review comment list
+ * @param {number} param0 type of reviews to return
+ * @returns object with reviews dictionary
+ */
+ export const reviewCommentList = (type: string) => {
+  const [, t] = useLanguage()
+
+  const reviews: any = {
+    customer: {
+      1: {
+        title: t('CUSTOMER_QUICK_COMMENT_TITLE_1', "What went wrong?"),
+        list: [
+          { key: 0, content: t('CUSTOMER_QUICK_COMMENT_1_0', "Poor communication") },
+          { key: 1, content: t('CUSTOMER_QUICK_COMMENT_1_1', "Wrong address") },
+          { key: 2, content: t('CUSTOMER_QUICK_COMMENT_1_2', "COVID-19 issue") },
+          { key: 3, content: t('CUSTOMER_QUICK_COMMENT_1_3', "Didn't follow instructions") },
+          { key: 4, content: t('CUSTOMER_QUICK_COMMENT_1_4', "Rude") },
+          { key: 5, content: t('CUSTOMER_QUICK_COMMENT_1_5', "Not on-time") },
+        ]
+      },
+      2: {
+        title: t('CUSTOMER_QUICK_COMMENT_TITLE_2', "What went wrong?"),
+        list: [
+          { key: 0, content: t('CUSTOMER_QUICK_COMMENT_2_0', "Poor communication") },
+          { key: 1, content: t('CUSTOMER_QUICK_COMMENT_2_1', "Wrong address") },
+          { key: 2, content: t('CUSTOMER_QUICK_COMMENT_2_2', "COVID-19 issue") },
+          { key: 3, content: t('CUSTOMER_QUICK_COMMENT_2_3', "Didn't follow instructions") },
+          { key: 4, content: t('CUSTOMER_QUICK_COMMENT_2_4', "Rude") },
+          { key: 5, content: t('CUSTOMER_QUICK_COMMENT_2_5', "Not on-time") },
+        ]
+      },
+      3: {
+        title: t('CUSTOMER_QUICK_COMMENT_TITLE_3', "What could have been better?"),
+        list: [
+          { key: 0, content: t('CUSTOMER_QUICK_COMMENT_3_0', "Poor communication") },
+          { key: 1, content: t('CUSTOMER_QUICK_COMMENT_3_1', "Wrong address") },
+          { key: 2, content: t('CUSTOMER_QUICK_COMMENT_3_2', "COVID-19 issue") },
+          { key: 3, content: t('CUSTOMER_QUICK_COMMENT_3_3', "Didn't follow instructions") },
+          { key: 4, content: t('CUSTOMER_QUICK_COMMENT_3_4', "Rude") },
+          { key: 5, content: t('CUSTOMER_QUICK_COMMENT_3_5', "Not on-time") },
+        ]
+      },
+      4: {
+        title: t('CUSTOMER_QUICK_COMMENT_TITLE_4', " Tell us more"),
+        list: [
+          { key: 0, content: t('CUSTOMER_QUICK_COMMENT_4_0', "Poor communication") },
+          { key: 1, content: t('CUSTOMER_QUICK_COMMENT_4_1', "Wrong address") },
+          { key: 2, content: t('CUSTOMER_QUICK_COMMENT_4_2', "COVID-19 issue") },
+          { key: 3, content: t('CUSTOMER_QUICK_COMMENT_4_3', "Didn't follow instructions") },
+          { key: 4, content: t('CUSTOMER_QUICK_COMMENT_4_4', "Rude") },
+          { key: 5, content: t('CUSTOMER_QUICK_COMMENT_4_5', "Not on-time") },
+        ]
+      },
+      5: {
+        title: t('CUSTOMER_QUICK_COMMENT_TITLE_5', "What went well?"),
+        list: [
+          { key: 0, content: t('CUSTOMER_QUICK_COMMENT_5_0', "Good communication") },
+          { key: 1, content: t('CUSTOMER_QUICK_COMMENT_5_1', "Friendly") },
+          { key: 2, content: t('CUSTOMER_QUICK_COMMENT_5_2', "Above and beyond") },
+        ]
+      },
+    }
+  }
+
+  return reviews[type]
+}

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

@@ -712,6 +712,14 @@ export const OrdersOption = (props: OrdersOptionParams) => {
           'Customer arrived to business',
         ),
       },
+      { 
+        key: 22, 
+        text: t('ORDER_LOOKING_FOR_DRIVER', 'Looking for driver') 
+      },
+      { 
+        key: 23, 
+        text: t('ORDER_DRIVER_ON_WAY', 'Driver on way') 
+      }
     ],
     tabs: [
       {
@@ -723,7 +731,7 @@ export const OrdersOption = (props: OrdersOptionParams) => {
       {
         key: 1,
         text: t('IN_PROGRESS', 'In Progress'),
-        tags: props?.orderGroupStatusCustom?.inProgress ?? [3, 4, 7, 8, 9, 14, 18, 19, 20, 21],
+        tags: props?.orderGroupStatusCustom?.inProgress ?? [3, 4, 7, 8, 9, 14, 18, 19, 20, 21, 22, 23],
         title: 'inProgress',
       },
       {

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

@@ -176,6 +176,18 @@ export const PreviousMessages = (props: PreviousMessagesParams) => {
         slug: 'ORDER_CUSTOMER_ARRIVED_BUSINESS',
         percentage: 95,
       },
+      { 
+        key: 22, 
+        value: t('ORDER_LOOKING_FOR_DRIVER', 'Looking for driver'), 
+        slug: 'ORDER_LOOKING_FOR_DRIVER', 
+        percentage: 35
+      },
+      { 
+        key: 23, 
+        value: t('ORDER_DRIVER_ON_WAY', 'Driver on way'), 
+        slug: 'ORDER_DRIVER_ON_WAY', 
+        percentage: 45 
+      }
     ];
 
     const objectStatus = orderStatus.find(o => o.key === status);

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

@@ -20,6 +20,8 @@ import { FloatingButton } from '../FloatingButton'
 import LinearGradient from 'react-native-linear-gradient'
 import Alert from '../../providers/AlertProvider'
 
+import { reviewCommentList } from '../../../../../src/utils'
+
 import {
   Content,
   ActionButtonWrapper,
@@ -101,11 +103,8 @@ const ReviewCustomerUI = (props: ReviewCustomerParams) => {
     { key: 5, text: t('GREAT', 'Great'), percent: 1, parentStyle: { right: '0%' }, isInnerStyle: false,  pointerColor: false }
   ]
 
-  const commentsList = [
-    { key: 0, content: t('RESPECTFUL', 'Respectful') },
-    { key: 1, content: t('EXCELLENT_COMMUNICATION', "Excellent communication") },
-    { key: 2, content: t('CORDIAL_SERVICE', 'Cordial service') }
-  ]
+  const commentsList = reviewCommentList('customer')
+
   const isSelectedComment = (commentKey: number) => {
     const found = comments.find((comment: any) => comment?.key === commentKey)
     return found
@@ -251,10 +250,10 @@ const ReviewCustomerUI = (props: ReviewCustomerParams) => {
           size={12}
           style={{ marginTop: 30 }}
         >
-          {t('COMMENTS', 'Comments')}
+          {commentsList[reviewState?.qualification || 1]?.title}
         </OText>
         <CommentsButtonGroup>
-          {commentsList.map(commentItem => (
+          {commentsList[reviewState?.qualification || 1]?.list?.map(commentItem => (
             <OButton
               key={commentItem.key}
               text={commentItem.content}

package/themes/business/src/utils/index.tsx

@@ -325,6 +325,18 @@ export const getOrderStatus = (s: string, t: any) => {
       slug: 'ORDER_CUSTOMER_ARRIVED_BUSINESS',
       percentage: 95,
     },
+    {
+      key: 22,
+      value: t('ORDER_LOOKING_FOR_DRIVER', 'Looking for driver'),
+      slug: 'ORDER_LOOKING_FOR_DRIVER',
+      percentage: 35
+    },
+    {
+      key: 23,
+      value: t('ORDER_DRIVER_ON_WAY', 'Driver on way'),
+      slug: 'ORDER_DRIVER_ON_WAY',
+      percentage: 45
+    }
   ];
 
   const objectStatus = orderStatus.find(o => o.key === status);

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

@@ -126,7 +126,9 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
       { key: 18, value: t('DRIVER_ALMOST_ARRIVED_TO_BUSINESS', 'Driver almost arrived to business'), slug: 'DRIVER_ALMOST_ARRIVED_TO_BUSINESS', percentage: 0.15, image: theme.images.order.status18 },
       { key: 19, value: t('DRIVER_ALMOST_ARRIVED_TO_CUSTOMER', 'Driver almost arrived to customer'), slug: 'DRIVER_ALMOST_ARRIVED_TO_CUSTOMER', percentage: 0.90, image: theme.images.order.status19 },
       { key: 20, value: t('ORDER_CUSTOMER_ALMOST_ARRIVED_BUSINESS', 'Customer almost arrived to business'), slug: 'ORDER_CUSTOMER_ALMOST_ARRIVED_BUSINESS', percentage: 90, image: theme.images.order.status20 },
-      { key: 21, value: t('ORDER_CUSTOMER_ARRIVED_BUSINESS', 'Customer arrived to business'), slug: 'ORDER_CUSTOMER_ARRIVED_BUSINESS', percentage: 95, image: theme.images.order.status21 }
+      { key: 21, value: t('ORDER_CUSTOMER_ARRIVED_BUSINESS', 'Customer arrived to business'), slug: 'ORDER_CUSTOMER_ARRIVED_BUSINESS', percentage: 95, image: theme.images.order.status21 },
+      { key: 22, value: t('ORDER_LOOKING_FOR_DRIVER', 'Looking for driver'), slug: 'ORDER_LOOKING_FOR_DRIVER', percentage: 35, image: theme.images.order.status22 },
+      { key: 23, value: t('ORDER_DRIVER_ON_WAY', 'Driver on way'), slug: 'ORDER_DRIVER_ON_WAY', percentage: 45, image: theme.images.order.status23 }
     ]
 
 

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

@@ -91,7 +91,9 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
 			{ key: 18, value: t('DRIVER_ALMOST_ARRIVED_TO_BUSINESS', 'Driver almost arrived to business') },
 			{ key: 19, value: t('DRIVER_ALMOST_ARRIVED_TO_CUSTOMER', 'Driver almost arrived to customer') },
 			{ key: 20, value: t('ORDER_CUSTOMER_ALMOST_ARRIVED_BUSINESS', 'Customer almost arrived to business') },
-			{ key: 21, value: t('ORDER_CUSTOMER_ARRIVED_BUSINESS', 'Customer arrived to business') }
+			{ key: 21, value: t('ORDER_CUSTOMER_ARRIVED_BUSINESS', 'Customer arrived to business') },
+			{ key: 22, value: t('ORDER_LOOKING_FOR_DRIVER', 'Looking for driver') },
+      		{ key: 23, value: t('ORDER_DRIVER_ON_WAY', 'Driver on way') }
 		]
 
 		const objectStatus = orderStatus.find((o) => o.key === status)
@@ -208,7 +210,7 @@ export const OrdersOption = (props: OrdersOptionParams) => {
 		...props,
 		UIComponent: OrdersOptionUI,
 		orderStatus: props.activeOrders
-			? [0, 3, 4, 7, 8, 9, 13, 14, 15, 18, 19, 20, 21]
+			? [0, 3, 4, 7, 8, 9, 13, 14, 15, 18, 19, 20, 21, 22, 23]
 			: [1, 2, 5, 6, 10, 11, 12, 16, 17],
 		useDefualtSessionManager: true,
 		paginationSettings: {

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

@@ -133,7 +133,9 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
       { key: 18, value: t('DRIVER_ALMOST_ARRIVED_TO_BUSINESS', 'Driver almost arrived to business'), slug: 'DRIVER_ALMOST_ARRIVED_TO_BUSINESS', percentage: 0.15, image: theme.images.order.status18 },
       { key: 19, value: t('DRIVER_ALMOST_ARRIVED_TO_CUSTOMER', 'Driver almost arrived to customer'), slug: 'DRIVER_ALMOST_ARRIVED_TO_CUSTOMER', percentage: 0.90, image: theme.images.order.status19 },
       { key: 20, value: t('ORDER_CUSTOMER_ALMOST_ARRIVED_BUSINESS', 'Customer almost arrived to business'), slug: 'ORDER_CUSTOMER_ALMOST_ARRIVED_BUSINESS', percentage: 90, image: theme.images.order.status20 },
-      { key: 21, value: t('ORDER_CUSTOMER_ARRIVED_BUSINESS', 'Customer arrived to business'), slug: 'ORDER_CUSTOMER_ARRIVED_BUSINESS', percentage: 95, image: theme.images.order.status21 }
+      { key: 21, value: t('ORDER_CUSTOMER_ARRIVED_BUSINESS', 'Customer arrived to business'), slug: 'ORDER_CUSTOMER_ARRIVED_BUSINESS', percentage: 95, image: theme.images.order.status21 },
+      { key: 22, value: t('ORDER_LOOKING_FOR_DRIVER', 'Looking for driver'), slug: 'ORDER_LOOKING_FOR_DRIVER', percentage: 35, image: theme.images.order.status22 },
+      { key: 23, value: t('ORDER_DRIVER_ON_WAY', 'Driver on way'), slug: 'ORDER_DRIVER_ON_WAY', percentage: 45, image: theme.images.order.status23 }
     ]
 
 

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

@@ -89,7 +89,9 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
       { key: 18, value: t('DRIVER_ALMOST_ARRIVED_TO_BUSINESS', 'Driver almost arrived to business') },
       { key: 19, value: t('DRIVER_ALMOST_ARRIVED_TO_CUSTOMER', 'Driver almost arrived to customer') },
       { key: 20, value: t('ORDER_CUSTOMER_ALMOST_ARRIVED_BUSINESS', 'Customer almost arrived to business') },
-      { key: 21, value: t('ORDER_CUSTOMER_ARRIVED_BUSINESS', 'Customer arrived to business') }
+      { key: 21, value: t('ORDER_CUSTOMER_ARRIVED_BUSINESS', 'Customer arrived to business') },
+      { key: 22, value: t('ORDER_LOOKING_FOR_DRIVER', 'Looking for driver') },
+      { key: 23, value: t('ORDER_DRIVER_ON_WAY', 'Driver on way') }
     ]
 
     const objectStatus = orderStatus.find((o) => o.key === status)
@@ -205,7 +207,7 @@ export const OrdersOption = (props: OrdersOptionParams) => {
     ...props,
     UIComponent: OrdersOptionUI,
     orderStatus: props.activeOrders
-      ? [0, 3, 4, 7, 8, 9, 13, 14, 15, 18, 19, 20, 21]
+      ? [0, 3, 4, 7, 8, 9, 13, 14, 15, 18, 19, 20, 21, 22, 23]
       : [1, 2, 5, 6, 10, 11, 12, 16, 17],
     useDefualtSessionManager: true,
     paginationSettings: {

package/themes/original/index.tsx

@@ -20,6 +20,8 @@ import { BusinessPreorder } from './src/components/BusinessPreorder';
 import { BusinessMenuList } from './src/components/BusinessMenuList';
 import { UserProfileForm } from './src/components/UserProfileForm';
 import { ReviewOrder } from './src/components/ReviewOrder';
+import { ReviewProducts } from './src/components/ReviewProducts';
+import { ReviewDriver } from './src/components/ReviewDriver';
 import { UserProfile } from './src/components/UserProfile';
 import { MessageListing } from './src/components/MessageListing';
 import { Help } from './src/components/Help';
@@ -82,6 +84,8 @@ export {
 	BusinessPreorder,
 	UserProfileForm,
 	ReviewOrder,
+	ReviewProducts,
+	ReviewDriver,
 	BusinessMenuList,
 	UserProfile,
 	MessageListing,

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

@@ -667,6 +667,19 @@ const CheckoutUI = (props: any) => {
 					setShowGateway={setShowGateway}
 				/>
 			)}
+			{webviewPaymethod?.gateway === 'square' && showGateway.open && (
+				<PaymentOptionsWebView
+					onNavigationRedirect={onNavigationRedirect}
+					uri={`https://test-square-f50f7.web.app`}
+					user={user}
+					token={token}
+					cart={cart}
+					currency={currency}
+					webviewPaymethod={webviewPaymethod}
+					setShowGateway={setShowGateway}
+					locationId={'L1NGAY5M6KJRX'}
+				/>
+			)}
 		</>
 	)
 }

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

@@ -91,7 +91,9 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
 			{ key: 18, value: t('DRIVER_ALMOST_ARRIVED_TO_BUSINESS', 'Driver almost arrived to business') },
 			{ key: 19, value: t('DRIVER_ALMOST_ARRIVED_TO_CUSTOMER', 'Driver almost arrived to customer') },
 			{ key: 20, value: t('ORDER_CUSTOMER_ALMOST_ARRIVED_BUSINESS', 'Customer almost arrived to business') },
-			{ key: 21, value: t('ORDER_CUSTOMER_ARRIVED_BUSINESS', 'Customer arrived to business') }
+			{ key: 21, value: t('ORDER_CUSTOMER_ARRIVED_BUSINESS', 'Customer arrived to business') },
+			{ key: 22, value: t('ORDER_LOOKING_FOR_DRIVER', 'Looking for driver') },
+      		{ key: 23, value: t('ORDER_DRIVER_ON_WAY', 'Driver on way') }
 		]
 
 		const objectStatus = orderStatus.find((o) => o.key === status)

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

@@ -73,7 +73,9 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
 			{ key: 18, value: t('DRIVER_ALMOST_ARRIVED_TO_BUSINESS', 'Driver almost arrived to business') },
 			{ key: 19, value: t('DRIVER_ALMOST_ARRIVED_TO_CUSTOMER', 'Driver almost arrived to customer') },
 			{ key: 20, value: t('ORDER_CUSTOMER_ALMOST_ARRIVED_BUSINESS', 'Customer almost arrived to business') },
-			{ key: 21, value: t('ORDER_CUSTOMER_ARRIVED_BUSINESS', 'Customer arrived to business') }
+			{ key: 21, value: t('ORDER_CUSTOMER_ARRIVED_BUSINESS', 'Customer arrived to business') },
+			{ key: 22, value: t('ORDER_LOOKING_FOR_DRIVER', 'Looking for driver') },
+      		{ key: 23, value: t('ORDER_DRIVER_ON_WAY', 'Driver on way') }
 		]
 
 		const objectStatus = orderStatus.find((o) => o.key === status)
@@ -218,7 +220,7 @@ export const OrderListing = (props: OrdersOptionParams) => {
 	const OrderListingProps = {
 		...props,
 		UIComponent: OrdersOptionUI,
-		orderStatus: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21],
+		orderStatus: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23],
 		useDefualtSessionManager: true,
 		paginationSettings: {
 			initialPage: 1,

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

@@ -293,6 +293,20 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
         percentage: 95,
         image: theme.images.order.status7,
       },
+      { 
+        key: 22, 
+        value: t('ORDER_LOOKING_FOR_DRIVER', 'Looking for driver'), 
+        slug: 'ORDER_LOOKING_FOR_DRIVER', 
+        percentage: 35, 
+        image: theme.images.order.status8 
+      },
+      { 
+        key: 23, 
+        value: t('ORDER_DRIVER_ON_WAY', 'Driver on way'), 
+        slug: 'ORDER_DRIVER_ON_WAY', 
+        percentage: 45, 
+        image: theme.images.order.status8
+      }
     ];
 
     const objectStatus = orderStatus.find((o) => o.key === status);

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

@@ -97,7 +97,9 @@ const OrderProgressUI = (props: any) => {
       { key: 18, value: t('ORDER_DRIVER_ALMOST_ARRIVED_BUSINESS', theme?.defaultLanguages?.ORDER_DRIVER_ALMOST_ARRIVED_BUSINESS || 'Driver almost arrived to business'), slug: 'ORDER_DRIVER_ALMOST_ARRIVED_BUSINESS', percentage: 55 },
       { key: 19, value: t('ORDER_DRIVER_ALMOST_ARRIVED_CUSTOMER', theme?.defaultLanguages?.ORDER_DRIVER_ALMOST_ARRIVED_CUSTOMER || 'Driver almost arrived to customer'), slug: 'ORDER_DRIVER_ALMOST_ARRIVED_CUSTOMER', percentage: 90 },
       { key: 20, value: t('ORDER_CUSTOMER_ALMOST_ARRIVED_BUSINESS', theme?.defaultLanguages?.ORDER_CUSTOMER_ALMOST_ARRIVED_BUSINESS || 'Customer almost arrived to business'), slug: 'ORDER_CUSTOMER_ALMOST_ARRIVED_BUSINESS', percentage: 90 },
-      { key: 21, value: t('ORDER_CUSTOMER_ARRIVED_BUSINESS', theme?.defaultLanguages?.ORDER_CUSTOMER_ARRIVED_BUSINESS || 'Customer arrived to business'), slug: 'ORDER_CUSTOMER_ARRIVED_BUSINESS', percentage: 95 }
+      { key: 21, value: t('ORDER_CUSTOMER_ARRIVED_BUSINESS', theme?.defaultLanguages?.ORDER_CUSTOMER_ARRIVED_BUSINESS || 'Customer arrived to business'), slug: 'ORDER_CUSTOMER_ARRIVED_BUSINESS', percentage: 95 },
+      { key: 22, value: t('ORDER_LOOKING_FOR_DRIVER', theme?.defaultLanguages?.ORDER_LOOKING_FOR_DRIVER || 'Looking for driver'), slug: 'ORDER_LOOKING_FOR_DRIVER', percentage: 35 },
+      { key: 23, value: t('ORDER_DRIVER_ON_WAY', theme?.defaultLanguages?.ORDER_DRIVER_ON_WAY  || 'Driver on way'), slug: 'ORDER_DRIVER_ON_WAY', percentage: 45 }
     ]
 
     const objectStatus = orderStatus.find((o) => o.key === status)
@@ -137,7 +139,7 @@ const OrderProgressUI = (props: any) => {
   return (
     <>
       {orderList?.loading && (
-        <Placeholder Animation={Fade} height={160}>
+        <Placeholder Animation={Fade} height={158}>
           <PlaceholderLine height={60} style={{ borderRadius: 8, marginBottom: 10 }} />
           <PlaceholderLine height={20} style={{ marginBottom: 10 }} />
           <PlaceholderLine height={40} style={{ borderRadius: 8, marginBottom: 10 }} />
@@ -217,7 +219,7 @@ export const OrderProgress = (props: any) => {
   const orderProgressProps = {
     ...props,
     UIComponent: OrderProgressUI,
-    orderStatus: [0, 3, 4, 7, 8, 9, 13, 14, 15, 18, 19, 20, 21],
+    orderStatus: [0, 3, 4, 7, 8, 9, 13, 14, 15, 18, 19, 20, 21, 22, 23],
     useDefualtSessionManager: true,
     paginationSettings: {
       initialPage: 1,

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

@@ -93,7 +93,9 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
 			{ key: 18, value: t('DRIVER_ALMOST_ARRIVED_TO_BUSINESS', 'Driver almost arrived to business') },
 			{ key: 19, value: t('DRIVER_ALMOST_ARRIVED_TO_CUSTOMER', 'Driver almost arrived to customer') },
 			{ key: 20, value: t('ORDER_CUSTOMER_ALMOST_ARRIVED_BUSINESS', 'Customer almost arrived to business') },
-			{ key: 21, value: t('ORDER_CUSTOMER_ARRIVED_BUSINESS', 'Customer arrived to business') }
+			{ key: 21, value: t('ORDER_CUSTOMER_ARRIVED_BUSINESS', 'Customer arrived to business') },
+			{ key: 22, value: t('ORDER_LOOKING_FOR_DRIVER', 'Looking for driver') },
+      		{ key: 23, value: t('ORDER_DRIVER_ON_WAY', 'Driver on way') }
 		]
 
 		const objectStatus = orderStatus.find((o) => o.key === status)
@@ -230,7 +232,7 @@ export const OrdersOption = (props: OrdersOptionParams) => {
 		...props,
 		UIComponent: OrdersOptionUI,
 		orderStatus: props.preOrders ? [13] : props.activeOrders
-			? [0, 3, 4, 7, 8, 9, 14, 15, 18, 19, 20, 21]
+			? [0, 3, 4, 7, 8, 9, 14, 15, 18, 19, 20, 21, 22, 23]
 			: [1, 2, 5, 6, 10, 11, 12, 16, 17],
 		useDefualtSessionManager: true,
 	}

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

@@ -154,7 +154,7 @@ const PaymentOptionsUI = (props: any) => {
 		)
 	}
 
-	const excludeIds: any = [32, 66]; //exclude paypal & connect & redirect
+	const excludeIds: any = [32]; //exclude paypal & connect & redirect
 
 	return (
 		<PMContainer>

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

@@ -935,28 +935,29 @@ export const ProductOptionsUI = (props: any) => {
 						style={{
 							width: isSoldOut || maxProductQuantity <= 0 ? '60%' : '40%',
 						}}>
-						{productCart &&
-							!isSoldOut &&
-							maxProductQuantity > 0 &&
+						{((productCart &&
 							auth &&
-							orderState.options?.address_id && (
+							orderState.options?.address_id) || (isSoldOut || maxProductQuantity <= 0)) && (
 								<OButton
 									onClick={() => handleSaveProduct()}
 									imgRightSrc=""
 									text={`${orderState.loading
 										? t('LOADING', 'Loading')
-										: editMode
-											? t('UPDATE', 'Update')
-											: t('ADD', 'Add')
+										: (isSoldOut || maxProductQuantity <= 0)
+											? t('SOLD_OUT', 'Sold out')
+											: editMode
+												? t('UPDATE', 'Update')
+												: t('ADD', 'Add')
 										}`}
+									isDisabled={isSoldOut || maxProductQuantity <= 0}
 									textStyle={{
-										color: (saveErrors || !productCart.quantity) ? theme.colors.primary : theme.colors.white,
+										color: saveErrors || isSoldOut || maxProductQuantity <= 0 ? theme.colors.primary : theme.colors.white,
 										fontSize: orderState.loading || editMode ? 10 : 14
 									}}
 									style={{
-										backgroundColor: (saveErrors || !productCart.quantity) ? theme.colors.lightGray : theme.colors.primary,
-										borderColor: (saveErrors || !productCart.quantity) ? theme.colors.white : theme.colors.primary,
-										opacity: (saveErrors || !productCart.quantity) ? 0.3 : 1,
+										backgroundColor: saveErrors || isSoldOut || maxProductQuantity <= 0 ? theme.colors.lightGray : theme.colors.primary,
+										borderColor: saveErrors || isSoldOut || maxProductQuantity <= 0 ? theme.colors.white : theme.colors.primary,
+										opacity: saveErrors || isSoldOut || maxProductQuantity <= 0 ? 0.3 : 1,
 										borderRadius: 7.6,
 										height: 44,
 										shadowOpacity: 0,
@@ -976,7 +977,7 @@ export const ProductOptionsUI = (props: any) => {
 							) : (
 								<OButton onClick={navigation.navigate('AddressList')} />
 							))}
-						{(!auth || isSoldOut || maxProductQuantity <= 0) && (
+						{!auth && (
 							<OButton
 								isDisabled={isSoldOut || maxProductQuantity <= 0}
 								onClick={() => handleRedirectLogin()}