ordering-ui-react-native 0.14.71 → 0.14.74

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

@@ -135,14 +135,21 @@ export const SingleProductCard = (props: SingleProductCardParams) => {
 					{product?.description}
 				</OText>
 			</CardInfo>
-			<FastImage
-				style={styles.productStyle}
-				source={{
-					uri: optimizeImage(product?.images, 'h_75,c_limit'),
-					priority: FastImage.priority.normal,
-				}}
-				resizeMode={FastImage.resizeMode.cover}
-			/>
+			{product?.images ? (
+				<FastImage
+					style={styles.productStyle}
+					source={{
+						uri: optimizeImage(product?.images, 'h_75,c_limit'),
+						priority: FastImage.priority.normal,
+					}}
+					resizeMode={FastImage.resizeMode.cover}
+				/>
+			) : (
+				<OIcon
+					src={theme?.images?.dummies?.product}
+					style={styles.productStyle}
+				/>
+			)}
 			{(isSoldOut || maxProductQuantity <= 0) && (
 				<SoldOut>
 					<OText size={12} weight="bold" color={theme.colors.textSecondary} style={styles.soldOutTextStyle}>

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

@@ -155,9 +155,6 @@ const UpsellingProductsUI = (props: UpsellingProductsParams) => {
           <TopActions onPress={() => onGoBack()}>
             <OIcon src={theme.images.general.arrow_left} width={15} />
           </TopActions>
-          <TopActions style={styles.cancelBtn} onPress={() => handleUpsellingPage()}>
-            <OText size={12} color={theme.colors.textSecondary}>{t('CANCEL', 'Cancel')}</OText>
-          </TopActions>
         </TopBar>
         <ScrollView style={{ marginBottom: props.isPage ? 40 : bottom + (Platform.OS == 'ios' ? 96 : 130) }} showsVerticalScrollIndicator={false}>
           <View style={{ paddingHorizontal: 40 }}>
@@ -178,7 +175,7 @@ const UpsellingProductsUI = (props: UpsellingProductsParams) => {
         <View
           style={{
             alignItems: 'center',
-            bottom: props.isPage ? 20 : Platform.OS === 'ios' ? bottom  + 59 :  bottom + 125
+            bottom: props.isPage ? Platform.OS === 'ios' ? 0 : 20 : Platform.OS === 'ios' ? bottom  + 59 :  bottom + 125
           }}
         >
           <OButton

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

@@ -5,7 +5,7 @@ import {
 	useLanguage,
 	ToastType,
 	useToast,
-  useConfig
+	useConfig
 } from 'ordering-components/native';
 import { useTheme } from 'styled-components/native';
 import { useForm } from 'react-hook-form';
@@ -85,7 +85,7 @@ const ProfileListUI = (props: ProfileParams) => {
 		messageIconStyle: {
 			fontSize: 18,
 			fontWeight: 'bold',
-            marginEnd: 14
+			marginEnd: 14
 		}
 	});
 
@@ -99,7 +99,7 @@ const ProfileListUI = (props: ProfileParams) => {
 	const { height } = useWindowDimensions();
 	const { top, bottom } = useSafeAreaInsets();
 
-  const isWalletEnabled = configs?.wallet_enabled?.value === '1' && (configs?.wallet_cash_enabled?.value === '1' || configs?.wallet_credit_point_enabled?.value === '1')
+	const isWalletEnabled = configs?.wallet_enabled?.value === '1' && (configs?.wallet_cash_enabled?.value === '1' || configs?.wallet_credit_point_enabled?.value === '1')
 
 	const onRedirect = (route: string, params?: any) => {
 		navigation.navigate(route, params)
@@ -136,7 +136,9 @@ const ProfileListUI = (props: ProfileParams) => {
 
 	return (
 		<View style={{ flex: 1, height: height - top - bottom - 62 }}>
-			<OText size={24} color={theme.colors.textNormal} lineHeight={36} weight={Platform.OS === 'ios' ? '600' : 'bold'} style={{ marginTop: 14, marginBottom: 24, ...styles.pagePadding }}>{t('PROFILE', 'Profile')}</OText>
+			<OText size={24} style={{ marginTop: 15, paddingHorizontal: 40 }}>
+				{t('PROFILE', 'Profile')}
+			</OText>
 			<CenterView style={styles.pagePadding}>
 				<View style={styles.photo}>
 					<OIcon
@@ -147,7 +149,7 @@ const ProfileListUI = (props: ProfileParams) => {
 					/>
 				</View>
 				<View style={{ flexBasis: '70%' }}>
-					<OText size={20} lineHeight={30} weight={Platform.OS === 'ios' ? '500' : 'bold'} color={theme.colors.textNormal}>{`${user?.name} ${user?.lastname}`}</OText>
+					<OText size={20} lineHeight={30} weight={Platform.OS === 'ios' ? '500' : 'bold'} color={theme.colors.textNormal}>{user?.name} {user?.lastname}</OText>
 					<TouchableOpacity onPress={() => navigation.navigate('ProfileForm', { ...detailProps })}>
 						<OText size={12} lineHeight={18} color={theme.colors.textSecondary} style={{ textDecorationLine: 'underline' }}>{t('VIEW_ACCOUNT', 'View account')}</OText>
 					</TouchableOpacity>
@@ -165,12 +167,12 @@ const ProfileListUI = (props: ProfileParams) => {
 						<MessageCircle name='message1' style={styles.messageIconStyle} color={theme.colors.textNormal} />
 						<OText size={14} lineHeight={24} weight={'400'} color={theme.colors.textNormal}>{t('MESSAGES', 'Messages')}</OText>
 					</ListItem>
-          {!isWalletEnabled && (
-            <ListItem onPress={() => onRedirect('Wallets', { isFromProfile: true, isGoBack: true })} activeOpacity={0.7}>
-              <Ionicons name='wallet-outline' style={styles.messageIconStyle} color={theme.colors.textNormal} />
-              <OText size={14} lineHeight={24} weight={'400'} color={theme.colors.textNormal}>{t('WALLETS', 'Wallets')}</OText>
-            </ListItem>
-          )}
+					{isWalletEnabled && (
+						<ListItem onPress={() => onRedirect('Wallets', { isFromProfile: true, isGoBack: true })} activeOpacity={0.7}>
+							<Ionicons name='wallet-outline' style={styles.messageIconStyle} color={theme.colors.textNormal} />
+							<OText size={14} lineHeight={24} weight={'400'} color={theme.colors.textNormal}>{t('WALLETS', 'Wallets')}</OText>
+						</ListItem>
+					)}
 					<ListItem onPress={() => navigation.navigate('Help', {})} activeOpacity={0.7}>
 						<OIcon src={theme.images.general.ic_help} width={16} color={theme.colors.textNormal} style={{ marginEnd: 14 }} />
 						<OText size={14} lineHeight={24} weight={'400'} color={theme.colors.textNormal}>{t('HELP', 'Help')}</OText>

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

@@ -22,10 +22,10 @@ export const WalletTransactionItem = (props: any) => {
   const [{ parsePrice, parseDate }] = useUtils()
   const [, t] = useLanguage()
 
-  const LANG_EVENT_KEY = `WALLET_${type.toUpperCase()}_${item?.event.toUpperCase()}_${item?.event_type.toUpperCase()}_${item?.amount >= 0 ? 'POSITIVE': 'NEGATIVE'}`
+  const LANG_EVENT_KEY = `WALLET_${type.toUpperCase()}_${item?.event.toUpperCase()}_${item?.event_type.toUpperCase()}_${item?.amount >= 0 ? 'POSITIVE' : 'NEGATIVE'}`
   const lang_event_text = !!item?.event?.order_id
-    ? `:author ${item?.amount >= 0 ? 'add' : 'reduce'} money in Order No. :order_id`
-    : `:author ${item?.amount >= 0 ? 'add' : 'reduce'} money`
+    ? `:author${item?.amount >= 0 ? 'Add' : 'Reduce'} money in Order No. :order_id`
+    : `:author${item?.amount >= 0 ? 'Add' : 'Reduce'} money`
 
   return (
     <Container>
@@ -44,8 +44,8 @@ export const WalletTransactionItem = (props: any) => {
       <MessageBlock>
         <OText>
           {t(LANG_EVENT_KEY, lang_event_text)
-            .replace(':author', item?.event?.author?.name ?? '')
-            .replace(':order_id', item?.event?.order_id ?? '')}
+            .replace(':author', item?.event?.author?.name ? item?.event?.author?.name + ' ' : '')
+            .replace(':order_id', item?.event?.order_id ? item?.event?.order_id + ' ' : '')}
         </OText>
       </MessageBlock>
       {!!item?.description && (

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

@@ -27,7 +27,7 @@ export const BalanceElement = styled.View`
   display: flex;
   flex-direction: row;
   justify-content: center;
-  align-items: flex-end;
+  align-items: center;
   background-color: ${(props: any) => props.theme.colors.backgroundGray100};
   border-radius: 8px;
 `

package/themes/original/src/components/shared/OInput.tsx

@@ -37,9 +37,10 @@ interface Props extends TextInputProps {
 	vectorIconColor?: string;
 	forwardRef?: any;
 	inputStyle?: TextStyle;
+	wrapperRef?: any;
 }
 
-const Wrapper = styled.View`
+const Wrapper = styled.Pressable`
 	background-color: ${(props: any) => props.theme.colors.backgroundLight};
 	border-radius: 25px;
 	border-width: 1px;
@@ -54,6 +55,7 @@ const Wrapper = styled.View`
 const OInput = (props: Props): React.ReactElement => {
 	return (
 		<Wrapper
+			onPress={() => props.forwardRef?.current?.focus?.()}
 			style={{
 				backgroundColor: props.bgColor,
 				borderColor: props.borderColor,
@@ -87,7 +89,9 @@ const OInput = (props: Props): React.ReactElement => {
 				returnKeyType={props.returnKeyType}
 				onSubmitEditing={props.onSubmitEditing}
 				blurOnSubmit={props.blurOnSubmit}
-				ref={props.forwardRef}
+				ref={(e : any) => {
+					props.forwardRef.current = e
+				}}
 				style={props?.inputStyle}
 			/>
 			{props.iconRight && (

package/themes/original/src/utils/index.tsx

@@ -195,4 +195,11 @@ export const getDistance = (lat1: any, lon1: any, lat2: any, lon2: any) => {
   const a = Math.sin(dLat / 2) * Math.sin(dLat / 2) + Math.sin(dLon / 2) * Math.sin(dLon / 2) * Math.cos(curLat1) * Math.cos(curLat2)
   const c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a))
   return R * c
+}
+
+export const formatUrlVideo = (url : string) => {
+  const regExp = /^.*((youtu.be\/)|(v\/)|(\/u\/\w\/)|(embed\/)|(watch\?))\??v?=?([^#&?]*).*/
+  const match = url.match(regExp)
+  const id = (match && match[7].length === 11) ? match[7] : false
+  return `https://www.youtube-nocookie.com/embed/${id}`
 }