ordering-ui-react-native 0.21.50 → 0.21.51-release

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

@@ -152,6 +152,11 @@ const AddressListUI = (props: AddressListParams) => {
 							showCall={false}
 							paddingTop={10}
 							btnStyle={{ paddingLeft: 0 }}
+              buttonProps={{
+                bgColor: theme.colors.white,
+                borderColor: theme.colors.white,
+                textStyle: { color: theme.colors.btnFont }
+              }}
 						/>
 					)}
 					{
@@ -173,6 +178,11 @@ const AddressListUI = (props: AddressListParams) => {
 								style={{ marginTop: 0 }}
 								titleWrapStyle={{ paddingHorizontal: 0 }}
 								titleStyle={{ marginLeft: 0, marginRight: 0 }}
+                buttonProps={{
+                  bgColor: theme.colors.white,
+                  borderColor: theme.colors.white,
+                  textStyle: { color: theme.colors.btnFont }
+                }}
 							/>
 						)}
 					{addressList.loading && addressList?.addresses?.length === 0 && (
@@ -217,7 +227,8 @@ const AddressListUI = (props: AddressListParams) => {
 													onSaveAddress: handleSaveAddress,
 													isSelectedAfterAdd: true,
 													isFromProductsList: isFromProductsList,
-													hasAddressDefault: !!orderState.options?.address?.location
+													hasAddressDefault: !!orderState.options?.address?.location,
+													isFromCheckout: route?.params?.isFromCheckout
 												}
 											) : onNavigationRedirect(
 												'AddressFormInitial',
@@ -228,7 +239,8 @@ const AddressListUI = (props: AddressListParams) => {
 													onSaveAddress: handleSaveAddress,
 													isSelectedAfterAdd: true,
 													isFromProductsList: isFromProductsList,
-													hasAddressDefault: !!orderState.options?.address?.location
+													hasAddressDefault: !!orderState.options?.address?.location,
+													isFromCheckout: route?.params?.isFromCheckout
 												})}
 										>
 											<OIcon src={theme.images.general.pencil} width={16} style={{ marginHorizontal: 4 }} />
@@ -305,7 +317,8 @@ const AddressListUI = (props: AddressListParams) => {
 										addressesList: addressList?.addresses,
 										nopadding: true,
 										isSelectedAfterAdd: true,
-										hasAddressDefault: !!orderState.options?.address?.location
+										hasAddressDefault: !!orderState.options?.address?.location,
+										isFromCheckout: route?.params?.isFromCheckout
 									}) : onNavigationRedirect(
 										'AddressFormInitial',
 										{
@@ -314,7 +327,8 @@ const AddressListUI = (props: AddressListParams) => {
 											addressesList: addressList?.addresses,
 											nopadding: true,
 											isSelectedAfterAdd: true,
-											hasAddressDefault: !!orderState.options?.address?.location
+											hasAddressDefault: !!orderState.options?.address?.location,
+											isFormCheckout: route?.params?.isFromCheckout
 										})}
 							/>
 						</>

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

