ordering-ui-react-native 0.23.15 → 0.23.17

package/package.json

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

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

@@ -61,9 +61,14 @@ export const OrderItem = React.memo((props: any) => {
   const styles = StyleSheet.create({
     cardButton: {
       flex: 1,
-      paddingVertical: (isIpad || isTablet) ? 20 : 0,
+      paddingVertical: (isIpad || isTablet) ? 20 : 5,
       marginBottom: IS_PORTRAIT ? 25 : 0,
       marginLeft: 3,
+      backgroundColor: order?.time_status === 'delayed' 
+        ? theme.colors.danger100
+        : order?.time_status === 'at_risk' 
+          ? theme.colors.warning100
+          : theme.colors.primaryContrast
     },
     icon: {
       borderRadius: 7.6,
@@ -239,7 +244,7 @@ export const OrderItem = React.memo((props: any) => {
                 : parseDate(order?.delivery_datetime, { utc: false })}`)}
             </OText>
             )}
-            {((currentTabSelected === 'pending' || currentTabSelected === 'inProgress') && allowColumns?.timer) && (
+            {((currentTabSelected === 'pending' || currentTabSelected === 'inProgress' || currentTabSelected === 'active') && allowColumns?.timer) && (
               <>
                 <OText
                   style={styles.date}

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

@@ -321,7 +321,7 @@ const MomentOptionUI = (props: MomentOptionParams) => {
 				}
 			}))
 		}
-	}, [dateSelected, JSON.stringify(hoursList), JSON.stringify(datesWhitelist), cateringPreorder, JSON.stringify(business)])
+	}, [dateSelected, JSON.stringify(hoursList), JSON.stringify(datesWhitelist), JSON.stringify(business)])
 
 	useEffect(() => {
 		setLocalMoment(moment, t)

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

@@ -1,7 +1,7 @@
 import React from 'react'
 import { useTheme } from 'styled-components/native'
 import { ScrollView, StyleSheet, View } from 'react-native'
-import { useLanguage, useUtils } from 'ordering-components/native'
+import { useLanguage, useUtils, useConfig } from 'ordering-components/native'
 import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityIcons'
 import { OText, OButton } from '../shared'
 import { formatSeconds } from '../../utils'
@@ -17,7 +17,9 @@ export const OrderHistory = (props: any) => {
 
   const [, t] = useLanguage()
   const [{ parseDate }] = useUtils()
+  const [{ configs }] = useConfig();
   const theme = useTheme()
+  const changeIdToExternalId = configs?.change_order_id?.value === '1'
 
   const styles = StyleSheet.create({
     historyItem: {
@@ -93,7 +95,7 @@ export const OrderHistory = (props: any) => {
   return (
     <ScrollView contentContainerStyle={styles.container}>
       <OText size={20} style={{ alignSelf: 'center', textAlign: 'center' }} mBottom={10}>
-        {t('DETAILS_OF_ORDER', 'Details of Order_NUMBER_').replace('_NUMBER_', ` # ${order?.id}`)}
+        {t('DETAILS_OF_ORDER', 'Details of Order_NUMBER_').replace('_NUMBER_', (changeIdToExternalId && order?.external_id) || `# ${order?.id}`)}
       </OText>
       {!messages?.loading && order && (
         <View style={styles.historyItem}>

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

@@ -149,6 +149,8 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
   const hideDriverMessages = theme?.confirmation?.components?.driver?.components?.messages?.hidden
   const hideCustomerPhone = theme?.confirmation?.components?.customer?.components?.phone?.hidden
   const hideCustomerAddress = theme?.confirmation?.components?.customer?.components?.address?.hidden
+  const changeIdToExternalId = configs?.change_order_id?.value === '1'
+
   const progressBarObjt = isPickup ? getOrderStatuPickUp : getOrderStatus
   const walletName: any = {
     cash: {
@@ -386,7 +388,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
                 numberOfLines={2}
                 ellipsizeMode='tail'
               >
-                {`${t('ORDER', 'Order')} #${order?.id}`}
+                {`${t('ORDER', 'Order')} ${(changeIdToExternalId && order?.external_id) || `#${order?.id}`}`}
               </OText>
             )}
           </>
@@ -460,7 +462,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
             <Header>
               <NavBar
                 hideArrowLeft
-                title={`${t('ORDER', 'Order')} #${order?.id}`}
+                title={`${t('ORDER', 'Order')} ${(changeIdToExternalId && order?.external_id) || `#${order?.id}`}`}
                 titleAlign={'left'}
                 showCall={false}
                 btnStyle={{ paddingLeft: 0 }}

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

@@ -3,7 +3,8 @@ import {
   SingleOrderCard as SingleOrderCardController,
   useUtils,
   useOrder,
-  useLanguage
+  useLanguage,
+  useConfig
 } from 'ordering-components/native';
 import FastImage from 'react-native-fast-image'
 import { StyleSheet, TouchableOpacity, View } from 'react-native';
@@ -45,6 +46,7 @@ const SingleOrderCardUI = (props: SingleOrderCardParams) => {
   const [{ parsePrice, optimizeImage, parseDate }] = useUtils();
   const [, t] = useLanguage();
   const [{ carts }] = useOrder()
+  const [{ configs }] = useConfig()
   const theme = useTheme();
   const isFocused = useIsFocused();
 
@@ -54,6 +56,7 @@ const SingleOrderCardUI = (props: SingleOrderCardParams) => {
 
   const allowedOrderStatus = [1, 2, 5, 6, 10, 11, 12, 15];
   const isGiftCardOrder = !order?.business_id
+  const changeIdToExternalId = configs?.change_order_id?.value === '1'
 
   const styles = StyleSheet.create({
     container: {
@@ -333,7 +336,7 @@ const SingleOrderCardUI = (props: SingleOrderCardParams) => {
                         lineHeight={15}
                         numberOfLines={1}
                       >
-                        {order?.business?.length > 1 ? order?.business?.length : (t('ORDER_NO', 'Order No') + '.')}
+                        {order?.business?.length > 1 ? order?.business?.length : !(changeIdToExternalId && order?.external_id) && (t('ORDER_NO', 'Order No') + '.')}
                       </OText>
                       <OText
                         size={10}
@@ -342,7 +345,7 @@ const SingleOrderCardUI = (props: SingleOrderCardParams) => {
                         lineHeight={15}
                         numberOfLines={1}
                       >
-                        {order?.business?.length > 1 ? t('ORDERS', 'orders') + ' \u2022 ' : order.id + ` \u2022 `}
+                        {order?.business?.length > 1 ? t('ORDERS', 'orders') + ' \u2022 ' : ((changeIdToExternalId && order?.external_id) || order.id) + ` \u2022 `}
                       </OText>
                     </>
                   )}