ordering-ui-react-native 0.9.2 → 0.9.6

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

@@ -27,6 +27,7 @@ import { ProductItemAccordion } from '../ProductItemAccordion';
 import { USER_TYPE } from '../../config/constants';
 import { useTheme } from 'styled-components/native';
 import { verifyDecimals } from '../../utils';
+import { NotFoundSource } from '../NotFoundSource';
 
 //Styles
 import {
@@ -56,13 +57,16 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
     askLocationPermission,
     driverLocation,
     actions,
+    updateDriverPosition,
+    driverUpdateLocation,
+    setDriverUpdateLocation,
     titleAccept,
     titleReject,
     appTitle,
   } = props;
 
   const [, { showToast }] = useToast();
-  const { order, loading } = props.order;
+  const { order, loading, error } = props.order;
   const theme = useTheme();
   const [, t] = useLanguage();
   const [{ parsePrice, parseNumber, parseDate }] = useUtils();
@@ -444,7 +448,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
 
   return (
     <>
-      {(!order || Object.keys(order).length === 0) && (
+      {(!order || Object.keys(order).length === 0) && !error && (
         <View
           style={{
             padding: 20,
@@ -464,7 +468,14 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
           ))}
         </View>
       )}
-      {order && Object.keys(order).length > 0 && (
+      {error?.length > 0 && (
+        <NotFoundSource
+          btnTitle={t('GO_TO_MY_ORDERS', 'Go to my orders')}
+          content={props.order.error[0]}
+          onClickButton={() => navigation.navigate('Orders')}
+        />
+      )}
+      {order && Object.keys(order).length > 0 && !error && (
         <>
           <Header>
             <OIconButton
@@ -760,6 +771,9 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
                 orderStatus={getOrderStatus(order?.status)?.value || ''}
                 location={locationMarker}
                 readOnly
+                updateDriverPosition={updateDriverPosition}
+                driverUpdateLocation={driverUpdateLocation}
+                setDriverUpdateLocation={setDriverUpdateLocation}
                 handleViewActionOrder={handleViewActionOrder}
                 isBusinessMarker={isBusinessMarker}
                 isToFollow={isToFollow}
@@ -828,7 +842,6 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
 export const OrderDetailsDelivery = (props: OrderDetailsParams) => {
   const orderDetailsProps = {
     ...props,
-    driverAndBusinessId: true,
     UIComponent: OrderDetailsUI,
   };
   return <OrderDetailsConTableoller {...orderDetailsProps} />;

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

@@ -9,7 +9,7 @@ import {
 import { OrderList, useLanguage } from 'ordering-components/native';
 import { useTheme } from 'styled-components/native';
 import { Placeholder, PlaceholderLine, Fade } from 'rn-placeholder';
-import { OText, OIconButton, OButton } from '../shared';
+import { OText, OButton } from '../shared';
 import { PreviousOrders } from '../PreviousOrders';
 import { NotFoundSource } from '../NotFoundSource';
 import { FiltersTab, TabsContainer, Tag } from './styles';
@@ -134,6 +134,9 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
   const scrollRefTab = useRef() as React.MutableRefObject<ScrollView>;
 
   const [ordersFilter, setOrdersFilter] = useState(tabs[0].tags);
+  const [ordersFiltered, setOrdersFiltered] = useState(
+    orders.filter((order: any) => ordersFilter.includes(order?.status)),
+  );
   const [tabsStatus, setTabStatus] = useState(tabs[0].tags);
   const [tagsStatus, setTagsStatus] = useState(tabs[0].tags);
   const [isLoadedOrders, setIsLoadedOrders] = useState<any>({
@@ -153,6 +156,14 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
     parseInt(parseFloat(String(Dimensions.get('window').width)).toFixed(0)),
   );
 
+  useEffect(() => {
+    setOrdersFiltered(
+      orders.filter((order: any) =>
+        rememberOrderStatus.includes(order?.status),
+      ),
+    );
+  }, [ordersFilter, orders, rememberOrderStatus]);
+
   const handleChangeTab = (tags: number[], tabTitle: string) => {
     if (!isLoadedOrders[tabTitle].isFetched) {
       loadOrders && loadOrders(true, tags);
@@ -184,13 +195,11 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
 
   const handleChangeTag = (key: number) => {
     const updateTags: number[] = [];
-    if (ordersFilter.includes(key)) {
-      updateTags.push(...ordersFilter.filter(tag => tag !== key));
+    if (rememberOrderStatus.includes(key)) {
+      updateTags.push(...rememberOrderStatus.filter((tag: any) => tag !== key));
     } else {
-      updateTags.push(...ordersFilter.concat(key));
+      updateTags.push(...rememberOrderStatus.concat(key));
     }
-
-    setOrdersFilter(updateTags);
     setRememberOrderStatus(updateTags);
   };
 
@@ -355,14 +364,14 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
               key={key}
               onPress={() => handleChangeTag(key)}
               isSelected={
-                ordersFilter.includes(key)
+                rememberOrderStatus.includes(key)
                   ? theme.colors.primary
                   : theme.colors.tabBar
               }>
               <OText
                 style={styles.tag}
                 color={
-                  ordersFilter.includes(key)
+                  rememberOrderStatus.includes(key)
                     ? theme.colors.white
                     : theme.colors.black
                 }>
@@ -375,8 +384,10 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
 
       {!loading &&
         (!ordersFilter.length ||
+          ordersFiltered?.length < 1 ||
           orderList.error ||
-          !orderList.orders.length) && (
+          !orderList.orders.length ||
+          !rememberOrderStatus.length) && (
           <NotFoundSource
             content={
               !orderList.error
@@ -393,10 +404,10 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
       <ScrollView showsVerticalScrollIndicator={false} style={{ flex: 1 }}>
         {!reload && !error && orders.length > 0 && (
           <PreviousOrders
-            orders={orders}
+            orders={ordersFiltered}
             onNavigationRedirect={onNavigationRedirect}
             getOrderStatus={getOrderStatus}
-            tabsFilter={ordersFilter}
+            tabsFilter={rememberOrderStatus}
           />
         )}
 
@@ -438,7 +449,8 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
           !loading &&
           !!orders.length &&
           pagination.currentPage < pagination.totalPages &&
-          isLoadedOrders[currentTab].hasMorePagination && (
+          isLoadedOrders[currentTab].hasMorePagination &&
+          rememberOrderStatus.length > 0 && (
             <OButton
               onClick={handleLoadMore}
               text={t('LOAD_MORE_ORDERS', 'Load more orders')}

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

@@ -7,7 +7,7 @@ import { Card, Logo, Information, MyOrderOptions } from './styles';
 import { PreviousOrdersParams } from '../../types';
 
 export const PreviousOrders = (props: any) => {
-  const { orders, onNavigationRedirect, getOrderStatus, tabsFilter } = props;
+  const { orders, onNavigationRedirect, getOrderStatus } = props;
   const [, t] = useLanguage();
   const [{ parseDate, optimizeImage }] = useUtils();
   const theme = useTheme();
@@ -71,65 +71,66 @@ export const PreviousOrders = (props: any) => {
           ?.filter((order: any) =>
             hash[order?.id] ? false : (hash[order?.id] = true),
           )
-          .map((order: any) => (
+          ?.sort((a: any, b: any) => {
+            return b.id - a.id;
+          })
+          ?.map((order: any) => (
             <React.Fragment key={order.id}>
-              {tabsFilter.includes(order.status) && (
-                <TouchableOpacity
-                  onPress={() => handlePressOrder(order)}
-                  style={styles.cardButton}
-                  activeOpacity={1}>
-                  <Card key={order.id}>
-                    {!!order.business?.logo && (
-                      <Logo style={styles.logo}>
-                        <OIcon
-                          url={optimizeImage(
-                            order.business?.logo,
-                            'h_300,c_limit',
-                          )}
-                          style={styles.icon}
-                        />
-                      </Logo>
-                    )}
+              <TouchableOpacity
+                onPress={() => handlePressOrder(order)}
+                style={styles.cardButton}
+                activeOpacity={1}>
+                <Card key={order.id}>
+                  {!!order.business?.logo && (
+                    <Logo style={styles.logo}>
+                      <OIcon
+                        url={optimizeImage(
+                          order.business?.logo,
+                          'h_300,c_limit',
+                        )}
+                        style={styles.icon}
+                      />
+                    </Logo>
+                  )}
 
-                    <Information>
-                      <OText numberOfLines={1} style={styles.title}>
-                        {order.business?.name}
-                      </OText>
+                  <Information>
+                    <OText numberOfLines={1} style={styles.title}>
+                      {order.business?.name}
+                    </OText>
+
+                    <OText
+                      style={styles.date}
+                      numberOfLines={1}
+                      adjustsFontSizeToFit
+                      size={20}>
+                      {t('INVOICE_ORDER_NO', 'Order No.') + order.id + ' · '}
+                      {order?.delivery_datetime_utc
+                        ? parseDate(order?.delivery_datetime_utc)
+                        : parseDate(order?.delivery_datetime, { utc: false })}
+                    </OText>
 
+                    <MyOrderOptions>
                       <OText
-                        style={styles.date}
+                        style={styles.orderType}
+                        mRight={5}
                         numberOfLines={1}
                         adjustsFontSizeToFit
-                        size={20}>
-                        {t('INVOICE_ORDER_NO', 'Order No.') + order.id + ' · '}
-                        {order?.delivery_datetime_utc
-                          ? parseDate(order?.delivery_datetime_utc)
-                          : parseDate(order?.delivery_datetime, { utc: false })}
+                        size={18}>
+                        {order.delivery_type === 1
+                          ? t('DELIVERY', 'Delivery')
+                          : order.delivery_type === 2
+                          ? t('PICKUP', 'Pickup')
+                          : order.delivery_type === 3
+                          ? t('EAT_IN', 'Eat in')
+                          : order.delivery_type === 4
+                          ? t('CURBSIDE', 'Curbside')
+                          : t('DRIVER_THRU', 'Driver thru')}
+                        {` · ${getOrderStatus(order.status)}`}
                       </OText>
-
-                      <MyOrderOptions>
-                        <OText
-                          style={styles.orderType}
-                          mRight={5}
-                          numberOfLines={1}
-                          adjustsFontSizeToFit
-                          size={18}>
-                          {order.delivery_type === 1
-                            ? t('DELIVERY', 'Delivery')
-                            : order.delivery_type === 2
-                            ? t('PICKUP', 'Pickup')
-                            : order.delivery_type === 3
-                            ? t('EAT_IN', 'Eat in')
-                            : order.delivery_type === 4
-                            ? t('CURBSIDE', 'Curbside')
-                            : t('DRIVER_THRU', 'Driver thru')}
-                          {` · ${getOrderStatus(order.status)}`}
-                        </OText>
-                      </MyOrderOptions>
-                    </Information>
-                  </Card>
-                </TouchableOpacity>
-              )}
+                    </MyOrderOptions>
+                  </Information>
+                </Card>
+              </TouchableOpacity>
             </React.Fragment>
           ))}
     </>

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

@@ -30,12 +30,10 @@ const StoresListUI = (props: BusinessesListingParams) => {
   } = props;
 
   const { loading, error, businesses } = businessesList;
-  const [loadingConnected, setLoadingConnected] = useState(true);
   const [isConnected, setIsConnected] = useState<boolean | null>(false);
 
-  NetInfo.fetch().then(state => {
+  NetInfo.fetch().then((state: any) => {
     setIsConnected(state.isConnected);
-    setLoadingConnected(false);
   });
 
   const [, t] = useLanguage();
@@ -144,9 +142,8 @@ const StoresListUI = (props: BusinessesListingParams) => {
       <ScrollView
         showsVerticalScrollIndicator={false}
         style={styles.container}
-        onScroll={(e: any) => handleScroll(e)}
-      >
-        {!loadBusinesses && (businesses?.length === 0 || !isConnected) && (
+        onScroll={(e: any) => handleScroll(e)}>
+        {!loadBusinesses && businesses?.length === 0 && (
           <NotFoundSource
             content={
               !isConnected

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

@@ -45,6 +45,7 @@ export const UserFormDetailsUI = (props: any) => {
 
   const [{ user }] = useSession();
   const [passwordSee, setPasswordSee] = useState(false);
+  const [confirmSee, setConfirmSee] = useState(false);
   const [userPhoneNumber, setUserPhoneNumber] = useState<any>(null);
   const [phoneInputData, setPhoneInputData] = useState({
     error: '',
@@ -388,7 +389,7 @@ export const UserFormDetailsUI = (props: any) => {
                 control={control}
                 render={({ onChange, value }: any) => (
                   <OInput
-                    isSecured={!passwordSee ? true : false}
+                    isSecured={!confirmSee ? true : false}
                     placeholder={t(
                       'MOBILE_CONFIRM_PASSWORD',
                       'Confirm Password',
@@ -396,19 +397,19 @@ export const UserFormDetailsUI = (props: any) => {
                     style={styles.inputStyle}
                     placeholderTextColor={theme.colors.arrowColor}
                     iconCustomRight={
-                      passwordSee ? (
+                      confirmSee ? (
                         <MaterialCommunityIcons
                           name="eye-outline"
                           color={theme.colors.arrowColor}
                           size={24}
-                          onPress={() => setPasswordSee(!passwordSee)}
+                          onPress={() => setConfirmSee(!confirmSee)}
                         />
                       ) : (
                         <MaterialCommunityIcons
                           name="eye-off-outline"
                           color={theme.colors.arrowColor}
                           size={24}
-                          onPress={() => setPasswordSee(!passwordSee)}
+                          onPress={() => setConfirmSee(!confirmSee)}
                         />
                       )
                     }

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

@@ -104,20 +104,21 @@ const ProfileUI = (props: ProfileParams) => {
   };
 
   useEffect(() => {
-    if (userState.result.result && !isAvailableLoading) {
+    const isLoadingDriver = userState?.loadingDriver ?? true;
+
+    if (userState?.result?.result && !isLoadingDriver) {
       if (userState?.result?.error) {
-        showToast(
-          ToastType.Error,
-          t(userState.result.error, userState.result.error),
-        );
+        const messageError =
+          userState.result.error || userState.result.error[0];
+        showToast(ToastType.Error, t(messageError, messageError));
       } else {
         showToast(
           ToastType.Success,
-          t('UPDATE_SUCCESSFULLY', 'Update successfully'),
+          t('AVAILABLE_STATE_IS_UPDATED', 'Available state is updated'),
         );
       }
     }
-  }, [isAvailableLoading]);
+  }, [userState?.loadingDriver]);
 
   useEffect(() => {
     if (formState.result.result && !formState.loading) {
@@ -301,7 +302,7 @@ const ProfileUI = (props: ProfileParams) => {
                 )}
               </OText>
 
-              {isAvailableLoading ? (
+              {userState.loadingDriver ? (
                 <ActivityIndicator size="small" color={theme.colors.primary} />
               ) : (
                 <ToggleSwitch

package/themes/business/src/hooks/useLocation.tsx

@@ -67,7 +67,7 @@ export const useLocation = () => {
         setRoutesLines(routes => [...routes, location]);
       },
       err => console.log(err),
-      { enableHighAccuracy: true, distanceFilter: 1 },
+      { enableHighAccuracy: true, distanceFilter: 3 },
     );
   };
 

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

@@ -349,6 +349,9 @@ export interface OrderDetailsParams {
   permissions?: any;
   askLocationPermission?: any;
   redirectToSettings?: any;
+  updateDriverPosition?: any;
+  driverUpdateLocation?: any;
+  setDriverUpdateLocation?: any;
 }
 export interface ProductItemAccordionParams {
   isCartPending?: boolean;
@@ -488,6 +491,9 @@ export interface GoogleMapsParams {
   setSaveLocation?: (val: boolean) => void;
   handleToggleMap?: () => void;
   navigation: any;
+  updateDriverPosition?: any;
+  driverUpdateLocation?: any;
+  setDriverUpdateLocation: any;
 }
 
 export interface TagsParams {

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

@@ -60,7 +60,20 @@ export const PreviousOrders = (props: PreviousOrdersParams) => {
 	}
 
 	const handleClickOrderReview = (order: any) => {
-		onNavigationRedirect && onNavigationRedirect('ReviewOrder', { order: { id: order?.id, business_id: order?.business_id, logo: order.business?.logo } })
+		onNavigationRedirect && onNavigationRedirect(
+			'ReviewOrder',
+			{
+			  order: {
+				id: order?.id,
+				business_id: order?.business_id,
+				logo: order.business?.logo,
+				driver: order?.driver,
+				products: order?.products,
+				review: order?.review,
+				user_review: order?.user_review
+			  }
+			}
+		  )
 	}
 
 	const handleReorderClick = (id: number) => {

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

@@ -56,7 +56,20 @@ export const PreviousOrders = (props: PreviousOrdersParams) => {
   }
 
   const handleClickOrderReview = (order: any) => {
-    onNavigationRedirect && onNavigationRedirect('ReviewOrder', { order: { id: order?.id, business_id: order?.business_id, logo: order.business?.logo } })
+    onNavigationRedirect && onNavigationRedirect(
+      'ReviewOrder',
+      {
+        order: {
+          id: order?.id,
+          business_id: order?.business_id,
+          logo: order.business?.logo,
+          driver: order?.driver,
+          products: order?.products,
+          review: order?.review,
+          user_review: order?.user_review
+        }
+      }
+    )
   }
 
   const handleReorderClick = (id: number) => {

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

@@ -86,6 +86,10 @@ export const PreviousOrders = (props: PreviousOrdersParams) => {
 					id: order?.id,
 					business_id: order?.business_id,
 					logo: order.business?.logo,
+					driver: order?.driver,
+					products: order?.products,
+					review: order?.review,
+					user_review: order?.user_review
 				},
 			});
 	};

package/themes/uber-eats/src/components/AddressForm/index.tsx

@@ -87,6 +87,8 @@ const AddressFormUI = (props: AddressFormParams) => {
       flexDirection: 'row',
       justifyContent: 'space-between',
       marginBottom: 20,
+      height: 70,
+      maxHeight: 70
     },
     textAreaStyles: {
       borderRadius: 0,

package/themes/uber-eats/src/components/PreviousOrders/index.tsx

@@ -56,7 +56,20 @@ export const PreviousOrders = (props: PreviousOrdersParams) => {
   }
 
   const handleClickOrderReview = (order: any) => {
-    onNavigationRedirect && onNavigationRedirect('ReviewOrder', { order: { id: order?.id, business_id: order?.business_id, logo: order.business?.logo } })
+    onNavigationRedirect && onNavigationRedirect(
+      'ReviewOrder',
+      {
+        order: {
+          id: order?.id,
+          business_id: order?.business_id,
+          logo: order.business?.logo,
+          driver: order?.driver,
+          products: order?.products,
+          review: order?.review,
+          user_review: order?.user_review
+        }
+      }
+    )
   }
 
   const handleReorderClick = (id : number) => {