ordering-ui-react-native 0.17.77 → 0.17.79

package/package.json

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

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

@@ -1,6 +1,6 @@
-import React, { useState } from 'react'
+import React, { useState, useCallback } from 'react'
 
-import { Platform, StyleSheet, View } from 'react-native';
+import { Platform, StyleSheet, View, TouchableOpacity } from 'react-native';
 
 import { OButton, OText, OLink, OModal } from '../shared'
 import {
@@ -44,6 +44,9 @@ export const OrderContentComponent = (props: OrderContent) => {
   const [{ configs }] = useConfig();
   const [openReviewModal, setOpenReviewModal] = useState(false)
 
+  const [isReadMore, setIsReadMore] = useState(false)
+  const [lengthMore, setLengthMore] = useState(false)
+
   const pastOrderStatuses = [1, 2, 5, 6, 10, 11, 12, 16, 17]
 
   const walletName: any = {
@@ -95,6 +98,10 @@ export const OrderContentComponent = (props: OrderContent) => {
     return /^\d+$/.test(str);
   }
 
+  const onTextLayout = useCallback((e: any) => {
+    setLengthMore(e.nativeEvent.lines.length >= 3); //to check the text is more than 2 lines or not
+  },[]);
+
   return (
     <OrderContent isOrderGroup={isOrderGroup} lastOrder={lastOrder}>
       {isOrderGroup && (
@@ -298,18 +305,26 @@ export const OrderContentComponent = (props: OrderContent) => {
         )}
 
         {!!order?.customer?.address && (
-          <View style={styles.linkWithIcons}>
-            <OLink
-              PressStyle={styles.linkWithIcons}
-              url={Platform.select({
-                ios: `maps:0,0?q=${order?.customer?.address}`,
-                android: `geo:0,0?q=${order?.customer?.address}`,
-              })}
-              numberOfLines={2}
-              shorcut={order?.customer?.address}
-              TextStyle={styles.textLink}
-            />
-          </View>
+          <>
+            <View style={styles.linkWithIcons}>
+              <OLink
+                PressStyle={{ ...styles.linkWithIcons, marginBottom: 0 }}
+                url={Platform.select({
+                  ios: `maps:0,0?q=${order?.customer?.address}`,
+                  android: `geo:0,0?q=${order?.customer?.address}`,
+                })}
+                onTextLayout={onTextLayout}
+                numberOfLines={isReadMore ? 20 : 2}
+                shorcut={order?.customer?.address}
+                TextStyle={styles.textLink}
+              />
+            </View>
+            {lengthMore && (
+              <TouchableOpacity onPress={() => setIsReadMore(!isReadMore)}>
+                <OText size={12} color={theme.colors.statusOrderBlue}>{isReadMore ? t('SHOW_LESS', 'Show less') : t('READ_MORE', 'Read more')}</OText>
+              </TouchableOpacity>
+            )}
+          </>
         )}
 
         {!!order?.customer?.internal_number && (

package/themes/business/src/components/shared/OLink.tsx

@@ -13,10 +13,11 @@ interface Props {
   type?: string;
   hasButton?: boolean;
   numberOfLines?: number;
+  onTextLayout?: (e : any) => void;
 }
 
 const OLink = (props: Props): React.ReactElement => {
-  const { url, shorcut, color, PressStyle, TextStyle, type, hasButton, numberOfLines } = props;
+  const { url, shorcut, color, PressStyle, TextStyle, type, hasButton, numberOfLines, onTextLayout } = props;
   const [, t] = useLanguage();
 
   const handleAlert = () =>
@@ -78,7 +79,9 @@ const OLink = (props: Props): React.ReactElement => {
           style={TextStyle}
           numberOfLines={numberOfLines ?? 1}
           ellipsizeMode="tail"
-          color={color}>
+          color={color}
+          onTextLayout={onTextLayout}
+        >
           {shorcut}
         </OText>
       )}
@@ -86,4 +89,8 @@ const OLink = (props: Props): React.ReactElement => {
   );
 };
 
+OLink.defaultProps = {
+  onTextLayout: (e: any) => {}
+};
+
 export default OLink;

package/themes/business/src/components/shared/OText.tsx

@@ -42,15 +42,20 @@ interface Props {
   adjustsFontSizeToFit?: boolean;
   textDecorationLine?: string;
   lineHeight?: number;
+  onTextLayout?: (e : any) => void;
 }
 
 const OText = (props: Props): React.ReactElement => {
   return (
-    <SText {...props} style={[props.style, { lineHeight: props.lineHeight }]}>
+    <SText {...props} style={[props.style, { lineHeight: props.lineHeight }]} onTextLayout={props.onTextLayout}>
       {props.children}
       {props.space && ' '}
     </SText>
   );
 };
 
+OText.defaultProps = {
+  onTextLayout: (e: any) => {}
+};
+
 export default OText;

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

@@ -184,6 +184,35 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
 	}
 
 	const handleUpsellingPage = () => {
+		setOpenUpselling(false)
+		setCanOpenUpselling(false)
+		const cartSelectedHasGroup = currentCart?.group?.uuid
+		const cartFilterValidation = (cart: any) => cart?.valid && cart?.status !== 2
+		const cartsGroupLength = cartSelectedHasGroup ? Object.values(orderState.carts).filter((_cart: any) => _cart?.group?.uuid === cartSelectedHasGroup && cartFilterValidation(_cart))?.length : 0
+		if (cartsGroupLength > 1 && isCheckoutMultiBusinessEnabled) {
+			props.onNavigationRedirect('CheckoutNavigator', {
+				screen: 'MultiCheckout',
+				cartUuid: currentCart?.group?.uuid
+			})
+			return
+		}
+		const cartGroupsCount: any = {}
+		Object.values(orderState.carts).filter(_cart => cartFilterValidation(_cart))?.forEach((_cart: any) => {
+			if (cartGroupsCount[_cart?.group?.uuid]) {
+				cartGroupsCount[_cart?.group?.uuid] += 1
+			} else {
+				cartGroupsCount[_cart?.group?.uuid] = 1
+			}
+		})
+		let groupForTheCart
+		const groupForAddCartArray = Object.keys(cartGroupsCount).filter(cartGroupUuid => cartGroupsCount[cartGroupUuid] > 0 && cartGroupsCount[cartGroupUuid] < 5)
+		const max = Math.max(...groupForAddCartArray.map(uuid => cartGroupsCount[uuid]))
+		const indexes = groupForAddCartArray.filter(uuid => cartGroupsCount[uuid] === max)
+		if (indexes?.length > 1) {
+			groupForTheCart = indexes.find(uuid => uuid !== 'undefined')
+		} else {
+			groupForTheCart = indexes[0]
+		}
 		if (isCheckoutMultiBusinessEnabled && openCarts.length > 1) {
 			onRedirect('CheckoutNavigator', {
 				screen: 'MultiCheckout'
@@ -531,7 +560,6 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
 							btnLeftValue={currentCart?.products.reduce((prev: number, product: any) => prev + product.quantity, 0)}
 							btnRightValue={parsePrice(currentCart?.total)}
 							disabled={subtotalWithTaxes < currentCart?.minimum || openUpselling}
-							hideButton={isCheckoutMultiBusinessEnabled}
 							handleClick={() => setOpenUpselling(true)}
 						/>
 					</View>

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

@@ -22,8 +22,7 @@ const FloatingButtonUI = (props: FloatingButtonParams) => {
 		disabled,
 		isSecondaryBtn,
 		handleEmpty,
-		iosBottom,
-		hideButton
+		iosBottom
 	} = props;
 
 	const [, t] = useLanguage();
@@ -78,17 +77,15 @@ const FloatingButtonUI = (props: FloatingButtonParams) => {
 					</View>
 				)}
 			</View>
-			{!hideButton && (
-				<Button
-					style={[isSecondaryBtn ? styles.secondaryBtn : styles.primaryBtn]}
-					onPress={handleButtonClick}
-					disabled={disabled}
-				>
-					<OText color={isSecondaryBtn ? theme.colors.textSecondary : theme.colors.white} lineHeight={24} size={14} weight={'400'}>
-						{btnText}
-					</OText>
-				</Button>
-			)}
+			<Button
+				style={[isSecondaryBtn ? styles.secondaryBtn : styles.primaryBtn]}
+				onPress={handleButtonClick}
+				disabled={disabled}
+			>
+				<OText color={isSecondaryBtn ? theme.colors.textSecondary : theme.colors.white} lineHeight={24} size={14} weight={'400'}>
+					{btnText}
+				</OText>
+			</Button>
 		</Container>
 	);
 };

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

@@ -23,7 +23,7 @@ export const MyOrders = (props: any) => {
   const [isEmptyBusinesses, setIsEmptyBusinesses] = useState(false)
   const [businessOrderIds, setBusinessOrderIds] = useState([])
   const [ordersLength, setOrdersLength] = useState({
-    activeOrdersLength: 0,
+    activeOrdersLength: null,
     previousOrdersLength: 0,
   });
   const [selectedOption, setSelectedOption] = useState(!hideOrders ? 'orders' : 'business')
@@ -143,7 +143,7 @@ export const MyOrders = (props: any) => {
       )}
       {selectedOption === 'orders' && (
         <>
-          {ordersLength?.activeOrdersLength > 0 && (
+          {ordersLength?.activeOrdersLength !== 0 && (
             <View style={{ paddingHorizontal: isChewLayout ? 20 : 40 }}>
               <OrdersOption
                 {...props}

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

@@ -192,14 +192,14 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
 	useEffect(() => {
 		if (loading) return
 
-		const updateOrders = orders.filter((order: any) => orderStatus.includes(order.status))
+		const updateOrders = _orders.filter((order: any) => orderStatus.includes(order.status))
 
 		if (activeOrders) {
 			setOrdersLength && setOrdersLength({ ...ordersLength, activeOrdersLength: updateOrders?.length })
 		} else if (!preOrders) {
 			setOrdersLength && setOrdersLength({ ...ordersLength, previousOrdersLength: updateOrders?.length })
 		}
-	}, [orders, activeOrders, preOrders])
+	}, [_orders, activeOrders, preOrders])
 
 	useEffect(() => {
 		if (refreshOrders) {

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

@@ -251,6 +251,7 @@ export interface BusinessProductsListingParams {
 	handleChangeProfessionalSelected?: any;
 	handleUpdateProfessionals?: any;
 	onBusinessClick?: any;
+	onNavigationRedirect?: any;
 }
 export interface BusinessBasicInformationParams {
 	navigation?: any;
@@ -533,7 +534,6 @@ export interface FloatingButtonParams {
 	handleClick?: any;
 	handleEmpty?: any;
 	iosBottom?: number
-	hideButton?: boolean
 }
 export interface MomentOptionParams {
 	navigation: any;