ordering-ui-react-native 0.14.78 → 0.14.80-release

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

@@ -1,141 +1,141 @@
-import React, { useState } from 'react';
-import { TouchableOpacity, StyleSheet } from 'react-native';
-import {
-	DriverTips as DriverTipsController,
-	useUtils,
-	useLanguage,
-	useConfig,
-} from 'ordering-components/native';
-import { useTheme } from 'styled-components/native';
-import { OButton, OInput, OText } from '../shared';
-
-import {
-	DTContainer,
-	DTCard,
-	DTWrapperTips,
-	DTForm,
-	DTLabel,
-	DTWrapperInput
-} from './styles'
-
-const DriverTipsUI = (props: any) => {
-	const {
-		driverTip,
-		driverTipsOptions,
-		optionSelected,
-		isFixedPrice,
-		isDriverTipUseCustom,
-		handlerChangeOption
-	} = props;
-
-	const [{ parsePrice }] = useUtils();
-	const [, t] = useLanguage();
-	const [{ configs }] = useConfig();
-
-	const theme = useTheme();
-
-	const style = StyleSheet.create({
-		circle: {
-			borderRadius: 30
-		},
-		inputStyle: {
-			flex: 1,
-			borderRadius: 5,
-			borderWidth: 1,
-			borderColor: theme.colors.inputDisabled,
-			marginRight: 10,
-			height: 50
-		}
-	})
-
-	const [value, setvalue] = useState(0);
-
-	const placeholderCurrency = (configs?.currency_position?.value || 'left') === 'left'
-		? `${configs?.format_number_currency?.value}0`
-		: `0${configs?.format_number_currency?.value}`
-
-	const handleChangeDriverTip = (val: any) => {
-		let tip = parseFloat(val)
-		tip = isNaN(tip) ? 0 : tip
-		setvalue(tip)
-	}
-
-	return (
-		<DTContainer>
-			<DTWrapperTips>
-				{driverTipsOptions.map((option: any, i: number) => (				
-					<TouchableOpacity
-						key={i}
-						onPress={() => handlerChangeOption(option)}
-					>
-						<DTCard
-							style={style.circle}
-							isActive={option === optionSelected}
-						>
-							<OText size={12} numberOfLines={1} color={option === optionSelected ? '#FFF' : theme.colors.textSecondary}>
-								{`${isFixedPrice ? parsePrice(option) : `${option}%`}`}
-							</OText>
-						</DTCard>
-					</TouchableOpacity>
-				))}
-			</DTWrapperTips>
-			{!driverTipsOptions.includes(driverTip) && driverTip > 0 && (
-				<OText
-					color={theme.colors.error}
-					size={16}
-					style={{ marginTop: 10, textAlign: 'center' }}
-				>
-					{t('CUSTOM_DRIVER_TIP_AMOUNT', 'The driver\'s current tip comes from a custom option')}
-				</OText>
-			)}
-			{isDriverTipUseCustom && (
-				<DTForm>
-					<DTLabel>
-						{t('CUSTOM_DRIVER_TIP_MESSAGE', '100% of these tips go directly to your driver')}
-					</DTLabel>
-					<DTWrapperInput>
-						<OInput
-							placeholder={placeholderCurrency}
-							style={style.inputStyle}
-							onChange={handleChangeDriverTip}
-							autoCapitalize='none'
-							autoCorrect={false}
-						/>
-						<OButton
-							text={t('APPLY_TIP', 'Apply Tip')}
-							bgColor={theme.colors.primary}
-							borderColor={theme.colors.primary}
-							textStyle={{ color: 'white', fontSize: 14 }}
-							imgRightSrc={null}
-							style={{ borderRadius: 5, height: 44 }}
-							isDisabled={!(value > 0 && value !== driverTip) || !value}
-							onClick={() => {
-								handlerChangeOption(value)
-								setvalue(0)
-							}}
-						/>
-					</DTWrapperInput>
-					{parseFloat(driverTip || 0) > 0 && (
-						<OText
-							color={theme.colors.error}
-							size={16}
-							style={{ marginTop: 10, textAlign: 'center' }}
-						>
-							{t('CURRENT_DRIVER_TIP_AMOUNT', 'Current driver tip amount')}: {parsePrice(driverTip)}
-						</OText>
-					)}
-				</DTForm>
-			)}
-		</DTContainer>
-	)
-}
-
-
-export const DriverTips = (props: any) => {
-	const driverTipsProps = {
-		...props,
-		UIComponent: DriverTipsUI
-	}
-
-	return <DriverTipsController {...driverTipsProps} />
-}
+import React, { useState } from 'react';
+import { TouchableOpacity, StyleSheet } from 'react-native';
+import {
+	DriverTips as DriverTipsController,
+	useUtils,
+	useLanguage,
+	useConfig,
+} from 'ordering-components/native';
+import { useTheme } from 'styled-components/native';
+import { OButton, OInput, OText } from '../shared';
+
+import {
+	DTContainer,
+	DTCard,
+	DTWrapperTips,
+	DTForm,
+	DTLabel,
+	DTWrapperInput
+} from './styles'
+
+const DriverTipsUI = (props: any) => {
+	const {
+		driverTip,
+		driverTipsOptions,
+		optionSelected,
+		isFixedPrice,
+		isDriverTipUseCustom,
+		handlerChangeOption
+	} = props;
+
+	const [{ parsePrice }] = useUtils();
+	const [, t] = useLanguage();
+	const [{ configs }] = useConfig();
+
+	const theme = useTheme();
+
+	const style = StyleSheet.create({
+		circle: {
+			borderRadius: 30
+		},
+		inputStyle: {
+			flex: 1,
+			borderRadius: 5,
+			borderWidth: 1,
+			borderColor: theme.colors.inputDisabled,
+			marginRight: 10,
+			height: 50
+		}
+	})
+
+	const [value, setvalue] = useState(0);
+
+	const placeholderCurrency = (configs?.currency_position?.value || 'left') === 'left'
+		? `${configs?.format_number_currency?.value}0`
+		: `0${configs?.format_number_currency?.value}`
+
+	const handleChangeDriverTip = (val: any) => {
+		let tip = parseFloat(val)
+		tip = isNaN(tip) ? 0 : tip
+		setvalue(tip)
+	}
+
+	return (
+		<DTContainer>
+			<DTWrapperTips>
+				{driverTipsOptions.map((option: any, i: number) => (
+					<TouchableOpacity
+						key={i}
+						onPress={() => handlerChangeOption(option)}
+					>
+						<DTCard
+							style={style.circle}
+							isActive={option === optionSelected}
+						>
+							<OText size={12} numberOfLines={1} color={option === optionSelected ? '#FFF' : theme.colors.textSecondary}>
+								{`${isFixedPrice ? parsePrice(option) : `${option}%`}`}
+							</OText>
+						</DTCard>
+					</TouchableOpacity>
+				))}
+			</DTWrapperTips>
+			{!driverTipsOptions.includes(driverTip) && driverTip > 0 && (
+				<OText
+					color={theme.colors.error}
+					size={16}
+					style={{ marginTop: 10, textAlign: 'center' }}
+				>
+					{t('CUSTOM_DRIVER_TIP_AMOUNT', 'The driver\'s current tip comes from a custom option')}
+				</OText>
+			)}
+			{isDriverTipUseCustom && (
+				<DTForm>
+					<DTLabel>
+						{t('CUSTOM_DRIVER_TIP_MESSAGE', '100% of these tips go directly to your driver')}
+					</DTLabel>
+					<DTWrapperInput>
+						<OInput
+							placeholder={placeholderCurrency}
+							style={style.inputStyle}
+							onChange={handleChangeDriverTip}
+							autoCapitalize='none'
+							autoCorrect={false}
+						/>
+						<OButton
+							text={t('APPLY_TIP', 'Apply Tip')}
+							bgColor={theme.colors.primary}
+							borderColor={theme.colors.primary}
+							textStyle={{ color: 'white', fontSize: 14 }}
+							imgRightSrc={null}
+							style={{ borderRadius: 5, height: 44 }}
+							isDisabled={!(value > 0 && value !== driverTip) || !value}
+							onClick={() => {
+								handlerChangeOption(value)
+								setvalue(0)
+							}}
+						/>
+					</DTWrapperInput>
+					{parseFloat(driverTip || 0) > 0 && (
+						<OText
+							color={theme.colors.error}
+							size={16}
+							style={{ marginTop: 10, textAlign: 'center' }}
+						>
+							{t('CURRENT_DRIVER_TIP_AMOUNT', 'Current driver tip amount')}: {parsePrice(driverTip)}
+						</OText>
+					)}
+				</DTForm>
+			)}
+		</DTContainer>
+	)
+}
+
+
+export const DriverTips = (props: any) => {
+	const driverTipsProps = {
+		...props,
+		UIComponent: DriverTipsUI
+	}
+
+	return <DriverTipsController {...driverTipsProps} />
+}

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

