ordering-ui-react-native 0.22.21 → 0.22.22-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 (164) 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/Checkout/index.tsx +40 -39
  5. package/src/components/StripeMethodForm/index.tsx +4 -2
  6. package/src/components/VerifyPhone/styles.tsx +1 -2
  7. package/src/context/OfflineActions/index.tsx +236 -0
  8. package/src/types/index.tsx +2 -1
  9. package/themes/business/index.tsx +2 -0
  10. package/themes/business/src/components/AcceptOrRejectOrder/index.tsx +9 -6
  11. package/themes/business/src/components/AcceptOrRejectOrder/styles.tsx +1 -0
  12. package/themes/business/src/components/BusinessController/index.tsx +8 -3
  13. package/themes/business/src/components/BusinessProductList/index.tsx +3 -2
  14. package/themes/business/src/components/Chat/index.tsx +15 -3
  15. package/themes/business/src/components/DriverMap/index.tsx +49 -26
  16. package/themes/business/src/components/FloatingButton/index.tsx +3 -2
  17. package/themes/business/src/components/GoogleMap/index.tsx +15 -8
  18. package/themes/business/src/components/LanguageSelector/index.tsx +2 -3
  19. package/themes/business/src/components/LanguageSelector/lang_country.json +515 -70
  20. package/themes/business/src/components/LogoutButton/index.tsx +1 -1
  21. package/themes/business/src/components/MapView/index.tsx +36 -17
  22. package/themes/business/src/components/NewOrderNotification/index.tsx +38 -19
  23. package/themes/business/src/components/OrderDetails/Business.tsx +47 -27
  24. package/themes/business/src/components/OrderDetails/Delivery.tsx +134 -53
  25. package/themes/business/src/components/OrderDetails/OrderContentComponent.tsx +128 -41
  26. package/themes/business/src/components/OrderDetails/OrderHeaderComponent.tsx +45 -18
  27. package/themes/business/src/components/OrderDetails/styles.tsx +39 -3
  28. package/themes/business/src/components/OrderDetails/usePrinterCommands.tsx +17 -16
  29. package/themes/business/src/components/OrderDetailsLogistic/index.tsx +3 -2
  30. package/themes/business/src/components/OrderSummary/index.tsx +6 -4
  31. package/themes/business/src/components/OrdersListManager/index.tsx +13 -1
  32. package/themes/business/src/components/OrdersOption/index.tsx +217 -156
  33. package/themes/business/src/components/PhoneInputNumber/index.tsx +8 -5
  34. package/themes/business/src/components/PreviousMessages/index.tsx +26 -3
  35. package/themes/business/src/components/PreviousOrders/OrderItem.tsx +39 -16
  36. package/themes/business/src/components/PreviousOrders/index.tsx +74 -66
  37. package/themes/business/src/components/PrinterEdition/MessageAlert.tsx +33 -0
  38. package/themes/business/src/components/PrinterEdition/index.tsx +431 -0
  39. package/themes/business/src/components/PrinterEdition/printerList.tsx +23 -0
  40. package/themes/business/src/components/PrinterEdition/styles.tsx +61 -0
  41. package/themes/business/src/components/PrinterSettings/index.tsx +162 -174
  42. package/themes/business/src/components/PrinterSettings/styles.tsx +14 -1
  43. package/themes/business/src/components/ProductItemAccordion/index.tsx +3 -2
  44. package/themes/business/src/components/ReviewCustomer/index.tsx +2 -0
  45. package/themes/business/src/components/StoresList/index.tsx +2 -2
  46. package/themes/business/src/components/UserProfileForm/index.tsx +55 -22
  47. package/themes/business/src/components/UserProfileForm/styles.tsx +7 -0
  48. package/themes/business/src/components/WebsocketStatus/index.tsx +2 -2
  49. package/themes/business/src/components/shared/OTextarea.tsx +8 -9
  50. package/themes/business/src/config/currency.tsx +1010 -0
  51. package/themes/business/src/hooks/useLocation.tsx +16 -12
  52. package/themes/business/src/layouts/SafeAreaContainer.tsx +35 -19
  53. package/themes/business/src/types/index.tsx +16 -4
  54. package/themes/business/src/utils/index.tsx +33 -3
  55. package/themes/doordash/src/components/BusinessesListing/index.tsx +1 -1
  56. package/themes/doordash/src/components/LoginForm/index.tsx +1 -2
  57. package/themes/instacart/src/components/BusinessesListing/index.tsx +1 -1
  58. package/themes/kiosk/src/components/Checkout/index.tsx +6 -0
  59. package/themes/kiosk/src/components/NavBar/index.tsx +14 -14
  60. package/themes/kiosk/src/components/OptionCard/index.tsx +1 -1
  61. package/themes/kiosk/src/components/OrderTypeCardSelector/index.tsx +8 -10
  62. package/themes/kiosk/src/components/shared/OButton.tsx +5 -18
  63. package/themes/original/index.tsx +11 -0
  64. package/themes/original/src/components/AddressForm/index.tsx +32 -17
  65. package/themes/original/src/components/AddressList/index.tsx +8 -7
  66. package/themes/original/src/components/AppleLogin/index.tsx +4 -4
  67. package/themes/original/src/components/BusinessBasicInformation/index.tsx +5 -8
  68. package/themes/original/src/components/BusinessItemAccordion/index.tsx +13 -5
  69. package/themes/original/src/components/BusinessListingSearch/BusinessSearchFooter.tsx +103 -92
  70. package/themes/original/src/components/BusinessListingSearch/BusinessSearchHeader.tsx +8 -6
  71. package/themes/original/src/components/BusinessListingSearch/index.tsx +1 -2
  72. package/themes/original/src/components/BusinessPreorder/index.tsx +46 -28
  73. package/themes/original/src/components/BusinessProductsList/SubcategoriesComponent/index.tsx +73 -70
  74. package/themes/original/src/components/BusinessProductsList/index.tsx +6 -7
  75. package/themes/original/src/components/BusinessProductsList/styles.tsx +0 -3
  76. package/themes/original/src/components/BusinessProductsListing/index.tsx +10 -6
  77. package/themes/original/src/components/BusinessTypeFilter/index.tsx +9 -8
  78. package/themes/original/src/components/BusinessesListing/Layout/Appointment/index.tsx +2 -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 +46 -14
  82. package/themes/original/src/components/CartContent/index.tsx +2 -4
  83. package/themes/original/src/components/Checkout/index.tsx +127 -77
  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/GiftCardUI/index.tsx +15 -17
  91. package/themes/original/src/components/GiftCard/PurchaseGiftCard/index.tsx +3 -7
  92. package/themes/original/src/components/GiftCard/RedeemGiftCard/index.tsx +24 -32
  93. package/themes/original/src/components/GiftCard/SendGiftCard/index.tsx +7 -9
  94. package/themes/original/src/components/GiftCard/VerticalGiftCardOrdersLayout/index.tsx +11 -12
  95. package/themes/original/src/components/GoogleMap/index.tsx +39 -18
  96. package/themes/original/src/components/Help/index.tsx +2 -0
  97. package/themes/original/src/components/HighestRatedBusinesses/index.tsx +1 -1
  98. package/themes/original/src/components/Home/index.tsx +3 -11
  99. package/themes/original/src/components/LoginForm/Otp/index.tsx +0 -3
  100. package/themes/original/src/components/LoginForm/index.tsx +12 -9
  101. package/themes/original/src/components/MessageListing/index.tsx +2 -1
  102. package/themes/original/src/components/Messages/index.tsx +27 -19
  103. package/themes/original/src/components/MomentOption/TimeListItem.tsx +56 -0
  104. package/themes/original/src/components/MomentOption/index.tsx +80 -51
  105. package/themes/original/src/components/MomentSelector/index.tsx +5 -2
  106. package/themes/original/src/components/MultiCartsPaymethodsAndWallets/index.tsx +7 -3
  107. package/themes/original/src/components/MultiCheckout/index.tsx +55 -27
  108. package/themes/original/src/components/MultiOrdersDetails/index.tsx +1 -0
  109. package/themes/original/src/components/MyOrders/index.tsx +2 -2
  110. package/themes/original/src/components/NavBar/index.tsx +7 -4
  111. package/themes/original/src/components/NetworkError/index.tsx +0 -5
  112. package/themes/original/src/components/NotFoundSource/index.tsx +0 -3
  113. package/themes/original/src/components/OrderDetails/OrderEta.tsx +4 -3
  114. package/themes/original/src/components/OrderDetails/OrderHistory.tsx +16 -11
  115. package/themes/original/src/components/OrderDetails/index.tsx +44 -21
  116. package/themes/original/src/components/OrderDetails/styles.tsx +0 -1
  117. package/themes/original/src/components/OrderProgress/index.tsx +4 -3
  118. package/themes/original/src/components/OrderSummary/index.tsx +29 -10
  119. package/themes/original/src/components/OrderTypeSelector/index.tsx +7 -6
  120. package/themes/original/src/components/OrdersOption/index.tsx +3 -6
  121. package/themes/original/src/components/PaymentOptionStripe/index.tsx +0 -5
  122. package/themes/original/src/components/PaymentOptionWallet/index.tsx +56 -56
  123. package/themes/original/src/components/PaymentOptions/index.tsx +4 -3
  124. package/themes/original/src/components/PhoneInputNumber/index.tsx +92 -7
  125. package/themes/original/src/components/PlaceSpot/index.tsx +1 -3
  126. package/themes/original/src/components/PreviousOrders/index.tsx +1 -2
  127. package/themes/original/src/components/ProductForm/ActionButton.tsx +17 -20
  128. package/themes/original/src/components/ProductForm/index.tsx +107 -102
  129. package/themes/original/src/components/ProductItemAccordion/index.tsx +50 -43
  130. package/themes/original/src/components/ProductItemAccordion/styles.tsx +0 -3
  131. package/themes/original/src/components/ProductOptionSubOption/index.tsx +16 -8
  132. package/themes/original/src/components/ProfessionalProfile/index.tsx +4 -5
  133. package/themes/original/src/components/Promotions/index.tsx +6 -9
  134. package/themes/original/src/components/ReviewDriver/index.tsx +1 -1
  135. package/themes/original/src/components/ReviewOrder/index.tsx +2 -2
  136. package/themes/original/src/components/ReviewProducts/index.tsx +1 -1
  137. package/themes/original/src/components/ReviewTrigger/index.tsx +2 -2
  138. package/themes/original/src/components/ServiceForm/index.tsx +52 -54
  139. package/themes/original/src/components/Sessions/index.tsx +3 -3
  140. package/themes/original/src/components/SignupForm/index.tsx +102 -88
  141. package/themes/original/src/components/SingleOrderCard/index.tsx +6 -4
  142. package/themes/original/src/components/SingleProductCard/index.tsx +5 -5
  143. package/themes/original/src/components/SingleProductCard/styles.tsx +0 -3
  144. package/themes/original/src/components/StripeCardForm/index.tsx +0 -3
  145. package/themes/original/src/components/StripeCardsList/index.tsx +16 -3
  146. package/themes/original/src/components/StripeElementsForm/index.tsx +76 -62
  147. package/themes/original/src/components/StripeElementsForm/naked.tsx +48 -1
  148. package/themes/original/src/components/StripeRedirectForm/index.tsx +0 -3
  149. package/themes/original/src/components/TaxInformation/index.tsx +3 -2
  150. package/themes/original/src/components/UpsellingProducts/UpsellingContent.tsx +10 -7
  151. package/themes/original/src/components/UpsellingProducts/UpsellingLayout.tsx +8 -3
  152. package/themes/original/src/components/UserDetails/index.tsx +17 -16
  153. package/themes/original/src/components/UserFormDetails/index.tsx +164 -135
  154. package/themes/original/src/components/UserProfile/index.tsx +9 -1
  155. package/themes/original/src/components/UserVerification/index.tsx +15 -4
  156. package/themes/original/src/components/Wallets/index.tsx +6 -3
  157. package/themes/original/src/components/WebsocketStatus/index.tsx +1 -4
  158. package/themes/original/src/components/shared/OAlert.tsx +2 -1
  159. package/themes/original/src/components/shared/OButton.tsx +5 -4
  160. package/themes/original/src/components/shared/OInput.tsx +4 -8
  161. package/themes/original/src/components/shared/OModal.tsx +7 -2
  162. package/themes/original/src/types/index.tsx +10 -3
  163. package/themes/original/src/utils/index.tsx +30 -1
  164. package/themes/uber-eats/src/components/BusinessesListing/index.tsx +1 -1
