ordering-ui-react-native 0.21.74 → 0.21.75-release
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +6 -7
- package/src/DeliveryApp.tsx +43 -1
- package/src/components/BusinessesListing/index.tsx +1 -1
- package/src/components/PaymentOptionsWebView/index.tsx +1 -0
- package/src/components/StripeMethodForm/index.tsx +6 -4
- package/src/components/VerifyPhone/styles.tsx +1 -2
- package/src/types/index.tsx +3 -1
- package/themes/business/index.tsx +4 -0
- package/themes/business/src/components/AcceptOrRejectOrder/index.tsx +9 -6
- package/themes/business/src/components/AcceptOrRejectOrder/styles.tsx +1 -0
- package/themes/business/src/components/BusinessProductList/index.tsx +2 -1
- package/themes/business/src/components/Chat/index.tsx +3 -1
- package/themes/business/src/components/DriverMap/index.tsx +44 -27
- package/themes/business/src/components/GoogleMap/index.tsx +15 -8
- package/themes/business/src/components/Home/index.tsx +5 -1
- package/themes/business/src/components/LanguageSelector/index.tsx +2 -3
- package/themes/business/src/components/LanguageSelector/lang_country.json +515 -70
- package/themes/business/src/components/LogoutButton/index.tsx +1 -1
- package/themes/business/src/components/MapView/index.tsx +36 -17
- package/themes/business/src/components/NewOrderNotification/index.tsx +74 -24
- package/themes/business/src/components/OrderDetails/Business.tsx +65 -7
- package/themes/business/src/components/OrderDetails/Delivery.tsx +35 -20
- package/themes/business/src/components/OrderDetails/OrderContentComponent.tsx +110 -40
- package/themes/business/src/components/OrderDetails/OrderHeaderComponent.tsx +61 -35
- package/themes/business/src/components/OrderDetails/styles.tsx +39 -3
- package/themes/business/src/components/OrderDetails/usePrinterCommands.tsx +220 -0
- package/themes/business/src/components/OrderSummary/index.tsx +219 -71
- package/themes/business/src/components/OrdersListManager/index.tsx +9 -1
- package/themes/business/src/components/OrdersOption/index.tsx +247 -159
- package/themes/business/src/components/PhoneInputNumber/index.tsx +8 -5
- package/themes/business/src/components/PreviousMessages/index.tsx +12 -0
- package/themes/business/src/components/PreviousOrders/OrderItem.tsx +25 -15
- package/themes/business/src/components/PreviousOrders/index.tsx +5 -3
- package/themes/business/src/components/PrinterEdition/index.tsx +363 -0
- package/themes/business/src/components/PrinterEdition/styles.tsx +61 -0
- package/themes/business/src/components/PrinterSettings/index.tsx +267 -0
- package/themes/business/src/components/PrinterSettings/styles.tsx +30 -0
- package/themes/business/src/components/ProductItemAccordion/index.tsx +2 -2
- package/themes/business/src/components/ReviewCustomer/index.tsx +2 -0
- package/themes/business/src/components/Sessions/index.tsx +187 -0
- package/themes/business/src/components/Sessions/styles.tsx +20 -0
- package/themes/business/src/components/StoresList/index.tsx +2 -2
- package/themes/business/src/components/UserFormDetails/index.tsx +111 -107
- package/themes/business/src/components/UserProfileForm/index.tsx +85 -49
- package/themes/business/src/components/WebsocketStatus/index.tsx +2 -2
- package/themes/business/src/components/shared/OInput.tsx +2 -0
- package/themes/business/src/components/shared/OTextarea.tsx +8 -9
- package/themes/business/src/hooks/useLocation.tsx +5 -4
- package/themes/business/src/types/index.tsx +22 -4
- package/themes/business/src/utils/index.tsx +19 -1
- package/themes/doordash/src/components/BusinessesListing/index.tsx +1 -1
- package/themes/doordash/src/components/LoginForm/index.tsx +1 -2
- package/themes/instacart/src/components/BusinessesListing/index.tsx +1 -1
- package/themes/kiosk/src/components/Checkout/index.tsx +6 -0
- package/themes/kiosk/src/components/NavBar/index.tsx +14 -14
- package/themes/kiosk/src/components/OptionCard/index.tsx +1 -1
- package/themes/kiosk/src/components/OrderTypeCardSelector/index.tsx +8 -10
- package/themes/kiosk/src/components/shared/OButton.tsx +5 -18
- package/themes/original/index.tsx +13 -1
- package/themes/original/src/components/AddressDetails/index.tsx +20 -10
- package/themes/original/src/components/AddressForm/index.tsx +32 -17
- package/themes/original/src/components/AddressList/index.tsx +8 -7
- package/themes/original/src/components/AnalyticsSegment/index.tsx +6 -6
- package/themes/original/src/components/AppleLogin/index.tsx +4 -4
- package/themes/original/src/components/BusinessBasicInformation/index.tsx +6 -9
- package/themes/original/src/components/BusinessController/index.tsx +12 -7
- package/themes/original/src/components/BusinessItemAccordion/index.tsx +13 -5
- package/themes/original/src/components/BusinessListingSearch/BusinessSearchFooter.tsx +2 -3
- package/themes/original/src/components/BusinessListingSearch/BusinessSearchHeader.tsx +1 -3
- package/themes/original/src/components/BusinessListingSearch/index.tsx +1 -2
- package/themes/original/src/components/BusinessPreorder/index.tsx +20 -15
- package/themes/original/src/components/BusinessProductsList/SubcategoriesComponent/index.tsx +5 -5
- package/themes/original/src/components/BusinessProductsList/index.tsx +3 -3
- package/themes/original/src/components/BusinessProductsList/styles.tsx +0 -3
- package/themes/original/src/components/BusinessProductsListing/index.tsx +15 -4
- package/themes/original/src/components/BusinessTypeFilter/index.tsx +9 -8
- package/themes/original/src/components/BusinessesListing/Layout/Appointment/index.tsx +2 -1
- package/themes/original/src/components/BusinessesListing/Layout/Original/index.tsx +1 -1
- package/themes/original/src/components/BusinessesListing/Layout/Original/styles.tsx +1 -1
- package/themes/original/src/components/BusinessesListing/index.tsx +0 -1
- package/themes/original/src/components/Cart/index.tsx +39 -12
- package/themes/original/src/components/CartContent/index.tsx +59 -44
- package/themes/original/src/components/Checkout/index.tsx +31 -25
- package/themes/original/src/components/CitiesControl/index.tsx +0 -3
- package/themes/original/src/components/CouponControl/index.tsx +1 -3
- package/themes/original/src/components/DriverTips/index.tsx +1 -3
- package/themes/original/src/components/Favorite/index.tsx +1 -5
- package/themes/original/src/components/FavoriteList/index.tsx +0 -1
- package/themes/original/src/components/ForgotPasswordForm/index.tsx +5 -7
- package/themes/original/src/components/GiftCard/GiftCardOrdersList/index.tsx +64 -0
- package/themes/original/src/components/GiftCard/GiftCardOrdersList/styles.tsx +8 -0
- package/themes/original/src/components/GiftCard/GiftCardUI/index.tsx +15 -17
- package/themes/original/src/components/GiftCard/PurchaseGiftCard/index.tsx +3 -7
- package/themes/original/src/components/GiftCard/RedeemGiftCard/index.tsx +24 -32
- package/themes/original/src/components/GiftCard/SendGiftCard/index.tsx +7 -9
- package/themes/original/src/components/GiftCard/SingleGiftCard/index.tsx +101 -0
- package/themes/original/src/components/GiftCard/SingleGiftCard/styles.tsx +4 -0
- package/themes/original/src/components/GiftCard/VerticalGiftCardOrdersLayout/index.tsx +82 -0
- package/themes/original/src/components/GiftCard/VerticalGiftCardOrdersLayout/styles.tsx +9 -0
- package/themes/original/src/components/GoogleMap/index.tsx +39 -18
- package/themes/original/src/components/Help/index.tsx +2 -0
- package/themes/original/src/components/HighestRatedBusinesses/index.tsx +1 -1
- package/themes/original/src/components/Home/index.tsx +2 -10
- package/themes/original/src/components/LoginForm/Otp/index.tsx +0 -3
- package/themes/original/src/components/LoginForm/index.tsx +4 -7
- package/themes/original/src/components/MessageListing/index.tsx +1 -0
- package/themes/original/src/components/Messages/index.tsx +8 -7
- package/themes/original/src/components/MomentOption/index.tsx +13 -2
- package/themes/original/src/components/MultiCartsPaymethodsAndWallets/index.tsx +7 -3
- package/themes/original/src/components/MultiCheckout/index.tsx +123 -62
- package/themes/original/src/components/MultiCheckout/styles.tsx +17 -0
- package/themes/original/src/components/MultiOrdersDetails/index.tsx +20 -14
- package/themes/original/src/components/MyOrders/index.tsx +21 -26
- package/themes/original/src/components/NavBar/index.tsx +4 -2
- package/themes/original/src/components/NetworkError/index.tsx +0 -5
- package/themes/original/src/components/NotFoundSource/index.tsx +0 -3
- package/themes/original/src/components/OrderDetails/OrderEta.tsx +1 -1
- package/themes/original/src/components/OrderDetails/OrderHistory.tsx +5 -7
- package/themes/original/src/components/OrderDetails/index.tsx +26 -9
- package/themes/original/src/components/OrderDetails/styles.tsx +0 -1
- package/themes/original/src/components/OrderProgress/index.tsx +22 -3
- package/themes/original/src/components/OrderSummary/index.tsx +23 -5
- package/themes/original/src/components/OrderTypeSelector/index.tsx +7 -6
- package/themes/original/src/components/OrdersOption/index.tsx +2 -4
- package/themes/original/src/components/PaymentOptionStripe/index.tsx +0 -5
- package/themes/original/src/components/PaymentOptionWallet/index.tsx +56 -56
- package/themes/original/src/components/PaymentOptions/index.tsx +46 -5
- package/themes/original/src/components/PlaceSpot/index.tsx +1 -3
- package/themes/original/src/components/PreviousOrders/index.tsx +1 -2
- package/themes/original/src/components/ProductForm/ActionButton.tsx +16 -19
- package/themes/original/src/components/ProductForm/index.tsx +108 -105
- package/themes/original/src/components/ProductItemAccordion/index.tsx +55 -49
- package/themes/original/src/components/ProductItemAccordion/styles.tsx +3 -4
- package/themes/original/src/components/ProductOptionSubOption/index.tsx +8 -1
- package/themes/original/src/components/ProfessionalProfile/index.tsx +4 -5
- package/themes/original/src/components/Promotions/index.tsx +6 -9
- package/themes/original/src/components/ReviewDriver/index.tsx +1 -1
- package/themes/original/src/components/ReviewOrder/index.tsx +2 -2
- package/themes/original/src/components/ReviewProducts/index.tsx +1 -1
- package/themes/original/src/components/ReviewTrigger/index.tsx +2 -2
- package/themes/original/src/components/ServiceForm/index.tsx +52 -54
- package/themes/original/src/components/Sessions/index.tsx +3 -3
- package/themes/original/src/components/SignupForm/index.tsx +86 -78
- package/themes/original/src/components/SingleOrderCard/index.tsx +1 -2
- package/themes/original/src/components/SingleProductCard/index.tsx +5 -6
- package/themes/original/src/components/SingleProductCard/styles.tsx +0 -3
- package/themes/original/src/components/StripeCardForm/index.tsx +0 -3
- package/themes/original/src/components/StripeCardsList/index.tsx +10 -35
- package/themes/original/src/components/StripeElementsForm/index.tsx +78 -59
- package/themes/original/src/components/StripeElementsForm/naked.tsx +48 -1
- package/themes/original/src/components/StripeRedirectForm/index.tsx +0 -3
- package/themes/original/src/components/TaxInformation/index.tsx +3 -2
- package/themes/original/src/components/UpsellingProducts/UpsellingContent.tsx +10 -7
- package/themes/original/src/components/UpsellingProducts/UpsellingLayout.tsx +8 -3
- package/themes/original/src/components/UserFormDetails/index.tsx +98 -87
- package/themes/original/src/components/UserProfile/index.tsx +11 -2
- package/themes/original/src/components/Wallets/index.tsx +6 -3
- package/themes/original/src/components/WebsocketStatus/index.tsx +169 -0
- package/themes/original/src/components/WebsocketStatus/styles.tsx +28 -0
- package/themes/original/src/components/shared/OAlert.tsx +2 -1
- package/themes/original/src/components/shared/OButton.tsx +5 -4
- package/themes/original/src/components/shared/OInput.tsx +4 -8
- package/themes/original/src/types/index.tsx +5 -1
- package/themes/original/src/utils/index.tsx +12 -1
- package/themes/uber-eats/src/components/BusinessesListing/index.tsx +1 -1
|
@@ -18,12 +18,6 @@ export const Home = (props: any) => {
|
|
|
18
18
|
const unaddressedTypes = configs?.unaddressed_order_types_allowed?.value.split('|').map((value: any) => Number(value)) || []
|
|
19
19
|
const isAllowUnaddressOrderType = unaddressedTypes.includes(orderState?.options?.type)
|
|
20
20
|
|
|
21
|
-
useEffect(() => {
|
|
22
|
-
if (isAllowUnaddressOrderType) {
|
|
23
|
-
onNavigationRedirect(!!businessSlug ? 'Business' : 'BusinessList')
|
|
24
|
-
}
|
|
25
|
-
}, [isAllowUnaddressOrderType])
|
|
26
|
-
|
|
27
21
|
return (
|
|
28
22
|
<View style={styles.container}>
|
|
29
23
|
<View>
|
|
@@ -49,11 +43,8 @@ export const Home = (props: any) => {
|
|
|
49
43
|
</OText>
|
|
50
44
|
<OButton
|
|
51
45
|
text={t('LOGIN_NOW', 'Login now')}
|
|
52
|
-
bgColor={theme.colors.primary}
|
|
53
|
-
borderColor={theme.colors.primary}
|
|
54
46
|
style={styles.buttons}
|
|
55
47
|
isCircle={false}
|
|
56
|
-
textStyle={{ color: 'white' }}
|
|
57
48
|
onClick={() => onNavigationRedirect('Login')}
|
|
58
49
|
imgRightSrc={null}
|
|
59
50
|
/>
|
|
@@ -62,13 +53,14 @@ export const Home = (props: any) => {
|
|
|
62
53
|
bgColor={theme.colors.primaryContrast}
|
|
63
54
|
borderColor={theme.colors.primaryContrast}
|
|
64
55
|
style={styles.buttons}
|
|
56
|
+
textStyle={{ color: 'black' }}
|
|
65
57
|
onClick={() => onNavigationRedirect('Signup')}
|
|
66
58
|
imgRightSrc={null}
|
|
67
59
|
/>
|
|
68
60
|
<TouchableOpacity
|
|
69
61
|
style={{ ...styles.textLink, marginTop: 12 }}
|
|
70
62
|
onPress={() =>
|
|
71
|
-
orderState?.options?.address?.address
|
|
63
|
+
orderState?.options?.address?.address || isAllowUnaddressOrderType
|
|
72
64
|
? onNavigationRedirect(!!businessSlug ? 'Business' : 'BusinessList', { isGuestUser: true })
|
|
73
65
|
: onNavigationRedirect('AddressForm', { isGuestUser: true })
|
|
74
66
|
}>
|
|
@@ -145,9 +145,6 @@ export const Otp = (props: otpParams) => {
|
|
|
145
145
|
</TouchableOpacity>
|
|
146
146
|
<OButton
|
|
147
147
|
onClick={() => handleCloseOtp()}
|
|
148
|
-
bgColor={theme.colors.white}
|
|
149
|
-
borderColor={theme.colors.primary}
|
|
150
|
-
textStyle={{ color: theme.colors.primary }}
|
|
151
148
|
style={{ borderRadius: 8, width: '100%' }}
|
|
152
149
|
text={t('CANCEL', 'Cancel')}
|
|
153
150
|
/>
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React, { useEffect, useState, useRef } from 'react';
|
|
2
|
-
import { StyleSheet, View, Keyboard, Modal } from 'react-native';
|
|
2
|
+
import { StyleSheet, View, Keyboard, Modal, Platform } from 'react-native';
|
|
3
3
|
import Spinner from 'react-native-loading-spinner-overlay';
|
|
4
4
|
import { useForm, Controller } from 'react-hook-form';
|
|
5
5
|
import { PhoneInputNumber } from '../PhoneInputNumber';
|
|
@@ -108,7 +108,7 @@ const LoginFormUI = (props: LoginParams) => {
|
|
|
108
108
|
|
|
109
109
|
const googleLoginEnabled = configs?.google_login_enabled?.value === '1' || !configs?.google_login_enabled?.enabled
|
|
110
110
|
const facebookLoginEnabled = configs?.facebook_login_enabled?.value === '1' || !configs?.facebook_login_enabled?.enabled
|
|
111
|
-
const appleLoginEnabled = configs?.apple_login_enabled?.value === '1' || !configs?.apple_login_enabled?.enabled
|
|
111
|
+
const appleLoginEnabled = Platform.OS === 'ios' && (configs?.apple_login_enabled?.value === '1' || !configs?.apple_login_enabled?.enabled)
|
|
112
112
|
|
|
113
113
|
const loginStyle = StyleSheet.create({
|
|
114
114
|
btnOutline: {
|
|
@@ -630,6 +630,7 @@ const LoginFormUI = (props: LoginParams) => {
|
|
|
630
630
|
/>
|
|
631
631
|
)
|
|
632
632
|
}
|
|
633
|
+
autoCapitalize='none'
|
|
633
634
|
value={value}
|
|
634
635
|
forwardRef={passwordRef}
|
|
635
636
|
onChange={(val: any) => onChange(val)}
|
|
@@ -706,9 +707,6 @@ const LoginFormUI = (props: LoginParams) => {
|
|
|
706
707
|
<OButton
|
|
707
708
|
onClick={handleSubmit(onSubmit)}
|
|
708
709
|
text={loginTab !== 'otp' ? loginButtonText : t('GET_VERIFY_CODE', 'Get verify code')}
|
|
709
|
-
bgColor={theme.colors.primary}
|
|
710
|
-
borderColor={theme.colors.primary}
|
|
711
|
-
textStyle={{ color: 'white' }}
|
|
712
710
|
imgRightSrc={null}
|
|
713
711
|
isLoading={formState.loading}
|
|
714
712
|
style={{ borderRadius: 7.6, marginTop: 10, marginBottom: 25 }}
|
|
@@ -747,7 +745,6 @@ const LoginFormUI = (props: LoginParams) => {
|
|
|
747
745
|
<OButton
|
|
748
746
|
onClick={handleVerifyCodeClick}
|
|
749
747
|
text={t('GET_VERIFY_CODE', 'Get Verify Code')}
|
|
750
|
-
borderColor={theme.colors.primary}
|
|
751
748
|
style={loginStyle.btnOutline}
|
|
752
749
|
imgRightSrc={null}
|
|
753
750
|
isLoading={isLoadingVerifyModal}
|
|
@@ -802,7 +799,7 @@ const LoginFormUI = (props: LoginParams) => {
|
|
|
802
799
|
handleSuccessGoogleLogin={handleSuccessFacebook}
|
|
803
800
|
/>
|
|
804
801
|
)}
|
|
805
|
-
{(configs?.apple_login_client_id?.value !== '' && configs?.
|
|
802
|
+
{(configs?.apple_login_client_id?.value !== '' && configs?.apple_login_client_id?.value !== null) && appleLoginEnabled && (
|
|
806
803
|
<AppleLogin
|
|
807
804
|
notificationState={notificationState}
|
|
808
805
|
handleErrors={(err: any) => { showToast(ToastType.Error, err), vibrateApp() }}
|
|
@@ -237,6 +237,7 @@ export const MessageListing = (props: MessageListingParams) => {
|
|
|
237
237
|
const [seletedOrder, setSeletedOrder] = useState<any>()
|
|
238
238
|
const [openMessages, setOpenMessges] = useState(false)
|
|
239
239
|
const [, t] = useLanguage()
|
|
240
|
+
const theme = useTheme()
|
|
240
241
|
|
|
241
242
|
const goToBack = () => {
|
|
242
243
|
navigation?.canGoBack() && navigation.goBack()
|
|
@@ -127,12 +127,12 @@ const MessagesUI = (props: MessagesParams) => {
|
|
|
127
127
|
return message.change?.attribute !== 'driver_id'
|
|
128
128
|
?
|
|
129
129
|
`${t('ORDER', 'Order')} ${t(message.change.attribute.toUpperCase(), message.change.attribute.replace('_', ' '))} ${t('CHANGED_FROM', 'Changed from')} ${filterSpecialStatus.includes(message.change.attribute)
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
130
|
+
? `${message.change.old === null ? '0' : message.change.old} ${t('TO', 'to')} ${message.change.new} ${t('MINUTES', 'Minutes')}`
|
|
131
|
+
: `${message.change?.attribute !== 'logistic_status'
|
|
132
|
+
? message.change.old !== null && t(ORDER_STATUS[parseInt(message.change.old, 10)])
|
|
133
|
+
: message.change.old !== null && getLogisticTag(message.change.old)} ${t('TO', 'to')} ${message.change?.attribute !== 'logistic_status'
|
|
134
|
+
? t(ORDER_STATUS[parseInt(message.change.new, 10)])
|
|
135
|
+
: getLogisticTag(message.change.new)}`
|
|
136
136
|
}`
|
|
137
137
|
: message.change.new
|
|
138
138
|
?
|
|
@@ -461,7 +461,7 @@ const MessagesUI = (props: MessagesParams) => {
|
|
|
461
461
|
active={business}
|
|
462
462
|
>
|
|
463
463
|
<OIcon
|
|
464
|
-
url={order?.business?.logo
|
|
464
|
+
url={order?.business?.logo}
|
|
465
465
|
width={32}
|
|
466
466
|
height={32}
|
|
467
467
|
style={{ borderRadius: 32 }}
|
|
@@ -503,6 +503,7 @@ const MessagesUI = (props: MessagesParams) => {
|
|
|
503
503
|
scrollToBottom
|
|
504
504
|
renderAvatarOnTop
|
|
505
505
|
renderUsernameOnMessage
|
|
506
|
+
renderAvatar={() => null}
|
|
506
507
|
renderInputToolbar={renderInputToolbar}
|
|
507
508
|
renderComposer={renderComposer}
|
|
508
509
|
renderSend={renderSend}
|
|
@@ -29,7 +29,7 @@ import {
|
|
|
29
29
|
TimeItem
|
|
30
30
|
} from './styles';
|
|
31
31
|
import { useSafeAreaInsets } from 'react-native-safe-area-context';
|
|
32
|
-
import {
|
|
32
|
+
import { monthsEnum, setLocalMoment } from '../../utils';
|
|
33
33
|
|
|
34
34
|
const MomentOptionUI = (props: MomentOptionParams) => {
|
|
35
35
|
const {
|
|
@@ -323,6 +323,10 @@ const MomentOptionUI = (props: MomentOptionParams) => {
|
|
|
323
323
|
}
|
|
324
324
|
}, [dateSelected, JSON.stringify(hoursList), JSON.stringify(datesWhitelist), cateringPreorder, JSON.stringify(business)])
|
|
325
325
|
|
|
326
|
+
useEffect(() => {
|
|
327
|
+
setLocalMoment(moment, t)
|
|
328
|
+
}, [])
|
|
329
|
+
|
|
326
330
|
return (
|
|
327
331
|
<>
|
|
328
332
|
<Container
|
|
@@ -468,7 +472,14 @@ const MomentOptionUI = (props: MomentOptionParams) => {
|
|
|
468
472
|
</Container>
|
|
469
473
|
{!isCart && !cateringPreorder && (
|
|
470
474
|
<View style={{ position: 'absolute', bottom: bottom, paddingBottom: 20, paddingHorizontal: 20, backgroundColor: 'white', width: '100%' }}>
|
|
471
|
-
<OButton
|
|
475
|
+
<OButton
|
|
476
|
+
onClick={() => handleChangeMoment()}
|
|
477
|
+
isDisabled={!selectedTime}
|
|
478
|
+
text={t('CONTINUE', 'Continue')}
|
|
479
|
+
style={{ borderRadius: 7.6, height: 44, shadowOpacity: 0 }}
|
|
480
|
+
textStyle={{ fontSize: 14 }}
|
|
481
|
+
showNextIcon
|
|
482
|
+
/>
|
|
472
483
|
</View>
|
|
473
484
|
)}
|
|
474
485
|
</>
|
|
@@ -51,7 +51,7 @@ const MultiCartsPaymethodsAndWalletsUI = (props: any) => {
|
|
|
51
51
|
const { confirmApplePayPayment } = useApplePay()
|
|
52
52
|
|
|
53
53
|
const [addCardOpen, setAddCardOpen] = useState({ stripe: false, stripeConnect: false });
|
|
54
|
-
|
|
54
|
+
const [newCardAdded, setNewCardAdded] = useState(null)
|
|
55
55
|
const isWalletCashEnabled = configs?.wallet_cash_enabled?.value === '1'
|
|
56
56
|
const isWalletPointsEnabled = configs?.wallet_credit_point_enabled?.value === '1'
|
|
57
57
|
|
|
@@ -223,6 +223,8 @@ const MultiCartsPaymethodsAndWalletsUI = (props: any) => {
|
|
|
223
223
|
handlePaymethodDataChange={handlePaymethodDataChange}
|
|
224
224
|
clientSecret={props.clientSecret}
|
|
225
225
|
onPaymentChange={handlePaymethodDataChange}
|
|
226
|
+
newCardAdded={newCardAdded}
|
|
227
|
+
addNewCardAsDefault
|
|
226
228
|
/>
|
|
227
229
|
</View>
|
|
228
230
|
)}
|
|
@@ -233,6 +235,7 @@ const MultiCartsPaymethodsAndWalletsUI = (props: any) => {
|
|
|
233
235
|
toSave
|
|
234
236
|
businessId={businessIds[0]}
|
|
235
237
|
businessIds={businessIds}
|
|
238
|
+
businessNames={openCarts?.map?.((cart: any) => cart?.business?.name)}
|
|
236
239
|
publicKey={paymethodSelected?.data?.publishable}
|
|
237
240
|
requirements={props.clientSecret}
|
|
238
241
|
handleSource={handlePaymethodDataChange}
|
|
@@ -306,7 +309,7 @@ const MultiCartsPaymethodsAndWalletsUI = (props: any) => {
|
|
|
306
309
|
</>
|
|
307
310
|
)}
|
|
308
311
|
|
|
309
|
-
|
|
312
|
+
<OModal
|
|
310
313
|
entireModal
|
|
311
314
|
title={t('ADD_CREDIT_OR_DEBIT_CARD', 'Add credit or debit card')}
|
|
312
315
|
open={addCardOpen.stripe}
|
|
@@ -326,10 +329,11 @@ const MultiCartsPaymethodsAndWalletsUI = (props: any) => {
|
|
|
326
329
|
publicKey={paymethodSelected?.data?.publishable}
|
|
327
330
|
requirements={props.clientSecret}
|
|
328
331
|
onSelectCard={handlePaymethodDataChange}
|
|
332
|
+
setNewCardAdded={setNewCardAdded}
|
|
329
333
|
onCancel={() => setAddCardOpen({ ...addCardOpen, stripe: false })}
|
|
330
334
|
/>
|
|
331
335
|
</KeyboardAvoidingView>
|
|
332
|
-
</OModal>
|
|
336
|
+
</OModal>
|
|
333
337
|
</PMContainer>
|
|
334
338
|
)
|
|
335
339
|
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React, { useState, useEffect } from 'react'
|
|
1
|
+
import React, { useState, useEffect, useCallback } from 'react'
|
|
2
2
|
import {
|
|
3
3
|
useLanguage,
|
|
4
4
|
useConfig,
|
|
@@ -10,8 +10,9 @@ import {
|
|
|
10
10
|
ToastType,
|
|
11
11
|
MultiCheckout as MultiCheckoutController
|
|
12
12
|
} from 'ordering-components/native'
|
|
13
|
-
import { View, StyleSheet, Platform, ScrollView } from 'react-native'
|
|
13
|
+
import { View, StyleSheet, Platform, ScrollView, SafeAreaView } from 'react-native'
|
|
14
14
|
import { useTheme } from 'styled-components/native';
|
|
15
|
+
import IconAntDesign from 'react-native-vector-icons/AntDesign';
|
|
15
16
|
import { Container } from '../../layouts/Container';
|
|
16
17
|
import NavBar from '../NavBar';
|
|
17
18
|
import { OText, OIcon, OModal, OButton } from '../shared';
|
|
@@ -30,6 +31,8 @@ import { SignupForm } from '../SignupForm'
|
|
|
30
31
|
import { LoginForm } from '../LoginForm'
|
|
31
32
|
|
|
32
33
|
import {
|
|
34
|
+
TopHeader,
|
|
35
|
+
TopActions,
|
|
33
36
|
ChContainer,
|
|
34
37
|
ChSection,
|
|
35
38
|
ChHeader,
|
|
@@ -76,11 +79,15 @@ const MultiCheckoutUI = (props: any) => {
|
|
|
76
79
|
paddingLeft: 20,
|
|
77
80
|
paddingRight: 20
|
|
78
81
|
},
|
|
79
|
-
wrapperNavbar: {
|
|
82
|
+
wrapperNavbar: {
|
|
83
|
+
paddingHorizontal: 20,
|
|
84
|
+
backgroundColor: theme?.colors?.white,
|
|
85
|
+
borderWidth: 0
|
|
86
|
+
},
|
|
80
87
|
detailWrapper: {
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
88
|
+
paddingHorizontal: 20,
|
|
89
|
+
width: '100%'
|
|
90
|
+
},
|
|
84
91
|
})
|
|
85
92
|
|
|
86
93
|
const [, { showToast }] = useToast();
|
|
@@ -136,15 +143,17 @@ const MultiCheckoutUI = (props: any) => {
|
|
|
136
143
|
?.reduce((sum: any, cart: any) => sum + clearAmount((cart?.subtotal + getIncludedTaxes(cart)) * accumulationRateBusiness(cart?.business_id)), 0)
|
|
137
144
|
?.toFixed(configs.format_number_decimal_length?.value ?? 2)
|
|
138
145
|
|
|
146
|
+
const [showTitle, setShowTitle] = useState(false)
|
|
139
147
|
const [isUserDetailsEdit, setIsUserDetailsEdit] = useState(false);
|
|
140
148
|
const [phoneUpdate, setPhoneUpdate] = useState(false);
|
|
141
149
|
const [userErrors, setUserErrors] = useState<any>([]);
|
|
150
|
+
const [cartsOpened, setCartsOpened] = useState([])
|
|
142
151
|
const [placeByMethodPay, setPlaceByMethodPay] = useState(false)
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
152
|
+
const [allowedGuest, setAllowedGuest] = useState(false)
|
|
153
|
+
const [isOpen, setIsOpen] = useState(false)
|
|
154
|
+
const [requiredFields, setRequiredFields] = useState<any>([])
|
|
155
|
+
const stripePaymethods: any = ['stripe', 'stripe_direct', 'stripe_connect', 'stripe_redirect']
|
|
156
|
+
const [openModal, setOpenModal] = useState({ login: false, signup: false, isGuest: false })
|
|
148
157
|
const [methodPaySupported, setMethodPaySupported] = useState({ enabled: false, message: null, loading: true })
|
|
149
158
|
const methodsPay = ['global_google_pay', 'global_apple_pay']
|
|
150
159
|
const isDisablePlaceOrderButton = cartGroup?.loading || placing || (!(paymethodSelected?.paymethod_id || paymethodSelected?.wallet_id) && cartGroup?.result?.balance > 0) ||
|
|
@@ -162,7 +171,7 @@ const MultiCheckoutUI = (props: any) => {
|
|
|
162
171
|
setUserErrors([])
|
|
163
172
|
const errors = []
|
|
164
173
|
const notFields = ['coupon', 'driver_tip', 'mobile_phone', 'address', 'zipcode', 'address_notes']
|
|
165
|
-
|
|
174
|
+
const _requiredFields: any = []
|
|
166
175
|
|
|
167
176
|
Object.values(validationFields?.fields?.checkout).map((field: any) => {
|
|
168
177
|
if (field?.required && !notFields.includes(field.code)) {
|
|
@@ -180,7 +189,7 @@ const MultiCheckoutUI = (props: any) => {
|
|
|
180
189
|
) {
|
|
181
190
|
_requiredFields.push('cellphone')
|
|
182
191
|
}
|
|
183
|
-
|
|
192
|
+
setRequiredFields(_requiredFields)
|
|
184
193
|
|
|
185
194
|
if (phoneUpdate) {
|
|
186
195
|
errors.push(t('NECESSARY_UPDATE_COUNTRY_PHONE_CODE', 'It is necessary to update your phone number'))
|
|
@@ -195,18 +204,18 @@ const MultiCheckoutUI = (props: any) => {
|
|
|
195
204
|
|
|
196
205
|
const handlePlaceOrder = (confirmPayment?: any) => {
|
|
197
206
|
if (stripePaymethods.includes(paymethodSelected?.gateway) && user?.guest_id) {
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
207
|
+
setOpenModal({ ...openModal, signup: true, isGuest: true })
|
|
208
|
+
return
|
|
209
|
+
}
|
|
201
210
|
|
|
202
211
|
if (!userErrors.length && (!requiredFields?.length || allowedGuest)) {
|
|
203
212
|
handleGroupPlaceOrder && handleGroupPlaceOrder(confirmPayment)
|
|
204
213
|
return
|
|
205
214
|
}
|
|
206
215
|
if (requiredFields?.length) {
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
216
|
+
setIsOpen(true)
|
|
217
|
+
return
|
|
218
|
+
}
|
|
210
219
|
let stringError = ''
|
|
211
220
|
Object.values(userErrors).map((item: any, i: number) => {
|
|
212
221
|
stringError += (i + 1) === userErrors.length ? `- ${item?.message || item}` : `- ${item?.message || item}\n`
|
|
@@ -216,22 +225,34 @@ const MultiCheckoutUI = (props: any) => {
|
|
|
216
225
|
}
|
|
217
226
|
|
|
218
227
|
const handlePlaceOrderAsGuest = () => {
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
228
|
+
setIsOpen(false)
|
|
229
|
+
handleGroupPlaceOrder && handleGroupPlaceOrder()
|
|
230
|
+
}
|
|
222
231
|
|
|
223
232
|
const handleSuccessSignup = (user: any) => {
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
233
|
+
login({
|
|
234
|
+
user,
|
|
235
|
+
token: user?.session?.access_token
|
|
236
|
+
})
|
|
237
|
+
openModal?.isGuest && handlePlaceOrderAsGuest()
|
|
238
|
+
setOpenModal({ ...openModal, signup: false, isGuest: false })
|
|
239
|
+
}
|
|
240
|
+
|
|
241
|
+
const handleSuccessLogin = (user: any) => {
|
|
242
|
+
if (user) setOpenModal({ ...openModal, login: false })
|
|
243
|
+
}
|
|
244
|
+
|
|
245
|
+
const handleScroll = ({ nativeEvent: { contentOffset } }: any) => {
|
|
246
|
+
setShowTitle(contentOffset.y > 30)
|
|
247
|
+
}
|
|
248
|
+
|
|
249
|
+
const handleGoBack = () => {
|
|
250
|
+
if (navigation?.canGoBack()) {
|
|
251
|
+
navigation.goBack()
|
|
252
|
+
} else {
|
|
253
|
+
navigation.navigate('BottomTab', { screen: 'Cart' })
|
|
254
|
+
}
|
|
255
|
+
}
|
|
235
256
|
|
|
236
257
|
useEffect(() => {
|
|
237
258
|
if (validationFields && validationFields?.fields?.checkout) {
|
|
@@ -271,17 +292,58 @@ const MultiCheckoutUI = (props: any) => {
|
|
|
271
292
|
}
|
|
272
293
|
}, [paymethodSelected])
|
|
273
294
|
|
|
295
|
+
const changeActiveState = useCallback((isClosed: boolean, uuid: string) => {
|
|
296
|
+
const isActive = cartsOpened?.includes?.(uuid)
|
|
297
|
+
if (isActive || !isClosed) {
|
|
298
|
+
setCartsOpened(cartsOpened?.filter?.((_uuid) => _uuid !== uuid))
|
|
299
|
+
} else {
|
|
300
|
+
setCartsOpened([
|
|
301
|
+
...cartsOpened,
|
|
302
|
+
uuid
|
|
303
|
+
])
|
|
304
|
+
}
|
|
305
|
+
}, [cartsOpened])
|
|
306
|
+
|
|
274
307
|
return (
|
|
275
308
|
<>
|
|
276
|
-
<
|
|
309
|
+
<SafeAreaView style={{ backgroundColor: theme.colors.backgroundPage }}>
|
|
310
|
+
<View style={styles.wrapperNavbar}>
|
|
311
|
+
<TopHeader>
|
|
312
|
+
<>
|
|
313
|
+
<TopActions onPress={() => handleGoBack()}>
|
|
314
|
+
<IconAntDesign
|
|
315
|
+
name='arrowleft'
|
|
316
|
+
size={26}
|
|
317
|
+
/>
|
|
318
|
+
</TopActions>
|
|
319
|
+
{showTitle && (
|
|
320
|
+
<OText
|
|
321
|
+
size={16}
|
|
322
|
+
style={{ flex: 1, textAlign: 'center', right: 15 }}
|
|
323
|
+
weight={Platform.OS === 'ios' ? '600' : 'bold'}
|
|
324
|
+
numberOfLines={2}
|
|
325
|
+
ellipsizeMode='tail'
|
|
326
|
+
>
|
|
327
|
+
{t('CHECKOUT', 'Checkout')}
|
|
328
|
+
</OText>
|
|
329
|
+
)}
|
|
330
|
+
</>
|
|
331
|
+
</TopHeader>
|
|
332
|
+
</View>
|
|
333
|
+
</SafeAreaView>
|
|
334
|
+
<Container pt={0} noPadding onScroll={handleScroll} showsVerticalScrollIndicator={false}>
|
|
277
335
|
<View style={styles.wrapperNavbar}>
|
|
278
336
|
<NavBar
|
|
337
|
+
hideArrowLeft
|
|
279
338
|
title={t('CHECKOUT', 'Checkout')}
|
|
280
339
|
titleAlign={'center'}
|
|
281
340
|
onActionLeft={() => navigation?.canGoBack() && navigation.goBack()}
|
|
282
341
|
showCall={false}
|
|
283
342
|
paddingTop={Platform.OS === 'ios' ? 0 : 4}
|
|
284
343
|
btnStyle={{ paddingLeft: 0 }}
|
|
344
|
+
titleWrapStyle={{ paddingHorizontal: 0 }}
|
|
345
|
+
titleStyle={{ marginRight: 0, marginLeft: 0 }}
|
|
346
|
+
style={{ marginTop: 20 }}
|
|
285
347
|
/>
|
|
286
348
|
</View>
|
|
287
349
|
<ChContainer style={styles.pagePadding}>
|
|
@@ -332,15 +394,11 @@ const MultiCheckoutUI = (props: any) => {
|
|
|
332
394
|
</OText>
|
|
333
395
|
<OButton
|
|
334
396
|
text={t('SIGN_UP', 'Sign up')}
|
|
335
|
-
textStyle={{ color: theme.colors.white }}
|
|
336
397
|
style={{ borderRadius: 7.6, marginTop: 20 }}
|
|
337
398
|
onClick={() => setOpenModal({ ...openModal, signup: true })}
|
|
338
399
|
/>
|
|
339
400
|
<OButton
|
|
340
401
|
text={t('LOGIN', 'Login')}
|
|
341
|
-
textStyle={{ color: theme.colors.primary }}
|
|
342
|
-
bgColor={theme.colors.white}
|
|
343
|
-
borderColor={theme.colors.primary}
|
|
344
402
|
style={{ borderRadius: 7.6, marginTop: 20 }}
|
|
345
403
|
onClick={() => setOpenModal({ ...openModal, login: true })}
|
|
346
404
|
/>
|
|
@@ -473,6 +531,9 @@ const MultiCheckoutUI = (props: any) => {
|
|
|
473
531
|
hideDriverTip={configs?.multi_business_checkout_show_combined_driver_tip?.value === '1'}
|
|
474
532
|
onNavigationRedirect={(route: string, params: any) => props.navigation.navigate(route, params)}
|
|
475
533
|
businessConfigs={cart?.business?.configs}
|
|
534
|
+
cartsOpened={cartsOpened}
|
|
535
|
+
changeActiveState={changeActiveState}
|
|
536
|
+
isActive={cartsOpened?.includes?.(cart?.uuid)}
|
|
476
537
|
/>
|
|
477
538
|
{openCarts.length > 1 && (
|
|
478
539
|
<View style={{ height: 8, backgroundColor: theme.colors.backgroundGray100, marginTop: 13, marginHorizontal: -40 }} />
|
|
@@ -582,30 +643,30 @@ const MultiCheckoutUI = (props: any) => {
|
|
|
582
643
|
</ScrollView>
|
|
583
644
|
</OModal>
|
|
584
645
|
<OModal
|
|
585
|
-
|
|
586
|
-
|
|
587
|
-
|
|
588
|
-
|
|
589
|
-
|
|
590
|
-
|
|
591
|
-
|
|
592
|
-
|
|
593
|
-
|
|
594
|
-
|
|
595
|
-
|
|
596
|
-
|
|
597
|
-
|
|
598
|
-
|
|
599
|
-
|
|
600
|
-
|
|
601
|
-
|
|
602
|
-
|
|
603
|
-
|
|
604
|
-
|
|
605
|
-
|
|
606
|
-
|
|
607
|
-
|
|
608
|
-
|
|
646
|
+
open={isOpen}
|
|
647
|
+
onClose={() => setIsOpen(false)}
|
|
648
|
+
>
|
|
649
|
+
<View style={styles.detailWrapper}>
|
|
650
|
+
<UserDetails
|
|
651
|
+
isUserDetailsEdit
|
|
652
|
+
useValidationFields
|
|
653
|
+
useDefualtSessionManager
|
|
654
|
+
useSessionUser
|
|
655
|
+
isCheckout
|
|
656
|
+
isEdit
|
|
657
|
+
phoneUpdate={phoneUpdate}
|
|
658
|
+
togglePhoneUpdate={togglePhoneUpdate}
|
|
659
|
+
requiredFields={requiredFields}
|
|
660
|
+
hideUpdateButton
|
|
661
|
+
handlePlaceOrderAsGuest={handlePlaceOrderAsGuest}
|
|
662
|
+
onClose={() => {
|
|
663
|
+
setIsOpen(false)
|
|
664
|
+
handlePlaceOrder()
|
|
665
|
+
}}
|
|
666
|
+
setIsOpen={setIsOpen}
|
|
667
|
+
/>
|
|
668
|
+
</View>
|
|
669
|
+
</OModal>
|
|
609
670
|
</Container>
|
|
610
671
|
|
|
611
672
|
<FloatingButton
|
|
@@ -1,5 +1,22 @@
|
|
|
1
1
|
import styled from 'styled-components/native'
|
|
2
2
|
|
|
3
|
+
export const TopActions = styled.TouchableOpacity`
|
|
4
|
+
height: 60px;
|
|
5
|
+
justify-content: center;
|
|
6
|
+
min-width: 30px;
|
|
7
|
+
padding-right: 15px;
|
|
8
|
+
`;
|
|
9
|
+
|
|
10
|
+
export const TopHeader = styled.View`
|
|
11
|
+
width: 100%;
|
|
12
|
+
flex-direction: row;
|
|
13
|
+
align-items: center;
|
|
14
|
+
justify-content: space-between;
|
|
15
|
+
z-index: 1;
|
|
16
|
+
height: 60px;
|
|
17
|
+
min-height: 60px;
|
|
18
|
+
`
|
|
19
|
+
|
|
3
20
|
export const ChContainer = styled.View`
|
|
4
21
|
margin-bottom: 60px;
|
|
5
22
|
`
|
|
@@ -53,6 +53,7 @@ export const MultiOrdersDetailsUI = (props: any) => {
|
|
|
53
53
|
const [{ configs }] = useConfig()
|
|
54
54
|
|
|
55
55
|
const isTaxIncludedOnPrice = orders.every((_order: any) => _order.taxes?.length ? _order.taxes?.every((_tax: any) => _tax.type === 1) : true)
|
|
56
|
+
const deliveryType = orders.find((order: any) => order.delivery_type)?.delivery_type
|
|
56
57
|
const progressBarStyle = configs.multi_business_checkout_progress_bar_style?.value
|
|
57
58
|
const showBarInOrder = ['group', 'both']
|
|
58
59
|
const showBarInIndividual = ['individual', 'both']
|
|
@@ -71,7 +72,7 @@ export const MultiOrdersDetailsUI = (props: any) => {
|
|
|
71
72
|
navigation?.canGoBack() && navigation.goBack();
|
|
72
73
|
return;
|
|
73
74
|
}
|
|
74
|
-
navigation.navigate('
|
|
75
|
+
navigation.navigate('BottomTab');
|
|
75
76
|
return true
|
|
76
77
|
}
|
|
77
78
|
|
|
@@ -100,6 +101,7 @@ export const MultiOrdersDetailsUI = (props: any) => {
|
|
|
100
101
|
style={styles.btnBackArrow}
|
|
101
102
|
onClick={() => handleArrowBack()}
|
|
102
103
|
icon={AntDesignIcon}
|
|
104
|
+
useArrow
|
|
103
105
|
iconProps={{
|
|
104
106
|
name: 'arrowleft',
|
|
105
107
|
size: 26
|
|
@@ -171,19 +173,23 @@ export const MultiOrdersDetailsUI = (props: any) => {
|
|
|
171
173
|
))}
|
|
172
174
|
</Section>
|
|
173
175
|
<Divider />
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
176
|
+
{deliveryType === 1 && (
|
|
177
|
+
<>
|
|
178
|
+
<Section>
|
|
179
|
+
<OText size={16} lineHeight={24} weight={'500'} color={theme.colors.textNormal} mBottom={20}>
|
|
180
|
+
{t('DELIVERYA_V21', 'Delivery address')}
|
|
181
|
+
</OText>
|
|
182
|
+
{loading ? (
|
|
183
|
+
<PlaceholderLine height={18} noMargin style={{ borderRadius: 2 }} />
|
|
184
|
+
) : (
|
|
185
|
+
<OText size={12} lineHeight={18} color={theme.colors.textNormal} mBottom={2}>
|
|
186
|
+
{customer?.address}
|
|
187
|
+
</OText>
|
|
188
|
+
)}
|
|
189
|
+
</Section>
|
|
190
|
+
<Divider />
|
|
191
|
+
</>
|
|
192
|
+
)}
|
|
187
193
|
{loading ? (
|
|
188
194
|
<Placeholder Animation={Fade}>
|
|
189
195
|
<PlaceholderLine
|