@@ -3,10 +3,10 @@ import styled from 'styled-components/native'
 export const Container = styled.ScrollView`
     position: relative;
     flex: 1;
-	 paddingLeft: 40px;
-	 paddingRight: 40px;
-     margin-bottom: 40px;
-     padding-top: 10px;
+	paddingLeft: 20px;
+	paddingRight: 20px;
+    margin-bottom: 40px;
+    padding-top: 10px;
 `
 
 export const AddressItem = styled.TouchableOpacity`

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

@@ -23,8 +23,7 @@ export const AnalyticsSegment = (props: any) => {
     segmentClient.track('Product List Viewed', {
       business_id: category?.business_id,
       category_id: category?.id,
-      category: category?.name,
-      products: category?.products
+      category: category?.name
     })
   }
 
@@ -62,11 +61,12 @@ export const AnalyticsSegment = (props: any) => {
     })
   }
 
-  const handleProductAdded = (product: any) => {
+  const handleProductAdded = (product: any, result: any) => {
     segmentClient.track('Product Added', {
-      id: product.id,
+      cart_id: result.uuid,
+      product_id: product.id,
       name: product.name,
-      category: product.category_id,
+      category: product.category_id || product?.categoryId,
       price: product.price,
       quantity: product.quantity
     })
@@ -101,7 +101,7 @@ export const AnalyticsSegment = (props: any) => {
 
   const handleOrderPlaced = (order: any) => {
     segmentClient.track('Order Placed', {
-      id: order.id,
+      order_id: order.id,
       affiliation: order.business?.name,
       revenue: order.total,
       tax: order.tax_total,

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

@@ -21,7 +21,7 @@ export const AppleLogin = (props: any) => {
   const [{ configs }] = useConfig();
   const [credentialStateForUser, updateCredentialStateForUser] = useState<any>(-1);
 
-  let user : any= null
+  let user: any = null
 
   const buttonText = auth
     ? t('CONTINUE_WITH_APPLE', 'Logout with Apple')
@@ -53,7 +53,7 @@ export const AppleLogin = (props: any) => {
     }
   }
 
-  const fetchAndUpdateCredentialState = async (updateCredentialStateForUser : any) => {
+  const fetchAndUpdateCredentialState = async (updateCredentialStateForUser: any) => {
     if (user === null) {
       updateCredentialStateForUser('N/A');
     } else {
@@ -66,7 +66,7 @@ export const AppleLogin = (props: any) => {
     }
   }
 
-  const onIOSButtonPress = async (updateCredentialStateForUser : any) => {
+  const onIOSButtonPress = async (updateCredentialStateForUser: any) => {
     try {
       const appleAuthRequestResponse = await appleAuth.performRequest({
         requestedOperation: appleAuth.Operation.LOGIN,
@@ -79,7 +79,7 @@ export const AppleLogin = (props: any) => {
         identityToken,
         authorizationCode
       } = appleAuthRequestResponse;
-  
+
       user = newUser;
 
       fetchAndUpdateCredentialState(updateCredentialStateForUser).catch(error =>

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

@@ -26,7 +26,6 @@ import {
 	SocialListWrapper
 } from './styles';
 import { Fade, Placeholder, PlaceholderLine } from 'rn-placeholder';
-const types = ['food', 'laundry', 'alcohol', 'groceries'];
 
 let BusinessInformation: null | React.ElementType = null
 let BusinessReviews: null | React.ElementType = null
@@ -36,6 +35,7 @@ export const BusinessBasicInformation = (
 ) => {
 	const { navigation, businessState, isBusinessInfoShow, logo, header, isPreOrder } = props;
 	const { business, loading } = businessState;
+	const types = business?.types && business?.types?.filter(({ enabled }) => (enabled)).map(({ name }) => (name))
 
 	const theme = useTheme();
 	const [orderState] = useOrder();
@@ -72,7 +72,7 @@ export const BusinessBasicInformation = (
 			alignItems: 'flex-start'
 		},
 		businessInfo: {
-			paddingHorizontal: 40,
+			paddingHorizontal: 20,
 			paddingTop: isChewLayout ? 0 : 56,
 		},
 		bullet: {
@@ -95,7 +95,7 @@ export const BusinessBasicInformation = (
 			width: '100%',
 			top: 0,
 			zIndex: 100,
-			left: 40
+			left: 20
 		},
 		socialIcon: {
 			borderRadius: 3,
@@ -146,14 +146,11 @@ export const BusinessBasicInformation = (
 	}
 
 	const getBusinessType = () => {
-		if (Object.keys(business || {}).length <= 0) return t('GENERAL', 'General');
+		if (!types) return t('GENERAL', 'General');
 		const _types: any = [];
 		types.forEach(
-			(type) =>
-				business[type] &&
-				_types.push(
-					t(`BUSINESS_TYPE_${type?.replace(/\s/g, '_')?.toUpperCase()}`, type),
-				),
+			(type: any) =>
+				_types.push(type)
 		);
 		return _types.join(', ');
 	};
@@ -247,7 +244,7 @@ export const BusinessBasicInformation = (
 								<View style={styles.tiktokIcon}>
 									<OIcon
 										src={theme.images.general.tiktok}
-										style={{ width: 10, height: 12 }}
+										style={{ width: 10, height: 12, bottom: 1 }}
 										cover
 									/>
 								</View>

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

@@ -11,7 +11,7 @@ export const BusinessHeader = styled.ImageBackground`
 `;
 export const BusinessLogo = styled.View`
   position: absolute;
