ordering-ui-react-native 0.17.88 → 0.17.90

package/package.json

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

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

@@ -240,13 +240,16 @@ export const BusinessListingSearchUI = (props: BusinessSearchParams) => {
         <SearchBar
           lazyLoad
           {...(isChewLayout && { height: 55 })}
-          inputStyle={{ ...styles.searchInput, ...Platform.OS === 'ios' ? {} : { paddingBottom: 4 } }}
-          placeholder={`${t('SEARCH_BUSINESSES', 'Search Businesses')} / ${t('TYPE_AT_LEAST_3_CHARACTERS', 'type at least 3 characters')}`}
+          inputStyle={{ ...styles.searchInput }}
+          placeholder={t('SEARCH_BUSINESSES', 'Search Businesses')}
           onSearch={(val: string) => handleChangeTermValue(val)}
           value={termValue}
           iconCustomRight={<AntDesignIcon name='filter' size={16} style={{ bottom: 2 }} onPress={() => handleOpenfilters()} />}
         />
       </SearchWrapper>
+      <OText size={12} lineHeight={20} color={theme.colors.textThird} mLeft={5}>
+        {t('TYPE_AT_LEAST_3_CHARACTERS', 'Type at least 3 characters')}
+      </OText>
       {
         noResults && (
           <View>
@@ -273,11 +276,13 @@ export const BusinessListingSearchUI = (props: BusinessSearchParams) => {
         />
       )}
 
-      <OptionTitle isBusinessesSearchList={!!businessesSearchList}>
-        <OText size={16} lineHeight={24} weight={'500'} color={theme.colors.textNormal} mBottom={10}>
-          {t('BUSINESSES', 'Businesses')}
-        </OText>
-      </OptionTitle>
+      {businessesSearchList.businesses?.length > 0 && (
+        <OptionTitle isBusinessesSearchList={!!businessesSearchList}>
+          <OText size={16} lineHeight={24} weight={'500'} color={theme.colors.textNormal} mBottom={10}>
+            {t('BUSINESSES', 'Businesses')}
+          </OText>
+        </OptionTitle>
+      )}
       <ScrollView horizontal showsHorizontalScrollIndicator={false}>
         {businessesSearchList.businesses?.length > 0 && businessesSearchList.businesses.map((business: any, i: number) => (
           <View

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

@@ -401,12 +401,13 @@ const CartUI = (props: any) => {
                     uuid={cart?.uuid}
                     businessId={cart?.business_id}
                     driverTipsOptions={!driverTipsOptions.includes(0) ? [0, ...driverTipsOptions] : driverTipsOptions}
-                    isFixedPrice={parseInt(configs?.driver_tip_type?.value, 10) === 1 || !!parseInt(configs?.driver_tip_use_custom?.value, 10)}
+                    isFixedPrice={parseInt(configs?.driver_tip_type?.value, 10) === 1}
                     isDriverTipUseCustom={!!parseInt(configs?.driver_tip_use_custom?.value, 10)}
-                    driverTip={parseInt(configs?.driver_tip_type?.value, 10) === 1 || !!parseInt(configs?.driver_tip_use_custom?.value, 10)
+                    driverTip={parseInt(configs?.driver_tip_type?.value, 10) === 1
                       ? cart?.driver_tip
                       : cart?.driver_tip_rate}
                     useOrderContext
+                    cart={cart}
                   />
                 </DriverTipsContainer>
               )}

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

@@ -558,12 +558,13 @@ const CheckoutUI = (props: any) => {
 										uuid={cartUuid}
 										businessId={cart?.business_id}
 										driverTipsOptions={!driverTipsOptions.includes(0) ? [0, ...driverTipsOptions] : driverTipsOptions}
-										isFixedPrice={parseInt(configs?.driver_tip_type?.value, 10) === 1 || !!parseInt(configs?.driver_tip_use_custom?.value, 10)}
+										isFixedPrice={parseInt(configs?.driver_tip_type?.value, 10) === 1}
 										isDriverTipUseCustom={!!parseInt(configs?.driver_tip_use_custom?.value, 10)}
-										driverTip={parseInt(configs?.driver_tip_type?.value, 10) === 1 || !!parseInt(configs?.driver_tip_use_custom?.value, 10)
+										driverTip={parseInt(configs?.driver_tip_type?.value, 10) === 1
 											? cart?.driver_tip
 											: cart?.driver_tip_rate}
 										useOrderContext
+										cart={cart}
 									/>
 								</ChDriverTips>
 							</ChSection>

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

@@ -23,16 +23,19 @@ const DriverTipsUI = (props: any) => {
 		driverTip,
 		driverTipsOptions,
 		optionSelected,
-		isFixedPrice,
+		cart,
 		isDriverTipUseCustom,
-		handlerChangeOption
+		handlerChangeOption,
+		isFixedPrice
 	} = props;
 
 	const [{ parsePrice }] = useUtils();
+	const theme = useTheme();
 	const [, t] = useLanguage();
 	const [{ configs }] = useConfig();
-
-	const theme = useTheme();
+	const [customTip, setCustomTip] = useState((isDriverTipUseCustom && !driverTipsOptions.includes(driverTip)) ?? false)
+	const currentTip = customTip ? parseFloat(driverTip || 0) > 0 : (!customTip && !driverTipsOptions.includes(driverTip) && parseFloat(driverTip || 0)) > 0
+	const [value, setvalue] = useState('');
 
 	const style = StyleSheet.create({
 		semicircle: {
@@ -48,53 +51,59 @@ const DriverTipsUI = (props: any) => {
 		}
 	})
 
-	const [value, setvalue] = useState('');
-
-	const placeholderCurrency = (configs?.currency_position?.value || 'left') === 'left'
+	const placeholderCurrency = !isFixedPrice ? `0%` : (configs?.currency_position?.value || 'left') === 'left'
 		? `${configs?.format_number_currency?.value}0`
 		: `0${configs?.format_number_currency?.value}`
 
 	const handleChangeDriverTip = (val: any) => {
 		const tip = Number(val)
 		if ((isNaN(tip) || tip < 0)) {
-		  setvalue(value)
-		  return
+			setvalue(value)
+			return
 		}
 		setvalue(val)
 	}
-	
+
 	return (
 		<DTContainer>
 			<DTLabel>
 				{t('CUSTOM_DRIVER_TIP_MESSAGE', '100% of these tips go directly to your driver')}
 			</DTLabel>
 			<DTWrapperTips>
-				{!isDriverTipUseCustom && driverTipsOptions.map((option: any, i: number) => (
+				{driverTipsOptions.map((option: any, i: number) => (
 					<TouchableOpacity
 						key={i}
-						onPress={() => handlerChangeOption(option)}
+						onPress={() => {
+							handlerChangeOption(option)
+							setCustomTip(false)
+						}}
 					>
 						<DTCard
 							style={style.semicircle}
-							isActive={option === optionSelected}
+							isActive={(option === driverTip && !customTip)}
 						>
-							<OText size={12} numberOfLines={2} color={option === optionSelected ? '#FFF' : theme.colors.textSecondary}>
+							<OText size={12} numberOfLines={2} color={(option === driverTip && !customTip) ? '#FFF' : theme.colors.textSecondary}>
 								{`${isFixedPrice ? parsePrice(option) : `${option}%`}`}
 							</OText>
 						</DTCard>
 					</TouchableOpacity>
 				))}
+				{isDriverTipUseCustom && (
+					<TouchableOpacity
+						onPress={() => setCustomTip(true)}
+					>
+						<DTCard
+							style={style.semicircle}
+							isActive={customTip}
+						>
+							<OText size={12} numberOfLines={2} color={customTip ? '#FFF' : theme.colors.textSecondary}>
+								{t('CUSTOM_TIP', 'Custom')}
+							</OText>
+						</DTCard>
+					</TouchableOpacity>
+				)}
 			</DTWrapperTips>
-			{(!isDriverTipUseCustom && !driverTipsOptions.includes(driverTip) && driverTip > 0) && (
-				<OText
-					color={theme.colors.error}
-					size={16}
-					style={{ marginTop: 10, textAlign: 'center' }}
-				>
-					{t('CUSTOM_DRIVER_TIP_AMOUNT', 'The driver\'s current tip comes from a custom option')}
-				</OText>
-			)}
-			{isDriverTipUseCustom && (
+			{customTip && (
 				<DTForm>
 					<DTWrapperInput>
 						<OInput
@@ -120,17 +129,18 @@ const DriverTipsUI = (props: any) => {
 							}}
 						/>
 					</DTWrapperInput>
-					{parseFloat(driverTip || 0) > 0 && (
-						<OText
-							color={theme.colors.error}
-							size={16}
-							style={{ marginTop: 10, textAlign: 'center' }}
-						>
-							{t('CURRENT_DRIVER_TIP_AMOUNT', 'Current driver tip amount')}: {parsePrice(driverTip)}
-						</OText>
-					)}
 				</DTForm>
 			)}
+			{currentTip && (
+				<OText
+					color={theme.colors.primary}
+					size={16}
+					style={{ marginTop: 10, textAlign: 'center' }}
+				>
+					{t('CURRENT_DRIVER_TIP_AMOUNT', 'Current driver tip amount')}{!isFixedPrice &&
+						` (${driverTip}%)`}: {isFixedPrice ? parsePrice(driverTip) : parsePrice(cart?.driver_tip)}
+				</OText>
+			)}
 		</DTContainer>
 	)
 }

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

@@ -147,18 +147,16 @@ export const MyOrders = (props: any) => {
       )}
       {selectedOption === 'orders' && (
         <>
-          {ordersLength?.activeOrdersLength !== 0 && (
-            <View style={{ paddingHorizontal: isChewLayout ? 20 : 40 }}>
-              <OrdersOption
-                {...props}
-                activeOrders
-                ordersLength={ordersLength}
-                setOrdersLength={setOrdersLength}
-                setRefreshOrders={setRefreshOrders}
-                refreshOrders={refreshOrders}
-              />
-            </View>
-          )}
+          <View style={{ paddingHorizontal: isChewLayout ? 20 : 40 }}>
+            <OrdersOption
+              {...props}
+              activeOrders
+              ordersLength={ordersLength}
+              setOrdersLength={setOrdersLength}
+              setRefreshOrders={setRefreshOrders}
+              refreshOrders={refreshOrders}
+            />
+          </View>
           <View style={{ paddingHorizontal: isChewLayout ? 20 : 40 }}>
             <OrdersOption
               {...props}

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

@@ -26,7 +26,7 @@ export const PreviousProductsOrdered = (props: PreviousProductsOrderedParams) =>
   const ProductList = ({ style }: any) => {
     return (
       <>
-        {products?.map((product: any) => (
+        {products?.filter((product : any) => product?.business?.available)?.map((product: any) => (
             <SingleProductCard
               key={product?.id}
               isProductId

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

@@ -3,7 +3,6 @@ import { OrderList, useLanguage, useOrder, ToastType, useToast } from 'ordering-
 import { useTheme } from 'styled-components/native';
 import { useFocusEffect } from '@react-navigation/native'
 import { OText, OButton } from '../shared'
-import { NotFoundSource } from '../NotFoundSource'
 import { ActiveOrders } from '../ActiveOrders'
 import { PreviousOrders } from '../PreviousOrders'
 import { PreviousBusinessOrdered } from './PreviousBusinessOrdered'
@@ -70,23 +69,25 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
 	const _orders = customArray || values || []
 	const uniqueOrders: any = []
 
-
 	useEffect(() => {
 		if (loading || error) return
 		const ordersReduced = _orders.map((order: any) => order?.cart_group_id
-		? _orders
-				?.filter((_order : any) => _order?.cart_group_id === order?.cart_group_id)
-				?.reduce((orderCompleted : any, currentOrder : any) => ({
-					...orderCompleted,
-					total: orderCompleted.summary?.total + currentOrder?.summary?.total,
-					business: [orderCompleted.business, currentOrder.business].flat(),
-					business_id: [orderCompleted.business_id, currentOrder.business_id].flat(),
-					id: [orderCompleted.id, currentOrder.id].flat(),
-					review: orderCompleted.review && currentOrder.review,
-					user_review: orderCompleted.user_review && currentOrder.user_review,
-					products: [orderCompleted.products, currentOrder.products].flat()
-				}))
-				: order)
+			? _orders
+				.filter((_order: any) => _order?.cart_group_id === order?.cart_group_id)
+				.map((_o: any, _: any, _ordersList: any) => {
+					const obj = {
+						..._o,
+						id: _ordersList.map(o => o.id),
+						review: _o.review,
+						user_review: _o.user_review,
+						total: _ordersList.reduce((acc: any, o: any) => acc + o.summary.total, 0),
+						business: _ordersList.map((o: any) => o.business),
+						business_id: _ordersList.map((o: any) => o.business_id),
+						products: _ordersList.map((o: any) => o.products)
+					}
+					return obj
+				}).find((o: any) => o)
+			: order)
 		const orders = ordersReduced?.filter((order: any) => {
 			if (!order?.cart_group_id) return true
 			const isDuplicate = uniqueOrders.includes(order?.cart_group_id)
@@ -191,7 +192,7 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
 
 				</NoOrdersWrapper>
 			)}
-			{(ordersLength?.activeOrdersLength > 0 || ordersLength?.previousOrdersLength > 0) && (
+			{((ordersLength?.activeOrdersLength > 0 && activeOrders) || (ordersLength?.previousOrdersLength > 0 && !activeOrders)) && (
 				<>
 					{((titleContent && ((isBusiness && businessOrderIds?.length > 0) || isProducts)) || !titleContent) && (
 						<OptionTitle titleContent={!!titleContent} isBusinessesSearchList={!!businessesSearchList}>
@@ -204,17 +205,6 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
 							</OText>
 						</OptionTitle>
 					)}
-
-					{!(ordersLength?.activeOrdersLength === 0 && ordersLength?.previousOrdersLength === 0) &&
-						!loading &&
-						orders.filter((order: any) => orderStatus.includes(order.status)).length === 0 &&
-						(
-							<NotFoundSource
-								content={t('NO_RESULTS_FOUND', 'Sorry, no results found')}
-								image={imageFails}
-								conditioned
-							/>
-						)}
 				</>
 			)}
 			{isBusiness && !!businessesSearchList && businesses?.loading && (

package/themes/original/src/components/Sessions/styles.tsx

@@ -16,4 +16,5 @@ export const DurationWrapper = styled.View`
 
 export const Container = styled.View`
   padding-top: ${(props: any) => props.pdng};
+  margin-bottom: 50px;
 `

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

@@ -11,8 +11,8 @@ import {
 } from 'ordering-components/native';
 import { useTheme } from 'styled-components/native';
 import { SingleProductCardParams } from '../../types';
-import { CardInfo, SoldOut, QuantityContainer, PricesContainer, RibbonBox, LogoWrapper, WrapTags, TagsContainer } from './styles';
-import { StyleSheet, View } from 'react-native';
+import { CardInfo, SoldOut, QuantityContainer, PricesContainer, RibbonBox, LogoWrapper, TagsContainer } from './styles';
+import { ScrollView, StyleSheet, TouchableWithoutFeedback, View } from 'react-native';
 import { InView } from 'react-native-intersection-observer'
 import { Fade, Placeholder, PlaceholderLine } from 'rn-placeholder';
 import { OButton, OIcon, OText } from '../shared';
@@ -104,7 +104,7 @@ const SingleProductCardUI = React.memo((props: SingleProductCardParams) => {
 			color: '#808080',
 			textDecorationLine: 'line-through',
 			marginLeft: 7,
-			marginRight: 7
+			marginRight: 0
 		},
 		productTagsStyle: {
 			width: 30,
@@ -215,21 +215,29 @@ const SingleProductCardUI = React.memo((props: SingleProductCardParams) => {
 								{product?.offer_price !== null && !!product?.in_offer && (
 									<OText style={styles.regularPriceStyle}>{product?.offer_price ? parsePrice(product?.offer_price) : ''}</OText>
 								)}
-								{product?.tags && product?.tags.length > 0 && (
-									<WrapTags>
+								{!isPreviously && product?.tags && product?.tags.length > 0 && (
+									<ScrollView
+										showsVerticalScrollIndicator={false}
+										showsHorizontalScrollIndicator={false}
+										horizontal
+										style={{ marginLeft: 10 }}
+										contentContainerStyle={{flexGrow: 1}}
+									>
 										{product?.tags.map((tag: any, i: any) => (
-											<TagsContainer key={i}>
-												<FastImage
-													style={styles.productTagsStyle}
-													source={tag.image ? {
-														uri: optimizeImage(tag.image, 'h_250,c_limit'),
-														priority: FastImage.priority.normal,
-													} : theme?.images?.dummies?.product}
-													resizeMode={FastImage.resizeMode.cover}
-												/>
-											</TagsContainer>
+											<TouchableWithoutFeedback key={i}>
+												<TagsContainer>
+													<FastImage
+														style={styles.productTagsStyle}
+														source={tag.image ? {
+															uri: optimizeImage(tag.image, 'h_250,c_limit'),
+															priority: FastImage.priority.normal,
+														} : theme?.images?.dummies?.product}
+														resizeMode={FastImage.resizeMode.cover}
+													/>
+												</TagsContainer>
+											</TouchableWithoutFeedback>
 										))}
-									</WrapTags>
+									</ScrollView>
 								)}
 							</PricesContainer>
 							{!hideProductDescription && (

package/themes/original/src/components/SingleProductCard/styles.tsx

@@ -33,6 +33,7 @@ export const LogoWrapper = styled.View`
 export const WrapTags = styled.View`
   display: flex;
   flex-direction: row;
+  justify-content: flex-start;
   margin-left: 10px;
 `
 export const TagsContainer = styled.View`