ordering-ui-react-native 0.23.36 → 0.23.38

package/package.json

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

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

@@ -180,11 +180,11 @@ const CheckoutUI = (props: any) => {
 	const stripePaymethods: any = ['stripe', 'stripe_direct', 'stripe_connect', 'stripe_redirect']
 	const notFields = ['coupon', 'driver_tip', 'mobile_phone', 'address', 'zipcode', 'address_notes', 'comments']
 
-	const checkoutFields = useMemo(() => checkoutFieldsState?.fields?.filter((field : any) => field.order_type_id === options?.type), [checkoutFieldsState, options])
-	const guestCheckoutDriveTip = useMemo(() => checkoutFields?.find((field : any) => field.order_type_id === 1 && field?.validation_field?.code === 'driver_tip'), [JSON.stringify(checkoutFields), options])
-	const guestCheckoutComment = useMemo(() => checkoutFields?.find((field : any) => field.order_type_id === options?.type && field?.validation_field?.code === 'comments'), [JSON.stringify(checkoutFields), options])
-	const guestCheckoutCoupon = useMemo(() => checkoutFields?.find((field : any) => field.order_type_id === options?.type && field?.validation_field?.code === 'coupon'), [JSON.stringify(checkoutFields), options])
-	const guestCheckoutZipcode = useMemo(() => checkoutFields?.find((field : any) => field.order_type_id === options?.type && field?.validation_field?.code === 'zipcode'), [JSON.stringify(checkoutFields), options])
+	const checkoutFields = useMemo(() => checkoutFieldsState?.fields?.filter((field: any) => field.order_type_id === options?.type), [checkoutFieldsState, options])
+	const guestCheckoutDriveTip = useMemo(() => checkoutFields?.find((field: any) => field.order_type_id === 1 && field?.validation_field?.code === 'driver_tip'), [JSON.stringify(checkoutFields), options])
+	const guestCheckoutComment = useMemo(() => checkoutFields?.find((field: any) => field.order_type_id === options?.type && field?.validation_field?.code === 'comments'), [JSON.stringify(checkoutFields), options])
+	const guestCheckoutCoupon = useMemo(() => checkoutFields?.find((field: any) => field.order_type_id === options?.type && field?.validation_field?.code === 'coupon'), [JSON.stringify(checkoutFields), options])
+	const guestCheckoutZipcode = useMemo(() => checkoutFields?.find((field: any) => field.order_type_id === options?.type && field?.validation_field?.code === 'zipcode'), [JSON.stringify(checkoutFields), options])
 
 	const placeSpotTypes = [3, 4, 5]
 	const placeSpotsEnabled = placeSpotTypes.includes(options?.type)
@@ -212,7 +212,7 @@ const CheckoutUI = (props: any) => {
 
 	const validateCommentsCartField = (guestCheckoutComment?.enabled && (user?.guest_id ? guestCheckoutComment?.required_with_guest : guestCheckoutComment?.required)) && (cart?.comment === null || cart?.comment?.trim().length === 0)
 	const validateDriverTipField = options.type === 1 && (guestCheckoutDriveTip?.enabled && (user?.guest_id ? guestCheckoutDriveTip?.required_with_guest : guestCheckoutDriveTip?.required)) && (Number(cart?.driver_tip) <= 0)
-	const validateCouponField = (guestCheckoutCoupon?.enabled && (user?.guest_id ? guestCheckoutCoupon?.required_with_guest : guestCheckoutCoupon?.required)) && !cart?.offers?.some((offer : any) => offer?.type === 2)
+	const validateCouponField = (guestCheckoutCoupon?.enabled && (user?.guest_id ? guestCheckoutCoupon?.required_with_guest : guestCheckoutCoupon?.required)) && !cart?.offers?.some((offer: any) => offer?.type === 2)
 	const validateZipcodeCard = (guestCheckoutZipcode?.enabled && (user?.guest_id ? guestCheckoutZipcode?.required_with_guest : guestCheckoutZipcode?.required)) && paymethodSelected?.gateway === 'stripe' && paymethodSelected?.data?.card && !paymethodSelected?.data?.card?.zipcode
 
 	const isDisabledButtonPlace = loading || !cart?.valid || (!paymethodSelected && cart?.balance > 0) ||
@@ -350,20 +350,30 @@ const CheckoutUI = (props: any) => {
 	const checkGuestValidationFields = () => {
 		const userSelected = user
 		const _requiredFields = checkoutFieldsState?.fields
-			.filter((field) => (field?.order_type_id === options?.type) && field?.enabled && field?.required_with_guest &&
+			.filter((field : any) => (field?.order_type_id === options?.type) && field?.enabled && field?.required_with_guest &&
 				!notFields.includes(field?.validation_field?.code) &&
+				field?.validation_field?.code !== 'email' &&
 				userSelected && !userSelected[field?.validation_field?.code])
-		const requiredFieldsCode = _requiredFields.map((item) => item?.validation_field?.code)
-		const guestCheckoutCellPhone = checkoutFieldsState?.fields?.find((field) => field.order_type_id === options?.type && field?.validation_field?.code === 'mobile_phone')
+		const requiredFieldsCode = _requiredFields.map((item : any) => item?.validation_field?.code)
+		const guestCheckoutCellPhone = checkoutFieldsState?.fields?.find((field : any) => field.order_type_id === options?.type && field?.validation_field?.code === 'mobile_phone')
+		const guestCheckoutEmail = checkoutFieldsState?.fields?.find((field : any) => field.order_type_id === options?.type && field?.validation_field?.code === 'email')
 		if (
 			userSelected &&
-			!userSelected?.cellphone &&
+			!userSelected?.guest_cellphone &&
 			((guestCheckoutCellPhone?.enabled &&
 				guestCheckoutCellPhone?.required_with_guest) ||
 				configs?.verification_phone_required?.value === '1')
 		) {
 			requiredFieldsCode.push('cellphone')
 		}
+		if (
+			userSelected &&
+			!userSelected?.guest_email &&
+			guestCheckoutEmail?.enabled &&
+			guestCheckoutEmail?.required_with_guest
+		) {
+			requiredFieldsCode.push('email')
+		}
 		setRequiredFields(requiredFieldsCode)
 	}
 

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

@@ -713,13 +713,13 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
                         {order?.customer?.address}
                       </OText>
                     )}
-                    {(!!order?.customer?.cellphone && !hideCustomerPhone) && (
+                    {(!!(order?.customer?.cellphone || order?.customer?.guest_cellphone) && !hideCustomerPhone) && (
                       <OText
                         size={12}
                         lineHeight={18}
                         color={theme.colors.textNormal}
                         mBottom={2}>
-                        {`${!!order?.customer?.country_phone_code ? '+' + order?.customer?.country_phone_code : ''} ${order?.customer?.cellphone}`}
+                        {`${!!order?.customer?.country_phone_code ? '+' + order?.customer?.country_phone_code : ''} ${order?.customer?.guest_id ? order?.customer?.guest_cellphone : order?.customer?.cellphone}`}
                       </OText>
                     )}
                   </InfoBlock>

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

@@ -96,23 +96,23 @@ const UserDetailsUI = (props: any) => {
 				},
 			});
 			handleSendVerifyCode({
-			  cellphone: cellphone,
-			  country_phone_code: countryPhoneCode
+				cellphone: cellphone,
+				country_phone_code: countryPhoneCode
 			})
 		}
 	}
 
 	const handleSendPhoneCode = (values: any) => {
-    setWillVerifyOtpState(false)
+		setWillVerifyOtpState(false)
 		setIsModalVisible(false)
-    setFormState({
-      ...formState,
-      changes: {
-        ...formState?.changes,
-        verification_code: values?.code
-      }
-    })
-  }
+		setFormState({
+			...formState,
+			changes: {
+				...formState?.changes,
+				verification_code: values?.code
+			}
+		})
+	}
 
 	useEffect(() => {
 		if (willVerifyOtpState) handleVerifyCodeClick()
@@ -190,12 +190,12 @@ const UserDetailsUI = (props: any) => {
 								{userData?.name} {userData?.middle_name} {userData?.lastname} {userData?.second_lastname}
 							</OText>
 							<OText size={12} lineHeight={18} weight={'400'}>
-								{userData?.email}
+								{userData?.guest_id ? userData?.guest_email : userData?.email}
 							</OText>
-							{!!(userData?.cellphone || user?.cellphone) && (
+							{!!((userData?.cellphone ?? userData?.guest_cellphone) || (user?.cellphone ?? user?.guest_cellphone)) && (
 								<>
 									<OText size={12} lineHeight={18} weight={'400'}>
-										{(userData?.country_phone_code) && `+${(userData?.country_phone_code)} `}{(userData?.cellphone)}
+										{(userData?.country_phone_code) && `+${(userData?.country_phone_code)} `}{(userData?.guest_id ? user?.guest_cellphone : userData?.cellphone)}
 									</OText>
 									{!!phoneUpdate && (
 										<OText color={theme.colors.error} style={{ textAlign: 'center' }}>{t('NECESSARY_UPDATE_COUNTRY_PHONE_CODE', 'It is necessary to update your phone number')}</OText>

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

@@ -134,7 +134,7 @@ export const UserFormDetailsUI = (props: any) => {
 	};
 
 	const cellphoneValue = () => {
-		let cellphone = user?.cellphone || null
+		let cellphone = user?.guest_id ? user?.guest_cellphone : user?.cellphone
 		if (cellphone && CONDITIONAL_CODES.includes(user?.country_code)) {
 			if (user?.country_code === 'PR') {
 				cellphone = user?.cellphone?.slice(3)
@@ -148,10 +148,12 @@ export const UserFormDetailsUI = (props: any) => {
 			setUserPhoneNumber(userPhoneNumber);
 			return;
 		}
-		if (user?.cellphone) {
+		const cellphone = user?.guest_id ? user?.guest_cellphone : user?.cellphone
+
+		if (cellphone) {
 			let phone = null;
 			if (user?.country_phone_code) {
-				phone = `+${user?.country_phone_code} ${user?.cellphone}`;
+				phone = `+${user?.country_phone_code} ${cellphone}`;
 			} else {
 				phone = user?.cellphone;
 			}
@@ -165,7 +167,7 @@ export const UserFormDetailsUI = (props: any) => {
 			});
 			return;
 		}
-		setUserPhoneNumber(user?.cellphone || '');
+		setUserPhoneNumber(cellphone || '');
 	};
 
 	const onSubmit = () => {
@@ -351,7 +353,7 @@ export const UserFormDetailsUI = (props: any) => {
 																isDisabled={false}
 																value={
 																	formState?.changes[field.code] ??
-																	(user && user[field.code]) ??
+																	(user && user?.guest_id ? user?.guest_email : user[field.code]) ??
 																	''
 																}
 																onChange={(val: any) => {
@@ -395,7 +397,7 @@ export const UserFormDetailsUI = (props: any) => {
 													)}
 													name={field.code}
 													rules={getInputRules(field)}
-													defaultValue={user && user[field.code]}
+													defaultValue={user && (field.code === 'email' && user?.guest_id ? user?.guest_email : user[field.code])}
 												/>
 											</React.Fragment>
 										))

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

@@ -37,6 +37,7 @@ import {
   WrapperActions
 } from './styles'
 
+const CONDITIONAL_CODES = [1787]
 const TIME_COUNTDOWN = 60 * 10 // 10 minutes
 
 const UserDetails = (props: any) => {
@@ -176,9 +177,18 @@ const UserVerificationUI = (props: any) => {
     setTimer(`${TIME_COUNTDOWN / 60}:00`)
     setIsSendCodeAgain(true)
     if (opt === 'phone') {
+      let cellphone = phoneState?.cellphone
+      let country_phone_code = phoneState?.country_phone_code
+
+      if (CONDITIONAL_CODES.includes(Number(country_phone_code))) {
+        if (Number(country_phone_code) === 1787) {
+          cellphone = `787${cellphone}`
+          country_phone_code = '1'
+        }
+      }
       sendVerifyPhoneCode({
-        cellphone: phoneState?.cellphone,
-        country_phone_code: phoneState?.country_phone_code
+        cellphone,
+        country_phone_code
       })
       return
     }