-  start: 40px;
+  start: 20px;
   top: -36px;
   z-index: 50;
   box-shadow: 0 0 2px ${Platform.OS == 'android' ? '#000000DD' : '#0000001A'};

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

@@ -35,7 +35,12 @@ import FastImage from 'react-native-fast-image'
 import { LottieAnimation } from '../LottieAnimation';
 import { CardAnimation } from '../shared/CardAnimation';
 
-export const BusinessControllerUI = (props: BusinessControllerParams) => {
+function BusinessControllerPropsAreEqual(prevProps: any, nextProps: any) {
+	return JSON.stringify(prevProps.business) === JSON.stringify(nextProps.business) &&
+		prevProps.isBusinessOpen === nextProps.isBusinessOpen
+}
+
+export const BusinessControllerUI = React.memo((props: BusinessControllerParams) => {
 	const {
 		business,
 		handleClick,
@@ -76,7 +81,7 @@ export const BusinessControllerUI = (props: BusinessControllerParams) => {
 	const hideBusinessFavoriteBadge = theme?.business_listing_view?.components?.business?.components?.featured_badge?.hidden
 
 	const textSize = 12
-	const cardHeight = windowHeight * 0.3
+	const cardHeight = windowHeight * 0.34
 
 	const styles = StyleSheet.create({
 		container: {
@@ -184,7 +189,7 @@ export const BusinessControllerUI = (props: BusinessControllerParams) => {
 	}
 
 	return (
-		<InView style={{ minHeight: 200 }} triggerOnce={true} onChange={(inView: boolean) => handleChangeInterSection(inView)}>
+		<View style={{ minHeight: 200 }}>
 			{isIntersectionObserver ? (
 				<CardAnimation
 					style={[style, styles.container]}
@@ -227,7 +232,7 @@ export const BusinessControllerUI = (props: BusinessControllerParams) => {
 							</View>
 						)}
 						{!hideBusinessOffer && (
-							getBusinessOffer((business?.offers)) &&
+							!!getBusinessOffer((business?.offers)) &&
 							<OfferBox
 								isClosed={!isBusinessOpen && (configState?.configs?.preorder_status_enabled?.value === '1')}
 								isRibbon={business?.ribbon?.enabled && !!business?.ribbon?.text}
@@ -239,7 +244,7 @@ export const BusinessControllerUI = (props: BusinessControllerParams) => {
 									numberOfLines={2}
 									ellipsizeMode='tail'
 									lineHeight={13}
-								>{getBusinessOffer((business?.offers)) || parsePrice(0)}</OText>
+								>{t('DISCOUNT', 'Discount')}{' '}{getBusinessOffer((business?.offers))}</OText>
 							</OfferBox>
 						)}
 						<BusinessState isRibbon={business?.ribbon?.enabled && !!business?.ribbon?.text}>
@@ -256,7 +261,7 @@ export const BusinessControllerUI = (props: BusinessControllerParams) => {
 						</BusinessState>
 					</BusinessHero>
 					<BusinessContent>
-						<BusinessInfo style={{ position: 'absolute', bottom: 85, left: 15 }}>
+						<BusinessInfo style={{ position: 'absolute', top: -26, left: 15 }}>
 							{!hideBusinessLogo && (
 								<BusinessLogo style={styles.businessLogo}>
 									<FastImage
@@ -274,7 +279,10 @@ export const BusinessControllerUI = (props: BusinessControllerParams) => {
 							<OText
 								size={textSize + 2}
 								style={{ lineHeight: 18, marginBottom: 6, width: '90%' }}
-								weight={'500'}>
+								weight={'500'}
+								numberOfLines={1}
+								ellipsizeMode='tail'
+							>
 								{business?.name}
 							</OText>
 							{(!hideBusinessFavorite || !hideBusinessReviews) && (
@@ -301,7 +309,7 @@ export const BusinessControllerUI = (props: BusinessControllerParams) => {
 								</ReviewAndFavorite>
 							)}
 						</View>
-						<OText size={textSize} style={{ lineHeight: 15, marginBottom: 3 }} numberOfLines={1}>
+						<OText size={textSize} style={{ lineHeight: 15, marginBottom: 3, fontFamily: undefined }} numberOfLines={1}>
 							{business?.address}
 						</OText>
 						<Metadata>
@@ -373,9 +381,9 @@ export const BusinessControllerUI = (props: BusinessControllerParams) => {
 					</View>
 				</Placeholder>
 			)}
-		</InView>
+		</View>
 	);
-};
+}, BusinessControllerPropsAreEqual);
 
 export const BusinessController = (props: BusinessControllerParams) => {
 	const BusinessControllerProps = {

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

@@ -8,13 +8,14 @@ export const BusinessHero = styled.View`
 `
 
 export const BusinessContent = styled.View`
-    padding-horizontal: 18px;
-    padding-bottom: 10px;
-    border-bottom-left-radius: 7.6px;
-    border-bottom-right-radius: 7.6px;
-    border-width: 1px;
-    border-color: ${(props: any) => props.theme.colors.border};
-	 overflow: visible;
+  position: relative;
+  padding-horizontal: 18px;
+  padding-bottom: 10px;
+  border-bottom-left-radius: 7.6px;
+  border-bottom-right-radius: 7.6px;
+  border-width: 1px;
+  border-color: ${(props: any) => props.theme.colors.border};
+	overflow: visible;
 `;
 
 export const BusinessInfo = styled.View`

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

@@ -17,7 +17,7 @@ export const MediaWrapper = styled.ScrollView`
   height: 127px;
 `
 export const InnerContent = styled.View`
-  padding: 20px 40px;
+  padding: 20px;
 `
 export const WrapScheduleBlock = styled.View`
   margin: 20px 0;
@@ -36,4 +36,4 @@ export const DivideView = styled.View`
 	height: 8px;
 	background-color: ${(props: any) => props.theme.colors.backgroundGray100};
 	margin-horizontal: -40px;
-`;
+`;

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

@@ -24,6 +24,8 @@ export const BusinessItemAccordion = (props: any) => {
 		checkoutButtonDisabled,
 		isMultiCheckout,
 		isFromUpselling,
+		changeActiveState,
+		isActive,
 		isGiftCart
 	} = props
 
@@ -39,14 +41,13 @@ export const BusinessItemAccordion = (props: any) => {
 	const isProducts = cart?.products?.length
 	const isBusinessChangeEnabled = configs?.cart_change_business_validation?.value === '1'
 
-	const [isActive, setActiveState] = useState(!!singleBusiness)
 	const [viewedCart, setViewedCart] = useState<any>(null)
 
 	useEffect(() => {
 		const cartsArray = Object.values(orderState?.carts)
 		const cartsLength = cartsArray.filter((cart: any) => cart.products.length > 0).length ?? 0
 		if (cartsLength === 1) {
-			setActiveState(!isClosed)
+			changeActiveState && changeActiveState(!isClosed, cart?.uuid)
 		}
 	}, [orderState?.carts, isClosed])
 
@@ -69,7 +70,7 @@ export const BusinessItemAccordion = (props: any) => {
 		<BIContainer isClosed={isClosed} isMultiCheckout={isMultiCheckout} checkoutVisible={!isActive && !isClosed && !!isProducts && !checkoutButtonDisabled}>
 			<BIHeader
 				isClosed={isClosed}
-				onPress={() => !isClosed ? setActiveState(!isActive) : isClosed}
+				onPress={() => !isClosed ? changeActiveState && changeActiveState(!isClosed, cart?.uuid) : isClosed}
 				activeOpacity={1}
 			>
 				<BIInfo>