Merge pull request #45 from ninjas-code-official/aliyan-checking-issues

Fixed Language change triggers app reload issue
This commit is contained in:
usama sattar 2024-02-14 13:23:37 +05:00 committed by GitHub
commit 8c0ae6b58b
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
22 changed files with 1619 additions and 902 deletions

View File

@ -6,7 +6,6 @@ import * as SplashScreen from "expo-splash-screen";
import React, { useEffect, useState } from "react";
import { Platform, StatusBar } from "react-native";
import FlashMessage from "react-native-flash-message";
import i18n from "./i18n";
import setupApolloClient from "./src/apollo/index";
import { AuthContext } from "./src/context/auth";
import { ConfigurationProvider } from "./src/context/configuration";
@ -56,7 +55,6 @@ export default function App() {
};
async function loadData() {
await i18n.initAsync();
await Font.loadAsync({
MuseoSans300: require("./assets/font/MuseoSans/MuseoSans300.ttf"),
MuseoSans500: require("./assets/font/MuseoSans/MuseoSans500.ttf"),

View File

@ -1,24 +0,0 @@
import * as Localization from 'expo-localization'
import AsyncStorage from "@react-native-async-storage/async-storage";
import { Platform } from 'react-native'
import i18n from 'i18n-js'
import { en } from './languages/en'
import { fr } from './languages/fr'
import { km } from './languages/km'
import { zh } from './languages/zh'
import { de } from './languages/de'
import { ar } from './languages/ar'
i18n.initAsync = async () => {
i18n.fallbacks = true
i18n.translations = { fr, en, km, zh, de, ar }
// i18n.locale = 'km'
if (Platform.OS === 'android') {
const lang = await AsyncStorage.getItem('enatega-language')
i18n.locale = lang || 'en'
} else {
i18n.locale = Localization.locale
}
}
export default i18n

43
RiderApp/i18next.js Normal file
View File

@ -0,0 +1,43 @@
import i18next from "i18next";
import { initReactI18next } from "react-i18next";
import { Platform } from "react-native";
import { en } from "./languages/en";
import { de } from "./languages/de";
import { fr } from "./languages/fr";
import { km } from "./languages/km";
import { zh } from "./languages/zh";
import { ar } from "./languages/ar";
import AsyncStorage from "@react-native-async-storage/async-storage";
export const languageResources = {
en: { translation: en },
zh: { translation: zh },
de: { translation: de },
fr: { translation: fr },
km: { translation: km },
ar: { translation: ar },
};
const i18n = i18next.createInstance();
// Configure i18next instance
i18n
.use(initReactI18next) // Ensure initReactI18next is used
.init({
compatibilityJSON: "v3",
lng: "en", // Default language
fallbackLng: "en",
resources: languageResources,
});
// Fetch stored language and set i18next instance accordingly
const getStoredLanguage = async () => {
const lng = await AsyncStorage.getItem("enatega-language");
i18n.changeLanguage(lng || "en"); // Change language
};
// Execute language initialization based on platform
if (Platform.OS === "android" || Platform.OS === "ios") {
getStoredLanguage();
}
export default i18n;

View File

@ -1,154 +1,154 @@
export const en = {
title0: 'Selected Language',
subtitle0: 'English',
title0: "Selected Language",
subtitle0: "English",
description0:
'Select any language of your choice to change the content of the app to your required language.',
title1: 'Tasty',
subtitle1: 'BreakFast',
"Select any language of your choice to change the content of the app to your required language.",
title1: "Tasty",
subtitle1: "BreakFast",
description1:
'Breakfast is everything. The beginning, the first thing. It is the mouthful that is the commitment to a new day, a continuing life.',
title2: 'Refreshing',
subtitle2: 'Drinks',
"Breakfast is everything. The beginning, the first thing. It is the mouthful that is the commitment to a new day, a continuing life.",
title2: "Refreshing",
subtitle2: "Drinks",
description2:
'True silence is the rest of the mind, and is to the spirit what sleep is to the body, nourishment and refreshment.',
title3: 'Delicous',
subtitle3: 'Icecream',
"True silence is the rest of the mind, and is to the spirit what sleep is to the body, nourishment and refreshment.",
title3: "Delicous",
subtitle3: "Icecream",
description3:
'Age does not diminish the extreme disappointment of having a scoop of ice cream fall from the cone',
getStarted: 'Get Started!',
welcome: 'Welcome',
loginBtn: 'Login',
registerBtn: 'Register',
name: 'Name',
phone: 'Phone',
email: 'Email',
emailphone: 'Email or Phone',
username: 'Username',
password: 'Password',
deliveryAddress: 'Delivery Address',
registerText: 'Or Register With',
forgotPassword: 'Forgot Password?',
loginText: 'Or Login With',
"Age does not diminish the extreme disappointment of having a scoop of ice cream fall from the cone",
getStarted: "Get Started!",
welcome: "Welcome",
loginBtn: "Login",
registerBtn: "Register",
name: "Name",
phone: "Phone",
email: "Email",
emailphone: "Email or Phone",
username: "Username",
password: "Password",
deliveryAddress: "Delivery Address",
registerText: "Or Register With",
forgotPassword: "Forgot Password?",
loginText: "Or Login With",
deliveryLocation:
'Turn on location so we could send you endless taste of delicious food.',
locationBtn: 'Turn on Location',
locationPermissionDenied: 'Permission to access location was denied',
cameraRollPermissionDenied: 'Permission to access Camera Roll was denied',
locationOff: 'Turn on location and try again',
titleLanguage: 'Change Language',
titleMenu: 'Menu',
titleOrders: 'My Orders',
NewOrders: 'New Orders',
titleNotifications: 'Notifications',
titleReviews: 'Reviews',
titleSettings: 'Settings',
titleHelp: 'Help',
titleLogout: 'Logout',
titleCart: 'My Cart',
titlePayment: 'Payment',
orderId: 'Order ID',
totalOrderAmount: 'Total Order Amount',
reOrder: 'Reorder',
unReadNotifications: 'No unread notifications',
upload: 'Upload',
saveBtn: 'Save',
emailUs: 'Email us at',
question1: 'Where do we find the food?',
question2: 'How do we contact?',
question3: 'How can I pay the delivery person?',
question4: 'Is the service available in my city?',
"Turn on location so we could send you endless taste of delicious food.",
locationBtn: "Turn on Location",
locationPermissionDenied: "Permission to access location was denied",
cameraRollPermissionDenied: "Permission to access Camera Roll was denied",
locationOff: "Turn on location and try again",
titleLanguage: "Change Language",
titleMenu: "Menu",
titleOrders: "My Orders",
NewOrders: "New Orders",
titleNotifications: "Notifications",
titleReviews: "Reviews",
titleSettings: "Settings",
titleHelp: "Help",
titleLogout: "Logout",
titleCart: "My Cart",
titlePayment: "Payment",
orderId: "Order ID",
totalOrderAmount: "Total Order Amount",
reOrder: "Reorder",
unReadNotifications: "No unread notifications",
upload: "Upload",
saveBtn: "Save",
emailUs: "Email us at",
question1: "Where do we find the food?",
question2: "How do we contact?",
question3: "How can I pay the delivery person?",
question4: "Is the service available in my city?",
answer1:
'You can find the food at your nearest store without paying anything to customer service.Our charges are extremely low as compared to others.',
answer2: 'You can contact us through our email, phone number or our website.',
"You can find the food at your nearest store without paying anything to customer service.Our charges are extremely low as compared to others.",
answer2: "You can contact us through our email, phone number or our website.",
answer3:
'You can pay the delivery person in person or pay online as well through credit or debit card.',
"You can pay the delivery person in person or pay online as well through credit or debit card.",
answer4:
'Currently this service is available in cities Islamabad and Karachi you can contact us to avail this service in your city.',
add: 'ADD',
quantity: 'Quantity',
size: 'Size',
addToCart: 'Add to Cart',
orderNow: 'Order Now',
addToCartMessage: 'Added to cart',
emptyCart: 'No items in cart',
itemTotal: 'Item Total',
delvieryCharges: 'Delivery Charges',
total: 'Total',
contactInfo: 'Contact Info',
deliveryAddressmessage: 'Set delivery address',
proceedCheckout: 'Proceed to Checkout',
paymentText: 'How do you wish to pay?',
checkout: 'Checkout',
header_title1: 'Credit Card/Debit Card',
header_subscript1: 'Pay with Credit or Debit Card',
header_title2: 'PayPal',
header_subscript2: 'Pay online with PayPal',
header_title3: 'Cash on delivery',
header_subscript3: 'Pay when you recieve the item',
thankYou: 'Thank You!',
orderConfirmed: 'Your Order is confirmed',
orderAmount: 'Your Order Amount',
orderDetail: 'Order Detail',
paymentMethod: 'Payment Method',
trackOrder: 'Track Order',
backToMenu: 'Back To Menu',
foodItem: 'Food item',
deliveredTo: 'Delivered to',
writeAReview: 'Write a Review',
orderReceived: 'Order Received',
cancelled: 'Cancelled',
foodPreparing: 'Food is being prepared',
Delivered: 'Delivered',
rateAndReview: 'Rate and Review',
reviewPlaceholder: 'More detailed reviews get more visibility...',
submit: 'Submit',
noWorriesText: 'No worries, let us help you out!',
yourEmail: 'Your Email',
send: 'Send',
apply: 'Apply',
checkEmail: 'Check your email for reset password link',
languageText: 'Please select your required language',
countryCodePickerTranslation: 'eng',
countryCodeSelect: 'Select Country Code',
paymentNotSupported: 'This payment method does not support this Currency',
Orders: 'Orders',
deliveryTime: 'Delivery Time',
myOrders: 'My Orders',
newOrders: 'New Orders',
titleChat: 'Chat',
NoNewOrder: 'No New Order',
Somethingisworng: 'Something is worng',
PENDING: 'PENDING',
ACCEPTED: 'ACCEPTED',
PICKED: 'PICKED',
DELIVERED: 'DELIVERED',
COMPLETED: 'COMPLETED',
YourOrderID: 'Your Order ID',
ProductPage: 'Product Page',
Docs: 'Docs',
Blog: 'Blog',
AboutUs: 'About Us',
Done: 'Done',
Cancel: 'Cancel',
Usernameisrequired: 'Username is required',
Passwordisrequired: 'Password is required',
Loggedin: 'Logged in',
EnteryourEmailandPassword: 'Enter your Email and Password',
EmailorPhone: 'Email or Phone',
Password: 'Password',
NoOrdersAssignedyet: 'No Orders Assigned yet',
Loadingorders: 'Loading orders',
Orderassginedtootherrider: 'Order assgined to other rider',
CustomerDetails: 'Customer Details',
Contact: 'Contact',
DelvieryLocation: 'Delviery Location',
OrderDetails: 'Order Details',
Subtotal: 'Subtotal',
Assigntome: 'Assign to me',
'About Us': 'About Us',
'Product Page': 'Product Page',
Order: 'Order',
OrderMarkedAs: 'Order marked as',
titleLogin: 'Login',
Picked: 'Picked'
}
"Currently this service is available in cities Islamabad and Karachi you can contact us to avail this service in your city.",
add: "ADD",
quantity: "Quantity",
size: "Size",
addToCart: "Add to Cart",
orderNow: "Order Now",
addToCartMessage: "Added to cart",
emptyCart: "No items in cart",
itemTotal: "Item Total",
delvieryCharges: "Delivery Charges",
total: "Total",
contactInfo: "Contact Info",
deliveryAddressmessage: "Set delivery address",
proceedCheckout: "Proceed to Checkout",
paymentText: "How do you wish to pay?",
checkout: "Checkout",
header_title1: "Credit Card/Debit Card",
header_subscript1: "Pay with Credit or Debit Card",
header_title2: "PayPal",
header_subscript2: "Pay online with PayPal",
header_title3: "Cash on delivery",
header_subscript3: "Pay when you recieve the item",
thankYou: "Thank You!",
orderConfirmed: "Your Order is confirmed",
orderAmount: "Your Order Amount",
orderDetail: "Order Detail",
paymentMethod: "Payment Method",
trackOrder: "Track Order",
backToMenu: "Back To Menu",
foodItem: "Food item",
deliveredTo: "Delivered to",
writeAReview: "Write a Review",
orderReceived: "Order Received",
cancelled: "Cancelled",
foodPreparing: "Food is being prepared",
Delivered: "Delivered",
rateAndReview: "Rate and Review",
reviewPlaceholder: "More detailed reviews get more visibility...",
submit: "Submit",
noWorriesText: "No worries, let us help you out!",
yourEmail: "Your Email",
send: "Send",
apply: "Apply",
checkEmail: "Check your email for reset password link",
languageText: "Please select your required language",
countryCodePickerTranslation: "eng",
countryCodeSelect: "Select Country Code",
paymentNotSupported: "This payment method does not support this Currency",
Orders: "Orders",
deliveryTime: "Delivery Time",
myOrders: "My Orders",
newOrders: "New Orders",
titleChat: "Chat",
NoNewOrder: "No New Order",
Somethingisworng: "Something is worng",
PENDING: "PENDING",
ACCEPTED: "ACCEPTED",
PICKED: "PICKED",
DELIVERED: "DELIVERED",
COMPLETED: "COMPLETED",
YourOrderID: "Your Order ID",
ProductPage: "Product Page",
Docs: "Docs",
Blog: "Blog",
AboutUs: "About Us",
Done: "Done",
Cancel: "Cancel",
Usernameisrequired: "Username is required",
Passwordisrequired: "Password is required",
Loggedin: "Logged in",
EnteryourEmailandPassword: "Enter your Email and Password",
EmailorPhone: "Email or Phone",
Password: "Password",
NoOrdersAssignedyet: "No Orders Assigned yet",
Loadingorders: "Loading orders",
Orderassginedtootherrider: "Order assgined to other rider",
CustomerDetails: "Customer Details",
Contact: "Contact",
DelvieryLocation: "Delivery Location",
OrderDetails: "Order Details",
Subtotal: "Subtotal",
Assigntome: "Assign to me",
"About Us": "About Us",
"Product Page": "Product Page",
Order: "Order",
OrderMarkedAs: "Order marked as",
titleLogin: "Login",
Picked: "Picked",
};

File diff suppressed because it is too large Load Diff

View File

@ -43,7 +43,6 @@
"expo": "^47.0.0",
"expo-constants": "~14.0.2",
"expo-font": "~11.0.1",
"expo-localization": "~14.0.0",
"expo-location": "~15.0.1",
"expo-modules-autolinking": "^1.5.1",
"expo-navigation-bar": "~2.0.1",
@ -54,10 +53,11 @@
"expo-updates": "~0.15.6",
"graphql": "^14.3.1",
"graphql-tag": "^2.10.1",
"i18n-js": "^3.3.0",
"i18next": "^23.8.2",
"patch-package": "^6.5.1",
"react": "18.1.0",
"react-apollo": "^2.5.8",
"react-i18next": "^14.0.5",
"react-native": "0.70.8",
"react-native-animatable": "^1.3.2",
"react-native-flash-message": "^0.1.13",

View File

@ -1,35 +1,36 @@
import React, { useContext } from 'react'
import { FlatList } from 'react-native'
import Spinner from '../Spinner/Spinner'
import Order from '../Order/Order'
import ConfigurationContext from '../../context/configuration'
import UserContext from '../../context/user'
import TextError from '../Text/TextError/TextError'
import { useNavigation } from '@react-navigation/native'
import { verticalScale } from '../../utilities/scaling'
import i18n from '../../../i18n'
import React, { useContext } from "react";
import { FlatList } from "react-native";
import Spinner from "../Spinner/Spinner";
import Order from "../Order/Order";
import ConfigurationContext from "../../context/configuration";
import UserContext from "../../context/user";
import TextError from "../Text/TextError/TextError";
import { useNavigation } from "@react-navigation/native";
import { verticalScale } from "../../utilities/scaling";
import { useTranslation } from "react-i18next";
export default function Orders() {
const navigation = useNavigation()
const configuration = useContext(ConfigurationContext)
const { t } = useTranslation();
const navigation = useNavigation();
const configuration = useContext(ConfigurationContext);
const {
loadingAssigned,
errorAssigned,
assignedOrders,
refetchAssigned,
networkStatusAssigned
} = useContext(UserContext)
networkStatusAssigned,
} = useContext(UserContext);
if (loadingAssigned) return <Spinner />
if (errorAssigned) return <TextError text={i18n.t('Somethingisworng')} />
if (loadingAssigned) return <Spinner />;
if (errorAssigned) return <TextError text={t("Somethingisworng")} />;
function emptyView() {
return <TextError text={i18n.t('NoOrdersAssignedyet')} />
return <TextError text={t("NoOrdersAssignedyet")} />;
}
return (
<FlatList
keyExtractor={item => item._id}
keyExtractor={(item) => item._id}
data={assignedOrders.length > 0 ? assignedOrders.slice().reverse() : []}
refreshing={networkStatusAssigned === 4}
onRefresh={() => refetchAssigned()}
@ -45,13 +46,13 @@ export default function Orders() {
orderDatetime={item.createdAt}
paymentMethod={item.payment_method}
onPress={() => {
navigation.navigate('OrderDetail', {
navigation.navigate("OrderDetail", {
id: item._id,
orderId: item.order_id
})
orderId: item.order_id,
});
}}
/>
)}
/>
)
);
}