@@ -203,9 +203,9 @@ export const MyOrders = (props: any) => {
203
203
  setOrdersLength={setOrdersLength}
204
204
  />
205
205
  )}
206
-
206
+
207
207
  {selectedOption === 'giftCards' && (
208
- <View style={{ paddingHorizontal: 20 }}>
208
+ <View style={{ paddingHorizontal: 20 }}>
209
209
  <GiftCardOrdersList
210
210
  onNavigationRedirect={props?.onNavigationRedirect}
211
211
  />
@@ -1,3 +1,6 @@
1
+
2
+
3
+
1
4
  import * as React from 'react'
2
5
  import styled, { useTheme } from 'styled-components/native'
3
6
  import { OButton, OIcon, OText } from '../shared'
@@ -64,6 +67,7 @@ const NavBar = (props: Props) => {
64
67
  <Wrapper style={{ paddingTop: props.paddingTop, ...{ flexDirection: props.isVertical ? 'column' : 'row', alignItems: props.isVertical ? 'flex-start' : 'center' }, ...props.style }}>
65
68
  {!props.hideArrowLeft && (
66
69
  <OButton
70
+ useArrow
67
71
  iconProps={{
68
72
  name: 'arrowleft',
69
73
  size: 26
@@ -114,8 +118,6 @@ const NavBar = (props: Props) => {
114
118
  {props.showCall
115
119
  ? (<OButton
116
120
  isCircle={true}
117
- bgColor={theme.colors.primary}
118
- borderColor={theme.colors.primary}
119
121
  imgRightSrc={null}
120
122
  imgLeftStyle={{ tintColor: 'white', width: 30, height: 30 }}
121
123
  imgLeftSrc={theme.images.general.support}
@@ -131,8 +133,9 @@ NavBar.defaultProps = {
131
133
  textAlign: 'center'
132
134
  };
133
135
 
134
- const areEqual = (prevProps: { route?: any; }, nextProps: { route?: any; }) => {
135
- return prevProps.route === nextProps.route
136
+ const areEqual = (prevProps: { route?: any, title?: string }, nextProps: { route?: any, title?: string }) => {
137
+ return prevProps.route === nextProps.route &&
138
+ JSON.stringify(prevProps.title) === JSON.stringify(nextProps.title)
136
139
  return true
137
140
  }
138
141
 
@@ -45,15 +45,10 @@ export const NetworkError = (props: NoNetworkParams) => {
45
45
  />
46
46
  <OButton
47
47
  text={t('REFRESH', 'Refresh')}
48
- bgColor={theme.colors.primary}
49
- borderColor={theme.colors.primary}
50
48
  style={{
51
49
  borderRadius: 8,
52
50
  marginTop: 45
53
51
  }}
54
- textStyle={{
55
- color: theme.colors.white
56
- }}
57
52
  onClick={() => RNRestart.Restart()}
58
53
  />
59
54
  </ImageContainer>
@@ -42,11 +42,8 @@ export const NotFoundSource = (props: NotFoundSourceParams) => {
42
42
  <View style={{ marginTop: 10, width: '100%' }}>
43
43
  <OButton
44
44
  style={{ width: '100%', height: 50, ...btnStyle }}
45
- bgColor={theme.colors.primary}
46
- borderColor={theme.colors.primary}
47
45
  onClick={() => onClickButton()}
48
46
  text={btnTitle}
49
- textStyle={{ color: theme.colors.white }}
50
47
  />
51
48
  </View>
52
49
  )}
@@ -10,13 +10,14 @@ export const OrderEta = (props: any) => {
10
10
 
11
11
  const [{ parseDate }] = useUtils()
12
12
  const [estimatedDeliveryTime, setEstimatedDeliveryTime] = useState(null)
13
-
13
+ const deliveryTypes = [1, 7]
14
+
14
15
  const getEstimatedDeliveryTime = () => {
15
16
  let estimatedUtcTime = null
16
17
  let totalEta = 0
17
18
  if (order?.delivered_in) totalEta += order?.delivered_in
18
19
  if (order?.prepared_in) totalEta += order?.prepared_in
19
- if (order?.delivery_type === 1 && order?.eta_drive_time) {
20
+ if (deliveryTypes?.includes?.(order?.delivery_type) && order?.eta_drive_time) {
20
21
  totalEta += order?.eta_drive_time
21
22
  }
22
23
 
@@ -57,7 +58,7 @@ export const OrderEta = (props: any) => {
57
58
  }
58
59
  estimatedUtcTime = moment.utc(_delivery).add(totalEta, 'minutes')
59
60
  const _estimatedTime = outputFormat ? moment(estimatedUtcTime).local().format(outputFormat) : parseDate(estimatedUtcTime, { utc: false })
60
- setEstimatedDeliveryTime(_estimatedTime)
61
+ setEstimatedDeliveryTime(order?.status === 13 ? parseDate(_delivery, { utc: !!order?.delivery_datetime_utc, outputFormat: outputFormat }) : _estimatedTime)
61
62
  }
62
63
 
63
64
  useEffect(() => {
@@ -1,7 +1,7 @@
1
1
  import React from 'react'
2
2
  import { useTheme } from 'styled-components/native'
3
3
  import { ScrollView, StyleSheet, View } from 'react-native'
4
- import { useLanguage, useUtils } from 'ordering-components/native'
4
+ import { useLanguage, useUtils, useConfig } from 'ordering-components/native'
5
5
  import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityIcons'
6
6
  import { OText, OButton } from '../shared'
7
7
  import { formatSeconds } from '../../utils'
@@ -17,8 +17,12 @@ export const OrderHistory = (props: any) => {
17
17
 
18
18
  const [, t] = useLanguage()
19
19
  const [{ parseDate }] = useUtils()
20
+ const [{ configs }] = useConfig();
20
21
  const theme = useTheme()
21
22
 
23
+ const excludedMessages = ['manual_driver_assignment_comment', 'driver_group_id', 'manual_driver_assignment_author_id']
24
+ const changeIdToExternalId = configs?.change_order_id?.value === '1'
25
+
22
26
  const styles = StyleSheet.create({
23
27
  historyItem: {
24
28
  display: 'flex',
@@ -62,7 +66,10 @@ export const OrderHistory = (props: any) => {
62
66
  20: 'ORDER_CUSTOMER_ALMOST_ARRIVED_BUSINESS',
63
67
  21: 'ORDER_CUSTOMER_ARRIVED_BUSINESS',
64
68
  22: 'ORDER_LOOKING_FOR_DRIVER',
65
- 23: 'ORDER_DRIVER_ON_WAY'
69
+ 23: 'ORDER_DRIVER_ON_WAY',
70
+ 24: 'ORDER_DRIVER_WAITING_FOR_ORDER',
71
+ 25: 'ORDER_ACCEPTED_BY_DRIVER_COMPANY',
72
+ 26: 'ORDER_DRIVER_ARRIVED_CUSTOMER'
66
73
  }
67
74
 
68
75
  const getLogisticTagStatus = (status: any) => {
@@ -90,7 +97,7 @@ export const OrderHistory = (props: any) => {
90
97
  return (
91
98
  <ScrollView contentContainerStyle={styles.container}>
92
99
  <OText size={20} style={{ alignSelf: 'center', textAlign: 'center' }} mBottom={10}>
93
- {t('DETAILS_OF_ORDER', 'Details of Order_NUMBER_').replace('_NUMBER_', ` # ${order?.id}`)}
100
+ {t('DETAILS_OF_ORDER', 'Details of Order_NUMBER_').replace('_NUMBER_', (changeIdToExternalId && order?.external_id) || `# ${order?.id}`)}
94
101
  </OText>
95
102
  {!messages?.loading && order && (
96
103
  <View style={styles.historyItem}>
@@ -118,7 +125,7 @@ export const OrderHistory = (props: any) => {
118
125
  </View>
119
126
  </View>
120
127
  )}
121
- {messages && messages?.messages.map((message: any, i: number) => message.type === 1 && (
128
+ {messages && messages?.messages.map((message: any, i: number) => (message.type === 1 && !excludedMessages.includes(message?.change?.attribute)) && (
122
129
  <View
123
130
  style={styles.historyItem}
124
131
  key={i}
@@ -145,10 +152,10 @@ export const OrderHistory = (props: any) => {
145
152
  </>
146
153
  )
147
154
  : message.change?.attribute === 'prepared_in' ? (
148
- <>
149
- {t('TIME_ADDED_BY_BUSINESS', 'Time added by business')}{'\n'}
150
- {formatSeconds(parseInt(message.change.new, 10))}
151
- </>
155
+ <>
156
+ {t('TIME_ADDED_BY_BUSINESS', 'Time added by business')}{'\n'}
157
+ {formatSeconds(parseInt(message.change.new, 10))}
158
+ </>
152
159
  ) : t(ORDER_STATUS[parseInt(message.change.new, 10)])
153
160
  }
154
161
  </OText>
@@ -170,11 +177,9 @@ export const OrderHistory = (props: any) => {
170
177
  ))}
171
178
  <OButton
172
179
  text={enableReview ? t('REVIEW_ORDER', 'Review order') : t('CONTINUE', 'Continue')}
173
- textStyle={{ fontSize: 14, color: theme.colors.white }}
180
+ textStyle={{ fontSize: 14 }}
174
181
  imgRightSrc={theme.images.general.arrow_right}
175
182
  imgRightStyle={{ tintColor: theme.colors.white, right: 5, margin: 5 }}
176
- borderColor='transparent'
177
- bgColor={theme.colors.primary}
178
183
  style={{ borderRadius: 7.6, borderWidth: 1, height: 44, shadowOpacity: 0, marginBottom: 30, marginTop: 20 }}
179
184
  onClick={() => handleReview()}
180
185
  />
@@ -129,11 +129,13 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
129
129
  const [showTitle, setShowTitle] = useState(false)
130
130
 
131
131
  const { order, businessData } = props.order;
132
- const mapValidStatuses = [9, 19, 23]
132
+ const mapValidStatuses = [9, 19, 23, 26]
133
133
  const placeSpotTypes = [3, 4, 5]
134
134
  const directionTypes = [2, 3, 4, 5]
135
- const activeStatus = [0, 3, 4, 7, 8, 9, 13, 14, 18, 19, 20, 21, 22, 23]
135
+ const activeStatus = [0, 3, 4, 7, 8, 9, 13, 14, 18, 19, 20, 21, 22, 23, 24, 25, 26]
136
136
  const reorderStatus = [1, 2, 5, 6, 10, 11, 12]
137
+ const cateringTypes = [7, 8]
138
+ const deliveryTypes = [1, 7]
137
139
  const [isPickup, setIsPickup] = useState(order?.delivery_type === 2)
138
140
  const enabledPoweredByOrdering = configs?.powered_by_ordering_module?.value
139
141
  const isGiftCardOrder = !order?.business_id
@@ -148,6 +150,8 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
148
150
  const hideDriverMessages = theme?.confirmation?.components?.driver?.components?.messages?.hidden
149
151
  const hideCustomerPhone = theme?.confirmation?.components?.customer?.components?.phone?.hidden
150
152
  const hideCustomerAddress = theme?.confirmation?.components?.customer?.components?.address?.hidden
153
+ const changeIdToExternalId = configs?.change_order_id?.value === '1'
154
+
151
155
  const progressBarObjt = isPickup ? getOrderStatuPickUp : getOrderStatus
152
156
  const walletName: any = {
153
157
  cash: {
@@ -185,18 +189,18 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
185
189
  navigation.navigate('BottomTab');
186
190
  };
187
191
 
188
- const getIncludedTaxes = () => {
192
+ const getIncludedTaxes = (isDeliveryFee?: boolean) => {
189
193
  if (order?.taxes?.length === 0 || !order?.taxes) {
190
194
  return order.tax_type === 1 ? order?.summary?.tax ?? 0 : 0
191
195
  } else {
192
196
  return order?.taxes.reduce((taxIncluded: number, tax: any) => {
193
- return taxIncluded + (tax.type === 1 ? tax.summary?.tax : 0)
197
+ return taxIncluded + (((!isDeliveryFee && tax.type === 1 && tax.target === 'product') || (isDeliveryFee && tax.type === 1 && tax.target === 'delivery_fee')) ? tax.summary?.tax : 0)
194
198
  }, 0)
195
199
  }
196
200
  }
197
201
 
198
202
  const getIncludedTaxesDiscounts = () => {
199
- return order?.taxes?.filter((tax: any) => tax?.type === 1)?.reduce((carry: number, tax: any) => carry + (tax?.summary?.tax_after_discount ?? tax?.summary?.tax), 0)
203
+ return order?.taxes?.filter((tax: any) => tax?.type === 1 && tax?.target === 'product')?.reduce((carry: number, tax: any) => carry + (tax?.summary?.tax_after_discount ?? tax?.summary?.tax), 0)
200
204
  }
201
205
 
202
206
  const handleClickOrderReview = (order: any) => {
@@ -270,7 +274,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
270
274
  title: t('DRIVER', 'Driver'),
271
275
  icon:
272
276
  order?.driver?.photo ||
273
- 'https://res.cloudinary.com/demo/image/fetch/c_thumb,g_face,r_max/https://www.freeiconspng.com/thumbs/driver-icon/driver-icon-14.png',
277
+ theme?.images?.general?.driverPng,
274
278
  },
275
279
  {
276
280
  ...order?.business?.location,
@@ -361,7 +365,6 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
361
365
  }
362
366
  }, [props?.order?.error, props?.order?.loading])
363
367
 
364
-
365
368
  useEffect(() => {
366
369
  if (!order?.delivery_type) return
367
370
  setIsPickup(order?.delivery_type === 2)
@@ -386,7 +389,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
386
389
  numberOfLines={2}
387
390
  ellipsizeMode='tail'
388
391
  >
389
- {`${t('ORDER', 'Order')} #${order?.id}`}
392
+ {`${t('ORDER', 'Order')} ${(changeIdToExternalId && order?.external_id) || `#${order?.id}`}`}
390
393
  </OText>
391
394
  )}
392
395
  </>
@@ -460,16 +463,19 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
460
463
  <Header>
461
464
  <NavBar
462
465
  hideArrowLeft
463
- title={`${t('ORDER', 'Order')} #${order?.id}`}
464
- titleAlign={'center'}
466
+ title={`${t('ORDER', 'Order')} ${(changeIdToExternalId && order?.external_id) || `#${order?.id}`}`}
467
+ titleAlign={'left'}
465
468
  showCall={false}
466
469
  btnStyle={{ paddingLeft: 0 }}
467
470
  style={{ marginTop: Platform.OS === 'ios' ? 0 : 20 }}
468
471
  titleWrapStyle={{ paddingHorizontal: 0 }}
469
- titleStyle={{ marginRight: 0, marginLeft: 0 }}
472
+ titleStyle={{ marginRight: 0, marginLeft: 0, paddingHorizontal: 0 }}
470
473
  subTitle={!hideDeliveryDate && <OText size={12} lineHeight={18} color={theme.colors.textNormal}>
471
474
  {activeStatus.includes(order?.status) ? (
472
- <OrderEta order={order} />
475
+ <>
476
+ {cateringTypes.includes(order?.delivery_type) ? `${t('CREATED_AT', 'Created at')}: ${parseDate(order?.created_at)}\n` : ''}
477
+ {cateringTypes.includes(order?.delivery_type) ? `${t('PLACED_TO', 'Placed to')}:` : ''} <OrderEta order={order} />
478
+ </>
473
479
  ) : (
474
480
  parseDate(order?.reporting_data?.at[`status:${order.status}`])
475
481
  )}
@@ -643,7 +649,6 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
643
649
  <OButton
644
650
  text={t('GET_DIRECTIONS', 'Get Directions')}
645
651
  imgRightSrc=''
646
- textStyle={{ color: theme.colors.white }}
647
652
  style={{
648
653
  alignSelf: 'center',
649
654
  borderRadius: 10,
@@ -708,18 +713,18 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
708
713
  {order?.customer?.address}
709
714
  </OText>
710
715
  )}
711
- {(!!order?.customer?.cellphone && !hideCustomerPhone) && (
716
+ {(!!(order?.customer?.cellphone || order?.customer?.guest_cellphone) && !hideCustomerPhone) && (
712
717
  <OText
713
718
  size={12}
714
719
  lineHeight={18}
715
720
  color={theme.colors.textNormal}
716
721
  mBottom={2}>
717
- {`${!!order?.customer?.country_phone_code ? '+' + order?.customer?.country_phone_code : ''} ${order?.customer?.cellphone}`}
722
+ {`${!!order?.customer?.country_phone_code ? '+' + order?.customer?.country_phone_code : ''} ${order?.customer?.guest_id ? order?.customer?.guest_cellphone : order?.customer?.cellphone}`}
718
723
  </OText>
719
724
  )}
720
725
  </InfoBlock>
721
726
  </Customer>
722
- {!isGiftCardOrder && order?.delivery_option !== undefined && order?.delivery_type === 1 && (
727
+ {!isGiftCardOrder && order?.delivery_option !== undefined && deliveryTypes?.includes?.(order?.delivery_type) && (
723
728
  <View style={{ marginTop: 15 }}>
724
729
  <OText size={16} style={{ textAlign: 'left' }} color={theme.colors.textNormal}>
725
730
  {t('DELIVERY_PREFERENCE', 'Delivery Preference')}
@@ -750,6 +755,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
750
755
  }
751
756
  locations={parsedLocations}
752
757
  readOnly
758
+ manualZoom
753
759
  />
754
760
  </Map>
755
761
  )}
@@ -832,9 +838,8 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
832
838
  <OButton
833
839
  text={t('YOUR_ORDERS', 'Your Orders')}
834
840
  textStyle={{ fontSize: 14, color: theme.colors.primary }}
841
+ bgColor={theme.colors.white}
835
842
  imgRightSrc={null}
836
- borderColor={theme.colors.primary}
837
- bgColor={theme.colors.clear}
838
843
  style={{ borderRadius: 7.6, borderWidth: 1, height: 44, shadowOpacity: 0 }}
839
844
  parentStyle={{ marginTop: 29, marginEnd: 15 }}
840
845
  onClick={() => navigation.navigate('BottomTab', { screen: 'MyOrders' })}
@@ -934,7 +939,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
934
939
  )
935
940
  }
936
941
  {
937
- order?.taxes?.length > 0 && order?.taxes?.filter((tax: any) => tax?.type === 2 && tax?.rate !== 0).map((tax: any) => (
942
+ order?.taxes?.length > 0 && order?.taxes?.filter((tax: any) => tax?.type === 2 && tax?.rate !== 0 && tax?.target === 'product').map((tax: any) => (
938
943
  <Table key={tax.id}>
939
944
  <OSRow>
940
945
  <OText size={12} lineHeight={18} weight={'400'} color={theme.colors.textNormal} numberOfLines={1}>
@@ -983,12 +988,30 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
983
988
  </Table>
984
989
  ))
985
990
  }
986
- {typeof order?.summary?.delivery_price === 'number' && (
991
+ {typeof order?.summary?.delivery_price === 'number' && !isPickup && (
987
992
  <Table>
988
993
  <OText size={12} lineHeight={18} weight={'400'} color={theme.colors.textNormal}>{t('DELIVERY_FEE', 'Delivery Fee')}</OText>
989
- <OText size={12} lineHeight={18} weight={'400'} color={theme.colors.textNormal}>{parsePrice(order?.summary?.delivery_price)}</OText>
994
+ <OText size={12} lineHeight={18} weight={'400'} color={theme.colors.textNormal}>{parsePrice(order?.summary?.delivery_price + getIncludedTaxes(true))}</OText>
990
995
  </Table>
991
996
  )}
997
+ {
998
+ order?.taxes?.length > 0 && order?.taxes?.filter((tax: any) => tax?.type === 2 && tax?.rate !== 0 && tax?.target === 'delivery_fee').map((tax: any, i: number) => (
999
+ <Table key={`${tax?.description}_${i}`}>
1000
+ <OSRow>
1001
+ <OText size={12} lineHeight={18} weight={'400'} color={theme.colors.textNormal} numberOfLines={1}>
1002
+ {t(tax?.name?.toUpperCase()?.replace(/ /g, '_'), tax?.name) || t('INHERIT_FROM_BUSINESS', 'Inherit from business')}
1003
+ {`(${verifyDecimals(tax?.rate, parseNumber)}%)`}
1004
+ </OText>
1005
+ {setOpenTaxModal && (
1006
+ <TouchableOpacity onClick={() => setOpenTaxModal({ open: true, data: tax, type: 'tax' })}>
1007
+ <AntIcon name='infocirlceo' size={16} color={theme.colors.primary} />
1008
+ </TouchableOpacity>
1009
+ )}
1010
+ </OSRow>
1011
+ <OText size={12} lineHeight={18} weight={'400'} color={theme.colors.textNormal}>{parsePrice(tax?.summary?.tax_after_discount ?? tax?.summary?.tax ?? 0)}</OText>
1012
+ </Table>
1013
+ ))
1014
+ }
992
1015
  {
993
1016
  order?.offers?.length > 0 && order?.offers?.filter((offer: any) => offer?.target === 2)?.map((offer: any) => (
994
1017
  <Table key={offer.id}>
@@ -5,7 +5,6 @@ export const OrderDetailsContainer = styled.ScrollView`
5
5
  `
6
6
 
7
7
  export const NavBack = styled.TouchableOpacity`
8
-
9
8
  `
10
9
 
11
10
 
@@ -41,7 +41,8 @@ const OrderProgressUI = (props: any) => {
41
41
  const [lastOrder, setLastOrder] = useState<any>(null)
42
42
  const imageFails = theme.images.general.emptyActiveOrders
43
43
  const [initialLoaded, setInitialLoaded] = useState(false)
44
- const statusToShow = [0, 3, 4, 7, 8, 9, 13, 14, 18, 19, 20, 21, 22, 23]
44
+ const statusToShow = [0, 3, 4, 7, 8, 9, 13, 14, 18, 19, 20, 21, 22, 23, 24, 25, 26]
45
+ const deliveryTypes = [1, 7]
45
46
 
46
47
  const styles = StyleSheet.create({
47
48
  main: {
@@ -172,7 +173,7 @@ const OrderProgressUI = (props: any) => {
172
173
  <ProgressTextWrapper>
173
174
  <OText size={12} style={{ width: '50%' }}>{progressBarObjt(lastOrder.status)?.value}</OText>
174
175
  <TimeWrapper>
175
- <OText size={11}>{lastOrder?.delivery_type === 1 ? t('ESTIMATED_DELIVERY', 'Estimated delivery') : t('ESTIMATED_TIME', 'Estimated time')}</OText>
176
+ <OText size={11}>{deliveryTypes?.includes?.(lastOrder?.delivery_type) ? t('ESTIMATED_DELIVERY', 'Estimated delivery') : t('ESTIMATED_TIME', 'Estimated time')}</OText>
176
177
  <OText size={11}>
177
178
  {lastOrder?.delivery_datetime_utc
178
179
  ? parseTime(lastOrder?.delivery_datetime_utc, { outputFormat: configs?.general_hour_format?.value || 'HH:mm' })
@@ -205,7 +206,7 @@ export const OrderProgress = (props: any) => {
205
206
  const orderProgressProps = {
206
207
  ...props,
207
208
  UIComponent: OrderProgressUI,
208
- orderStatus: [0, 3, 4, 7, 8, 9, 13, 14, 18, 19, 20, 21, 22, 23],
209
+ orderStatus: [0, 3, 4, 7, 8, 9, 13, 14, 18, 19, 20, 21, 22, 23, 24, 25, 26],
209
210
  useDefualtSessionManager: true,
210
211
  paginationSettings: {
211
212
  initialPage: 1,
@@ -47,7 +47,9 @@ const OrderSummaryUI = (props: any) => {
47
47
  cateringTypes,
48
48
  hideDeliveryFee,
49
49
  loyaltyRewardRate,
50
- maxDate
50
+ maxDate,
51
+ hideCommentsByValidationCheckout,
52
+ hideCouponByValidationCheckout
51
53
  } = props;
52
54
 
53
55
  const theme = useTheme()
@@ -55,11 +57,10 @@ const OrderSummaryUI = (props: any) => {
55
57
  const [{ configs }] = useConfig();
56
58
  const [orderState] = useOrder();
57
59
  const [{ parsePrice, parseNumber }] = useUtils();
58
- const [validationFields] = useValidationFields();
59
60
  const commentRef = useRef()
60
61
  const [openTaxModal, setOpenTaxModal] = useState<any>({ open: false, data: null, type: '' })
61
- const isCouponEnabled = validationFields?.fields?.checkout?.coupon?.enabled;
62
- const hideCartComments = !validationFields?.fields?.checkout?.comments?.enabled
62
+ const hideCartDiscount = hideCouponByValidationCheckout
63
+ const hideCartComments = hideCommentsByValidationCheckout
63
64
 
64
65
  const cart = orderState?.carts?.[`businessId:${props.cart.business_id}`]
65
66
 
@@ -72,12 +73,14 @@ const OrderSummaryUI = (props: any) => {
72
73
  }
73
74
  }
74
75
 
75
- const getIncludedTaxes = () => {
76
+ const getIncludedTaxes = (isDeliveryFee?: boolean) => {
76
77
  if (cart?.taxes === null || !cart?.taxes) {
77
78
  return cart?.business?.tax_type === 1 ? cart?.tax : 0
78
79
  } else {
79
80
  return cart?.taxes.reduce((taxIncluded: number, tax: any) => {
80
- return taxIncluded + (tax.type === 1 ? tax.summary?.tax : 0)
81
+ return taxIncluded +
82
+ (((!isDeliveryFee && tax.type === 1 && tax.target === 'product') ||
83
+ (isDeliveryFee && tax.type === 1 && tax.target === 'delivery_fee')) ? tax.summary?.tax : 0)
81
84
  }, 0)
82
85
  }
83
86
  }
@@ -102,7 +105,7 @@ const OrderSummaryUI = (props: any) => {
102
105
  }
103
106
 
104
107
  const getIncludedTaxesDiscounts = () => {
105
- return cart?.taxes?.filter((tax: any) => tax?.type === 1)?.reduce((carry: number, tax: any) => carry + (tax?.summary?.tax_after_discount ?? tax?.summary?.tax), 0)
108
+ return cart?.taxes?.filter((tax: any) => (tax?.type === 1 && tax?.target === 'product'))?.reduce((carry: number, tax: any) => carry + (tax?.summary?.tax_after_discount ?? tax?.summary?.tax), 0)
106
109
  }
107
110
 
108
111
  const OfferAlert = ({ offerId }: any) => {
@@ -194,7 +197,7 @@ const OrderSummaryUI = (props: any) => {
194
197
  </OSTable>
195
198
  )}
196
199
  {
197
- cart.taxes?.length > 0 && cart.taxes.filter((tax: any) => tax.type === 2 && tax?.rate !== 0).map((tax: any) => (
200
+ cart.taxes?.length > 0 && cart.taxes.filter((tax: any) => tax.type === 2 && tax?.rate !== 0 && tax?.target === 'product').map((tax: any, i: number) => (
198
201
  <OSTable key={tax.id}>
199
202
  <OSRow>
200
203
  <OText size={12} numberOfLines={1} >
@@ -249,9 +252,25 @@ const OrderSummaryUI = (props: any) => {
249
252
  {orderState?.options?.type === 1 && !hideDeliveryFee && (
250
253
  <OSTable>
251
254
  <OText size={12}>{t('DELIVERY_FEE', 'Delivery Fee')}</OText>
252
- <OText size={12}>{parsePrice(cart?.delivery_price_with_discount)}</OText>
255
+ <OText size={12}>{parsePrice(cart?.delivery_price_with_discount + getIncludedTaxes(true))}</OText>
253
256
  </OSTable>
254
257
  )}
258
+ {
259
+ cart?.taxes?.length > 0 && cart?.taxes?.filter((tax: any) => tax?.type === 2 && tax?.rate !== 0 && tax?.target === 'delivery_fee').map((tax: any, i: number) => (
260
+ <OSTable key={`${tax.description}_${i}`}>
261
+ <OSRow>
262
+ <OText size={12} numberOfLines={1}>
263
+ {tax.name || t('INHERIT_FROM_BUSINESS', 'Inherit from business')}
264
+ {`(${verifyDecimals(tax?.rate, parseNumber)}%)`}
265
+ </OText>
266
+ <TouchableOpacity onPress={() => setOpenTaxModal({ open: true, data: tax, type: 'tax' })}>
267
+ <AntIcon name='infocirlceo' size={16} color={theme.colors.primary} />
268
+ </TouchableOpacity>
269
+ </OSRow>
270
+ <OText size={12}>{parsePrice(tax?.summary?.tax_after_discount ?? tax?.summary?.tax ?? 0)}</OText>
271
+ </OSTable>
272
+ ))
273
+ }
255
274
  {
256
275
  cart?.offers?.length > 0 && cart?.offers?.filter((offer: any) => offer?.target === 2)?.map((offer: any) => (
257
276
  <OSTable key={offer.id}>
@@ -295,7 +314,7 @@ const OrderSummaryUI = (props: any) => {
295
314
  <OText size={12}>-{parsePrice(event.amount, { isTruncable: true })}</OText>
296
315
  </OSTable>
297
316
  ))}
298
- {isCouponEnabled && !isCartPending && cart?.business_id && (
317
+ {!hideCartDiscount && !isCartPending && cart?.business_id && (
299
318
  <View>
300
319
  <View style={{ paddingVertical: 5 }}>
301
320
  <CouponControl
@@ -31,14 +31,14 @@ const OrderTypeSelectorUI = (props: OrderTypeSelectParams) => {
31
31
  const [orderState] = useOrder();
32
32
  const [, t] = useLanguage();
33
33
  const _orderTypes = orderTypes.filter((type: any) => configTypes?.includes(type.value));
34
- const orderTypeTitle = (type : string) => theme?.header?.components?.order_types?.components?.[type]?.components?.title
35
- const orderTypeDescription = (type : string) => theme?.header?.components?.order_types?.components?.[type]?.components?.description
36
- const orderTypeCallAction = (type : string) => theme?.header?.components?.order_types?.components?.[type]?.components?.call_to_action
34
+ const orderTypeTitle = (type: string) => theme?.header?.components?.order_types?.components?.[type]?.components?.title
35
+ const orderTypeDescription = (type: string) => theme?.header?.components?.order_types?.components?.[type]?.components?.description
36
+ const orderTypeCallAction = (type: string) => theme?.header?.components?.order_types?.components?.[type]?.components?.call_to_action
37
37
  const items = _orderTypes.map((type) => {
38
38
  return {
39
39
  value: type.value,
40
- label: orderTypeTitle(type.value) || t(type.content, type.content),
41
- description: orderTypeDescription(type.value) || t(type.description, 'Lorem ipsum dolor sit amet, consectetur.')
40
+ label: t(type.content, type.content),
41
+ description: t(type.description, 'Lorem ipsum dolor sit amet, consectetur.')
42
42
  }
43
43
  })
44
44
 
@@ -102,6 +102,7 @@ const OrderTypeSelectorUI = (props: OrderTypeSelectParams) => {
102
102
  style={{ paddingBottom: 0 }}
103
103
  title={t('HOW_WILL_YOU_DELIVERY_TYPE', 'How will your order type?')}
104
104
  titleAlign={'center'}
105
+ titleStyle={{ fontSize: 14 }}
105
106
  noMargin
106
107
  />
107
108
  {
@@ -115,7 +116,7 @@ const OrderTypeSelectorUI = (props: OrderTypeSelectParams) => {
115
116
  <OText size={12} lineHeight={18} color={theme.colors.white} weight={Platform.OS === 'android' ? 'bold' : '600'}>{item?.label}</OText>
116
117
  <OText size={10} lineHeight={15} color={theme.colors.white}>{item?.description}</OText>
117
118
  <View style={{ flexDirection: 'row', alignItems: 'center' }}>
118
- <OText size={10} lineHeight={15} color={theme.colors.white}>{orderTypeCallAction(item?.value) || t('START_MY_ORDER', 'Start my order')}</OText>
119
+ <OText size={10} lineHeight={15} color={theme.colors.white}>{t('START_MY_ORDER', 'Start my order')}</OText>
119
120
  <AntDesignIcon name='arrowleft' size={26} color={theme.colors.white} style={{ transform: [{ rotate: '180deg' }], marginStart: 4 }} />
120
121
  </View>
121
122
  </MaskCont>
@@ -159,10 +159,7 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
159
159
 
160
160
  useEffect(() => {
161
161
  if (reorderState?.error) {
162
- const errorMessage = (Array.isArray(reorderState?.result) || typeof reorderState?.result === 'string')
163
- ? reorderState?.result
164
- : t('CANT_REORDER_FOR_THIS_BUSINESS', 'Can’t reorder for this store, please create order manually.')
165
- showToast(ToastType.Error, errorMessage)
162
+ showToast(ToastType.Error, reorderState?.result)
166
163
  }
167
164
  }, [reorderState])
168
165
 
@@ -355,9 +352,9 @@ export const OrdersOption = (props: OrdersOptionParams) => {
355
352
  UIComponent: OrdersOptionUI,
356
353
  noGiftCardOrders: true,
357
354
  orderStatus: getAllOrders
358
- ? [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23]
355
+ ? [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26]
359
356
  : props.preOrders ? [13] : props.activeOrders
360
- ? [0, 3, 4, 7, 8, 9, 14, 18, 19, 20, 21, 22, 23]
357
+ ? [0, 3, 4, 7, 8, 9, 14, 18, 19, 20, 21, 22, 23, 24, 25, 26]
361
358
  : [1, 2, 5, 6, 10, 11, 12, 15, 16, 17],
362
359
  useDefualtSessionManager: true,
363
360
  paginationSettings: {
@@ -131,7 +131,6 @@ const PaymentOptionStripeUI = (props: any) => {
131
131
  bgColor={theme.colors.backgroundGray}
132
132
  borderColor={theme.colors.backgroundGray}
133
133
  style={styles.btnAddStyle}
134
- textStyle={{ color: 'white' }}
135
134
  imgRightSrc={null}
136
135
  onClick={() => setAddCardOpen(true)}
137
136
  />
@@ -141,7 +140,6 @@ const PaymentOptionStripeUI = (props: any) => {
141
140
  text={t('CANCEL', 'Cancel')}
142
141
  bgColor={theme.colors.backgroundGray}
143
142
  borderColor={theme.colors.backgroundGray}
144
- textStyle={{ color: 'white' }}
145
143
  style={styles.btnAction}
146
144
  imgRightSrc={null}
147
145
  onClick={() => onCancel()}
@@ -150,9 +148,6 @@ const PaymentOptionStripeUI = (props: any) => {
150
148
  <View style={{ width: '48%' }}>
151
149
  <OButton
152
150
  text={t('ACCEPT', 'Accept')}
153
- bgColor={theme.colors.primary}
154
- borderColor={theme.colors.primary}
155
- textStyle={{ color: 'white' }}
156
151
  style={styles.btnAction}
157
152
  imgRightSrc={null}
158
153
  isDisabled={!cardSelected || cardsList?.cards?.length === 0}