ordering-ui-react-native 0.12.34 → 0.12.38

package/package.json

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

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

@@ -40,12 +40,14 @@ export const AcceptOrRejectOrder = (props: AcceptOrRejectOrderParams) => {
   const [time, setTime] = useState('');
   const [comments, setComments] = useState('');
   const [isKeyboardShow, setIsKeyboardShow] = useState(false);
-  const phoneNumber = customerCellphone;
-  let codeNumberPhone, numberPhone, numberToShow;
   const { top, bottom } = useSafeAreaInsets()
-  const titleOrder = t(orderTitle[action].key, orderTitle[action].text)
-  const buttonText = t(orderTitle[action].btnKey, orderTitle[action].btnText)
+
+  let codeNumberPhone, numberPhone, numberToShow;
+  const phoneNumber = customerCellphone;
+  const titleOrder = t(orderTitle[action]?.key, orderTitle[action]?.text)
+  const buttonText = t(orderTitle[action]?.btnKey, orderTitle[action]?.btnText)
   const showTextArea = ['reject', 'deliveryFailed', 'pickupFailed', 'notReady'].includes(action)
+
   const handleFocus = () => {
     viewRef?.current?.measure((x: any, y: any) => {
       scrollViewRef?.current?.scrollTo({ x: 0, y });
@@ -210,7 +212,6 @@ export const AcceptOrRejectOrder = (props: AcceptOrRejectOrderParams) => {
     }
 
     bodyToSend.id = orderId;
-
     handleUpdateOrder && handleUpdateOrder(bodyToSend.status, bodyToSend);
   };
 

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

@@ -48,8 +48,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
     isFromCheckout,
     driverLocation,
     actions,
-    titleAccept,
-    titleReject,
+    orderTitle,
     appTitle,
   } = props;
 
@@ -607,8 +606,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
                   orderId={order?.id}
                   notShowCustomerPhone={false}
                   actions={actions}
-                  titleAccept={titleAccept}
-                  titleReject={titleReject}
+                  orderTitle={orderTitle}
                   appTitle={appTitle}
                 />
               </OModal>

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

@@ -128,6 +128,36 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
     setOpenModalForAccept(true);
   };
 
+  const handleCloseModal = () => {
+    setOpenModalForBusiness(false);
+  };
+
+  const handleArrowBack: any = () => {
+    navigation?.canGoBack() && navigation.goBack();
+  };
+
+  const handleRejectLogisticOrder = () => {
+    handleClickLogisticOrder?.(2, order?.logistic_order_id)
+    handleArrowBack()
+  }
+
+  const locations = [
+    {
+      ...order?.business?.location,
+      title: order?.business?.name,
+      icon: order?.business?.logo || theme.images.dummies.businessLogo,
+      type: 'Business',
+    },
+    {
+      ...order?.customer?.location,
+      title: order?.customer?.name,
+      icon:
+        order?.customer?.photo ||
+        'https://res.cloudinary.com/demo/image/upload/c_thumb,g_face,r_max/d_avatar.png/non_existing_id.png',
+      type: 'Customer',
+    },
+  ];
+
   useEffect(() => {
     if (permissions.locationStatus !== 'granted' && openModalForMapView) {
       setOpenModalForMapView(false);
@@ -146,20 +176,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
     if (openModalForMapView) {
       setOpenModalForMapView(false);
     }
-  }, [order?.loading]);
-
-  const handleCloseModal = () => {
-    setOpenModalForBusiness(false);
-  };
-
-  const handleArrowBack: any = () => {
-    navigation?.canGoBack() && navigation.goBack();
-  };
-
-  const handleRejectLogisticOrder = () => {
-    handleClickLogisticOrder?.(2, order?.logistic_order_id)
-    handleArrowBack()
-  }
+  }, [props.order?.loading]);
 
   useEffect(() => {
     if (order?.driver === null && session?.user?.level === 4) {
@@ -176,23 +193,6 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
     }
   }, [order?.driver]);
 