View File

@ -7,9 +7,10 @@ import UserContext from '../../context/user'
import TextError from '../Text/TextError/TextError'
import { useNavigation } from '@react-navigation/native'
import { verticalScale } from '../../utilities/scaling'
import i18n from '../../../i18n'
import { useTranslation } from "react-i18next";
export default function Orders() {
const { t } = useTranslation();
const navigation = useNavigation()
const configuration = useContext(ConfigurationContext)
const {
@ -21,11 +22,11 @@ export default function Orders() {
} = useContext(UserContext)
function emptyView() {
return <TextError text={i18n.t('NoNewOrder')} />
return <TextError text={t('NoNewOrder')} />
}
if (loadingUnAssigned) return <Spinner />
if (errorUnAssigned) return <TextError text={i18n.t('Somethingisworng')} />
if (errorUnAssigned) return <TextError text={t('Somethingisworng')} />
return (
<FlatList

View File

@ -3,7 +3,7 @@ import { View, TouchableOpacity } from 'react-native'
import { scale } from '../../utilities/scaling'
import colors from '../../utilities/colors'
import styles from './style'
import i18n from '../../../i18n'
import { useTranslation } from "react-i18next";
import TextDefault from '../Text/TextDefault/TextDefault'
import { alignment } from '../../utilities/alignment'
import { AntDesign } from '@expo/vector-icons'
@ -36,7 +36,7 @@ function Order(props) {
// const cardHeight = props.height
// ? props.height
// : PixelRatio.getFontScale() * verticalScale(150)
const { t } = useTranslation();
const checkStatus = status => {
const obj = orderStatuses.filter(x => {
return x.key === status
@ -60,7 +60,7 @@ function Order(props) {
numberOfLines={2}
bold
textColor={colors.placeHolderColor}>
{i18n.t('YourOrderID')}
{t('YourOrderID')}
</TextDefault>
<TextDefault H4 bolder>
{props.orderId}
@ -77,7 +77,7 @@ function Order(props) {
bold
uppercase
style={{ ...alignment.PLxSmall, ...alignment.PRxSmall }}>
{i18n.t(props.orderStatus)}
{t(props.orderStatus)}
</TextDefault>
</View>
<View style={{ paddingLeft: '5%' }}>
@ -100,19 +100,19 @@ function Order(props) {
style={alignment.MTmedium}
textColor={colors.placeHolderColor}
bold>
{i18n.t('totalOrderAmount')}
{t('totalOrderAmount')}
</TextDefault>
<TextDefault
textColor={colors.placeHolderColor}
bold
style={{ ...alignment.MTxSmall }}>
{i18n.t('paymentMethod')}
{t('paymentMethod')}
</TextDefault>
<TextDefault
textColor={colors.placeHolderColor}
bold
style={{ ...alignment.MTxSmall }}>
{i18n.t('deliveryTime')}
{t('deliveryTime')}
</TextDefault>
</View>
<View>
@ -140,14 +140,14 @@ function Order(props) {
{/* <View style={[styles.card_container__left]}>
<View style={[styles.left_toptextLine]}>
<TextDefault center H5 bold textColor={colors.placeHolderColor}>
Your {i18n.t('orderId')}
Your {t('orderId')}
</TextDefault>
<TextDefault H3 bolder>
{props.orderId}
</TextDefault>
</View> */}
{/* <TextDefault style={alignment.MTmedium} textColor={colors.placeHolderColor} bold>
{i18n.t('totalOrderAmount')} - {props.orderAmount}
{t('totalOrderAmount')} - {props.orderAmount}
</TextDefault>
<TextDefault
textColor={colors.placeHolderColor}

View File

@ -1,23 +1,24 @@
import React from 'react'
import { View } from 'react-native'
import gql from 'graphql-tag'
import Spinner from '../../Spinner/Spinner'
import styles from './styles'
import { profile } from '../../../apollo/queries'
import { useQuery } from '@apollo/react-hooks'
import TextDefault from '../../Text/TextDefault/TextDefault'
import colors from '../../../utilities/colors'
import TextError from '../../Text/TextError/TextError'
import i18n from '../../../../i18n'
import React from "react";
import { View } from "react-native";
import gql from "graphql-tag";
import Spinner from "../../Spinner/Spinner";
import styles from "./styles";
import { profile } from "../../../apollo/queries";
import { useQuery } from "@apollo/react-hooks";
import TextDefault from "../../Text/TextDefault/TextDefault";
import colors from "../../../utilities/colors";
import TextError from "../../Text/TextError/TextError";
import { useTranslation } from "react-i18next";
const PROFILE = gql`
${profile}
`
`;
function Profile() {
const { data, loading, error } = useQuery(PROFILE)
if (loading) return <Spinner />
if (error) return <TextError text="Something is worng" />
const { t } = useTranslation();
const { data, loading, error } = useQuery(PROFILE);
if (loading) return <Spinner />;
if (error) return <TextError text="Something is worng" />;
return (
<View style={styles.container}>
<View style={styles.leftContainer}>
@ -31,14 +32,14 @@ function Profile() {
</View>
<View style={styles.rightContainer}>
<TextDefault H5 bold textColor={colors.fontSecondColor}>
{i18n.t('welcome')}
{t("welcome")}
</TextDefault>
<TextDefault H3 textColor={colors.fontSecondColor} bolder>
{data.rider.username}
</TextDefault>
</View>
</View>
)
);
}
export default Profile
export default Profile;

View File

@ -1,7 +1,7 @@
import PropTypes from 'prop-types'
import React, { useContext } from 'react'
import { Platform, View } from 'react-native'
import i18n from '../../../i18n'
import { useTranslation } from "react-i18next";
import { AuthContext } from '../../context/auth'
import { NAVIGATION_SCREEN } from '../../utilities/constant'
import NavItem from './NavItem/NavItem'
@ -40,6 +40,7 @@ const datas = [
]
function SidebBar({ navigation }) {
const { t } = useTranslation();
const { logout } = useContext(AuthContext)
// if (loading) return <Spinner />
@ -64,7 +65,7 @@ function SidebBar({ navigation }) {
}
}}
icon={data.icon}
title={i18n.t(data.title)}
title={t(data.title)}
/>
</View>
)
@ -78,7 +79,7 @@ function SidebBar({ navigation }) {
navigation.closeDrawer()
}}
icon={'sign-out'}
title={i18n.t('titleLogout')}
title={t('titleLogout')}
/>
</View>
</View>

View File

@ -1,91 +1,97 @@
import { Feather, FontAwesome } from '@expo/vector-icons'
import { useNavigation } from '@react-navigation/native'
import React, { useCallback, useEffect, useState, useLayoutEffect } from 'react'
import { Keyboard, View } from 'react-native'
import { Feather, FontAwesome } from "@expo/vector-icons";
import { useNavigation } from "@react-navigation/native";
import React, {
useCallback,
useEffect,
useState,
useLayoutEffect,
} from "react";
import { Keyboard, View } from "react-native";
import {
Bubble,
GiftedChat,
InputToolbar,
Send
} from 'react-native-gifted-chat'
import { MainWrapper, TextDefault } from '../../components'
import { alignment } from '../../utilities/alignment'
import colors from '../../utilities/colors'
import { scale } from '../../utilities/scaling'
import useStyle from './styles'
import i18n from '../../../i18n'
Send,
} from "react-native-gifted-chat";
import { MainWrapper, TextDefault } from "../../components";
import { alignment } from "../../utilities/alignment";
import colors from "../../utilities/colors";
import { scale } from "../../utilities/scaling";
import useStyle from "./styles";
import { useTranslation } from "react-i18next";
const UserInfo = {
_id: 1,
name: 'Jason',
active: true
}
name: "Jason",
active: true,
};
function Chat() {
const styles = useStyle()
const navigation = useNavigation()
const [messages, setMessages] = useState([])
const [isTyping, setIsTyping] = useState(false)
const { t } = useTranslation();
const styles = useStyle();
const navigation = useNavigation();
const [messages, setMessages] = useState([]);
const [isTyping, setIsTyping] = useState(false);
useEffect(() => {
Keyboard.addListener('keyboardDidShow', _keyboardDidShow)
Keyboard.addListener('keyboardDidHide', _keyboardDidHide)
Keyboard.addListener("keyboardDidShow", _keyboardDidShow);
Keyboard.addListener("keyboardDidHide", _keyboardDidHide);
// cleanup function
return () => {
Keyboard.removeListener('keyboardDidShow', _keyboardDidShow)
Keyboard.removeListener('keyboardDidHide', _keyboardDidHide)
}
}, [])
Keyboard.removeListener("keyboardDidShow", _keyboardDidShow);
Keyboard.removeListener("keyboardDidHide", _keyboardDidHide);
};
}, []);
const _keyboardDidShow = () => setIsTyping(true)
const _keyboardDidHide = () => setIsTyping(false)
const _keyboardDidShow = () => setIsTyping(true);
const _keyboardDidHide = () => setIsTyping(false);
useEffect(() => {
navigation.setOptions({
headerTitle: i18n.t('titleChat')
})
headerTitle: t("titleChat"),
});
setMessages([
{
_id: 1,
text: 'How can I help you?',
text: "How can I help you?",
sent: true,
received: true,
createdAt: new Date(),
user: {
_id: 2,
name: 'React Native',
avatar: 'https://placeimg.com/140/140/any'
}
}
])
}, [navigation])
name: "React Native",
avatar: "https://placeimg.com/140/140/any",
},
},
]);
}, [navigation]);
const onSend = useCallback((messages = []) => {
setMessages(previousMessages =>
setMessages((previousMessages) =>
GiftedChat.append(previousMessages, messages)
)
}, [])
);
}, []);
const renderBubble = props => {
const renderBubble = (props) => {
return (
<Bubble
{...props}
textStyle={{
right: {
color: colors.fontMainColor
color: colors.fontMainColor,
},
left: {
color: colors.fontMainColor
}
color: colors.fontMainColor,
},
}}
bottomContainerStyle={{
right: {
...alignment.PTxSmall
...alignment.PTxSmall,
},
left: {
...alignment.PTxSmall
}
...alignment.PTxSmall,
},
}}
wrapperStyle={{
right: {
@ -100,11 +106,11 @@ function Chat() {
shadowColor: colors.black,
shadowOffset: {
width: 0,
height: 1
height: 1,
},
shadowOpacity: 0.2,
shadowRadius: 2,
elevation: 3
elevation: 3,
},
left: {
minWidth: 150,
@ -118,36 +124,36 @@ function Chat() {
shadowColor: colors.black,
shadowOffset: {
width: 0,
height: 1
height: 1,
},
shadowOpacity: 0.2,
shadowRadius: 2,
elevation: 3
}
elevation: 3,
},
}}
/>
)
}
);
};
const renderSend = props => (
const renderSend = (props) => (
<Send {...props} containerStyle={styles.sendBtn}>
<View style={styles.rightBtn}>
<Feather
name={'send'}
name={"send"}
color={colors.buttonText}
size={scale(17)}
style={{
transform: [
{ rotateZ: '45deg' },
{ rotateZ: "45deg" },
{ translateY: 2 },
{ translateX: -1 }
]
{ translateX: -1 },
],
}}
/>
</View>
</Send>
)
const customtInputToolbar = props => {
);
const customtInputToolbar = (props) => {
return (
<InputToolbar
{...props}
@ -155,8 +161,8 @@ function Chat() {
renderSend={renderSend}
render
/>
)
}
);
};
return (
<MainWrapper>
@ -167,7 +173,7 @@ function Chat() {
color={UserInfo.active ? colors.iconPink : colors.fontSecondColor}
/>
<TextDefault medium H5 style={alignment.PLsmall}>
{UserInfo.active ? UserInfo.name : 'Offline'}
{UserInfo.active ? UserInfo.name : "Offline"}
</TextDefault>
</View>
<GiftedChat
@ -176,7 +182,7 @@ function Chat() {
user={UserInfo}
isTyping={isTyping}
messages={messages}
onSend={messages => onSend(messages)}
onSend={(messages) => onSend(messages)}
renderAvatar={() => null}
renderBubble={renderBubble}
renderInputToolbar={customtInputToolbar}
@ -193,20 +199,20 @@ function Chat() {
// }
timeTextStyle={{
left: {
width: '100%',
width: "100%",
color: colors.fontMainColor,
fontSize: 11,
textAlign: 'right'
textAlign: "right",
},
right: {
color: colors.fontMainColor,
fontSize: 11
}
fontSize: 11,
},
}}
/>
</View>
</MainWrapper>
)
);
}
export default Chat
export default Chat;

View File

@ -1,36 +1,39 @@
import { AntDesign } from '@expo/vector-icons'
import { useNavigation } from '@react-navigation/native'
import React, { useLayoutEffect } from 'react'
import { TouchableOpacity, View } from 'react-native'
import i18n from '../../../i18n'
import { MainWrapper, TextDefault } from '../../components'
import colors from '../../utilities/colors'
import { scale, verticalScale } from '../../utilities/scaling'
import styles from './styles'
import { AntDesign } from "@expo/vector-icons";
import { useNavigation } from "@react-navigation/native";
import React, { useLayoutEffect } from "react";
import { TouchableOpacity, View } from "react-native";
import { useTranslation } from "react-i18next";
import { MainWrapper, TextDefault } from "../../components";
import colors from "../../utilities/colors";
import { scale, verticalScale } from "../../utilities/scaling";
import styles from "./styles";
const links = [
{
title: 'Product Page',
url:
'https://enatega.com/enatega-single-vendor/'
title: "Product Page",
url: "https://enatega.com/enatega-single-vendor/",
},
{ title: 'Docs', url: 'https://enatega.com/docs/enatega-singlevendor-rider-app-introduction/' },
{
title: 'Blog',
title: "Docs",
url:
'https://enatega.com/blog/'
"https://enatega.com/docs/enatega-singlevendor-rider-app-introduction/",
},
{ title: 'About Us', url: 'https://ninjascode.com/our-team/' }
]
{
title: "Blog",
url: "https://enatega.com/blog/",
},
{ title: "About Us", url: "https://ninjascode.com/our-team/" },
];
function Help() {
const navigation = useNavigation()
const { t } = useTranslation();
const navigation = useNavigation();
useLayoutEffect(() => {
navigation.setOptions({
headerRight: null,
headerTitle: i18n.t('titleHelp')
})
}, [navigation])
headerTitle: t("titleHelp"),
});
}, [navigation]);
return (
<MainWrapper>
@ -38,17 +41,18 @@ function Help() {
{links.map(({ title, url }, index) => (
<TouchableOpacity
activeOpacity={0.8}
onPress={() => navigation.navigate('HelpBrowser', { title, url })}
onPress={() => navigation.navigate("HelpBrowser", { title, url })}
style={styles.itemContainer}
key={index}>
key={index}
>
<TextDefault textColor={colors.fontMainColor} H4>
{i18n.t(title)}
{t(title)}
</TextDefault>
<AntDesign name="arrowright" size={scale(20)} />
</TouchableOpacity>
))}
</MainWrapper>
)
);
}
export default Help
export default Help;

View File

@ -1,20 +1,21 @@
import { useNavigation, useRoute } from '@react-navigation/native'
import React, { useLayoutEffect } from 'react'
import { WebView } from 'react-native-webview'
import { MainWrapper, Spinner } from '../../components'
import i18n from '../../../i18n'
import { useNavigation, useRoute } from "@react-navigation/native";
import React, { useLayoutEffect } from "react";
import { WebView } from "react-native-webview";
import { MainWrapper, Spinner } from "../../components";
import { useTranslation } from "react-i18next";
function HelpBrowser() {
const navigation = useNavigation()
const route = useRoute()
const { title, url } = route.params
const { t } = useTranslation();
const navigation = useNavigation();
const route = useRoute();
const { title, url } = route.params;
useLayoutEffect(() => {
navigation.setOptions({
headerRight: null,
headerTitle: i18n.t(title)
})
}, [navigation])
headerTitle: t(title),
});
}, [navigation]);
return (
<MainWrapper>
@ -24,7 +25,7 @@ function HelpBrowser() {
renderLoading={() => <Spinner />}
/>
</MainWrapper>
)
);
}
export default HelpBrowser
export default HelpBrowser;

View File

@ -1,68 +1,72 @@
import AsyncStorage from '@react-native-async-storage/async-storage'
import { useNavigation } from '@react-navigation/native'
import * as Localization from 'expo-localization'
import * as Updates from 'expo-updates'
import React, { useEffect, useLayoutEffect, useState } from 'react'
import { Platform, TouchableOpacity, View } from 'react-native'
import i18n from '../../../i18n'
import { MainWrapper } from '../../components'
import RadioButton from '../../components/FdRadioBtn/RadioBtn'
import TextDefault from '../../components/Text/TextDefault/TextDefault'
import { alignment } from '../../utilities/alignment'
import colors from '../../utilities/colors'
import { scale } from '../../utilities/scaling'
import styles from './styles'
import AsyncStorage from "@react-native-async-storage/async-storage";
import { useNavigation } from "@react-navigation/native";
import React, { useEffect, useLayoutEffect, useState } from "react";
import { TouchableOpacity, View, ActivityIndicator } from "react-native";
import i18n from "../../../i18next";
import { useTranslation } from "react-i18next";
import { MainWrapper } from "../../components";
import RadioButton from "../../components/FdRadioBtn/RadioBtn";
import TextDefault from "../../components/Text/TextDefault/TextDefault";
import { alignment } from "../../utilities/alignment";
import colors from "../../utilities/colors";
import { scale } from "../../utilities/scaling";
import styles from "./styles";
const languageTypes = [
{ value: 'English', code: 'en', index: 0 },
{ value: 'français', code: 'fr', index: 1 },
{ value: 'ភាសាខ្មែរ', code: 'km', index: 2 },
{ value: '中文', code: 'zh', index: 3 },
{ value: 'Deutsche', code: 'de', index: 4 },
{ value: 'Arabic', code: 'ar', index: 5 }
]
{ value: "English", code: "en", index: 0 },
{ value: "français", code: "fr", index: 1 },
{ value: "ភាសាខ្មែរ", code: "km", index: 2 },
{ value: "中文", code: "zh", index: 3 },
{ value: "Deutsche", code: "de", index: 4 },
{ value: "Arabic", code: "ar", index: 5 },
];
function Language() {
const navigation = useNavigation()
const [activeRadio, setActiveRadio] = useState(languageTypes[0].index)
// eslint-disable-next-line no-unused-vars
const [languageName, languageNameSetter] = useState('English')
const { t } = useTranslation();
const navigation = useNavigation();
const [activeRadio, setActiveRadio] = useState(languageTypes[0].index);
const [languageName, languageNameSetter] = useState("English");
const [loadinglang, setLoadingLang] = useState(false);
useLayoutEffect(() => {
navigation.setOptions({
title: i18n.t('titleLanguage')
})
}, [navigation])
title: t("titleLanguage"),
});
}, [t, navigation]);
useEffect(() => {
selectedLanguageFunc()
}, [])
selectedLanguageFunc();
}, []);
async function selectedLanguageFunc() {
const lang = await AsyncStorage.getItem('enatega-language')
const lang = await AsyncStorage.getItem("enatega-language");
if (lang) {
const defLang = languageTypes.findIndex(el => el.code === lang)
const langName = languageTypes[defLang].value
setActiveRadio(defLang)
languageNameSetter(langName)
const defLang = languageTypes.findIndex((el) => el.code === lang);
const langName = languageTypes[defLang].value;
setActiveRadio(defLang);
languageNameSetter(langName);
}
}
async function onSelectedLanguage() {
const languageInd = activeRadio
if (Platform.OS === 'android') {
const localization = await Localization.getLocalizationAsync()
localization.locale = languageTypes[languageInd].code
try {
setLoadingLang(true);
const languageInd = activeRadio;
await AsyncStorage.setItem(
'enatega-language',
"enatega-language",
languageTypes[languageInd].code
)
try {
Updates.reloadAsync()
} catch (error) {
console.log('err', error)
);
var lang = await AsyncStorage.getItem("enatega-language");
if (lang) {
const defLang = languageTypes.findIndex((el) => el.code === lang);
const langName = languageTypes[defLang].value;
languageNameSetter(langName);
}
i18n.changeLanguage(lang);
} catch (error) {
console.error("Error during language selection:", error);
} finally {
setLoadingLang(false);
}
}
@ -75,7 +79,8 @@ function Language() {
activeOpacity={0.7}
key={index}
onPress={() => setActiveRadio(item.index)}
style={[styles.radioContainer]}>
style={[styles.radioContainer]}
>
<TextDefault
numberOfLines={1}
textColor={
@ -85,11 +90,12 @@ function Language() {
}
bold
H5
style={alignment.MLsmall}>
style={alignment.MLsmall}
>
{item.value}
</TextDefault>
<RadioButton
animation={'bounceIn'}
animation={"bounceIn"}
size={13}
outerColor={colors.tagColor}
innerColor={colors.radioColor}
@ -106,35 +112,42 @@ function Language() {
onPress={() => onSelectedLanguage()}
style={{
backgroundColor: colors.tagColor,
width: '72%',
width: "72%",
borderRadius: scale(10),
alignSelf: 'center',
alignItems: 'center',
alignSelf: "center",
alignItems: "center",
height: scale(40),
justifyContent: 'center'
}}>
justifyContent: "center",
}}
>
<TextDefault H5 bold textColor={colors.fontSecondColor}>
{i18n.t('Done')}
{t("Done")}
</TextDefault>
</TouchableOpacity>
<TouchableOpacity
activeOpacity={0.8}
onPress={() => navigation.goBack()}
style={{
width: '72%',
alignSelf: 'center',
alignItems: 'center',
width: "72%",
alignSelf: "center",
alignItems: "center",
height: scale(40),
justifyContent: 'center'
}}>
justifyContent: "center",
}}
>
<TextDefault H5 bold textColor={colors.fontMainColor}>
{i18n.t('Cancel')}
{t("Cancel")}
</TextDefault>
</TouchableOpacity>
</View>
{loadinglang && (
<View style={styles.loadingContainer}>
<ActivityIndicator size="large" />
</View>
)}
</View>
</MainWrapper>
)
);
}
export default Language
export default Language;

View File

@ -0,0 +1,16 @@
// LanguageContext.js
import React, { createContext, useState, useContext } from 'react';
const LanguageContext = createContext();
export const LanguageProvider = ({ children }) => {
const [selectedLanguage, setSelectedLanguage] = useState("en");
return (
<LanguageContext.Provider value={{ selectedLanguage, setSelectedLanguage }}>
{children}
</LanguageContext.Provider>
);
};
export const useLanguage = () => useContext(LanguageContext);

View File

@ -1,114 +1,117 @@
import { useMutation } from '@apollo/react-hooks'
import AsyncStorage from '@react-native-async-storage/async-storage'
import { useNavigation } from '@react-navigation/native'
import Constants from 'expo-constants'
import * as Notifications from 'expo-notifications'
import gql from 'graphql-tag'
import React, { useContext, useEffect, useState,useLayoutEffect } from 'react'
import { useMutation } from "@apollo/react-hooks";
import AsyncStorage from "@react-native-async-storage/async-storage";
import { useNavigation } from "@react-navigation/native";
import Constants from "expo-constants";
import * as Notifications from "expo-notifications";
import gql from "graphql-tag";
import React, { useContext, useEffect, useState, useLayoutEffect } from "react";
import {
KeyboardAvoidingView,
Platform,
ScrollView,
TouchableOpacity,
View
} from 'react-native'
import { FilledTextField } from 'react-native-material-textfield'
import Logo from '../../../assets/images/Svg/Logo'
import i18n from '../../../i18n'
import { riderLogin } from '../../apollo/mutations'
import { Spinner, TextDefault, WrapperView } from '../../components'
import { FlashMessage } from '../../components/FlashMessage/FlashMessage'
import { AuthContext } from '../../context/auth'
import { alignment } from '../../utilities/alignment'
import colors from '../../utilities/colors'
import { scale } from '../../utilities/scaling'
import useStyle from './styles'
View,
} from "react-native";
import { FilledTextField } from "react-native-material-textfield";
import Logo from "../../../assets/images/Svg/Logo";
import { useTranslation } from "react-i18next";
import { riderLogin } from "../../apollo/mutations";
import { Spinner, TextDefault, WrapperView } from "../../components";
import { FlashMessage } from "../../components/FlashMessage/FlashMessage";
import { AuthContext } from "../../context/auth";
import { alignment } from "../../utilities/alignment";
import colors from "../../utilities/colors";
import { scale } from "../../utilities/scaling";
import useStyle from "./styles";
const RIDER_LOGIN = gql`
${riderLogin}
`
`;
export default function Login() {
const styles = useStyle()
const navigation = useNavigation()
const [username, setUsername] = useState('rider')
const [password, setPassword] = useState('123123')
const [usernameError, setUsernameError] = useState('')
const [passwordError, setPasswordError] = useState('')
const { t } = useTranslation();
const styles = useStyle();
const navigation = useNavigation();
const [username, setUsername] = useState("rider");
const [password, setPassword] = useState("123123");
const [usernameError, setUsernameError] = useState("");
const [passwordError, setPasswordError] = useState("");
const { setTokenAsync } = useContext(AuthContext)
const { setTokenAsync } = useContext(AuthContext);
useLayoutEffect(() => {
useLayoutEffect(() => {
navigation.setOptions({
headerRight: null,
headerTitle: i18n.t('titleHelp')
})
}, [navigation])
headerTitle: t("titleHelp"),
});
}, [navigation]);
const [mutate, { loading }] = useMutation(RIDER_LOGIN, {
onCompleted,
onError
})
onError,
});
function validateForm() {
let res = true
setUsernameError('')
setPasswordError('')
let res = true;
setUsernameError("");
setPasswordError("");
if (!username) {
setUsernameError(i18n.t('Usernameisrequired'))
res = false
setUsernameError(t("Usernameisrequired"));
res = false;
}
if (!password) {
setPasswordError(i18n.t('Passwordisrequired'))
res = false
setPasswordError(t("Passwordisrequired"));
res = false;
}
return res
return res;
}
async function onCompleted(data) {
FlashMessage({
message: i18n.t('Loggedin')
})
await AsyncStorage.setItem('rider-id', data.riderLogin.userId)
setTokenAsync(data.riderLogin.token)
message: t("Loggedin"),
});
await AsyncStorage.setItem("rider-id", data.riderLogin.userId);
setTokenAsync(data.riderLogin.token);
}
function onError({ networkError, graphQLErrors }) {
console.log('errors', networkError, graphQLErrors)
let message = ''
console.log("errors", networkError, graphQLErrors);
let message = "";
if (!!graphQLErrors && graphQLErrors.length) {
message = graphQLErrors[0].message
message = graphQLErrors[0].message;
}
if (!!networkError) {
message = networkError.result.errors[0].message
message = networkError.result.errors[0].message;
}
FlashMessage({
message: message
})
message: message,
});
}
return (
<WrapperView>
<KeyboardAvoidingView
behavior={Platform.OS === 'ios' ? 'padding' : 'height'}
style={styles.flex}>
behavior={Platform.OS === "ios" ? "padding" : "height"}
style={styles.flex}
>
<ScrollView
style={styles.flex}
contentContainerStyle={styles.scrollContent}>
contentContainerStyle={styles.scrollContent}
>
<View style={[styles.flex, styles.container]}>
<Logo width={scale(130)} height={scale(130)} />
<View style={styles.width100}>
<TextDefault
style={alignment.MBmedium}
textColor={colors.placeHolderColor}>
{i18n.t('EnteryourEmailandPassword')}
textColor={colors.placeHolderColor}
>
{t("EnteryourEmailandPassword")}
</TextDefault>
<FilledTextField
defaultValue={'rider'}
defaultValue={"rider"}
error={usernameError}
keyboardType={'email-address'}
label={i18n.t('EmailorPhone')}
keyboardType={"email-address"}
label={t("EmailorPhone")}
labelFontSize={scale(12)}
fontSize={scale(12)}
activeLineWidth={0}
@ -120,15 +123,15 @@ export default function Login() {
tintColor={colors.tagColor}
labelTextStyle={styles.labelStyle}
inputContainerStyle={styles.textContainer}
onChangeText={text => {
setUsername(text.toLowerCase().trim())
onChangeText={(text) => {
setUsername(text.toLowerCase().trim());
}}
/>
<View style={styles.mt15} />
<FilledTextField
defaultValue={'123123'}
defaultValue={"123123"}
error={passwordError}
label={i18n.t('Password')}
label={t("Password")}
secureTextEntry
labelFontSize={scale(12)}
fontSize={scale(12)}
@ -141,8 +144,8 @@ export default function Login() {
tintColor={colors.tagColor}
labelTextStyle={styles.labelStyle}
inputContainerStyle={styles.textContainer}
onChangeText={text => {
setPassword(text.trim())
onChangeText={(text) => {
setPassword(text.trim());
}}
/>
<View style={[styles.lower_form]}>
@ -151,30 +154,31 @@ export default function Login() {
<TouchableOpacity
onPress={async () => {
if (validateForm()) {
let notificationToken = null
let notificationToken = null;
if (Constants.isDevice) {
const {
status: existingStatus
} = await Notifications.getPermissionsAsync()
if (existingStatus === 'granted') {
status: existingStatus,
} = await Notifications.getPermissionsAsync();
if (existingStatus === "granted") {
notificationToken = (
await Notifications.getExpoPushTokenAsync()
).data
).data;
}
}
mutate({
variables: {
username: username.toLowerCase(),
password: password,
notificationToken
}
})
notificationToken,
},
});
}
}}
activeOpacity={0.5}
style={[styles.RContainer]}>
style={[styles.RContainer]}
>
<TextDefault textColor={colors.fontMainColor} H5 bold>
{i18n.t('loginBtn')}
{t("loginBtn")}
</TextDefault>
</TouchableOpacity>
)}
@ -184,5 +188,5 @@ export default function Login() {
</ScrollView>
</KeyboardAvoidingView>
</WrapperView>
)
);
}

View File

@ -6,9 +6,10 @@ import UserContext from '../../context/user'
import styles from './style'
import { TextError, Spinner } from '../../components'
import { useNavigation } from '@react-navigation/native'
import i18n from '../../../i18n'
import { useTranslation } from "react-i18next";
export default function Orders() {
const { t } = useTranslation();
const navigation = useNavigation()
const configuration = useContext(ConfigurationContext)
const {
@ -20,11 +21,11 @@ export default function Orders() {
} = useContext(UserContext)
function emptyView() {
return <TextError text={i18n.t('NoNewOrder')} />
return <TextError text={t('NoNewOrder')} />
}
if (loadingUnAssigned) return <Spinner />
if (errorUnAssigned) return <TextError text={i18n.t('Somethingisworng')} />
if (errorUnAssigned) return <TextError text={t('Somethingisworng')} />
return (
<View style={styles.flex}>

View File

@ -20,7 +20,7 @@ import colors from "../../utilities/colors";
import { linkToMapsApp } from "../../utilities/links";
import { scale } from "../../utilities/scaling";
import styles from "./styles";
import i18n from "../../../i18n";
import { useTranslation } from "react-i18next";
const CONFIGURATION = gql`
${configuration}
@ -38,6 +38,7 @@ const LATITUDE_DELTA = 0.0022;
const LONGITUDE_DELTA = 0.0021;
function OrderDetail() {
const { t } = useTranslation();
const navigation = useNavigation();
const route = useRoute();
const {
@ -71,13 +72,15 @@ function OrderDetail() {
useLayoutEffect(() => {
if (!selectedOrder) return;
navigation.setOptions({
title: `${i18n.t('Order')} ${selectedOrder.order_id}`,
title: `${t("Order")} ${selectedOrder.order_id}`,
});
}, [selectedOrder]);
async function onCompleted({ updateOrderStatusRider, assignOrder }) {
if (updateOrderStatusRider) {
FlashMessage({
message: `${i18n.t('OrderMarkedAs')} ${i18n.t(updateOrderStatusRider.order_status)}`,
message: `${t("OrderMarkedAs")} ${t(
updateOrderStatusRider.order_status
)}`,
});
if (updateOrderStatusRider.order_status === "DELIVERED") {
navigation.goBack();
@ -173,18 +176,16 @@ function OrderDetail() {
}
if (loadingAssigned || loadingUnAssigned) {
return <TextError text={i18n.t('Loadingorders')} />;
return <TextError text={t("Loadingorders")} />;
}
if (loadingConfig) {
return <Spinner />;
}
if (errorConfig) {
return <TextError text={i18n.t('Somethingisworng')} />;
return <TextError text={t("Somethingisworng")} />;
}
if (!selectedOrder) {
return (
<TextError text={i18n.t('Orderassginedtootherrider')} />
);
return <TextError text={t("Orderassginedtootherrider")} />;
}
return (
@ -203,7 +204,7 @@ function OrderDetail() {
textColor={colors.tagColor}
style={{ ...alignment.PTxSmall, ...alignment.PBxSmall }}
>
{i18n.t('CustomerDetails')}
{t("CustomerDetails")}
</TextDefault>
</View>
<View style={styles.customerContent}>
@ -215,7 +216,7 @@ function OrderDetail() {
textColor={colors.placeHolderColor}
style={{ ...alignment.PTxSmall, ...alignment.PBxSmall }}
>
{i18n.t('name')}
{t("name")}
</TextDefault>
<TextDefault bolder style={{ ...alignment.PBxSmall }}>
{selectedOrder.user.name}
@ -229,7 +230,7 @@ function OrderDetail() {
textColor={colors.placeHolderColor}
style={{ ...alignment.PTxSmall, ...alignment.PBxSmall }}
>
{i18n.t('Contact')}
{t("Contact")}
</TextDefault>
<TextDefault bolder style={{ ...alignment.PBxSmall }}>
{selectedOrder.user.phone}
@ -243,7 +244,7 @@ function OrderDetail() {
textColor={colors.placeHolderColor}
style={{ ...alignment.PTxSmall, ...alignment.PBxSmall }}
>
{i18n.t('DelvieryLocation')}
{t("DelvieryLocation")}
</TextDefault>
<TextDefault
numberOfLines={2}
@ -267,7 +268,7 @@ function OrderDetail() {
textColor={colors.tagColor}
style={{ ...alignment.PTmedium }}
>
{i18n.t('OrderDetails')}
{t("OrderDetails")}
</TextDefault>
</View>
<View style={styles.orderSpacer} />
@ -285,7 +286,7 @@ function OrderDetail() {
bolder
style={{ ...alignment.PTmedium, ...alignment.PLmedium }}
>
{i18n.t('Subtotal')}
{t("Subtotal")}
</TextDefault>
</View>
<View style={styles.orderTextRight}>
@ -312,7 +313,7 @@ function OrderDetail() {
bolder
style={{ ...alignment.PLmedium }}
>
{i18n.t('delvieryCharges')}
{t("delvieryCharges")}
</TextDefault>
</View>
<View style={styles.orderTextRight}>
@ -332,7 +333,7 @@ function OrderDetail() {
<View style={styles.orderSubRow}>
<View style={styles.orderTextLeft}>
<TextDefault H4 bolder>
{i18n.t('total')}
{t("total")}
</TextDefault>
</View>
<View style={styles.orderTextRight}>
@ -424,7 +425,7 @@ function OrderDetail() {
bold
style={{ ...alignment.PTxSmall, ...alignment.PBxSmall }}
>
{i18n.t('Assigntome')}
{t("Assigntome")}
</TextDefault>
)}
</TouchableOpacity>
@ -450,7 +451,7 @@ function OrderDetail() {
bold
style={{ ...alignment.PTxSmall, ...alignment.PBxSmall }}
>
{i18n.t('Picked')}
{t("Picked")}
</TextDefault>
</TouchableOpacity>
)}
@ -469,7 +470,7 @@ function OrderDetail() {
bold
style={{ ...alignment.PTxSmall, ...alignment.PBxSmall }}
>
{i18n.t('Delivered')}
{t("Delivered")}
</TextDefault>
</TouchableOpacity>
)}

View File

@ -1,197 +1,198 @@
import { Dimensions, StyleSheet } from 'react-native'
import { alignment } from '../../utilities/alignment'
import colors from '../../utilities/colors'
import { scale, verticalScale } from '../../utilities/scaling'
const { height } = Dimensions.get('window')
import { Dimensions, StyleSheet } from "react-native";
import { alignment } from "../../utilities/alignment";
import colors from "../../utilities/colors";
import { scale, verticalScale } from "../../utilities/scaling";
const { height } = Dimensions.get("window");
export default {
flex: {
flex: 1,
backgroundColor: colors.themeBackground
backgroundColor: colors.themeBackground,
},
line: {
width: '80%',
width: "80%",
height: StyleSheet.hairlineWidth,
backgroundColor: colors.horizontalLine,
alignSelf: 'center',
alignSelf: "center",
...alignment.MTmedium,
...alignment.MBmedium
...alignment.MBmedium,
},
customerCard: {
width: '100%',
width: "100%",
height: height * 0.4,
justifyContent: 'center',
alignItems: 'center'
justifyContent: "center",
alignItems: "center",
},
customerSubCard: {
width: '85%',
height: '90%',
width: "85%",
height: "90%",
borderWidth: 2,
borderStyle: 'dashed',
backgroundColor: '#F3FAFE',
borderStyle: "dashed",
backgroundColor: "#F3FAFE",
borderRadius: scale(10),
borderColor: colors.horizontalLine
borderColor: colors.horizontalLine,
},
customerHeader: {
width: '100%',
height: '30%',
justifyContent: 'center',
alignItems: 'center'
width: "100%",
height: "30%",
justifyContent: "center",
alignItems: "center",
},
customerContent: {
flex: 1,
justifyContent: 'flex-start'
justifyContent: "flex-start",
},
customerSubContent: {
width: '80%',
height: '95%',
justifyContent: 'space-around'
width: "80%",
height: "95%",
justifyContent: "space-around",
},
customerContentRow: {
width: '100%',
height: '50%',
flexDirection: 'row',
paddingLeft: '8%'
width: "100%",
height: "50%",
flexDirection: "row",
paddingLeft: "8%",
},
customerImgContainer: {
width: '20%',
height: '100%',
justifyContent: 'center',
alignItems: 'center'
width: "20%",
height: "100%",
justifyContent: "center",
alignItems: "center",
},
customerTextContainer: {
flex: 1,
justifyContent: 'center'
justifyContent: "center",
},
customerAddContainer: {
justifyContent: 'center',
width: '90%'
flex: 1,
justifyContent: "center",
width: "90%",
},
orderContainer: {
width: '100%',
width: "100%",
flexGrow: 1,
justifyContent: 'center',
alignItems: 'center',
justifyContent: "center",
alignItems: "center",
...alignment.PTxSmall,
...alignment.PBxSmall
...alignment.PBxSmall,
},
orderSubContainer: {
width: '85%',
width: "85%",
minHeight: height * 0.3,
borderWidth: 2,
borderStyle: 'dashed',
borderStyle: "dashed",
borderRadius: scale(20),
backgroundColor: '#F3FAFE',
borderColor: colors.horizontalLine
backgroundColor: "#F3FAFE",
borderColor: colors.horizontalLine,
},
orderHeader: {
width: '100%',
width: "100%",
height: height * 0.08,
justifyContent: 'center',
alignItems: 'center'
justifyContent: "center",
alignItems: "center",
},
orderContent: {
width: '100%',
alignItems: 'center'
width: "100%",
alignItems: "center",
},
orderSubContent: {
width: '90%',
flexDirection: 'row'
width: "90%",
flexDirection: "row",
},
orderTextLeftContainer: {
width: '10%',
justifyContent: 'center',
alignItems: 'center'
width: "10%",
justifyContent: "center",
alignItems: "center",
},
orderTextCenterContainer: {
width: '65%',
justifyContent: 'center',
alignItems: 'flex-start'
width: "65%",
justifyContent: "center",
alignItems: "flex-start",
},
orderTextRightContainer: {
width: '25%',
justifyContent: 'center',
alignItems: 'flex-end'
width: "25%",
justifyContent: "center",
alignItems: "flex-end",
},
orderSpacer: {
width: '100%',
height: height * 0.02
width: "100%",
height: height * 0.02,
},
orderRow: {
width: '100%',
width: "100%",
height: height * 0.05,
alignItems: 'center'
alignItems: "center",
},
orderRow2: {
width: '100%',
width: "100%",
height: height * 0.07,
alignItems: 'center',
...alignment.PBlarge
alignItems: "center",
...alignment.PBlarge,
},
orderSubRow: {
width: '90%',
height: '100%',
flexDirection: 'row'
width: "90%",
height: "100%",
flexDirection: "row",
},
orderTextLeft: {
width: '50%',
height: '100%',
paddingLeft: '5%',
justifyContent: 'center',
alignItems: 'flex-start'
width: "50%",
height: "100%",
paddingLeft: "5%",
justifyContent: "center",
alignItems: "flex-start",
},
orderTextRight: {
width: '50%',
height: '100%',
alignItems: 'flex-end',
justifyContent: 'center'
width: "50%",
height: "100%",
alignItems: "flex-end",
justifyContent: "center",
},
actionContainer: {
width: '100%',
width: "100%",
height: height * 0.1,
justifyContent: 'center',
alignItems: 'center',
justifyContent: "center",
alignItems: "center",
...alignment.MTmedium,
...alignment.MBlarge
...alignment.MBlarge,
},
actionSubContainer: {
width: '90%',
height: '80%',
flexDirection: 'row',
justifyContent: 'space-around',
alignItems: 'center',
width: "90%",
height: "80%",
flexDirection: "row",
justifyContent: "space-around",
alignItems: "center",
borderRadius: scale(10),
...alignment.MBlarge
...alignment.MBlarge,
},
cancelBtnStyle: {
width: '80%',
height: '70%',
justifyContent: 'center',
alignItems: 'center',
borderRadius: scale(10)
width: "80%",
height: "70%",
justifyContent: "center",
alignItems: "center",
borderRadius: scale(10),
},
acceptBtnStyle: {
backgroundColor: colors.tagColor,
width: '80%',
height: '70%',
justifyContent: 'center',
alignItems: 'center',
borderRadius: scale(10)
width: "80%",
height: "70%",
justifyContent: "center",
alignItems: "center",
borderRadius: scale(10),
},
removeBtnStyle: {
backgroundColor: colors.tagColor,
width: '45%',
height: '70%',
justifyContent: 'center',
alignItems: 'center'
width: "45%",
height: "70%",
justifyContent: "center",
alignItems: "center",
},
baseSpacer: {
marginTop: verticalScale(15)
marginTop: verticalScale(15),
},
mapContainer: {
width: '85%',
alignSelf: 'center',
height: verticalScale(200)
}
}
width: "85%",
alignSelf: "center",
height: verticalScale(200),
},
};

View File

@ -1,33 +1,34 @@
import React, { useEffect, useState, useLayoutEffect } from 'react'
import { useNavigation } from '@react-navigation/native'
import React, { useEffect, useState, useLayoutEffect } from "react";
import { useNavigation } from "@react-navigation/native";
import {
ImageBackground,
StatusBar,
TouchableOpacity,
View
} from 'react-native'
import i18n from '../../../i18n'
import { AssignedOrders, NewOrders, TextDefault } from '../../components'
import colors from '../../utilities/colors'
import useStyle from './style'
View,
} from "react-native";
import { useTranslation } from "react-i18next";
import { AssignedOrders, NewOrders, TextDefault } from "../../components";
import colors from "../../utilities/colors";
import useStyle from "./style";
const BACKGROUND_IMAGE = require('../../../assets/images/ui/BG.png')
const BACKGROUND_IMAGE = require("../../../assets/images/ui/BG.png");
export default function Orders() {
const styles = useStyle()
const [isNewOrderSelected, setIsNewOrderSelected] = useState(false)
const navigation = useNavigation()
const { t } = useTranslation();
const styles = useStyle();
const [isNewOrderSelected, setIsNewOrderSelected] = useState(false);
const navigation = useNavigation();
useEffect(() => {
StatusBar.setBarStyle('light-content')
}, [isNewOrderSelected])
StatusBar.setBarStyle("light-content");
}, [isNewOrderSelected]);
useLayoutEffect(() => {
navigation.setOptions({
headerRight: null,
headerTitle: i18n.t('Orders')
})
}, [navigation])
headerTitle: t("Orders"),
});
}, [t, navigation]);
return (
<View style={[styles.flex, styles.bottom]}>
@ -41,11 +42,12 @@ export default function Orders() {
{
backgroundColor: !isNewOrderSelected
? colors.buttonBackgroundPink
: 'transparent'
}
]}>
: "transparent",
},
]}
>
<TextDefault bold H5 numberOfLines={1}>
{i18n.t('myOrders')}
{t("myOrders")}
</TextDefault>
</TouchableOpacity>
<TouchableOpacity
@ -56,16 +58,17 @@ export default function Orders() {
{
backgroundColor: isNewOrderSelected
? colors.buttonBackgroundPink
: 'transparent'
}
]}>
: "transparent",
},
]}
>
<TextDefault bold H5 numberOfLines={1}>
{i18n.t('newOrders')}
{t("newOrders")}
</TextDefault>
</TouchableOpacity>
</View>
</ImageBackground>
{!isNewOrderSelected ? <AssignedOrders /> : <NewOrders />}
</View>
)
);
}

View File

@ -1,135 +1,135 @@
import { scale } from './scaling'
import { scale } from "./scaling";
const XSMALL = 5
const SMALL = 10
const MEDIUM = 15
const LARGE = 20
const XSMALL = 5;
const SMALL = 10;
const MEDIUM = 15;
const LARGE = 20;
export const alignment = {
MxSmall: {
margin: scale(XSMALL)
margin: scale(XSMALL),
},
MBxSmall: {
marginBottom: scale(XSMALL)
marginBottom: scale(XSMALL),
},
MTxSmall: {
marginTop: scale(XSMALL)
marginTop: scale(XSMALL),
},
MRxSmall: {
marginRight: scale(XSMALL)
marginRight: scale(XSMALL),
},
MLxSmall: {
marginLeft: scale(XSMALL)
marginLeft: scale(XSMALL),
},
Msmall: {
margin: scale(SMALL)
margin: scale(SMALL),
},
MBsmall: {
marginBottom: scale(SMALL)
marginBottom: scale(SMALL),
},
MTsmall: {
marginTop: scale(SMALL)
marginTop: scale(SMALL),
},
MRsmall: {
marginRight: scale(SMALL)
marginRight: scale(SMALL),
},
MLsmall: {
marginLeft: scale(SMALL)
marginLeft: scale(SMALL),
},
Mmedium: {
margin: scale(MEDIUM)
margin: scale(MEDIUM),
},
MBmedium: {
marginBottom: scale(MEDIUM)
marginBottom: scale(MEDIUM),
},
MTmedium: {
marginTop: scale(MEDIUM)
marginTop: scale(MEDIUM),
},
MRmedium: {
marginRight: scale(MEDIUM)
marginRight: scale(MEDIUM),
},
MLmedium: {
marginLeft: scale(MEDIUM)
marginLeft: scale(MEDIUM),
},
Mlarge: {
margin: scale(LARGE)
margin: scale(LARGE),
},
MBlarge: {
marginBottom: scale(LARGE)
marginBottom: scale(LARGE),
},
MTlarge: {
marginTop: scale(LARGE)
marginTop: scale(LARGE),
},
MRlarge: {
marginRight: scale(LARGE)
marginRight: scale(LARGE),
},
MLlarge: {
marginLeft: scale(LARGE)
marginLeft: scale(LARGE),
},
// Padding
PxSmall: {
padding: scale(XSMALL)
padding: scale(XSMALL),
},
PBxSmall: {
paddingBottom: scale(XSMALL)
paddingBottom: scale(XSMALL),
},
PTxSmall: {
paddingTop: scale(XSMALL)
paddingTop: scale(XSMALL),
},
PRxSmall: {
paddingRight: scale(XSMALL)
paddingRight: scale(XSMALL),
},
PLxSmall: {
paddingLeft: scale(XSMALL)
paddingLeft: scale(XSMALL),
},
Psmall: {
padding: scale(SMALL)
padding: scale(SMALL),
},
PBsmall: {
paddingBottom: scale(SMALL)
paddingBottom: scale(SMALL),
},
PTsmall: {
paddingTop: scale(SMALL)
paddingTop: scale(SMALL),
},
PRsmall: {
paddingRight: scale(SMALL)
paddingRight: scale(SMALL),
},
PLsmall: {
paddingLeft: scale(SMALL)
paddingLeft: scale(SMALL),
},
Pmedium: {
padding: scale(MEDIUM)
padding: scale(MEDIUM),
},
PBmedium: {
paddingBottom: scale(MEDIUM)
paddingBottom: scale(MEDIUM),
},
PTmedium: {
paddingTop: scale(MEDIUM)
paddingTop: scale(MEDIUM),
},
PRmedium: {
paddingRight: scale(MEDIUM)
paddingRight: scale(MEDIUM),
},
PLmedium: {
paddingLeft: scale(MEDIUM)
paddingLeft: scale(MEDIUM),
},
Plarge: {
padding: scale(LARGE)
padding: scale(LARGE),
},
PBlarge: {
paddingBottom: scale(LARGE)
paddingBottom: scale(LARGE),
},
PTlarge: {
paddingTop: scale(LARGE)
paddingTop: scale(LARGE),
},
PRlarge: {
paddingRight: scale(LARGE)
paddingRight: scale(LARGE),
},
PLlarge: {
paddingLeft: scale(LARGE)
}
}
paddingLeft: scale(LARGE),
},
};