ordering-ui-react-native 0.21.78 → 0.21.79-release

package/themes/original/src/components/ProductForm/ActionButton.tsx

@@ -5,7 +5,7 @@ import { TouchableOpacity, View } from 'react-native'
 import { OButton, OText } from '../shared';
 import { Placeholder, PlaceholderLine, Fade } from 'rn-placeholder';
 
-export const ActionButton = (props : any) => {
+export const ActionButton = (props: any) => {
     const {
         navigation,
         isHaveWeight,
@@ -23,27 +23,29 @@ export const ActionButton = (props : any) => {
         handleUpdateGuest,
         actionStatus
     } = props
-    const [,t] = useLanguage()
+    const [, t] = useLanguage()
     const [{ auth }] = useSession()
     const [orderState] = useOrder()
     const theme = useTheme()
-	const [{ configs }] = useConfig()
+    const [{ configs }] = useConfig()
     const unaddressedTypes = configs?.unaddressed_order_types_allowed?.value.split('|').map((value: any) => Number(value)) || []
-	const isAllowUnaddressOrderType = unaddressedTypes.includes(orderState?.options?.type)
-
+    const isAllowUnaddressOrderType = unaddressedTypes.includes(orderState?.options?.type)
     const saveErrors =
-		orderState.loading ||
-		maxProductQuantity === 0 ||
-		Object.keys(errors)?.length > 0;
+        orderState.loading ||
+        maxProductQuantity === 0 ||
+        Object.keys(errors)?.length > 0;
+    const buttonColor = saveErrors || isSoldOut || maxProductQuantity <= 0 || (product?.minimum_per_order && ((productCart?.quantity + productAddedToCartLength) < product?.minimum_per_order)) || (product?.maximum_per_order && ((productCart?.quantity + productAddedToCartLength) > product?.maximum_per_order))
+
+
 
     return (
         <View
             style={{
                 width: isHaveWeight ? '100%' : ((isSoldOut || maxProductQuantity <= 0) ? '60%' : '40%'),
             }}>
-            {((productCart &&
+            {(productCart &&
                 auth &&
-                (orderState.options?.address_id || isAllowUnaddressOrderType)) || (isSoldOut || maxProductQuantity <= 0)) && (
+                ((orderState.options?.address_id || isAllowUnaddressOrderType) || (isSoldOut || maxProductQuantity <= 0))) && (
                     <OButton
                         onClick={() => handleSaveProduct()}
                         imgRightSrc=""
@@ -55,15 +57,11 @@ export const ActionButton = (props : any) => {
                                     ? t('UPDATE', 'Update')
                                     : t('ADD', 'Add')
                             }`}
-                        isDisabled={isSoldOut || maxProductQuantity <= 0 || (product?.minimum_per_order && ((productCart?.quantity + productAddedToCartLength) < product?.minimum_per_order)) || (product?.maximum_per_order && ((productCart?.quantity + productAddedToCartLength) > product?.maximum_per_order))}
+                        isDisabled={buttonColor}
                         textStyle={{
-                            color: saveErrors || isSoldOut || maxProductQuantity <= 0 ? theme.colors.primary : theme.colors.white,
                             fontSize: orderState.loading || editMode ? 10 : 14
                         }}
                         style={{
-                            backgroundColor: saveErrors || isSoldOut || maxProductQuantity <= 0 || (product?.minimum_per_order && ((productCart?.quantity + productAddedToCartLength) < product?.minimum_per_order)) || (product?.maximum_per_order && ((productCart?.quantity + productAddedToCartLength) > product?.maximum_per_order)) ? theme.colors.lightGray : theme.colors.primary,
-                            borderColor: saveErrors || isSoldOut || maxProductQuantity <= 0 || (product?.minimum_per_order && ((productCart?.quantity + productAddedToCartLength) < product?.minimum_per_order)) || (product?.maximum_per_order && ((productCart?.quantity + productAddedToCartLength) > product?.maximum_per_order)) ? theme.colors.white : theme.colors.primary,
-                            opacity: saveErrors || isSoldOut || maxProductQuantity <= 0 ? 0.3 : 1,
                             borderRadius: 7.6,
                             height: 44,
                             shadowOpacity: 0,
@@ -82,7 +80,7 @@ export const ActionButton = (props : any) => {
                         textStyle={{ fontSize: 10 }}
                     />
                 ) : (
-                    <OButton onClick={navigation.navigate('AddressList')} />
+                    <OButton onClick={() => navigation.navigate('AddressList')} />
                 ))}
             {!auth && (
                 <OButton
@@ -94,13 +92,12 @@ export const ActionButton = (props : any) => {
                             : t('LOGIN_SIGNUP', 'Login / Sign Up')
                     }
                     imgRightSrc=""
-                    textStyle={{ color: theme.colors.primary, fontSize: 13, textAlign: 'center' }}
+                    textStyle={{ fontSize: 13, textAlign: 'center' }}
                     style={{
                         height: 42,
-                        borderColor: theme.colors.primary,
-                        backgroundColor: theme.colors.white,
                         paddingLeft: 0,
-                        paddingRight: 0
+                        paddingRight: 0,
+                        borderRadius: 7.6
                     }}
                 />
             )}

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

@@ -88,6 +88,7 @@ export const ProductOptionsUI = (props: any) => {
 	const [events] = useEvent()
 	const commentRef = useRef()
 	const isChewLayout = theme?.header?.components?.layout?.type?.toLowerCase() === 'chew'
+	const hideProductDummyLogo = theme?.business_view?.components?.products?.components?.product?.components?.dummy?.hidden
 
 	const styles = StyleSheet.create({
 		mainContainer: {
@@ -487,114 +488,118 @@ export const ProductOptionsUI = (props: any) => {
 							</View>
 						) : (
 							<>
-								<Swiper
-									loop={false}
-									ref={swiperRef}
-									showsButtons={true}
-									style={styles.mainSwiper}
-									showsPagination={false}
-									onIndexChanged={(index : any) => handleChangeMainIndex(index)}
-									prevButton={
-										<View style={styles.swiperButton}>
-											<IconAntDesign
-												name="caretleft"
-												color={theme.colors.white}
-												size={13}
-											// style={styles.starIcon}
-											/>
-										</View>
-									}
-									nextButton={
-										<View style={styles.swiperButton}>
-											<IconAntDesign
-												name="caretright"
-												color={theme.colors.white}
-												size={13}
-											// style={styles.starIcon}
-											/>
-										</View>
-									}
-								>
-									{gallery && gallery?.length > 0 && gallery.map((img : any, i: number) => (
-										<View
-											style={styles.slide1}
-											key={i}
-										>
-											{(String(img).includes('http') || typeof img === 'number') ? (
-												<FastImage
-													style={{ height: '100%', opacity: isSoldOut ? 0.5 : 1, aspectRatio: 16 / 9 }}
-													source={typeof img !== 'number' ? {
-														uri: optimizeImage(img, 'h_1024,c_limit'),
-														priority: FastImage.priority.normal,
-													} : img}
-												/>
-											) : (
-												<>
-													<YoutubePlayer
-														height={'100%'}
-														width={'100%'}
-														play={playing}
-														videoId={img}
-														onChangeState={onStateChange}
+								{(product?.images || !hideProductDummyLogo) && (
+									<>
+										<Swiper
+											loop={false}
+											ref={swiperRef}
+											showsButtons={true}
+											style={styles.mainSwiper}
+											showsPagination={false}
+											onIndexChanged={(index : any) => handleChangeMainIndex(index)}
+											prevButton={
+												<View style={styles.swiperButton}>
+													<IconAntDesign
+														name="caretleft"
+														color={theme.colors.white}
+														size={13}
+													// style={styles.starIcon}
 													/>
-													<Button title={playing ? "pause" : "play"} onPress={togglePlaying} />
-												</>
-											)}
-										</View>
-									))}
-								</Swiper>
-								<ScrollView
-									horizontal
-									contentContainerStyle={{
-										paddingHorizontal: 20,
-										paddingVertical: 15
-									}}
-								>
-									{gallery?.length > 1 && gallery.map((img: any, index: number) => (
-										<TouchableOpacity
-											key={index}
-											onPress={() => handleClickThumb(index)}
-										>
-											<View
-												style={{
-													height: 56,
-													borderRadius: 8,
-													margin: 8,
-													opacity: index === thumbsSwiper ? 1 : 0.8
-												}}
-											>
-												{String(img).includes('http') ? (
-													<OIcon
-														url={img}
-														style={{
-															borderColor: theme.colors.lightGray,
-															borderRadius: 8,
-															minHeight: '100%',
-															opacity: isSoldOut ? 0.5 : 1
-														}}
-														width={56}
-														height={56}
-														cover
+												</View>
+											}
+											nextButton={
+												<View style={styles.swiperButton}>
+													<IconAntDesign
+														name="caretright"
+														color={theme.colors.white}
+														size={13}
+													// style={styles.starIcon}
 													/>
-												) : (
-													<OIcon
-														url={'https://img.youtube.com/vi/' + img + '/0.jpg'}
+												</View>
+											}
+										>
+											{gallery && gallery?.length > 0 && gallery.map((img : any, i: number) => (
+												<View
+													style={styles.slide1}
+													key={i}
+												>
+													{(String(img).includes('http') || typeof img === 'number') ? (
+														<FastImage
+															style={{ height: '100%', opacity: isSoldOut ? 0.5 : 1, aspectRatio: 16 / 9 }}
+															source={typeof img !== 'number' ? {
+																uri: optimizeImage(img, 'h_1024,c_limit'),
+																priority: FastImage.priority.normal,
+															} : img}
+														/>
+													) : (
+														<>
+															<YoutubePlayer
+																height={'100%'}
+																width={'100%'}
+																play={playing}
+																videoId={img}
+																onChangeState={onStateChange}
+															/>
+															<Button title={playing ? "pause" : "play"} onPress={togglePlaying} />
+														</>
+													)}
+												</View>
+											))}
+										</Swiper>
+										<ScrollView
+											horizontal
+											contentContainerStyle={{
+												paddingHorizontal: 20,
+												paddingVertical: 15
+											}}
+										>
+											{gallery?.length > 1 && gallery.map((img: any, index: number) => (
+												<TouchableOpacity
+													key={index}
+													onPress={() => handleClickThumb(index)}
+												>
+													<View
 														style={{
-															borderColor: theme.colors.lightGray,
+															height: 56,
 															borderRadius: 8,
-															minHeight: '100%',
-															opacity: isSoldOut ? 0.5 : 1
+															margin: 8,
+															opacity: index === thumbsSwiper ? 1 : 0.8
 														}}
-														width={56}
-														height={56}
-														cover
-													/>
-												)}
-											</View>
-										</TouchableOpacity>
+													>
+														{String(img).includes('http') ? (
+															<OIcon
+																url={img}
+																style={{
+																	borderColor: theme.colors.lightGray,
+																	borderRadius: 8,
+																	minHeight: '100%',
+																	opacity: isSoldOut ? 0.5 : 1
+																}}
+																width={56}
+																height={56}
+																cover
+															/>
+														) : (
+															<OIcon
+																url={'https://img.youtube.com/vi/' + img + '/0.jpg'}
+																style={{
+																	borderColor: theme.colors.lightGray,
+																	borderRadius: 8,
+																	minHeight: '100%',
+																	opacity: isSoldOut ? 0.5 : 1
+																}}
+																width={56}
+																height={56}
+																cover
+															/>
+														)}
+													</View>
+												</TouchableOpacity>
 
-									))}
-								</ScrollView>
+											))}
+										</ScrollView>
+									</>
+								)}
 							</>
 						)}
 					</WrapHeader>

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

@@ -1,5 +1,5 @@
-import React, { useState } from 'react'
-import { View, Animated, StyleSheet, Platform, TouchableOpacity } from 'react-native'
+import React, { useEffect, useState } from 'react'
+import { View, Animated, StyleSheet, TouchableOpacity } from 'react-native'
 import { useUtils, useLanguage, useOrder } from 'ordering-components/native'
 import { useTheme } from 'styled-components/native';
 import MaterialCommunityIcon from 'react-native-vector-icons/MaterialCommunityIcons'
@@ -39,29 +39,43 @@ export const ProductItemAccordion = (props: ProductItemAccordionParams) => {
 	} = props
 
 	const theme = useTheme();
+	const hideProductImage = isFromCheckout
+		? theme?.checkout?.components?.cart?.components?.product?.components?.image?.hidden
+		: theme?.confirmation?.components?.cart?.components?.products?.components?.photo?.hidden
 
+	const hideProductDummyLogo = theme?.business_view?.components?.products?.components?.product?.components?.dummy?.hidden
+	const hideProductCommentHide = isFromCheckout && theme?.checkout?.components?.cart?.components?.product?.components?.comments?.hidden
 
 	const pickerStyle = StyleSheet.create({
 		inputAndroid: {
-			width: 34,
+			width: 45,
 			textAlign: 'center',
 			overflow: 'visible',
 			fontSize: 12,
-			height: 20,
-			padding: 0,
-			color: theme.colors.textNormal
+			height: 30,
+			color: theme.colors.textNormal,
+			backgroundColor: theme.colors.backgroundGray100,
+			paddingVertical: 8,
+			paddingRight: 10,
+			paddingLeft: 0,
+			borderRadius: 7.6,
 		},
 		inputIOS: {
-			width: 34,
+			width: 45,
 			textAlign: 'center',
 			overflow: 'visible',
 			fontSize: 12,
+			backgroundColor: theme.colors.backgroundGray100,
+			paddingVertical: 8,
+			paddingRight: 15,
+			paddingLeft: 0,
+			borderRadius: 7.6,
 		},
 		icon: {
 			position: 'absolute',
 			zIndex: 1,
-			top: -4,
-			end: -4,
+			top: 0,
+			end: 8,
 		},
 		placeholder: {
 			color: theme.colors.secundaryContrast
@@ -75,9 +89,7 @@ export const ProductItemAccordion = (props: ProductItemAccordionParams) => {
 
 	const [isActive, setActiveState] = useState(false)
 	const [isServiceOpen, setIsServiceOpen] = useState(false)
-	// const [setHeight, setHeightState] = useState({ height: new Animated.Value(0) })
-	// const [setRotate, setRotateState] = useState({ angle: new Animated.Value(0) })
-	const [productQuantity, setProductQuantity] = useState(product.quantity.toString())
+	const [productQuantityState, setProductQuantityState] = useState<any>(product.quantity.toString())
 
 	const productInfo = () => {
 		if (isCartProduct) {
@@ -105,23 +117,9 @@ export const ProductItemAccordion = (props: ProductItemAccordionParams) => {
 		setIsServiceOpen(true)
 	}
 
-	/* const toggleAccordion = () => {
-		if ((!product?.valid_menu && isCartProduct)) return
-		if (isActive) {
-			Animated.timing(setHeight.height, {
-			 toValue: 100,
-			 duration: 500,
-			 easing: Easing.linear,
-			 useNativeDriver: false,
-			}).start()
-		} else {
-			setHeightState({height: new Animated.Value(0)})
-		}
-	 }*/
-
 	const handleChangeQuantity = (value: string) => {
 		if (!orderState.loading) {
-			setProductQuantity(value)
+			setProductQuantityState(value)
 			if (parseInt(value) === 0) {
 				onDeleteProduct && onDeleteProduct(product)
 			} else {
@@ -135,10 +133,6 @@ export const ProductItemAccordion = (props: ProductItemAccordionParams) => {
 		return `${quantity} x ${name} ${pos} +${price}`
 	}
 
-	/*useEffect(() => {
-		toggleAccordion()
-	}, [isActive])*/
-
 	const productOptions = getProductMax && [...Array(getProductMax(product) + 1),].map((_: any, opt: number) => {
 		return {
 			label: opt === 0 ? t('REMOVE', 'Remove') : opt.toString(),
@@ -146,19 +140,27 @@ export const ProductItemAccordion = (props: ProductItemAccordionParams) => {
 		}
 	})
 
+	useEffect(() => {
+		if (product.quantity.toString() === productQuantityState || productQuantityState) {
+			setProductQuantityState(null)
+		}
+	}, [product.quantity])
+
 	return (
 		<>
 			<AccordionSection>
 				<Accordion
-					isValid={product?.valid ?? true}
-					onPress={() => (!product?.valid_menu && isCartProduct)
-						? {}
-						: setActiveState(!isActive)}
 					activeOpacity={1}
+					isValid={product?.valid ?? true}
+					onPress={
+						(!product?.valid_menu && isCartProduct) ||
+						!(productInfo().ingredients.length > 0 || productInfo().options.length > 0 || !!product.comment)
+						? null : () => setActiveState(!isActive)
+					}
 				>
 					<View style={{ flexDirection: 'row', alignItems: 'flex-start' }}>
 						<ContentInfo>
-							{(product?.images || theme?.images?.dummies?.product) && (
+							{(product?.images || (!hideProductDummyLogo && theme?.images?.dummies?.product)) && !hideProductImage && (
 								<ProductImage>
 									{isFromCheckout ? (
 										product?.images ? (
@@ -211,16 +213,20 @@ export const ProductItemAccordion = (props: ProductItemAccordionParams) => {
 											<RNPickerSelect
 												items={productOptions}
 												onValueChange={handleChangeQuantity}
-												value={productQuantity}
+												value={productQuantityState ?? product.quantity.toString()}
 												style={pickerStyle}
 												useNativeAndroidPickerStyle={false}
 												placeholder={{}}
-												touchableWrapperProps={{
-													style: {
-														width: 40,
-													}
-												}}
-												Icon={() => <View style={pickerStyle.icon}><OIcon src={theme.images.general.arrow_down} color={theme.colors.textNormal} width={8} /></View>}
+												touchableWrapperProps={{ style: { width: 45 } }}
+												Icon={() => (
+													<View style={pickerStyle.icon}>
+														<OIcon
+															src={theme.images.general.arrow_down}
+															color={theme.colors.textNormal}
+															width={8}
+														/>
+													</View>
+												)}
 												disabled={orderState.loading}
 											/>
 										</ProductInfo>
@@ -281,21 +287,21 @@ export const ProductItemAccordion = (props: ProductItemAccordionParams) => {
 						)}
 				</Accordion>
 
-				<View style={{ display: isActive ? 'flex' : 'none', paddingStart: 40 }}>
+				<View style={{ display: isActive ? 'flex' : 'none', paddingStart: isFromCheckout ? 100 : 40, marginTop: isFromCheckout ? -80 : -30 }}>
 					<Animated.View>
 						<AccordionContent>
 							{productInfo().ingredients.length > 0 && productInfo().ingredients.some((ingredient: any) => !ingredient.selected) && (
 								<ProductOptionsList>
 									<OText size={10} color={theme.colors.textSecondary}>{t('INGREDIENTS', 'Ingredients')}</OText>
-									{productInfo().ingredients.map((ingredient: any) => !ingredient.selected && (
-										<OText size={10} color={theme.colors.textThird} key={ingredient.id} style={{ marginLeft: 10 }}>{t('NO', 'No')} {ingredient.name}</OText>
+									{productInfo().ingredients.map((ingredient: any, i) => !ingredient.selected && (
+										<OText size={10} color={theme.colors.textThird} key={ingredient.id + i} style={{ marginLeft: 10 }}>{t('NO', 'No')} {ingredient.name}</OText>
 									))}
 								</ProductOptionsList>
 							)}
 							{productInfo().options.length > 0 && (
 								<ProductOptionsList>
-									{productInfo().options.sort((a: any, b: any) => a.rank - b.rank).map((option: any, i: number) => (
-										<ProductOption key={option.id + i}>
+									{productInfo().options.sort((a: any, b: any) => a.rank - b.rank).map((option: any) => (
+										<ProductOption key={option.id}>
 											<OText size={10} color={theme.colors.textSecondary}>{option.name}</OText>
 											{option.suboptions.map((suboption: any) => (
 												<ProductSubOption key={suboption.id}>
@@ -313,7 +319,7 @@ export const ProductItemAccordion = (props: ProductItemAccordionParams) => {
 									))}
 								</ProductOptionsList>
 							)}
-							{!!product.comment && (
+							{!!product.comment && !hideProductCommentHide && (
 								<ProductComment>
 									<OText size={10} color={theme.colors.textSecondary}>{t('SPECIAL_COMMENT', 'Special Comment')}</OText>
 									<OText size={10} color={theme.colors.textThird}>{product.comment}</OText>

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

@@ -17,9 +17,6 @@ export const Accordion = styled.TouchableOpacity`
 
 export const ProductInfo = styled.View`
 	margin-horizontal: 7px;
-	background-color: ${(props: any) => props.theme.colors.backgroundGray100};
-	padding: 4px 12px 4px 0px;
-	border-radius: 7.6px;
 `
 
 export const ProductQuantity = styled.View`
@@ -54,4 +51,6 @@ export const ProductSubOption = styled.View`
   margin-left: 0px;
 `
 
-export const ProductComment = styled.View``
+export const ProductComment = styled.View`
+margin-left: 20px;
+`

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

@@ -35,7 +35,8 @@ export const ProductOptionSubOptionUI = (props: any) => {
 		disabled,
 		setIsScrollAvailable,
 		image,
-		enableIntersection
+		enableIntersection,
+		onChange
 	} = props
 
 	const disableIncrement = option?.limit_suboptions_by_max ? balance === option?.max || state.quantity === suboption?.max : state.quantity === suboption?.max || (!state.selected && balance === option?.max)
@@ -88,6 +89,12 @@ export const ProductOptionSubOptionUI = (props: any) => {
 		}
 	}, [balance])
 
+	useEffect(() => {
+		if (!suboption?.preselected || !option?.respect_to) return
+		const newState = { ...state, selected: suboption?.preselected, quantity: state.selected ? 0 : 1 }
+		onChange(newState, suboption, option)
+	}, [suboption, option])
+
 	return (
 		<InView onChange={(inView: boolean) => handleChangeInterSection(inView)} triggerOnce={true}>
 			{isIntersectionObserver ? (

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

@@ -233,7 +233,7 @@ export const ProfessionalProfile = (props: ProfessionalProfileParams) => {
           <CalendarWrapper>
             {(timeList?.length > 0 && isEnabled) ? (
               <SelectDropdown
-                ref={dropdownRef} 
+                ref={dropdownRef}
                 data={timeList}
                 onSelect={(selectedItem, index) => {
                   console.log(selectedItem.value)
@@ -244,7 +244,7 @@ export const ProfessionalProfile = (props: ProfessionalProfileParams) => {
                 rowTextForSelection={(item, index) => {
                   return item.text
                 }}
-                buttonStyle={{borderRadius: 7.6, ...styles.selectOption}}
+                buttonStyle={{ borderRadius: 7.6, ...styles.selectOption }}
                 buttonTextStyle={{
                   color: theme.colors.disabled,
                   fontSize: 14,
@@ -267,7 +267,7 @@ export const ProfessionalProfile = (props: ProfessionalProfileParams) => {
                 }}
                 renderCustomizedRowChild={(item, index) => {
                   return (
-                    <Text style={[styles.dropDownRow, { color: isBusyTime(professional, getMomentTime(item.value)) ? theme.colors.lightGray : theme.colors.primary } ]}>
+                    <Text style={[styles.dropDownRow, { color: isBusyTime(professional, getMomentTime(item.value)) ? theme.colors.lightGray : theme.colors.primary }]}>
                       {item.text}
                     </Text>
                   )
@@ -326,11 +326,10 @@ export const ProfessionalProfile = (props: ProfessionalProfileParams) => {
       </ScheduleWrapper>
       <ButtonWrapper>
         <OButton
-          bgColor={theme.colors.primary}
           onClick={() => handleSelectProfessional()}
           text={t('BOOK', 'Book')}
           style={styles.buttonStyle}
-          textStyle={{ fontSize: 14, color: theme.colors.white }}
+          textStyle={{ fontSize: 14 }}
         />
       </ButtonWrapper>
     </Container>

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

@@ -171,7 +171,7 @@ const PromotionsUI = (props: PromotionParams) => {
                 onClick={() => handleClickOffer(offer)}
                 text={t('VIEW', 'View')}
                 style={styles.buttonStyle}
-                textStyle={{ fontSize: 14, color: '#fff', flexWrap: 'nowrap' }}
+                textStyle={{ fontSize: 14, flexWrap: 'nowrap' }}
               />
             </WrapperSingleOffer>
           ))}
@@ -182,7 +182,7 @@ const PromotionsUI = (props: PromotionParams) => {
           title={``}
           onClose={() => setOpenModal(false)}
         >
-          <View style={{ padding: 20 }}>
+          <ScrollView style={{ padding: 20 }}>
             <OText style={{ alignSelf: 'center', fontWeight: '700' }} mBottom={20}>
               {offerSelected?.name} / {t('VALUE_OF_OFFER', 'Value of offer')}: {offerSelected?.rate_type === 1 ? `${offerSelected?.rate}%` : `${parsePrice(offerSelected?.rate)}`}
             </OText>
@@ -210,10 +210,7 @@ const PromotionsUI = (props: PromotionParams) => {
             <OText style={{ marginTop: 10, marginBottom: 10 }}>
               {t('AVAILABLE_BUSINESSES_FOR_OFFER', 'Available businesses for this offer')}:
             </OText>
-            <ScrollView
-              showsVerticalScrollIndicator={false}
-              style={{ height: '68%' }}
-            >
+            <View style={{ marginBottom: 70 }}>
               {offerSelected?.businesses?.map((business: any) => {
                 return (
                   <SingleBusinessOffer key={business.id}>
@@ -238,14 +235,14 @@ const PromotionsUI = (props: PromotionParams) => {
                         onClick={() => handleBusinessClick(business)}
                         text={t('GO_TO_BUSINESSS', 'Go to business')}
                         style={styles.modalButtonStyle}
-                        textStyle={{ fontSize: 10, color: '#fff' }}
+                        textStyle={{ fontSize: 10 }}
                       />
                     </BusinessInfo>
                   </SingleBusinessOffer>
                 )
               })}
-            </ScrollView>
-          </View>
+            </View>
+          </ScrollView>
         </OModal>
       </PromotionsContainer>
     </Container>

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

@@ -293,7 +293,7 @@ const ReviewDriverUI = (props: ReviewDriverParams) => {
       <FloatingBottomContainer>
         <ActionContainer>
           <OButton
-            textStyle={{ color: theme.colors.white, paddingRight: 10 }}
+            textStyle={{ paddingRight: 10 }}
             text={t('SEND_REVIEW', 'Send Review')}
             style={{ borderRadius: 8 }}
             imgRightStyle={{ tintColor: theme.colors.white, right: 5, margin: 5 }}