ordering-ui-react-native 0.12.69 → 0.12.70

package/package.json

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

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

@@ -290,14 +290,6 @@ const AddressListUI = (props: AddressListParams) => {
 							/>
 						</>
 					)}
-					{!isFromProfile && addressList?.addresses?.length > 0 && (
-						<OButton
-							text={t('CONTINUE', 'Continue')}
-							style={styles.button}
-							onClick={() => onNavigatorRedirect()}
-							textStyle={{ color: theme.colors.white }}
-						/>
-					)}
 				</AddressListContainer>
 			)}
 		</Container>

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

@@ -1,5 +1,5 @@
 import React, { useState, useEffect } from 'react';
-import { View, StyleSheet, BackHandler, KeyboardAvoidingView, Platform } from 'react-native';
+import { View, StyleSheet, BackHandler, KeyboardAvoidingView, Platform, Linking } from 'react-native';
 import Spinner from 'react-native-loading-spinner-overlay';
 import LinearGradient from 'react-native-linear-gradient';
 import { Messages } from '../Messages';
@@ -483,10 +483,8 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
                   </OText>
                   <Icons>
                     <TouchableOpacity
-                      onPress={() =>
-                        props.navigation.navigate('Business', {
-                          store: businessData?.slug,
-                        })
+                      onPress={() => order?.business?.cellphone &&
+                        Linking.openURL(`tel:${order?.business?.cellphone}`)
                       }
                       style={{ paddingEnd: 5 }}>
                       <OIcon

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

@@ -314,6 +314,41 @@ export const UserFormDetailsUI = (props: any) => {
 									)}
 								</WrapperPhone>
 							)}
+							<Controller
+								control={control}
+								render={() => (
+									<>
+										<OText size={14} lineHeight={21} color={theme.colors.textNormal} weight={'500'} style={{ textTransform: 'capitalize', alignSelf: 'flex-start' }}>
+										{t('PASSWORD', 'Password')}
+										</OText>
+										<OInput
+											name='password'
+											placeholder={t('FRONT_VISUALS_PASSWORD', 'Password')}
+											inputStyle={styles.inputStyle}
+											style={{ paddingLeft: 0, paddingRight: 0, marginTop: 6, height: 44, minHeight: 44 }}
+											autoCapitalize='none'
+											isDisabled={false}
+											value={
+												formState?.changes['password'] ??
+												(user && user['password']) ??
+												''
+											}
+											onChange={(val: any) => {
+												setValue('password', val.target.value)
+												handleChangeInput(val)
+											}}
+											autoCorrect
+											type='default'
+											returnKeyType="done"
+											autoCompleteType='off'
+											isSecured
+										/>
+									</>
+								)}
+								name='password'
+								rules={getInputRules({name: 'password', code: 'password'})}
+								defaultValue=''
+							/>
 						</UDWrapper>
 					)}
 				{validationFields?.loading && (
@@ -339,7 +374,7 @@ export const UserFormDetailsUI = (props: any) => {
 								borderColor={theme.colors.primary}
 								isDisabled={formState.loading}
 								imgRightSrc={null}
-								style={{ borderRadius: 7.6, shadowOpacity: 0, width: '100%', borderWidth: 1, marginTop: 20 }}
+								style={{ borderRadius: 7.6, shadowOpacity: 0, width: '100%', borderWidth: 1, marginTop: 20, marginBottom: 20 }}
 								onClick={handleSubmit(onSubmit)}
 							/>
 						)}

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

@@ -114,8 +114,9 @@ const ProfileUI = (props: ProfileParams) => {
 					console.log('ImagePicker Error: ', response.errorMessage);
 					showToast(ToastType.Error, response.errorMessage);
 				} else {
-					if (response.uri) {
-						const url = `data:${response.type};base64,${response.base64}`;
+					if (response?.assets?.length > 0) {
+						const image = response?.assets[0]
+						const url = `data:${image.type};base64,${image.base64}`
 						handleButtonUpdateClick(null, true, url);
 					} else {
 						showToast(ToastType.Error, t('IMAGE_NOT_FOUND', 'Image not found'));

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

@@ -33,8 +33,8 @@ export const VerifyPhone = (props: any) => {
 
 	const styles = StyleSheet.create({
 		inputStyle: {
-			width: 80,
-			height: 80,
+			width: 75,
+			height: 75,
 			marginBottom: 25,
 			borderWidth: 1,
 			borderColor: theme.colors.disabled,
@@ -50,12 +50,21 @@ export const VerifyPhone = (props: any) => {
 	const [timer, setTimer] = useState(`${TIME_COUNTDOWN / 60}:00`)
 	const [verifyCode, setVerifyCode] = useState({ 0: '', 1: '', 2: '', 3: '' })
 	const [isSendCodeAgain, setIsSendCodeAgain] = useState(false)
+	const inputRefs: any = [
+		React.createRef(),
+		React.createRef(),
+		React.createRef(),
+		React.createRef()
+	]
 
 	const lastNumbers = phone?.cellphone &&
 		`${phone?.cellphone.charAt(phone?.cellphone.length - 2)}${phone?.cellphone.charAt(phone?.cellphone.length - 1)}`
 
-	const handleChangeCode = (val: number, i: number) => {
+	const goNextAfterEdit = (val: number, i: number) => {
 		setVerifyCode({ ...verifyCode, [i]: val })
+		if(val && i < inputRefs.length - 1) {
+			inputRefs[i+1].focus()
+		}
 	}
 
 	const checkResult = (result: any) => {
@@ -141,14 +150,15 @@ export const VerifyPhone = (props: any) => {
 				</CountDownContainer>
 			</WrappCountdown>
 			<InputsSection>
-				{[...Array(4),].map((_: any, i: number) => (
+				{inputRefs.map((k: any, idx: number) => (
 					<TextInput
-						key={i}
+						key={idx}
 						keyboardType='number-pad'
-						placeholder={'0'}
-						style={styles.inputStyle}
-						onChangeText={(val: any) => handleChangeCode(val, i)}
+						ref={r => inputRefs[idx] =  r}
 						maxLength={1}
+						style={styles.inputStyle}
+						placeholder={'0'}
+						onChangeText={(val: any) => goNextAfterEdit(val, idx)}
 						editable={timer !== '00:00'}
 					/>
 				))}
@@ -173,11 +183,11 @@ export const VerifyPhone = (props: any) => {
 					</ErrorSection>
 				)}
 			<ResendSection>
-				<OText size={17} style={{ marginRight: 5 }}>
+				<OText size={16} style={{ marginRight: 5 }}>
 					{t('ARE_YOU_NOT_SEEING_THE_CODE', 'Are you not seeing the code?')}
 				</OText>
 				<Pressable onPress={() => handleSendCodeAgain()}>
-					<OText size={17} color={theme.colors.primary}>
+					<OText size={16} color={theme.colors.primary}>
 						{t('SEND_AGAIN', 'Send Again')}
 					</OText>
 				</Pressable>

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

@@ -3,8 +3,8 @@ import styled from 'styled-components/native';
 export const Container = styled.View`
   width: 100%;
   padding-top: 5px;
-  padding-left: 20px;
-  padding-right: 20px;
+  padding-left: 40px;
+  padding-right: 40px;
 `
 
 export const CountDownContainer = styled.View`