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.
Files changed (165) hide show
  1. package/package.json +6 -7
  2. package/src/DeliveryApp.tsx +43 -1
  3. package/src/components/BusinessesListing/index.tsx +1 -1
  4. package/src/components/PaymentOptionsWebView/index.tsx +1 -0
  5. package/src/components/StripeMethodForm/index.tsx +6 -4
  6. package/src/components/VerifyPhone/styles.tsx +1 -2
  7. package/src/types/index.tsx +3 -1
  8. package/themes/business/index.tsx +4 -0
  9. package/themes/business/src/components/AcceptOrRejectOrder/index.tsx +9 -6
  10. package/themes/business/src/components/AcceptOrRejectOrder/styles.tsx +1 -0
  11. package/themes/business/src/components/BusinessProductList/index.tsx +2 -1
  12. package/themes/business/src/components/Chat/index.tsx +3 -1
  13. package/themes/business/src/components/DriverMap/index.tsx +44 -27
  14. package/themes/business/src/components/GoogleMap/index.tsx +15 -8
  15. package/themes/business/src/components/Home/index.tsx +5 -1
  16. package/themes/business/src/components/LanguageSelector/index.tsx +2 -3
  17. package/themes/business/src/components/LanguageSelector/lang_country.json +515 -70
  18. package/themes/business/src/components/LogoutButton/index.tsx +1 -1
  19. package/themes/business/src/components/MapView/index.tsx +36 -17
  20. package/themes/business/src/components/NewOrderNotification/index.tsx +74 -24
  21. package/themes/business/src/components/OrderDetails/Business.tsx +65 -7
  22. package/themes/business/src/components/OrderDetails/Delivery.tsx +35 -20
  23. package/themes/business/src/components/OrderDetails/OrderContentComponent.tsx +110 -40
  24. package/themes/business/src/components/OrderDetails/OrderHeaderComponent.tsx +61 -35
  25. package/themes/business/src/components/OrderDetails/styles.tsx +39 -3
  26. package/themes/business/src/components/OrderDetails/usePrinterCommands.tsx +220 -0
  27. package/themes/business/src/components/OrderSummary/index.tsx +219 -71
  28. package/themes/business/src/components/OrdersListManager/index.tsx +9 -1
  29. package/themes/business/src/components/OrdersOption/index.tsx +247 -159
  30. package/themes/business/src/components/PhoneInputNumber/index.tsx +8 -5
  31. package/themes/business/src/components/PreviousMessages/index.tsx +12 -0
  32. package/themes/business/src/components/PreviousOrders/OrderItem.tsx +25 -15
  33. package/themes/business/src/components/PreviousOrders/index.tsx +5 -3
  34. package/themes/business/src/components/PrinterEdition/index.tsx +363 -0
  35. package/themes/business/src/components/PrinterEdition/styles.tsx +61 -0
  36. package/themes/business/src/components/PrinterSettings/index.tsx +267 -0
  37. package/themes/business/src/components/PrinterSettings/styles.tsx +30 -0
  38. package/themes/business/src/components/ProductItemAccordion/index.tsx +2 -2
  39. package/themes/business/src/components/ReviewCustomer/index.tsx +2 -0
  40. package/themes/business/src/components/Sessions/index.tsx +187 -0
  41. package/themes/business/src/components/Sessions/styles.tsx +20 -0
  42. package/themes/business/src/components/StoresList/index.tsx +2 -2
  43. package/themes/business/src/components/UserFormDetails/index.tsx +111 -107
  44. package/themes/business/src/components/UserProfileForm/index.tsx +85 -49
  45. package/themes/business/src/components/WebsocketStatus/index.tsx +2 -2
  46. package/themes/business/src/components/shared/OInput.tsx +2 -0
  47. package/themes/business/src/components/shared/OTextarea.tsx +8 -9
  48. package/themes/business/src/hooks/useLocation.tsx +5 -4
  49. package/themes/business/src/types/index.tsx +22 -4
  50. package/themes/business/src/utils/index.tsx +19 -1
  51. package/themes/doordash/src/components/BusinessesListing/index.tsx +1 -1
  52. package/themes/doordash/src/components/LoginForm/index.tsx +1 -2
  53. package/themes/instacart/src/components/BusinessesListing/index.tsx +1 -1
  54. package/themes/kiosk/src/components/Checkout/index.tsx +6 -0
  55. package/themes/kiosk/src/components/NavBar/index.tsx +14 -14
  56. package/themes/kiosk/src/components/OptionCard/index.tsx +1 -1
  57. package/themes/kiosk/src/components/OrderTypeCardSelector/index.tsx +8 -10
  58. package/themes/kiosk/src/components/shared/OButton.tsx +5 -18
  59. package/themes/original/index.tsx +13 -1
  60. package/themes/original/src/components/AddressDetails/index.tsx +20 -10
  61. package/themes/original/src/components/AddressForm/index.tsx +32 -17
  62. package/themes/original/src/components/AddressList/index.tsx +8 -7
  63. package/themes/original/src/components/AnalyticsSegment/index.tsx +6 -6
  64. package/themes/original/src/components/AppleLogin/index.tsx +4 -4
  65. package/themes/original/src/components/BusinessBasicInformation/index.tsx +6 -9
  66. package/themes/original/src/components/BusinessController/index.tsx +12 -7
  67. package/themes/original/src/components/BusinessItemAccordion/index.tsx +13 -5
  68. package/themes/original/src/components/BusinessListingSearch/BusinessSearchFooter.tsx +2 -3
  69. package/themes/original/src/components/BusinessListingSearch/BusinessSearchHeader.tsx +1 -3
  70. package/themes/original/src/components/BusinessListingSearch/index.tsx +1 -2
  71. package/themes/original/src/components/BusinessPreorder/index.tsx +20 -15
  72. package/themes/original/src/components/BusinessProductsList/SubcategoriesComponent/index.tsx +5 -5
  73. package/themes/original/src/components/BusinessProductsList/index.tsx +3 -3
  74. package/themes/original/src/components/BusinessProductsList/styles.tsx +0 -3
  75. package/themes/original/src/components/BusinessProductsListing/index.tsx +15 -4
  76. package/themes/original/src/components/BusinessTypeFilter/index.tsx +9 -8
  77. package/themes/original/src/components/BusinessesListing/Layout/Appointment/index.tsx +2 -1
  78. package/themes/original/src/components/BusinessesListing/Layout/Original/index.tsx +1 -1
  79. package/themes/original/src/components/BusinessesListing/Layout/Original/styles.tsx +1 -1
  80. package/themes/original/src/components/BusinessesListing/index.tsx +0 -1
  81. package/themes/original/src/components/Cart/index.tsx +39 -12
  82. package/themes/original/src/components/CartContent/index.tsx +59 -44
  83. package/themes/original/src/components/Checkout/index.tsx +31 -25
  84. package/themes/original/src/components/CitiesControl/index.tsx +0 -3
  85. package/themes/original/src/components/CouponControl/index.tsx +1 -3
  86. package/themes/original/src/components/DriverTips/index.tsx +1 -3
  87. package/themes/original/src/components/Favorite/index.tsx +1 -5
  88. package/themes/original/src/components/FavoriteList/index.tsx +0 -1
  89. package/themes/original/src/components/ForgotPasswordForm/index.tsx +5 -7
  90. package/themes/original/src/components/GiftCard/GiftCardOrdersList/index.tsx +64 -0
  91. package/themes/original/src/components/GiftCard/GiftCardOrdersList/styles.tsx +8 -0
  92. package/themes/original/src/components/GiftCard/GiftCardUI/index.tsx +15 -17
  93. package/themes/original/src/components/GiftCard/PurchaseGiftCard/index.tsx +3 -7
  94. package/themes/original/src/components/GiftCard/RedeemGiftCard/index.tsx +24 -32
  95. package/themes/original/src/components/GiftCard/SendGiftCard/index.tsx +7 -9
  96. package/themes/original/src/components/GiftCard/SingleGiftCard/index.tsx +101 -0
  97. package/themes/original/src/components/GiftCard/SingleGiftCard/styles.tsx +4 -0
  98. package/themes/original/src/components/GiftCard/VerticalGiftCardOrdersLayout/index.tsx +82 -0
  99. package/themes/original/src/components/GiftCard/VerticalGiftCardOrdersLayout/styles.tsx +9 -0
  100. package/themes/original/src/components/GoogleMap/index.tsx +39 -18
  101. package/themes/original/src/components/Help/index.tsx +2 -0
  102. package/themes/original/src/components/HighestRatedBusinesses/index.tsx +1 -1
  103. package/themes/original/src/components/Home/index.tsx +2 -10
  104. package/themes/original/src/components/LoginForm/Otp/index.tsx +0 -3
  105. package/themes/original/src/components/LoginForm/index.tsx +4 -7
  106. package/themes/original/src/components/MessageListing/index.tsx +1 -0
  107. package/themes/original/src/components/Messages/index.tsx +8 -7
  108. package/themes/original/src/components/MomentOption/index.tsx +13 -2
  109. package/themes/original/src/components/MultiCartsPaymethodsAndWallets/index.tsx +7 -3
  110. package/themes/original/src/components/MultiCheckout/index.tsx +123 -62
  111. package/themes/original/src/components/MultiCheckout/styles.tsx +17 -0
  112. package/themes/original/src/components/MultiOrdersDetails/index.tsx +20 -14
  113. package/themes/original/src/components/MyOrders/index.tsx +21 -26
  114. package/themes/original/src/components/NavBar/index.tsx +4 -2
  115. package/themes/original/src/components/NetworkError/index.tsx +0 -5
  116. package/themes/original/src/components/NotFoundSource/index.tsx +0 -3
  117. package/themes/original/src/components/OrderDetails/OrderEta.tsx +1 -1
  118. package/themes/original/src/components/OrderDetails/OrderHistory.tsx +5 -7
  119. package/themes/original/src/components/OrderDetails/index.tsx +26 -9
  120. package/themes/original/src/components/OrderDetails/styles.tsx +0 -1
  121. package/themes/original/src/components/OrderProgress/index.tsx +22 -3
  122. package/themes/original/src/components/OrderSummary/index.tsx +23 -5
  123. package/themes/original/src/components/OrderTypeSelector/index.tsx +7 -6
  124. package/themes/original/src/components/OrdersOption/index.tsx +2 -4
  125. package/themes/original/src/components/PaymentOptionStripe/index.tsx +0 -5
  126. package/themes/original/src/components/PaymentOptionWallet/index.tsx +56 -56
  127. package/themes/original/src/components/PaymentOptions/index.tsx +46 -5
  128. package/themes/original/src/components/PlaceSpot/index.tsx +1 -3
  129. package/themes/original/src/components/PreviousOrders/index.tsx +1 -2
  130. package/themes/original/src/components/ProductForm/ActionButton.tsx +16 -19
  131. package/themes/original/src/components/ProductForm/index.tsx +108 -105
  132. package/themes/original/src/components/ProductItemAccordion/index.tsx +55 -49
  133. package/themes/original/src/components/ProductItemAccordion/styles.tsx +3 -4
  134. package/themes/original/src/components/ProductOptionSubOption/index.tsx +8 -1
  135. package/themes/original/src/components/ProfessionalProfile/index.tsx +4 -5
  136. package/themes/original/src/components/Promotions/index.tsx +6 -9
  137. package/themes/original/src/components/ReviewDriver/index.tsx +1 -1
  138. package/themes/original/src/components/ReviewOrder/index.tsx +2 -2
  139. package/themes/original/src/components/ReviewProducts/index.tsx +1 -1
  140. package/themes/original/src/components/ReviewTrigger/index.tsx +2 -2
  141. package/themes/original/src/components/ServiceForm/index.tsx +52 -54
  142. package/themes/original/src/components/Sessions/index.tsx +3 -3
  143. package/themes/original/src/components/SignupForm/index.tsx +86 -78
  144. package/themes/original/src/components/SingleOrderCard/index.tsx +1 -2
  145. package/themes/original/src/components/SingleProductCard/index.tsx +5 -6
  146. package/themes/original/src/components/SingleProductCard/styles.tsx +0 -3
  147. package/themes/original/src/components/StripeCardForm/index.tsx +0 -3
  148. package/themes/original/src/components/StripeCardsList/index.tsx +10 -35
  149. package/themes/original/src/components/StripeElementsForm/index.tsx +78 -59
  150. package/themes/original/src/components/StripeElementsForm/naked.tsx +48 -1
  151. package/themes/original/src/components/StripeRedirectForm/index.tsx +0 -3
  152. package/themes/original/src/components/TaxInformation/index.tsx +3 -2
  153. package/themes/original/src/components/UpsellingProducts/UpsellingContent.tsx +10 -7
  154. package/themes/original/src/components/UpsellingProducts/UpsellingLayout.tsx +8 -3
  155. package/themes/original/src/components/UserFormDetails/index.tsx +98 -87
  156. package/themes/original/src/components/UserProfile/index.tsx +11 -2
  157. package/themes/original/src/components/Wallets/index.tsx +6 -3
  158. package/themes/original/src/components/WebsocketStatus/index.tsx +169 -0
  159. package/themes/original/src/components/WebsocketStatus/styles.tsx +28 -0
  160. package/themes/original/src/components/shared/OAlert.tsx +2 -1
  161. package/themes/original/src/components/shared/OButton.tsx +5 -4
  162. package/themes/original/src/components/shared/OInput.tsx +4 -8
  163. package/themes/original/src/types/index.tsx +5 -1
  164. package/themes/original/src/utils/index.tsx +12 -1
  165. 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?.google_login_client_id?.value !== null) && appleLoginEnabled && (
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
- ? `${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)}`
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 || theme.images.dummies.businessLogo}
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 { locale, monthsEnum } from '../../utils';
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 onClick={() => handleChangeMoment()} isDisabled={!selectedTime} text={t('CONTINUE', 'Continue')} style={{ borderRadius: 7.6, height: 44, shadowOpacity: 0 }} textStyle={{ color: 'white', fontSize: 14 }} showNextIcon />
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
- {/* <OModal
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: { paddingHorizontal: 20 },
82
+ wrapperNavbar: {
83
+ paddingHorizontal: 20,
84
+ backgroundColor: theme?.colors?.white,
85
+ borderWidth: 0
86
+ },
80
87
  detailWrapper: {
81
- paddingHorizontal: 20,
82
- width: '100%'
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
- const [allowedGuest, setAllowedGuest] = useState(false)
144
- const [isOpen, setIsOpen] = useState(false)
145
- const [requiredFields, setRequiredFields] = useState<any>([])
146
- const stripePaymethods: any = ['stripe', 'stripe_direct', 'stripe_connect', 'stripe_redirect']
147
- const [openModal, setOpenModal] = useState({ login: false, signup: false, isGuest: false })
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
- const _requiredFields: any = []
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
- setRequiredFields(_requiredFields)
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
- setOpenModal({ ...openModal, signup: true, isGuest: true })
199
- return
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
- setIsOpen(true)
208
- return
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
- setIsOpen(false)
220
- handleGroupPlaceOrder && handleGroupPlaceOrder()
221
- }
228
+ setIsOpen(false)
229
+ handleGroupPlaceOrder && handleGroupPlaceOrder()
230
+ }
222
231
 
223
232
  const handleSuccessSignup = (user: any) => {
224
- login({
225
- user,
226
- token: user?.session?.access_token
227
- })
228
- openModal?.isGuest && handlePlaceOrderAsGuest()
229
- setOpenModal({ ...openModal, signup: false, isGuest: false })
230
- }
231
-
232
- const handleSuccessLogin = (user: any) => {
233
- if (user) setOpenModal({ ...openModal, login: false })
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
- <Container noPadding>
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
- open={isOpen}
586
- onClose={() => setIsOpen(false)}
587
- >
588
- <View style={styles.detailWrapper}>
589
- <UserDetails
590
- isUserDetailsEdit
591
- useValidationFields
592
- useDefualtSessionManager
593
- useSessionUser
594
- isCheckout
595
- isEdit
596
- phoneUpdate={phoneUpdate}
597
- togglePhoneUpdate={togglePhoneUpdate}
598
- requiredFields={requiredFields}
599
- hideUpdateButton
600
- handlePlaceOrderAsGuest={handlePlaceOrderAsGuest}
601
- onClose={() => {
602
- setIsOpen(false)
603
- handlePlaceOrder()
604
- }}
605
- setIsOpen={setIsOpen}
606
- />
607
- </View>
608
- </OModal>
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('BusinessList');
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
- <Section>
175
- <OText size={16} lineHeight={24} weight={'500'} color={theme.colors.textNormal} mBottom={20}>
176
- {t('DELIVERYA_V21', 'Delivery address')}
177
- </OText>
178
- {loading ? (
179
- <PlaceholderLine height={18} noMargin style={{ borderRadius: 2 }} />
180
- ) : (
181
- <OText size={12} lineHeight={18} color={theme.colors.textNormal} mBottom={2}>
182
- {customer?.address}
183
- </OText>
184
- )}
185
- </Section>
186
- <Divider />
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