@@ -1,66 +1,66 @@
-import styled, { css } from 'styled-components/native'
-
-export const DTContainer = styled.View`
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: space-around;
-  flex-wrap: wrap;
-  width: 100%;
-`
-
-export const DTWrapperTips = styled.View`
-  display: flex;
-  flex-direction: row;
-  width: 100%;
-  justify-content: space-evenly;
-  align-items: center;
-  flex-wrap: wrap;
-`
-
-export const DTCard = styled.View`
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  border: 1px solid ${(props: any) => props.isActive ? props.theme.colors.primary : props.theme.colors.border};
-  text-transform: capitalize;
-  min-height: 55px;
-  min-width: 55px;
-  max-width: 55px;
-  max-height: 55px;
-  margin-right: 10px;
-  margin-left: 10px;
-  margin-top: 10px;
-
-  ${(props: any) => props.isActive && css`
-    background-color: ${(props: any) => props.theme.colors.primary};
-  `}
-`
-
-export const DTForm = styled.View`
-  width: 100%;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-`
-
-export const DTLabel = styled.Text`
-  font-size: 14px;
-  align-self: flex-start;
-  color: ${(props: any) => props.theme.colors.textSecondary};
-  margin-top: 10px;
-
-  ${(props: any) => props.theme?.rtl && css`
-    margin-left: 20px;
-    margin-right: 0;
-  `}
-`
-
-export const DTWrapperInput = styled.View`
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  justify-content: center;
-  margin-top: 20px;
-`
+import styled, { css } from 'styled-components/native'
+
+export const DTContainer = styled.View`
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: space-around;
+  flex-wrap: wrap;
+  width: 100%;
+`
+
+export const DTWrapperTips = styled.View`
+  display: flex;
+  flex-direction: row;
+  width: 100%;
+  justify-content: space-evenly;
+  align-items: center;
+  flex-wrap: wrap;
+`
+
+export const DTCard = styled.View`
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  border: 1px solid ${(props: any) => props.isActive ? props.theme.colors.primary : props.theme.colors.border};
+  text-transform: capitalize;
+  min-height: 55px;
+  min-width: 55px;
+  max-width: 55px;
+  max-height: 55px;
+  margin-right: 10px;
+  margin-left: 10px;
+  margin-top: 10px;
+
+  ${(props: any) => props.isActive && css`
+    background-color: ${(props: any) => props.theme.colors.primary};
+  `}
+`
+
+export const DTForm = styled.View`
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+`
+
+export const DTLabel = styled.Text`
+  font-size: 14px;
+  align-self: flex-start;
+  color: ${(props: any) => props.theme.colors.textSecondary};
+  margin-top: 10px;
+
+  ${(props: any) => props.theme?.rtl && css`
+    margin-left: 20px;
+    margin-right: 0;
+  `}
+`
+
+export const DTWrapperInput = styled.View`
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: center;
+  margin-top: 20px;
+`

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

