ordering-ui-react-native 0.22.82 → 0.22.84

package/package.json

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

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

@@ -428,19 +428,15 @@ export const AcceptOrRejectOrder = (props: AcceptOrRejectOrderParams) => {
             {action === 'accept' && (
               <View style={{ height: 300, justifyContent: 'center' }}>
                 <Timer onPress={() => openTimerIOnput()}>
-                  <View>
-                    <OText weight="600" size={55}>
-                      {hour}
-                    </OText>
-                    <OText style={{ marginLeft: 10 }}>{t('HOURS', 'Hours')}</OText>
-                  </View>
-                  {hour.length > 0 && <OText size={55} style={{ marginBottom: 30 }}>:</OText>}
-                  <View>
-                    <OText weight="600" size={55}>
-                      {min}
-                    </OText>
-                    <OText style={{ marginLeft: 10 }}>{t('MINUTES', 'Minutes')}</OText>
-                  </View>
+                  <OText weight="600" size={55}>
+                    {hour}
+                  </OText>
+                  {hour.length > 0 && <OText size={55} style={{ marginBottom: 10 }}>:</OText>}
+                  <OText weight="600" size={55}>
+                    {min}
+                  </OText>
+                  {time?.length > 2 && <OText style={{ position: 'absolute', bottom: 60, left: 55 }}>{t('HOURS', 'Hours')}</OText>}
+                  <OText style={{ position: 'absolute', bottom: 60, right: time?.length > 2 ? 55 : 95 }}>{t('MINUTES', 'Minutes')}</OText>
                 </Timer>
               </View>
             )}

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

@@ -10,6 +10,7 @@ export const TopActions = styled.View`
 `
 
 export const Timer = styled.TouchableOpacity`
+  position: relative;
   padding: 40px;
   justify-content: center;
   flex-direction: row;

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

@@ -96,7 +96,9 @@ const ChatUI = (props: MessagesParams) => {
     20: t('ORDER_CUSTOMER_ALMOST_ARRIVED_BUSINESS', 'Order customer almost arrived to business'),
     21: t('ORDER_CUSTOMER_ARRIVED_BUSINESS', 'Order customer arrived to business'),
     22: t('ORDER_LOOKING_FOR_DRIVER', 'Order looking for driver'),
-    23: t('ORDER_DRIVER_ON_WAY', 'Driver on way')
+    23: t('ORDER_DRIVER_ON_WAY', 'Driver on way'),
+    24: t('ORDER_DRIVER_WAITING_FOR_ORDER', 'Driver waiting for order'),
+    25: t('ORDER_ACCEPTED_BY_DRIVER_COMPANY', 'Accepted by driver company')
   }
 
   const getLogisticTag = (status: any) => {

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

@@ -78,7 +78,8 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
   const [printerSettings, setPrinterSettings] = useState<any>('')
   const [autoPrintEnabled, setAutoPrintEnabled] = useState<boolean>(false)
 
-  const orderToComplete = [4, 7, 14, 20, 21]
+  const orderToComplete = [4, 20, 21]
+  const orderToReady = [7, 14]
 
   if (order?.status === 7 || order?.status === 4) {
     if (drivers?.length > 0 && drivers) {
@@ -341,6 +342,8 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
   };
 
   const handleCloseModal = () => {
+    readMessages && readMessages()
+    loadMessages && loadMessages()
     setOpenModalForBusiness(false);
   };
 
@@ -485,6 +488,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
             handleArrowBack={handleArrowBack}
             isCustomView={props.isCustomView}
             messages={messages}
+            messagesReadList={messagesReadList}
           />
           <OrderDetailsContainer
             keyboardShouldPersistTaps="handled"
@@ -633,7 +637,6 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
             </>
             <View style={{ height: 30 }} />
           </OrderDetailsContainer>
-
           {order &&
             Object.keys(order).length > 0 &&
             getOrderStatus(order?.status, t)?.value ===
@@ -650,7 +653,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
                 widthButton={'45%'}
               />
             )}
-          {order?.status === 7 && (
+          {orderToReady.includes(order?.status) && (
             <FloatingButton
               btnText={t('READY_FOR_PICKUP', 'Ready for pickup')}
               colorTxt1={theme.colors.primary}

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

@@ -24,7 +24,8 @@ import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityI
 import {
   useLanguage,
   useUtils,
-  useConfig
+  useConfig,
+  useSession
 } from 'ordering-components/native';
 
 interface OrderHeader {
@@ -38,6 +39,7 @@ interface OrderHeader {
   handleCopyClipboard?: any
   isCustomView?: any
   messages?: any
+  messagesReadList?: any
 }
 
 export const OrderHeaderComponent = (props: OrderHeader) => {
@@ -51,13 +53,18 @@ export const OrderHeaderComponent = (props: OrderHeader) => {
     handleViewSummaryOrder,
     handleCopyClipboard,
     messages,
+    messagesReadList
   } = props
   const theme = useTheme();
   const [, t] = useLanguage();
   const [configState] = useConfig()
+  const [{ user }] = useSession()
   const [{ parseDate, parsePrice }] = useUtils();
   const paymethodsLength = order?.payment_events?.filter((item: any) => item.event === 'payment')?.length
   const showExternalId = configState?.configs?.change_order_id?.value === '1'
+  const messagesReadIds = messagesReadList?.map((message: any) => message?.order_message_id)
+
+  const filteredMessages = messagesReadList?.length > 0 ? messages?.messages?.filter((message: any) => !messagesReadIds?.includes(message?.id)) : messages?.messages
 
   const styles = StyleSheet.create({
     icons: {
@@ -196,7 +203,7 @@ export const OrderHeaderComponent = (props: OrderHeader) => {
                 onClick={() => handleOpenMapView()}
               />
               <Messages>
-                {messages?.messages?.filter((message: any) => !message?.read)?.length > 0 && <Dot />}
+                {filteredMessages?.filter((message: any) => message?.author_id !== user?.id && !message?.read)?.length > 0 && <Dot />}
                 <OIconButton
                   icon={theme.images.general.messages}
                   iconStyle={{

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

@@ -846,6 +846,14 @@ 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')
       }
     ],
     tabs: [
@@ -858,7 +866,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],
         title: 'inProgress',
       },
       {

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

@@ -393,12 +393,12 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
     setTags({ values: [] })
   }, [currentTabSelected])
 
-	useEffect(() => {
-		const unsubcribe = navigation.addListener('focus', () => {
+  useEffect(() => {
+    const unsubcribe = navigation.addListener('focus', () => {
       currentTabSelected === 'logisticOrders' && loadLogisticOrders && loadLogisticOrders()
-		})
-		return unsubcribe
-	}, [navigation, loadLogisticOrders])
+    })
+    return unsubcribe
+  }, [navigation, loadLogisticOrders])
 
   useEffect(() => {
     const orderStatuses = ['active', 'pending', 'inProgress', 'completed', 'cancelled']
@@ -675,34 +675,34 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
               !currentOrdersGroup?.orders?.length
             ) || internetLoading
           ) && (
-            <View>
-              {[...Array(5)].map((_, i) => (
-                <Placeholder key={i} Animation={Fade}>
-                  <View
-                    style={{
-                      width: '100%',
-                      flexDirection: 'row',
-                      marginBottom: 10,
-                    }}>
-                    <PlaceholderLine
-                      width={IS_PORTRAIT ? 22 : 11}
-                      height={74}
+              <View>
+                {[...Array(5)].map((_, i) => (
+                  <Placeholder key={i} Animation={Fade}>
+                    <View
                       style={{
-                        marginRight: 20,
-                        marginBottom: 20,
-                        borderRadius: 7.6,
-                      }}
-                    />
-                    <Placeholder>
-                      <PlaceholderLine width={30} style={{ marginTop: 5 }} />
-                      <PlaceholderLine width={50} />
-                      <PlaceholderLine width={20} />
-                    </Placeholder>
-                  </View>
-                </Placeholder>
-              ))}
-            </View>
-          )}
+                        width: '100%',
+                        flexDirection: 'row',
+                        marginBottom: 10,
+                      }}>
+                      <PlaceholderLine
+                        width={IS_PORTRAIT ? 22 : 11}
+                        height={74}
+                        style={{
+                          marginRight: 20,
+                          marginBottom: 20,
+                          borderRadius: 7.6,
+                        }}
+                      />
+                      <Placeholder>
+                        <PlaceholderLine width={30} style={{ marginTop: 5 }} />
+                        <PlaceholderLine width={50} />
+                        <PlaceholderLine width={20} />
+                      </Placeholder>
+                    </View>
+                  </Placeholder>
+                ))}
+              </View>
+            )}
 
           {isNetConnected &&
             !currentOrdersGroup?.error?.length &&
@@ -724,22 +724,22 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
 
           {!internetLoading &&
             ((!currentOrdersGroup?.loading &&
-            (currentOrdersGroup?.error?.length ||
-              currentOrdersGroup?.orders?.length === 0)) ||
-            (currentTabSelected === 'logisticOrders' &&
-              (logisticOrders?.error?.length > 0 || logisticOrders?.orders?.length === 0 || !logisticOrders?.orders?.some(order => !order?.expired)))
-          ) &&
+              (currentOrdersGroup?.error?.length ||
+                currentOrdersGroup?.orders?.length === 0)) ||
+              (currentTabSelected === 'logisticOrders' &&
+                (logisticOrders?.error?.length > 0 || logisticOrders?.orders?.length === 0 || !logisticOrders?.orders?.some(order => !order?.expired)))
+            ) &&
             (
               <NotFoundSource
                 content={
                   !isNetConnected ? t('NETWORK_ERROR', 'Network Error') :
-                  ((currentTabSelected !== 'logisticOrders' && !currentOrdersGroup?.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] ||
-                    (currentTabSelected === 'logisticOrders' && logisticOrders?.error) ||
-                    t('NETWORK_ERROR', 'Network Error')
+                    ((currentTabSelected !== 'logisticOrders' && !currentOrdersGroup?.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] ||
+                      (currentTabSelected === 'logisticOrders' && logisticOrders?.error) ||
+                      t('NETWORK_ERROR', 'Network Error')
                 }
                 image={theme.images.general.notFound}
                 conditioned={false}
@@ -1117,13 +1117,21 @@ export const OrdersOption = (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')
       }
     ],
     tabs: combineTabs ? [
       {
         key: 0,
         text: t('ACTIVE', 'Active'),
-        tags: props?.orderGroupStatusCustom?.active ?? [0, 3, 4, 7, 8, 9, 13, 14, 18, 19, 20, 21, 22, 23],
+        tags: props?.orderGroupStatusCustom?.active ?? [0, 3, 4, 7, 8, 9, 13, 14, 18, 19, 20, 21, 22, 23, 24, 25],
         title: 'active',
       },
       {
@@ -1149,7 +1157,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, 22, 23],
+          tags: props?.orderGroupStatusCustom?.inProgress ?? [3, 4, 7, 8, 9, 14, 18, 19, 20, 21, 22, 23, 24, 25],
           title: 'inProgress',
         },
         {

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

@@ -201,6 +201,18 @@ export const PreviousMessages = (props: PreviousMessagesParams) => {
         value: t('ORDER_DRIVER_ON_WAY', 'Driver on way'),
         slug: 'ORDER_DRIVER_ON_WAY',
         percentage: 45
+      },
+      {
+        key: 24,
+        value: t('ORDER_DRIVER_WAITING_FOR_ORDER', 'Driver waiting for order'),
+        slug: 'ORDER_DRIVER_WAITING_FOR_ORDER',
+        percentage: 25
+      },
+      {
+        key: 25,
+        value: t('ORDER_ACCEPTED_BY_DRIVER_COMPANY', 'Accepted by driver company'),
+        slug: 'ORDER_ACCEPTED_BY_DRIVER_COMPANY',
+        percentage: 25
       }
     ];
 

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

@@ -344,6 +344,18 @@ export const getOrderStatus = (s: string, t: any) => {
       value: t('ORDER_DRIVER_ON_WAY', 'Driver on way'),
       slug: 'ORDER_DRIVER_ON_WAY',
       percentage: 45
+    },
+    {
+      key: 24,
+      value: t('ORDER_DRIVER_WAITING_FOR_ORDER', 'Driver waiting for order'),
+      slug: 'ORDER_DRIVER_WAITING_FOR_ORDER',
+      percentage: 25
+    },
+    {
+      key: 25,
+      value: t('ORDER_ACCEPTED_BY_DRIVER_COMPANY', 'Accepted by driver company'),
+      slug: 'ORDER_ACCEPTED_BY_DRIVER_COMPANY',
+      percentage: 25
     }
   ];