steve
/
grocery-app
mirror of https://github.com/ninjas-code-official/food-delivery-singlevendor
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

fixed order status text issue

This commit is contained in:
aliyanlatif 2024-01-31 15:05:01 +05:00
parent 8e04835487
commit 28b7fc6277
5 changed files with 272 additions and 210 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

74
CustomerApp/src/components/Menu/StatusCard/StatusCard.js
View File

@ -11,33 +11,55 @@ import TextError from "../../Text/TextError/TextError";
import useStyle from "./styles"; import useStyle from "./styles";
import i18n from "../../../../i18n"; import i18n from "../../../../i18n";
export const orderStatuses = [ // export const orderStatuses = [
{ // {
key: i18n.t("PENDING"), // key: i18n.t("PENDING"),
// status: 1,
// statusText: i18n.t("orderPending"),
// },
// {
// key: i18n.t("ACCEPTED"),
// status: 2,
// statusText: i18n.t("prepFood"),
// },
// {
// key: i18n.t("PICKED"),
// status: 3,
// statusText: i18n.t("riderOnWay"),
// },
// {
// key: i18n.t("DELIVERED"),
// status: 4,
// statusText: i18n.t("orderDelivered"),
// },
// {
// key: i18n.t("COMPLETED"),
// status: 5,
// statusText: i18n.t("completeOrder"),
// },
// ];
export const orderStatuses = {
PENDING: {
status: 1, status: 1,
statusText: i18n.t("orderPending"), statusText: "orderPending",
}, },
{ ACCEPTED: {
key: i18n.t("ACCEPTED"),
status: 2, status: 2,
statusText: i18n.t("prepFood"), statusText: "prepFood",
}, },
{ PICKED: {
key: i18n.t("PICKED"),
status: 3, status: 3,
statusText: i18n.t("riderOnWay"), statusText: "riderOnWay",
}, },
{ DELIVERED: {
key: i18n.t("DELIVERED"),
status: 4, status: 4,
statusText: i18n.t("orderDelivered"), statusText: "orderDelivered",
}, },
{ COMPLETED: {
key: i18n.t("COMPLETED"),
status: 5, status: 5,
statusText: i18n.t("completeOrder"), statusText: "completeOrder",
}, },
]; };
const orderStatusActive = ["PENDING", "PICKED", "ACCEPTED"]; const orderStatusActive = ["PENDING", "PICKED", "ACCEPTED"];
@ -54,12 +76,12 @@ const StatusCard = () => {
} = useContext(UserContext); } = useContext(UserContext);
const configuration = useContext(ConfigurationContext); const configuration = useContext(ConfigurationContext);
const checkStatus = (status) => { // const checkStatus = (status) => {
const obj = orderStatuses.filter((x) => { // const obj = orderStatuses.filter((x) => {
return x.key === status; // return x.key === status;
}); // });
return obj[0]; // return obj[0];
}; // };
if (loadingOrders) return <Spinner />; if (loadingOrders) return <Spinner />;
if (errorOrders) return <TextError>{errorOrders.message}</TextError>; if (errorOrders) return <TextError>{errorOrders.message}</TextError>;
@ -101,8 +123,10 @@ const StatusCard = () => {
<TextDefault textColor={"#00b9c6"} H5 medium> <TextDefault textColor={"#00b9c6"} H5 medium>
{i18n.t(item.order_status)}{" "} {i18n.t(item.order_status)}{" "}
<TextDefault numberOfLines={2} medium> <TextDefault numberOfLines={2} medium>
{checkStatus(item.order_status).status}. ( {/* {checkStatus(item.order_status).status}.{' '} */}
{checkStatus(i18n.t(item.order_status)).statusText}) {/* {checkStatus(i18n.t(item.order_status)?.status)?.statusText ||
"..."} */}
{`(${i18n.t(orderStatuses[item.order_status]?.statusText)})`}
</TextDefault> </TextDefault>
</TextDefault> </TextDefault>
</View> </View>

116
CustomerApp/src/components/MyOrders/ActiveOrders.js
View File

@ -1,93 +1,104 @@
import { useTheme } from '@react-navigation/native' import { useTheme } from "@react-navigation/native";
import PropTypes from 'prop-types' import PropTypes from "prop-types";
import React, { useContext } from 'react' import React, { useContext } from "react";
import { TouchableOpacity, View } from 'react-native' import { TouchableOpacity, View } from "react-native";
import ConfigurationContext from '../../context/Configuration' import ConfigurationContext from "../../context/Configuration";
import { COLORS } from '../../Theme/Colors' import { COLORS } from "../../Theme/Colors";
import { alignment } from '../../utils/alignment' import { alignment } from "../../utils/alignment";
import { ICONS_NAME, NAVIGATION_SCREEN } from '../../utils/constant' import { ICONS_NAME, NAVIGATION_SCREEN } from "../../utils/constant";
import { scale } from '../../utils/scaling' import { scale } from "../../utils/scaling";
import { CustomIcon } from '../CustomIcon/index' import { CustomIcon } from "../CustomIcon/index";
import EnategaImage from '../EnategaImage/EnategaImage' import EnategaImage from "../EnategaImage/EnategaImage";
import TextDefault from '../Text/TextDefault/TextDefault' import TextDefault from "../Text/TextDefault/TextDefault";
import TextError from '../Text/TextError/TextError' import TextError from "../Text/TextError/TextError";
import TextLine from '../Text/TextLine/TextLine' import TextLine from "../Text/TextLine/TextLine";
import useStyle from './styles' import useStyle from "./styles";
import i18n from '../../../i18n' import i18n from "../../../i18n";
export const orderStatuses = [ export const orderStatuses = [
{ {
key: 'PENDING', key: "PENDING",
status: 1, status: 1,
icon: ICONS_NAME.Clock, icon: ICONS_NAME.Clock,
color: COLORS.primary color: COLORS.primary,
}, },
{ {
key: 'ACCEPTED', key: "ACCEPTED",
status: 2, status: 2,
icon: ICONS_NAME.Checked, icon: ICONS_NAME.Checked,
color: COLORS.blueColor color: COLORS.blueColor,
}, },
{ {
key: 'PICKED', key: "PICKED",
status: 3, status: 3,
icon: ICONS_NAME.Checked, icon: ICONS_NAME.Checked,
color: COLORS.blueColor color: COLORS.blueColor,
}, },
{ {
key: 'DELIVERED', key: "DELIVERED",
status: 4, status: 4,
icon: ICONS_NAME.Checked, icon: ICONS_NAME.Checked,
color: COLORS.blueColor color: COLORS.blueColor,
}, },
{ {
key: 'COMPLETED', key: "COMPLETED",
status: 5, status: 5,
icon: ICONS_NAME.Checked, icon: ICONS_NAME.Checked,
color: COLORS.blueColor color: COLORS.blueColor,
} },
] ];
const ActiveOrders = ({ const ActiveOrders = ({
navigation, navigation,
loading, loading,
error, error,
activeOrders, activeOrders,
pastOrders pastOrders,
}) => { }) => {
const styles = useStyle() const styles = useStyle();
const { colors } = useTheme() const { colors } = useTheme();
const configuration = useContext(ConfigurationContext) const configuration = useContext(ConfigurationContext);
if (loading) { if (loading) {
return <TextDefault small> Loading...</TextDefault> return <TextDefault small> Loading...</TextDefault>;
} }
if (error) return <TextError text={error.message} /> if (error) return <TextError text={error.message} />;
if (!activeOrders || (activeOrders && !activeOrders.length)) { if (!activeOrders || (activeOrders && !activeOrders.length)) {
if (!pastOrders || (pastOrders && !pastOrders.length)) { if (!pastOrders || (pastOrders && !pastOrders.length)) {
return <TextDefault> </TextDefault> return <TextDefault> </TextDefault>;
} }
return <TextLine headerName={i18n.t('oldOrder')} textWidth="34%" lineWidth="28%" /> return (
<TextLine
headerName={i18n.t("oldOrder")}
textWidth="34%"
lineWidth="28%"
/>
);
} }
const checkStatus = status => { const checkStatus = (status) => {
const obj = orderStatuses.filter(x => { const obj = orderStatuses.filter((x) => {
return x.key === status return x.key === status;
}) });
return obj[0] return obj[0];
} };
return ( return (
<React.Fragment> <React.Fragment>
<TextLine headerName={i18n.t('activeOrder')} textWidth="40%" lineWidth="26%" /> <TextLine
headerName={i18n.t("activeOrder")}
textWidth="40%"
lineWidth="26%"
/>
{activeOrders.map((item, index) => ( {activeOrders.map((item, index) => (
<TouchableOpacity <TouchableOpacity
activeOpacity={0.7} activeOpacity={0.7}
key={index.toString()} key={index.toString()}
onPress={() => onPress={() =>
navigation.navigate(NAVIGATION_SCREEN.OrderDetail, { navigation.navigate(NAVIGATION_SCREEN.OrderDetail, {
_id: item._id _id: item._id,
}) })
}> }
>
<View style={styles.container}> <View style={styles.container}>
<View style={styles.imgContainer}> <View style={styles.imgContainer}>
<EnategaImage <EnategaImage
@ -98,7 +109,7 @@ const ActiveOrders = ({
</View> </View>
<View style={styles.infoContainer}> <View style={styles.infoContainer}>
<TextDefault H5 bolder style={alignment.MBxSmall}> <TextDefault H5 bolder style={alignment.MBxSmall}>
{i18n.t('idVar')} {i18n.t("idVar")}
{item.order_id} {item.order_id}
</TextDefault> </TextDefault>
<TextDefault line={3} textColor={colors.tagColor} H5 bold> <TextDefault line={3} textColor={colors.tagColor} H5 bold>
@ -117,7 +128,8 @@ const ActiveOrders = ({
textColor={checkStatus(item.order_status).color} textColor={checkStatus(item.order_status).color}
style={alignment.MTxSmall} style={alignment.MTxSmall}
bold bold
center> center
>
{i18n.t(item.order_status)} {i18n.t(item.order_status)}
</TextDefault> </TextDefault>
</View> </View>
@ -126,15 +138,15 @@ const ActiveOrders = ({
))} ))}
<TextLine headerName="Old Orders" textWidth="34%" lineWidth="26%" /> <TextLine headerName="Old Orders" textWidth="34%" lineWidth="26%" />
</React.Fragment> </React.Fragment>
) );
} };
ActiveOrders.propTypes = { ActiveOrders.propTypes = {
loading: PropTypes.bool, loading: PropTypes.bool,
error: PropTypes.object, error: PropTypes.object,
activeOrders: PropTypes.arrayOf(PropTypes.object), activeOrders: PropTypes.arrayOf(PropTypes.object),
navigation: PropTypes.object, navigation: PropTypes.object,
pastOrders: PropTypes.arrayOf(PropTypes.object) pastOrders: PropTypes.arrayOf(PropTypes.object),
} };
export default ActiveOrders export default ActiveOrders;

19
CustomerApp/src/screens/MyOrders/MyOrders.js
View File

@ -21,8 +21,8 @@ import { ICONS_NAME, NAVIGATION_SCREEN } from "../../utils/constant";
import { scale } from "../../utils/scaling"; import { scale } from "../../utils/scaling";
import useStyle from "./style"; import useStyle from "./style";
const orderStatusActive = [i18n.t("PENDING"), i18n.t("PICKED"), i18n.t("ACCEPTED")]; const orderStatusActive = ["PENDING", "PICKED", "ACCEPTED"];
const orderStatusInactive = [i18n.t("DELIVERED"), i18n.t("COMPLETED")]; const orderStatusInactive = ["DELIVERED", "COMPLETED"];
function MyOrders() { function MyOrders() {
const styles = useStyle(); const styles = useStyle();
@ -86,7 +86,7 @@ function MyOrders() {
</View> </View>
<View style={styles.descriptionEmpty}> <View style={styles.descriptionEmpty}>
<TextDefault bolder center H4> <TextDefault bolder center H4>
{i18n.t('noOrdersFound')} {i18n.t("noOrdersFound")}
</TextDefault> </TextDefault>
</View> </View>
<TouchableOpacity <TouchableOpacity
@ -95,7 +95,7 @@ function MyOrders() {
onPress={() => navigation.navigate(NAVIGATION_SCREEN.Menu)} onPress={() => navigation.navigate(NAVIGATION_SCREEN.Menu)}
> >
<TextDefault textColor={colors.buttonText} bold H5 center> <TextDefault textColor={colors.buttonText} bold H5 center>
{i18n.t('startShopping')} {i18n.t("startShopping")}
</TextDefault> </TextDefault>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
@ -103,13 +103,16 @@ function MyOrders() {
} }
} }
console.log(orders);
return ( return (
<WrapperView> <WrapperView>
<FlatList <FlatList
data={ data={
loadingOrders || errorOrders loadingOrders || errorOrders
? [] ? []
: orders.filter((o) => orderStatusInactive.includes(i18n.t(o.order_status))) : orders.filter((o) =>
orderStatusInactive.includes(o.order_status)
)
} }
style={styles.container} style={styles.container}
contentContainerStyle={styles.contentContainer} contentContainerStyle={styles.contentContainer}
@ -118,10 +121,10 @@ function MyOrders() {
<ActiveOrders <ActiveOrders
navigation={navigation} navigation={navigation}
activeOrders={orders.filter((o) => activeOrders={orders.filter((o) =>
orderStatusActive.includes(i18n.t(o.order_status)) orderStatusActive.includes(o.order_status)
)} )}
pastOrders={orders.filter((o) => pastOrders={orders.filter((o) =>
orderStatusInactive.includes(i18n.t(o.order_status)) orderStatusInactive.includes(o.order_status)
)} )}
loading={loadingOrders} loading={loadingOrders}
error={errorOrders} error={errorOrders}
@ -151,7 +154,7 @@ function MyOrders() {
</View> </View>
<View style={styles.infoContainer}> <View style={styles.infoContainer}>
<TextDefault H5 bold style={alignment.MBxSmall}> <TextDefault H5 bold style={alignment.MBxSmall}>
{i18n.t('idVar')} {i18n.t("idVar")}
{item.order_id} {item.order_id}
</TextDefault> </TextDefault>
<TextDefault line={3} textColor={colors.tagColor} H5 medium> <TextDefault line={3} textColor={colors.tagColor} H5 medium>

216
CustomerApp/src/screens/OrderDetail/OrderDetail.js
View File

@ -1,79 +1,79 @@
import { MaterialIcons } from '@expo/vector-icons' import { MaterialIcons } from "@expo/vector-icons";
import { useNavigation, useRoute, useTheme } from '@react-navigation/native' import { useNavigation, useRoute, useTheme } from "@react-navigation/native";
import React, { useContext, useEffect, useLayoutEffect } from 'react' import React, { useContext, useEffect, useLayoutEffect } from "react";
import { Platform, ScrollView, TouchableOpacity, View } from 'react-native' import { Platform, ScrollView, TouchableOpacity, View } from "react-native";
import MapView, { PROVIDER_DEFAULT, PROVIDER_GOOGLE } from 'react-native-maps' import MapView, { PROVIDER_DEFAULT, PROVIDER_GOOGLE } from "react-native-maps";
import i18n from '../../../i18n' import i18n from "../../../i18n";
import { import {
Spinner, Spinner,
TextDefault, TextDefault,
TextError, TextError,
TrackingRider, TrackingRider,
WrapperView WrapperView,
} from '../../components' } from "../../components";
import { orderStatuses } from '../../components/Menu/StatusCard/StatusCard' import { orderStatuses } from "../../components/Menu/StatusCard/StatusCard";
import ConfigurationContext from '../../context/Configuration' import ConfigurationContext from "../../context/Configuration";
import UserContext from '../../context/User' import UserContext from "../../context/User";
import { alignment } from '../../utils/alignment' import { alignment } from "../../utils/alignment";
import { NAVIGATION_SCREEN } from '../../utils/constant' import { NAVIGATION_SCREEN } from "../../utils/constant";
import { moderateScale, scale } from '../../utils/scaling' import { moderateScale, scale } from "../../utils/scaling";
import useStyle from './styles' import useStyle from "./styles";
function calculatePrice(food) { function calculatePrice(food) {
var foodPrice = food.variation.price var foodPrice = food.variation.price;
food.addons.forEach(addons => { food.addons.forEach((addons) => {
addons.options.forEach(addon => { addons.options.forEach((addon) => {
foodPrice += addon.price foodPrice += addon.price;
}) });
}) });
return foodPrice return foodPrice;
} }
const checkStatus = status => { // const checkStatus = (status) => {
const obj = orderStatuses.filter(x => { // const obj = orderStatuses.filter((x) => {
return x.key === status // return x.key === status;
}) // });
return obj[0] // return obj[0];
} // };
function OrderDetail() { function OrderDetail() {
const styles = useStyle() const styles = useStyle();
const route = useRoute() const route = useRoute();
const { colors } = useTheme() const { colors } = useTheme();
const navigation = useNavigation() const navigation = useNavigation();
const id = route.params._id ?? null const id = route.params._id ?? null;
const cart = route.params.clearCart ?? false const cart = route.params.clearCart ?? false;
const { loadingOrders, errorOrders, orders, clearCart } = const { loadingOrders, errorOrders, orders, clearCart } =
useContext(UserContext) useContext(UserContext);
const configuration = useContext(ConfigurationContext) const configuration = useContext(ConfigurationContext);
const order = orders.find(o => o._id === id) const order = orders.find((o) => o._id === id);
useLayoutEffect(() => { useLayoutEffect(() => {
navigation.setOptions({ navigation.setOptions({
headerTitle: i18n.t('orderDetail'), headerTitle: i18n.t("orderDetail"),
headerRight: null headerRight: null,
}) });
}, [navigation]) }, [navigation]);
useEffect(() => { useEffect(() => {
return () => { return () => {
if (cart) { if (cart) {
clear() clear();
} }
} };
}, [cart]) }, [cart]);
async function clear() { async function clear() {
await clearCart() await clearCart();
} }
if (loadingOrders || !order) return <Spinner /> if (loadingOrders || !order) return <Spinner />;
if (errorOrders) return <TextError text={i18n.t('error')} /> if (errorOrders) return <TextError text={i18n.t("error")} />;
return ( return (
<WrapperView> <WrapperView>
<ScrollView style={[styles.flex]}> <ScrollView style={[styles.flex]}>
<View> <View>
{i18n.t(order.order_status) === i18n.t('PICKED') && order.rider && ( {i18n.t(order.order_status) === i18n.t("PICKED") && order.rider && (
<TrackingRider <TrackingRider
delivery_address={order.delivery_address} delivery_address={order.delivery_address}
id={order.rider._id} id={order.rider._id}
@ -85,15 +85,17 @@ function OrderDetail() {
textColor={colors.buttonBackgroundBlue} textColor={colors.buttonBackgroundBlue}
bolder bolder
H3 H3
style={alignment.MBsmall}> style={alignment.MBsmall}
{i18n.t('thankYou')} >
{i18n.t("thankYou")}
</TextDefault> </TextDefault>
<TextDefault <TextDefault
textColor={colors.fontSecondColor} textColor={colors.fontSecondColor}
medium medium
H5 H5
style={[alignment.MTsmall]}> style={[alignment.MTsmall]}
{i18n.t('orderId')} >
{i18n.t("orderId")}
</TextDefault> </TextDefault>
<TextDefault H4 bolder style={alignment.PTxSmall}> <TextDefault H4 bolder style={alignment.PTxSmall}>
{order.order_id} {order.order_id}
@ -102,21 +104,24 @@ function OrderDetail() {
textColor={colors.fontSecondColor} textColor={colors.fontSecondColor}
bold bold
H5 H5
style={[alignment.MTlarge]}> style={[alignment.MTlarge]}
{i18n.t('status')} >
{i18n.t("status")}
</TextDefault> </TextDefault>
<TextDefault <TextDefault
textColor={colors.buttonBackgroundBlue} textColor={colors.buttonBackgroundBlue}
H4 H4
medium medium
style={[alignment.MBsmall, alignment.MTxSmall]}> style={[alignment.MBsmall, alignment.MTxSmall]}
{i18n.t(order.order_status)}{' '} >
{i18n.t(order.order_status)}{" "}
<TextDefault medium> <TextDefault medium>
( {checkStatus(i18n.t(order.order_status)).statusText}) {/* ({checkStatus(i18n.t(order.order_status))?.statusText || "..."}) */}
{`(${i18n.t(orderStatuses[order.order_status]?.statusText)})`}
</TextDefault> </TextDefault>
</TextDefault> </TextDefault>
<TextDefault textColor={colors.fontSecondColor} H5 bold> <TextDefault textColor={colors.fontSecondColor} H5 bold>
{i18n.t('deliveryAddress')}: {i18n.t("deliveryAddress")}:
</TextDefault> </TextDefault>
<TextDefault style={{ ...alignment.PTxSmall }} H5> <TextDefault style={{ ...alignment.PTxSmall }} H5>
{order.delivery_address.delivery_address} {order.delivery_address.delivery_address}
@ -128,18 +133,20 @@ function OrderDetail() {
<View style={[styles.marginBottom10, styles.orderReceipt]}> <View style={[styles.marginBottom10, styles.orderReceipt]}>
{order.items.map((item, index) => ( {order.items.map((item, index) => (
<View style={[styles.marginBottom10, styles.floatView]} key={index}> <View style={[styles.marginBottom10, styles.floatView]} key={index}>
<TextDefault H5 style={{ width: '10%' }}> <TextDefault H5 style={{ width: "10%" }}>
{item.quantity}x {item.quantity}x
</TextDefault> </TextDefault>
<TextDefault <TextDefault
textColor={colors.fontMainColor} textColor={colors.fontMainColor}
style={{ width: '65%' }}> style={{ width: "65%" }}
>
{item.food.title} {item.food.title}
</TextDefault> </TextDefault>
<TextDefault <TextDefault
textColor={colors.fontMainColor} textColor={colors.fontMainColor}
style={{ width: '25%' }} style={{ width: "25%" }}
right> right
>
{configuration.currency_symbol} {configuration.currency_symbol}
{parseFloat(calculatePrice(item)).toFixed(2)} {parseFloat(calculatePrice(item)).toFixed(2)}
</TextDefault> </TextDefault>
@ -150,14 +157,16 @@ function OrderDetail() {
<TextDefault <TextDefault
textColor={colors.fontMainColor} textColor={colors.fontMainColor}
medium medium
style={{ width: '40%' }}> style={{ width: "40%" }}
{i18n.t('subTotal')} >
{i18n.t("subTotal")}
</TextDefault> </TextDefault>
<TextDefault <TextDefault
textColor={colors.fontMainColor} textColor={colors.fontMainColor}
medium medium
style={{ width: '60%' }} style={{ width: "60%" }}
right> right
>
{configuration.currency_symbol} {configuration.currency_symbol}
{parseFloat(order.order_amount - order.delivery_charges).toFixed( {parseFloat(order.order_amount - order.delivery_charges).toFixed(
2 2
@ -168,14 +177,16 @@ function OrderDetail() {
<TextDefault <TextDefault
textColor={colors.fontMainColor} textColor={colors.fontMainColor}
medium medium
style={{ width: '40%' }}> style={{ width: "40%" }}
{i18n.t('deliveryFee')} >
{i18n.t("deliveryFee")}
</TextDefault> </TextDefault>
<TextDefault <TextDefault
textColor={colors.fontMainColor} textColor={colors.fontMainColor}
medium medium
style={{ width: '60%' }} style={{ width: "60%" }}
right> right
>
{configuration.currency_symbol} {configuration.currency_symbol}
{parseFloat(order.delivery_charges).toFixed(2)} {parseFloat(order.delivery_charges).toFixed(2)}
</TextDefault> </TextDefault>
@ -184,26 +195,29 @@ function OrderDetail() {
<TextDefault <TextDefault
textColor={colors.fontMainColor} textColor={colors.fontMainColor}
bold bold
style={{ width: '40%' }}> style={{ width: "40%" }}
{i18n.t('total')} >
{i18n.t("total")}
</TextDefault> </TextDefault>
<TextDefault <TextDefault
textColor={colors.fontMainColor} textColor={colors.fontMainColor}
bold bold
style={{ width: '60%' }} style={{ width: "60%" }}
right> right
>
{configuration.currency_symbol} {configuration.currency_symbol}
{parseFloat(order.order_amount).toFixed(2)} {parseFloat(order.order_amount).toFixed(2)}
</TextDefault> </TextDefault>
</View> </View>
</View> </View>
{i18n.t(order.order_status) === i18n.t('PICKED') && ( {i18n.t(order.order_status) === i18n.t("PICKED") && (
<View <View
style={{ style={{
...alignment.PLmedium, ...alignment.PLmedium,
...alignment.PRmedium, ...alignment.PRmedium,
height: moderateScale(250) height: moderateScale(250),
}}> }}
>
<MapView <MapView
style={{ flex: 1, borderRadius: 20 }} style={{ flex: 1, borderRadius: 20 }}
scrollEnabled={false} scrollEnabled={false}
@ -222,53 +236,58 @@ function OrderDetail() {
loadingEnabled={true} loadingEnabled={true}
loadingIndicatorColor="#d83765" loadingIndicatorColor="#d83765"
provider={ provider={
Platform.OS === 'android' ? PROVIDER_GOOGLE : PROVIDER_DEFAULT Platform.OS === "android" ? PROVIDER_GOOGLE : PROVIDER_DEFAULT
}></MapView> }
></MapView>
<View <View
style={{ style={{
...alignment.PTlarge, ...alignment.PTlarge,
width: '80%', width: "80%",
borderRadius: moderateScale(10), borderRadius: moderateScale(10),
alignSelf: 'center' alignSelf: "center",
}}> }}
>
<TouchableOpacity <TouchableOpacity
activeOpacity={0.8} activeOpacity={0.8}
style={{ style={{
backgroundColor: colors.buttonBackgroundBlue, backgroundColor: colors.buttonBackgroundBlue,
alignItems: 'center', alignItems: "center",
padding: moderateScale(16), padding: moderateScale(16),
borderRadius: moderateScale(10) borderRadius: moderateScale(10),
}}> }}
>
<TextDefault H5 bold textColor={colors.lightBackground}> <TextDefault H5 bold textColor={colors.lightBackground}>
{i18n.t('chatWithRider')} {i18n.t("chatWithRider")}
</TextDefault> </TextDefault>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
</View> </View>
)} )}
{(i18n.t(order.order_status) === i18n.t('DELIVERED') || {(i18n.t(order.order_status) === i18n.t("DELIVERED") ||
i18n.t(order.order_status) === i18n.t('COMPLETED')) && i18n.t(order.order_status) === i18n.t("COMPLETED")) &&
order.review && order.review &&
order.review.rating === 0 && ( order.review.rating === 0 && (
<View style={styles.orderReceipt}> <View style={styles.orderReceipt}>
<TextDefault H3 bolder style={alignment.MBsmall}> <TextDefault H3 bolder style={alignment.MBsmall}>
{i18n.t('anySuggestion')} {i18n.t("anySuggestion")}
</TextDefault> </TextDefault>
<TextDefault <TextDefault
textColor={colors.fontSecondColor} textColor={colors.fontSecondColor}
bold bold
style={[alignment.MBsmall, alignment.MTsmall]}> style={[alignment.MBsmall, alignment.MTsmall]}
{i18n.t('reviewRegarding')} >
{i18n.t("reviewRegarding")}
</TextDefault> </TextDefault>
<TouchableOpacity <TouchableOpacity
activeOpacity={0.7} activeOpacity={0.7}
style={[styles.floatView, { justifyContent: 'center' }]} style={[styles.floatView, { justifyContent: "center" }]}
onPress={() => onPress={() =>
navigation.navigate(NAVIGATION_SCREEN.RateAndReview, { navigation.navigate(NAVIGATION_SCREEN.RateAndReview, {
_id: order._id _id: order._id,
}) })
}> }
>
<MaterialIcons <MaterialIcons
name="rate-review" name="rate-review"
size={scale(20)} size={scale(20)}
@ -279,15 +298,16 @@ function OrderDetail() {
style={[alignment.MBsmall, alignment.MTsmall, alignment.ML10]} style={[alignment.MBsmall, alignment.MTsmall, alignment.ML10]}
H5 H5
bold bold
center> center
{i18n.t('writeReview')} >
{i18n.t("writeReview")}
</TextDefault> </TextDefault>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
)} )}
</ScrollView> </ScrollView>
</WrapperView> </WrapperView>
) );
} }
export default OrderDetail export default OrderDetail;

7
CustomerApp/src/screens/Settings/Settings.js
View File

@ -125,9 +125,12 @@ function Settings() {
}; };
useEffect(() => { useEffect(() => {
AppState.addEventListener("change", _handleAppStateChange); const subscription = AppState.addEventListener(
"change",
_handleAppStateChange
);
return () => { return () => {
AppState.remove("change", _handleAppStateChange); subscription.remove("change", _handleAppStateChange);
}; };
}, []); }, []);