@@ -1,122 +1,122 @@
-import React from 'react';
-import { StyleSheet, Text } from 'react-native';
-import { AccessToken, LoginManager } from 'react-native-fbsdk-next';
-import { useLanguage, useSession, useApi } from 'ordering-components/native';
-import { useTheme } from 'styled-components/native';
-import Icon from 'react-native-vector-icons/FontAwesome5';
-
-import { Container, FacebookButton } from './styles';
-
-export const FacebookLogin = (props: any) => {
-	const {
-		handleErrors,
-		handleLoading,
-		handleSuccessFacebookLogin,
-		notificationState
-	} = props
-
-	const [, t] = useLanguage()
-	const [ordering] = useApi()
-	const [{ auth }] = useSession()
-
-	const theme = useTheme();
-
-	const buttonText = auth
-		? t('LOGOUT_WITH_FACEBOOK', 'Logout with Facebook')
-		: t('CONTINUE_WITH_FACEBOOK', 'Continue with Facebook');
-
-	const logoutWithFacebook = () => {
-		LoginManager && LoginManager.logOut();
-	};
-
-	const handleLoginClick = async (accessToken: string) => {
-		try {
-			const body: any = {
-				access_token: accessToken
-			  }
-			  if (notificationState?.notification_token) {
-				body.notification_token = notificationState.notification_token
-				body.notification_app = notificationState.notification_app
-			  }
-			const response = await ordering.users().authFacebook(body)
-			if (!response.content.error) {
-				if (handleSuccessFacebookLogin) {
-					handleSuccessFacebookLogin(response.content.result)
-					handleLoading && handleLoading(false)
-				}
-			} else {
-				handleLoading && handleLoading(false)
-				handleErrors && handleErrors(response.content.result)
-				logoutWithFacebook()
-			}
-		} catch (err: any) {
-			handleLoading && handleLoading(false)
-			handleErrors && handleErrors(err.message)
-		}
-	}
-
-	const loginWithFacebook = () => {
-		handleLoading && handleLoading(true)
-		LoginManager && LoginManager.logInWithPermissions(['public_profile', 'email']).then(
-			(login: any) => {
-				if (login.isCancelled) {
-					const err = t('LOGIN_WITH_FACEBOOK_CANCELLED', 'Login cancelled')
-					handleLoading && handleLoading(false)
-					handleErrors && handleErrors(err)
-				} else {
-					AccessToken.getCurrentAccessToken().then((data: any) => {
-						const accessToken = data.accessToken.toString();
-						handleLoginClick(accessToken)
-					}).catch((err : any) => {
-						handleErrors && handleErrors(err.message)
-						handleLoading && handleLoading(false)
-					});
-				}
-			},
-			(error: any) => {
-				const err = error
-					? t(error?.replace(/ /g, '_').toUpperCase(), 'Login cancelled')
-					: t('LOGIN_FAIL_WITH_FACEBOOK', 'Login fail with facebook')
-				handleLoading && handleLoading(false)
-				handleErrors && handleErrors(err)
-			},
-		).catch((err : any) => {
-			handleErrors && handleErrors(err.message)
-			handleLoading && handleLoading(false)
-		});
-	};
-
-	const onPressButton = auth
-		? logoutWithFacebook
-		: loginWithFacebook;
-
-	return (
-		<Container>
-			<FacebookButton
-				onPress={onPressButton}
-			>
-				<Icon
-					name="facebook"
-					size={16}
-					color={theme.colors.skyBlue}
-					style={style.fbBtn}
-				/>
-				<Text style={style.textBtn}>
-					{buttonText}
-				</Text>
-			</FacebookButton>
-		</Container>
-	);
-}
-
-const style = StyleSheet.create({
-	fbBtn: {
-		position: 'absolute',
-		left: 0,
-		marginHorizontal: 16
-	},
-	textBtn: {
-		fontSize: 14,
-		color: '#000000'
-	}
-})
+import React from 'react';
+import { StyleSheet, Text } from 'react-native';
+import { AccessToken, LoginManager } from 'react-native-fbsdk-next';
+import { useLanguage, useSession, useApi } from 'ordering-components/native';
+import { useTheme } from 'styled-components/native';
+import Icon from 'react-native-vector-icons/FontAwesome5';
+
+import { Container, FacebookButton } from './styles';
+
+export const FacebookLogin = (props: any) => {
+	const {
+		handleErrors,
+		handleLoading,
+		handleSuccessFacebookLogin,
+		notificationState
+	} = props
+
+	const [, t] = useLanguage()
+	const [ordering] = useApi()
+	const [{ auth }] = useSession()
+
+	const theme = useTheme();
+
+	const buttonText = auth
+		? t('LOGOUT_WITH_FACEBOOK', 'Logout with Facebook')
+		: t('CONTINUE_WITH_FACEBOOK', 'Continue with Facebook');
+
+	const logoutWithFacebook = () => {
+		LoginManager && LoginManager.logOut();
+	};
+
+	const handleLoginClick = async (accessToken: string) => {
+		try {
+			const body: any = {
+				access_token: accessToken
+			  }
+			  if (notificationState?.notification_token) {
+				body.notification_token = notificationState.notification_token
+				body.notification_app = notificationState.notification_app
+			  }
+			const response = await ordering.users().authFacebook(body)
+			if (!response.content.error) {
+				if (handleSuccessFacebookLogin) {
+					handleSuccessFacebookLogin(response.content.result)
+					handleLoading && handleLoading(false)
+				}
+			} else {
+				handleLoading && handleLoading(false)
+				handleErrors && handleErrors(response.content.result)
+				logoutWithFacebook()
+			}
+		} catch (err: any) {
+			handleLoading && handleLoading(false)
+			handleErrors && handleErrors(err.message)
+		}
+	}
+
+	const loginWithFacebook = () => {
+		handleLoading && handleLoading(true)
+		LoginManager && LoginManager.logInWithPermissions(['public_profile', 'email']).then(
+			(login: any) => {
+				if (login.isCancelled) {
+					const err = t('LOGIN_WITH_FACEBOOK_CANCELLED', 'Login cancelled')
+					handleLoading && handleLoading(false)
+					handleErrors && handleErrors(err)
+				} else {
+					AccessToken.getCurrentAccessToken().then((data: any) => {
+						const accessToken = data.accessToken.toString();
+						handleLoginClick(accessToken)
+					}).catch((err : any) => {
+						handleErrors && handleErrors(err.message)
+						handleLoading && handleLoading(false)
+					});
+				}
+			},
+			(error: any) => {
+				const err = error
+					? t(error?.replace(/ /g, '_').toUpperCase(), 'Login cancelled')
+					: t('LOGIN_FAIL_WITH_FACEBOOK', 'Login fail with facebook')
+				handleLoading && handleLoading(false)
+				handleErrors && handleErrors(err)
+			},
+		).catch((err : any) => {
+			handleErrors && handleErrors(err.message)
+			handleLoading && handleLoading(false)
+		});
+	};
+
+	const onPressButton = auth
+		? logoutWithFacebook
+		: loginWithFacebook;
+
+	return (
+		<Container>
+			<FacebookButton
+				onPress={onPressButton}
+			>
+				<Icon
+					name="facebook"
+					size={16}
+					color={theme.colors.skyBlue}
+					style={style.fbBtn}
+				/>
+				<Text style={style.textBtn}>
+					{buttonText}
+				</Text>
+			</FacebookButton>
+		</Container>
+	);
+}
+
+const style = StyleSheet.create({
+	fbBtn: {
+		position: 'absolute',
+		left: 0,
+		marginHorizontal: 16
+	},
+	textBtn: {
+		fontSize: 14,
+		color: '#000000'
+	}
+})