-  const locations = [
-    {
-      ...order?.business?.location,
-      title: order?.business?.name,
-      icon: order?.business?.logo || theme.images.dummies.businessLogo,
-      type: 'Business',
-    },
-    {
-      ...order?.customer?.location,
-      title: order?.customer?.name,
-      icon:
-        order?.customer?.photo ||
-        'https://res.cloudinary.com/demo/image/upload/c_thumb,g_face,r_max/d_avatar.png/non_existing_id.png',
-      type: 'Customer',
-    },
-  ];
-
   useEffect(() => {
     if (driverLocation) {
       locations[0] = driverLocation;
@@ -270,7 +270,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
                 />
               </Pickup>
             )}
-            {(order?.status === 3) && order?.delivery_type === 1 && (
+            {order?.status === 3 && order?.delivery_type === 1 && (
               <View style={{ paddingVertical: 20, marginBottom: 20 }}>
                 <OButton
                   style={styles.btnPickUp}
@@ -285,67 +285,6 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
               </View>
             )}
           </>
-
-          <OModal
-            open={openModalForBusiness}
-            order={order}
-            title={`${t('INVOICE_ORDER_NO', 'Order No.')} ${order.id}`}
-            entireModal
-            onClose={() => handleCloseModal()}>
-            <Chat
-              type={
-                openModalForBusiness ? USER_TYPE.BUSINESS : USER_TYPE.DRIVER
-              }
-              orderId={order?.id}
-              messages={messages}
-              order={order}
-              setMessages={setMessages}
-            />
-          </OModal>
-
-          <OModal
-            open={openModalForAccept}
-            onClose={() => setOpenModalForAccept(false)}
-            entireModal
-            customClose>
-            <AcceptOrRejectOrder
-              handleUpdateOrder={handleChangeOrderStatus}
-              closeModal={setOpenModalForAccept}
-              customerCellphone={order?.customer?.cellphone}
-              loading={order?.loading}
-              action={actionOrder}
-              orderId={order?.id}
-              notShowCustomerPhone
-              actions={actions}
-              orderTitle={orderTitle}
-              appTitle={appTitle}
-            />
-          </OModal>
-
-          <OModal
-            open={openModalForMapView}
-            onClose={() => handleOpenMapView()}
-            entireModal
-            customClose>
-            <DriverMap
-              navigation={navigation}
-              order={order}
-              orderStatus={getOrderStatus(order?.status, t)?.value || ''}
-              location={locationMarker}
-              readOnly
-              updateDriverPosition={updateDriverPosition}
-              driverUpdateLocation={driverUpdateLocation}
-              setDriverUpdateLocation={setDriverUpdateLocation}
-              handleViewActionOrder={handleViewActionOrder}
-              isBusinessMarker={isBusinessMarker}
-              isToFollow={isToFollow}
-              showAcceptOrReject={
-                showFloatButtonsAcceptOrReject[order?.status]
-              }
-              handleOpenMapView={handleOpenMapView}
-            />
-          </OModal>
-
           <View
             style={{
               height:
@@ -356,14 +295,14 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
 
         {showFloatButtonsPickUp[order?.status] && (
           <FloatingButton
-            disabled={order?.loading}
+            disabled={props.order?.loading}
             btnText={t('PICKUP_FAILED', 'Pickup failed')}
             isSecondaryBtn={false}
             secondButtonClick={() =>
               handleChangeOrderStatus && handleChangeOrderStatus(9)
             }
             firstButtonClick={() =>
-              handleViewActionOrder && handleViewActionOrder('failed')
+              handleViewActionOrder && handleViewActionOrder('pickupFailed')
             }
             secondBtnText={t('PICKUP_COMPLETE', 'Pickup complete')}
             secondButton={true}
@@ -375,14 +314,14 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
         {(order?.status === 9 || order?.status === 19) && (
           <>
             <FloatingButton
-              disabled={order?.loading}
+              disabled={props.order?.loading}
               btnText={t('DELIVERY_FAILED', 'Delivery Failed')}
               isSecondaryBtn={false}
               secondButtonClick={() =>
                 handleChangeOrderStatus && handleChangeOrderStatus(11)
               }
               firstButtonClick={() =>
-                handleViewActionOrder && handleViewActionOrder('failed')
+                handleViewActionOrder && handleViewActionOrder('deliveryFailed')
               }
               secondBtnText={t('DELIVERY_COMPLETE', 'Delivery complete')}
               secondButton={true}
@@ -405,14 +344,6 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
             widthButton={'45%'}
           />
         )}
-
-        <Alert
-          open={alertState.open}
-          onAccept={handleArrowBack}
-          onClose={handleArrowBack}
-          content={alertState.content}
-          title={t('WARNING', 'Warning')}
-        />
       </>
     )
   }
@@ -420,7 +351,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
   return (
     <>
       {(!order || Object.keys(order).length === 0) &&
-        (order?.error?.length < 1 || !order?.error) && (
+        (props.order?.error?.length < 1 || !props.order?.error) && (
           <View style={{ flex: 1 }}>
             {[...Array(6)].map((item, i) => (
               <Placeholder key={i} Animation={Fade}>
@@ -437,7 +368,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
           </View>
         )}
 
-      {(!!order?.error || order?.error) && (
+      {(!!props.order?.error || props.order?.error) && (
         <NotFoundSource
           btnTitle={t('GO_TO_MY_ORDERS', 'Go to my orders')}
           content={
@@ -457,7 +388,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
           handleArrowBack={handleArrowBack}
           logisticOrderStatus={logisticOrderStatus}
         />
-        {order && Object.keys(order).length > 0 && (order?.error?.length < 1 || !order?.error) && (
+        {order && Object.keys(order).length > 0 && (props.order?.error?.length < 1 || !props.order?.error) && (
           <>
             {order?.order_group && order?.order_group_id ? order?.order_group?.orders.map((order: any) => (
               <OrderDetailsInformation order={order} />
@@ -466,7 +397,79 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
             )}
           </>
         )}
+        {openModalForMapView && (
+          <OModal
+            open={openModalForMapView}
+            onClose={() => handleOpenMapView()}
+            entireModal
+            customClose>
+            <DriverMap
+              navigation={navigation}
+              order={order}
+              orderStatus={getOrderStatus(order?.status, t)?.value || ''}
+              location={locationMarker}
+              readOnly
+              updateDriverPosition={updateDriverPosition}
+              driverUpdateLocation={driverUpdateLocation}
+              setDriverUpdateLocation={setDriverUpdateLocation}
+              handleViewActionOrder={handleViewActionOrder}
+              isBusinessMarker={isBusinessMarker}
+              isToFollow={isToFollow}
+              showAcceptOrReject={
+                showFloatButtonsAcceptOrReject[order?.status]
+              }
+              handleOpenMapView={handleOpenMapView}
+            />
+          </OModal>
+        )}
+        {openModalForBusiness && (
+          <OModal
+            open={openModalForBusiness}
+            order={order}
+            title={`${t('INVOICE_ORDER_NO', 'Order No.')} ${order.id}`}
+            entireModal
+            onClose={() => handleCloseModal()}>
+            <Chat
+              type={
+                openModalForBusiness ? USER_TYPE.BUSINESS : USER_TYPE.DRIVER
+              }
+              orderId={order?.id}
+              messages={messages}
+              order={order}
+              setMessages={setMessages}
+            />
+          </OModal>
+        )}
+        {openModalForAccept && (
+          <OModal
+            open={openModalForAccept}
+            onClose={() => setOpenModalForAccept(false)}
+            entireModal
+            customClose>
+            <AcceptOrRejectOrder
+              handleUpdateOrder={handleChangeOrderStatus}
+              closeModal={setOpenModalForAccept}
+              customerCellphone={order?.customer?.cellphone}
+              loading={props.order?.loading}
+              action={actionOrder}
+              orderId={order?.id}
+              notShowCustomerPhone
+              actions={actions}
+              orderTitle={orderTitle}
+              appTitle={appTitle}
+            />
+          </OModal>
+        )}
       </View>
+      {alertState?.open && (
+        <Alert
+          open={alertState.open}
+          onAccept={handleArrowBack}
+          onClose={handleArrowBack}
+          content={alertState.content}
+          title={t('WARNING', 'Warning')}
+        />
+      )}
     </>
   );
 };

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

@@ -526,9 +526,9 @@ export interface TagsParams {
 interface actions {
   accept: string;
   reject: string;
-  pickupFailed: string;
-  deliveryFailed: string;
-  notReady: string;
+  pickupFailed?: string;
+  deliveryFailed?: string;
+  notReady?: string;
 }
 
 interface textTranslate {

package/themes/single-business/src/components/BusinessBasicInformation/index.tsx

@@ -79,7 +79,7 @@ export const BusinessBasicInformation = (
 						onPress={() => auth
 							? navigation.navigate('AddressList', { isGoBack: true, isFromProductsList: true })
 							: navigation.navigate('AddressForm', { address: orderState.options?.address })}
-						style={{marginTop: !auth ? 36 : top > 0 ? 0 : 20}}
+						style={{marginTop: (!auth || props.isFranchiseApp) ? 36 : top > 0 ? 0 : 20}}
 						activeOpacity={0.8}
 					>
 						<OIcon src={theme.images.general.pin} width={16} color={theme.colors.textSecondary} />

package/themes/single-business/src/components/BusinessProductsListing/index.tsx

@@ -28,6 +28,7 @@ import { ProductForm } from '../ProductForm'
 // import { UpsellingProducts } from '../UpsellingProducts'
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import { _setStoreData } from '../../providers/StoreUtil';
+import NavBar from '../NavBar';
 
 const PIXELS_TO_SCROLL = 1000
 
@@ -180,15 +181,14 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
 				scrollEventThrottle={16}
       >
 				<WrapHeader>
-					{!auth &&
+					{(!auth || props.isFranchiseApp) && !loading &&
 						<TopHeader style={{top: top}}>
-							<OButton
-								imgLeftSrc={theme.images.general.arrow_left}
-								imgRightSrc={null}
-								style={styles.btnBackArrow}
-								onClick={() => navigation?.canGoBack() && navigation.goBack()}
-								imgLeftStyle={{ tintColor: theme.colors.white }}
-							/>
+              <NavBar
+                style={{ paddingBottom: 0, marginLeft: 20, backgroundColor: 'transparent' }}
+                btnStyle={{ backgroundColor: 'transparent' }}
+                leftImageStyle={{ tintColor: theme.colors.white }}
+                onActionLeft={() => navigation?.canGoBack() && navigation.goBack()}
+              />
 						</TopHeader>
 					}
 					<BusinessBasicInformation
@@ -197,6 +197,7 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
 						openBusinessInformation={openBusinessInformation}
 						header={header}
 						logo={logo}
+            isFranchiseApp={props.isFranchiseApp}
 					/>
 				</WrapHeader>
 				<View style={{ height: 8, backgroundColor: theme.colors.backgroundGray100 }} />