ordering-ui-react-native 0.21.73 → 0.21.74

package/package.json

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

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

@@ -389,6 +389,9 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
       <View style={styles.header}>
         <OText style={styles.title}>{t('MY_ORDERS', 'My orders')}</OText>
         <IconWrapper>
+          <View style={{ marginRight: 10 }}>
+            <WebsocketStatus />
+          </View>
           <FeatherIcon
             name='refresh-cw'
             color={theme.colors.backgroundDark}
@@ -404,10 +407,9 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
           />
         </IconWrapper>
       </View>
-      <WebsocketStatus />
       {configState?.configs?.order_deadlines_enabled?.value === '1' && (
         <View style={styles.SLAwrapper}>
-          <View style={{ flex: 0.5 }}>
+          {/* <View style={{ flex: 0.5 }}>
             <OButton
               text={t('SLA_SETTING', 'SLA’s Settings')}
               textStyle={{ color: theme.colors.backArrow }}
@@ -421,9 +423,9 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
               }}
               onClick={onClickSetting}
             />
-          </View>
-          <View style={{ width: 10, height: '100%' }} />
-          <View style={{ flex: 0.5, justifyContent: 'center' }}>
+          </View> */}
+          {/* <View style={{ width: 10, height: '100%' }} /> */}
+          {/* <View style={{ flex: 0.5, justifyContent: 'center' }}>
             <SelectDropdown
               defaultButtonText={t('SLA', 'SLA\'s')}
               data={preorderTypeList}
@@ -453,7 +455,7 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
                 );
               }}
             />
-          </View>
+          </View> */}
         </View>
       )}
       <FiltersTab>
@@ -713,6 +715,39 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
             {openSearchModal && (
               <SearchModalContent>
                 <ModalTitle>{t('SEARCH_ORDERS', 'Search orders')}</ModalTitle>
+                <InputContainer style={{ marginBottom: 24 }}>
+                  <SelectDropdown
+                    defaultButtonText={search?.timeStatus
+                      ? preorderTypeList.find(type => type.key === search?.timeStatus)?.name
+                      : t('SLA', 'SLA\'s')}
+                    data={preorderTypeList}
+                    onSelect={(selectedItem, index) => {
+                      setSearch({ ...search, timeStatus: selectedItem?.key })
+                    }}
+                    buttonTextAfterSelection={(selectedItem, index) => {
+                      return selectedItem.name
+                    }}
+                    rowTextForSelection={(item, index) => {
+                      return item.key
+                    }}
+                    buttonStyle={styles.selectOption}
+                    buttonTextStyle={styles.buttonTextStyle}
+                    renderDropdownIcon={isOpened => {
+                      return <FeatherIcon name={isOpened ? 'chevron-up' : 'chevron-down'} color={'#444'} size={18} />;
+                    }}
+                    dropdownStyle={styles.dropdownStyle}
+                    dropdownOverlayColor='transparent'
+                    rowStyle={styles.rowStyle}
+                    renderCustomizedRowChild={(item, index) => {
+                      return (
+                        <SlaOption>
+                          {index !== 0 && <OrderStatus timeState={item?.key} />}
+                          <View><OText size={14} color={'#748194'} >{item?.name}</OText></View>
+                        </SlaOption>
+                      );
+                    }}
+                  />
+                </InputContainer>
                 <InputContainer>
                   <OInput
                     value={search.id}

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

@@ -153,10 +153,10 @@ export const OrderItem = React.memo((props: any) => {
         <Logo style={styles.logo}>
           <FastImage
             style={styles.icon}
-            source={order.business?.logo ? {
-              uri: optimizeImage(order.business?.logo, 'h_100,c_limit'),
+            source={order.business?.logo?.includes('https') ? {
+              uri: order.business?.logo,
               priority: FastImage.priority.normal,
-            } : theme?.images?.dummies?.businessLogo}
+            } : order.business?.logo ?? theme?.images?.dummies?.businessLogo}
             resizeMode={FastImage.resizeMode.cover}
           />
         </Logo>

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

@@ -46,11 +46,10 @@ const ProfileUI = (props: ProfileParams) => {
     toggleIsEdit,
     cleanFormState,
     handleToggleAvalaibleStatusDriver,
-    userState,
     isAlsea
   } = props;
 
-  const [{ user }] = useSession();
+  const [{ user, sessionLoading }] = useSession();
   const [, t] = useLanguage();
   const [, { showToast }] = useToast();
   const [{ optimizeImage }] = useUtils();
@@ -67,6 +66,7 @@ const ProfileUI = (props: ProfileParams) => {
     },
   });
   const [phoneUpdate, setPhoneUpdate] = useState(false);
+  const [userState, setUserState] = useState(props.userState)
   const [userPhoneNumber, setUserPhoneNumber] = useState<any>(null);
   const [phoneToShow, setPhoneToShow] = useState('');
   const [openModal, setOpenModal] = useState(false)
@@ -207,6 +207,22 @@ const ProfileUI = (props: ProfileParams) => {
     }
   }, [user?.country_phone_code]);
 
