ordering-ui-react-native 0.22.43 → 0.22.44

package/package.json

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

package/themes/business/src/components/LogoutButton/index.tsx

@@ -15,7 +15,7 @@ const LogoutButtonUI = (props: any) => {
     const data = await _retrieveStoreData('notification_state');
     const res = await handleLogoutClick(data);
     if (res) {
-      _clearStoreData({ excludedKeys: ['isTutorial'] });
+      _clearStoreData({ excludedKeys: ['isTutorial', 'language'] });
     }
   };
 

package/themes/business/src/components/PreviousOrders/OrderItem.tsx

@@ -191,13 +191,13 @@ export const OrderItem = React.memo((props: any) => {
                 {order?.external_id ?? t('NO_EXTERNAL_ID', 'No external Id ') + t('NO', 'Order No.') + order?.id}
               </OText>
             )}
-            {!showExternalId && <OText
+            <OText
               style={styles.date}
               color={theme.colors.unselectText}
               numberOfLines={1}
               adjustsFontSizeToFit
             >
-              {((!!order?.order_group_id && order?.order_group && isLogisticOrder
+              {!showExternalId && ((!!order?.order_group_id && order?.order_group && isLogisticOrder
                 ? `${order?.order_group?.orders?.length} ${t('ORDERS', 'Orders')}`
                 : (t('NO', 'Order No.') + order?.id)
               ) + ' · ')}
@@ -205,7 +205,6 @@ export const OrderItem = React.memo((props: any) => {
                 ? parseDate(order?.delivery_datetime_utc)
                 : parseDate(order?.delivery_datetime, { utc: false })}
             </OText>
-            }
             {((currentTabSelected === 'pending' || currentTabSelected === 'inProgress') && allowColumns?.timer) && (
               <>
                 {!showExternalId && <OText> · </OText>}

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

@@ -66,7 +66,8 @@ const AddressFormUI = (props: AddressFormParams) => {
 		isFromProductsList,
 		hasAddressDefault,
 		afterSignup,
-		businessSlug
+		businessSlug,
+		isFromCheckout
 	} = props;
 
 	const theme = useTheme();
@@ -383,9 +384,11 @@ const AddressFormUI = (props: AddressFormParams) => {
 			auth &&
 			!afterSignup
 		) {
-			!isFromProductsList
-				? navigation.navigate('BottomTab')
-				: navigation.navigate('Business');
+			isFromCheckout
+				? navigation.goBack()
+				: !isFromProductsList
+					? navigation.navigate('BottomTab')
+					: navigation.navigate('Business');
 		}
 	}, [orderState?.options?.address]);
 

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

@@ -217,7 +217,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 +229,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 +307,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 +317,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/Checkout/index.tsx

@@ -103,7 +103,8 @@ const CheckoutUI = (props: any) => {
 		setPlaceSpotNumber,
 		maxDate,
 		androidAppId,
-		urlscheme
+		urlscheme,
+		checkoutFieldsState
 	} = props
 
 	const theme = useTheme();
@@ -178,6 +179,7 @@ const CheckoutUI = (props: any) => {
 	const containerRef = useRef<any>()
 	const cardsMethods = ['credomatic']
 	const stripePaymethods: any = ['stripe', 'stripe_direct', 'stripe_connect', 'stripe_redirect']
+	const notFields = ['coupon', 'driver_tip', 'mobile_phone', 'address', 'zipcode', 'address_notes', 'comments']
 	const placeSpotTypes = [3, 4, 5]
 	const placeSpotsEnabled = placeSpotTypes.includes(options?.type)
 	const businessConfigs = businessDetails?.business?.configs ?? []
@@ -270,7 +272,7 @@ const CheckoutUI = (props: any) => {
 			return
 		}
 
-		if (!userErrors.length && (!requiredFields?.length || allowedGuest) || forcePlace) {
+		if (!userErrors.length && (!requiredFields?.length) || forcePlace) {
 			vibrateApp()
 			handlerClickPlaceOrder && handlerClickPlaceOrder(null, { isNative: true }, confirmPayment, NativeStripeSdk?.dismissPlatformPay)
 			return
@@ -310,7 +312,6 @@ const CheckoutUI = (props: any) => {
 	const checkValidationFields = () => {
 		setUserErrors([])
 		const errors = []
-		const notFields = ['coupon', 'driver_tip', 'mobile_phone', 'address', 'zipcode', 'address_notes', 'comments']
 		const _requiredFields: any = []
 
 		Object.values(validationFields?.fields?.checkout).map((field: any) => {
@@ -338,6 +339,27 @@ const CheckoutUI = (props: any) => {
 		setUserErrors(errors)
 	}
 
+	const checkGuestValidationFields = () => {
+		const userSelected = user
+		const _requiredFields = checkoutFieldsState?.fields
+			.filter((field: any) => (field?.order_type_id === options?.type) && field?.enabled && field?.required &&
+				!notFields.includes(field?.validation_field?.code) &&
+				userSelected && !userSelected[field?.validation_field?.code])
+			.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')
+
+		if (
+			userSelected &&
+			!userSelected?.cellphone &&
+			((guestCheckoutCellPhone?.enabled &&
+				guestCheckoutCellPhone?.required) ||
+				configs?.verification_phone_required?.value === '1')
+		) {
+			_requiredFields.push('cellphone')
+		}
+		setRequiredFields(_requiredFields)
+	}
+
 	const togglePhoneUpdate = (val: boolean) => {
 		setPhoneUpdate(val)
 	}
@@ -347,11 +369,16 @@ const CheckoutUI = (props: any) => {
 	}
 
 	useEffect(() => {
-		if (validationFields && validationFields?.fields?.checkout) {
+		if (validationFields && validationFields?.fields?.checkout && !user?.guest_id) {
 			checkValidationFields()
 		}
 	}, [validationFields, user])
 
+	useEffect(() => {
+		if (checkoutFieldsState?.loading || !user?.guest_id) return
+		checkGuestValidationFields()
+	}, [user, checkoutFieldsState])
+
 	useEffect(() => {
 		if (errors) {
 			const errorText = manageErrorsToShow(errors)

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

@@ -108,7 +108,7 @@ const LoginFormUI = (props: LoginParams) => {
 
 	const googleLoginEnabled = configs?.google_login_enabled?.value === '1' || !configs?.google_login_enabled?.enabled
 	const facebookLoginEnabled = configs?.facebook_login_enabled?.value === '1' || !configs?.facebook_login_enabled?.enabled
-	const appleLoginEnabled = Platform.OS === 'ios' && configs?.apple_login_enabled?.value === '1' || !configs?.apple_login_enabled?.enabled
+	const appleLoginEnabled = Platform.OS === 'ios' && (configs?.apple_login_enabled?.value === '1' || !configs?.apple_login_enabled?.enabled)
 
 	const loginStyle = StyleSheet.create({
 		btnOutline: {
@@ -802,7 +802,7 @@ const LoginFormUI = (props: LoginParams) => {
 											handleSuccessGoogleLogin={handleSuccessFacebook}
 										/>
 									)}
-									{(configs?.apple_login_client_id?.value !== '' && configs?.google_login_client_id?.value !== null) && appleLoginEnabled && (
+									{(configs?.apple_login_client_id?.value !== '' && configs?.apple_login_client_id?.value !== null) && appleLoginEnabled && (
 										<AppleLogin
 											notificationState={notificationState}
 											handleErrors={(err: any) => { showToast(ToastType.Error, err), vibrateApp() }}

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

@@ -155,7 +155,7 @@ const SignupFormUI = (props: SignupParams) => {
 	const showInputPhoneNumber = (validationFields?.fields?.checkout?.cellphone?.enabled ?? false) || configs?.verification_phone_required?.value === '1'
 	const googleLoginEnabled = configs?.google_login_enabled?.value === '1' || !configs?.google_login_enabled?.enabled
 	const facebookLoginEnabled = configs?.facebook_login_enabled?.value === '1' || !configs?.facebook_login_enabled?.enabled
-	const appleLoginEnabled = configs?.apple_login_enabled?.value === '1' || !configs?.apple_login_enabled?.enabled
+	const appleLoginEnabled = Platform.OS === 'ios' && (configs?.apple_login_enabled?.value === '1' || !configs?.apple_login_enabled?.enabled)
 
 	const closeAlert = () => {
 		setAlertState({

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

@@ -381,7 +381,7 @@ export const UserFormDetailsUI = (props: any) => {
 										))
 								},
 							)}
-							{showInputBirthday && (
+							{showInputBirthday && ((requiredFields && requiredFields?.includes?.('birthdate')) || !requiredFields) && (
 								<>
 									<WrapperBirthdate>
 										<OText size={14} lineHeight={21} color={theme.colors.textNormal} weight={'500'} style={{ textTransform: 'capitalize', alignSelf: 'flex-start' }}>
@@ -396,7 +396,7 @@ export const UserFormDetailsUI = (props: any) => {
 									<DatePickerUI open={showDatePicker} birthdate={birthdate} onConfirm={_handleChangeDate} onCancel={() => setShowDatePicker(false)} />
 								</>
 							)}
-							{!!showInputPhoneNumber && ((requiredFields && requiredFields.includes('cellphone')) || !requiredFields) && (
+							{!!showInputPhoneNumber && ((requiredFields && requiredFields?.includes?.('cellphone')) || !requiredFields) && (
 								<WrapperPhone>
 									<OText size={14} lineHeight={21} weight={'500'} color={theme.colors.textNormal}>{t('PHONE', 'Phone')}</OText>
 									<PhoneInputNumber
@@ -523,10 +523,10 @@ export const UserFormDetailsUI = (props: any) => {
 						borderColor: !user?.guest_id && (formState.loading || !isValid) ? theme.colors.white : theme.colors.primary,
 						opacity: !user?.guest_id && (formState.loading || !isValid) ? 0.3 : 1,
 					}}
-					onClick={!user?.guest_id ? handleSubmit(onSubmit) : () => setIsModalOpen(true)}
+					onClick={handleSubmit(onSubmit)}
 				/>
 			)}
-			{isCheckout && !!user?.guest_id && (
+			{isCheckout && !!user?.guest_id && !requiredFields && (
 				<TouchableOpacity style={{ marginTop: 10 }} onPress={() => handlePlaceOrderAsGuest()}>
 					<OText color={theme.colors.primary} style={{ textAlign: 'center' }}>{t('PLACE_ORDER_AS_GUEST', 'Place order as guest')}</OText>
 				</TouchableOpacity>