+  useEffect(() => {
+    setUserState({ ...userState, ...props.userState })
+  }, [props.userState])
+
+  useEffect(() => {
+    if (!user?.id) return
+
+    setUserState({
+      ...userState,
+      result: {
+        error: true,
+        result: user
+      }
+    })
+  }, [user, props.isFocused])
+
   const styles = StyleSheet.create({
     label: {
       color: theme.colors.textGray,
@@ -255,7 +271,7 @@ const ProfileUI = (props: ProfileParams) => {
         />
       )}
 
-      {formState?.loading && !validationFields.error && (
+      {(formState?.loading || sessionLoading) && !validationFields.error && (
         <View
           style={{
             backgroundColor: theme.colors.backgroundLight,
@@ -326,7 +342,7 @@ const ProfileUI = (props: ProfileParams) => {
         </View>
       )}
 
-      {!formState?.loading && !validationFields.error && (
+      {!(formState?.loading || sessionLoading) && !validationFields.error && (
         <ScrollView showsVerticalScrollIndicator={false} style={{ flex: 1 }}>
           <CenterView>
             <OIcon

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

@@ -51,7 +51,7 @@ const SocketStatusUI = (props: any) => {
         return '#E63757';
       default:
         return '#FF9922';
-    }  
+    }
   }
 
   return (
@@ -73,7 +73,7 @@ const SocketStatusUI = (props: any) => {
         <OText
           style={{ color: theme.colors.backArrow, fontSize: 16, marginBottom: 0, lineHeight: 16 }}
         >
-          {t('CONNECTION_STATUS', 'Connection status')}
+          {t('CONNECTION_STATUS_SHORT', 'Status')}
         </OText>
         <MaterialIcon
           name='circle'

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

@@ -58,6 +58,7 @@ export interface ProfileParams {
   isRequiredField?: any;
   isAlsea?: boolean;
   isShowDriverStatus?: boolean;
+  isFocused?: boolean;
 }
 
 export interface AddressListParams {

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

@@ -1,5 +1,5 @@
 import React, { useState, useEffect, useCallback, useRef } from 'react';
-import { View, StyleSheet, TouchableOpacity, Platform, I18nManager, ScrollView, Keyboard } from 'react-native';
+import { View, StyleSheet, TouchableOpacity, Platform, I18nManager, ScrollView, Keyboard, BackHandler } from 'react-native';
 import { initStripe, useConfirmPayment } from '@stripe/stripe-react-native';
 import NativeStripeSdk from '@stripe/stripe-react-native/src/NativeStripeSdk'
 import Picker from 'react-native-country-picker-modal';
@@ -159,7 +159,7 @@ const CheckoutUI = (props: any) => {
 	const [phoneUpdate, setPhoneUpdate] = useState(false);
 	const [openChangeStore, setOpenChangeStore] = useState(false)
 	const [isDeliveryOptionModalVisible, setIsDeliveryOptionModalVisible] = useState(false)
-	const [showGateway, setShowGateway] = useState<any>({ closedByUsed: false, open: false });
+	const [showGateway, setShowGateway] = useState<any>({ closedByUser: false, open: false });
 	const [webviewPaymethod, setWebviewPaymethod] = useState<any>(null)
 	const [isOpen, setIsOpen] = useState(false)
 	const [requiredFields, setRequiredFields] = useState<any>([])
@@ -431,6 +431,21 @@ const CheckoutUI = (props: any) => {
 		}
 	}, [])
 
+	useEffect(() => {
+		const onBackFunction = () => {
+			if (webviewPaymethod?.gateway === 'paypal' && showGateway.open) {
+				setShowGateway({ open: false, closedByUser: true })
+				return true
+			} else {
+				return false
+			}
+		}
+		BackHandler.addEventListener('hardwareBackPress', onBackFunction)
+		return () => {
+			BackHandler.removeEventListener('hardwareBackPress', onBackFunction)
+		}
+	}, [BackHandler, webviewPaymethod?.gateway, showGateway.open])
+
 	return (
 		<>
 			<View style={styles.wrapperNavbar}>

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

@@ -368,7 +368,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
   }, [order?.delivery_type])
 
   return (
-    <SafeAreaView>
+    <>
       <View style={styles.wrapperNavbar}>
         <TopHeader>
           <>
@@ -1125,8 +1125,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
           />
         </OModal>
       </OrderDetailsContainer>
-    </SafeAreaView>
-
+    </>
   );
 };