ordering-ui-react-native 0.21.62 → 0.21.63-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 (161) 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 +4 -3
  10. package/themes/business/src/components/Chat/index.tsx +3 -1
  11. package/themes/business/src/components/DriverMap/index.tsx +36 -23
  12. package/themes/business/src/components/GoogleMap/index.tsx +15 -8
  13. package/themes/business/src/components/Home/index.tsx +5 -1
  14. package/themes/business/src/components/LanguageSelector/index.tsx +1 -2
  15. package/themes/business/src/components/LanguageSelector/lang_country.json +515 -70
  16. package/themes/business/src/components/LogoutButton/index.tsx +1 -1
  17. package/themes/business/src/components/MapView/index.tsx +30 -15
  18. package/themes/business/src/components/NewOrderNotification/index.tsx +76 -26
  19. package/themes/business/src/components/OrderDetails/Business.tsx +52 -2
  20. package/themes/business/src/components/OrderDetails/Delivery.tsx +36 -21
  21. package/themes/business/src/components/OrderDetails/OrderContentComponent.tsx +61 -55
  22. package/themes/business/src/components/OrderDetails/OrderHeaderComponent.tsx +35 -21
  23. package/themes/business/src/components/OrderDetails/usePrinterCommands.tsx +220 -0
  24. package/themes/business/src/components/OrderSummary/index.tsx +240 -76
  25. package/themes/business/src/components/OrdersListManager/index.tsx +9 -1
  26. package/themes/business/src/components/OrdersOption/index.tsx +249 -126
  27. package/themes/business/src/components/PhoneInputNumber/index.tsx +8 -5
  28. package/themes/business/src/components/PreviousMessages/index.tsx +12 -0
  29. package/themes/business/src/components/PreviousOrders/OrderItem.tsx +29 -19
  30. package/themes/business/src/components/PreviousOrders/index.tsx +5 -3
  31. package/themes/business/src/components/PrinterEdition/index.tsx +363 -0
  32. package/themes/business/src/components/PrinterEdition/styles.tsx +61 -0
  33. package/themes/business/src/components/PrinterSettings/index.tsx +267 -0
  34. package/themes/business/src/components/PrinterSettings/styles.tsx +30 -0
  35. package/themes/business/src/components/ProductItemAccordion/index.tsx +2 -2
  36. package/themes/business/src/components/ReviewCustomer/index.tsx +2 -0
  37. package/themes/business/src/components/Sessions/index.tsx +187 -0
  38. package/themes/business/src/components/Sessions/styles.tsx +20 -0
  39. package/themes/business/src/components/StoresList/index.tsx +2 -2
  40. package/themes/business/src/components/UserFormDetails/index.tsx +111 -107
  41. package/themes/business/src/components/UserProfileForm/index.tsx +106 -54
  42. package/themes/business/src/components/WebsocketStatus/index.tsx +2 -2
  43. package/themes/business/src/components/shared/OInput.tsx +2 -0
  44. package/themes/business/src/components/shared/OTextarea.tsx +8 -9
  45. package/themes/business/src/hooks/useLocation.tsx +5 -4
  46. package/themes/business/src/types/index.tsx +22 -5
  47. package/themes/business/src/utils/index.tsx +19 -1
  48. package/themes/doordash/src/components/BusinessesListing/index.tsx +1 -1
  49. package/themes/doordash/src/components/LoginForm/index.tsx +1 -2
  50. package/themes/instacart/src/components/BusinessesListing/index.tsx +1 -1
  51. package/themes/kiosk/src/components/Checkout/index.tsx +6 -0
  52. package/themes/kiosk/src/components/NavBar/index.tsx +14 -14
  53. package/themes/kiosk/src/components/OptionCard/index.tsx +1 -1
  54. package/themes/kiosk/src/components/OrderTypeCardSelector/index.tsx +8 -10
  55. package/themes/kiosk/src/components/shared/OButton.tsx +5 -18
  56. package/themes/original/index.tsx +13 -1
  57. package/themes/original/src/components/AddressDetails/index.tsx +20 -10
  58. package/themes/original/src/components/AddressForm/index.tsx +32 -17
  59. package/themes/original/src/components/AddressList/index.tsx +8 -7
  60. package/themes/original/src/components/AnalyticsSegment/index.tsx +6 -6
  61. package/themes/original/src/components/AppleLogin/index.tsx +4 -4
  62. package/themes/original/src/components/BusinessBasicInformation/index.tsx +6 -9
  63. package/themes/original/src/components/BusinessController/index.tsx +14 -9
  64. package/themes/original/src/components/BusinessController/styles.tsx +8 -7
  65. package/themes/original/src/components/BusinessItemAccordion/index.tsx +15 -7
  66. package/themes/original/src/components/BusinessListingSearch/BusinessSearchFooter.tsx +2 -3
  67. package/themes/original/src/components/BusinessListingSearch/BusinessSearchHeader.tsx +1 -3
  68. package/themes/original/src/components/BusinessListingSearch/index.tsx +1 -2
  69. package/themes/original/src/components/BusinessPreorder/index.tsx +20 -15
  70. package/themes/original/src/components/BusinessProductsList/SubcategoriesComponent/index.tsx +5 -5
  71. package/themes/original/src/components/BusinessProductsList/index.tsx +3 -3
  72. package/themes/original/src/components/BusinessProductsList/styles.tsx +0 -3
  73. package/themes/original/src/components/BusinessProductsListing/index.tsx +28 -13
  74. package/themes/original/src/components/BusinessTypeFilter/index.tsx +9 -8
  75. package/themes/original/src/components/BusinessesListing/Layout/Appointment/index.tsx +2 -1
  76. package/themes/original/src/components/BusinessesListing/Layout/Original/index.tsx +1 -1
  77. package/themes/original/src/components/BusinessesListing/Layout/Original/styles.tsx +1 -1
  78. package/themes/original/src/components/BusinessesListing/index.tsx +0 -1
  79. package/themes/original/src/components/Cart/index.tsx +26 -9
  80. package/themes/original/src/components/CartContent/index.tsx +60 -45
  81. package/themes/original/src/components/Checkout/index.tsx +94 -62
  82. package/themes/original/src/components/CitiesControl/index.tsx +0 -3
  83. package/themes/original/src/components/CouponControl/index.tsx +1 -3
  84. package/themes/original/src/components/DriverTips/index.tsx +1 -3
  85. package/themes/original/src/components/Favorite/index.tsx +1 -5
  86. package/themes/original/src/components/FavoriteList/index.tsx +0 -1
  87. package/themes/original/src/components/ForgotPasswordForm/index.tsx +5 -7
  88. package/themes/original/src/components/GiftCard/GiftCardOrdersList/index.tsx +64 -0
  89. package/themes/original/src/components/GiftCard/GiftCardOrdersList/styles.tsx +8 -0
  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 +9 -11
  94. package/themes/original/src/components/GiftCard/SingleGiftCard/index.tsx +101 -0
  95. package/themes/original/src/components/GiftCard/SingleGiftCard/styles.tsx +4 -0
  96. package/themes/original/src/components/GiftCard/VerticalGiftCardOrdersLayout/index.tsx +82 -0
  97. package/themes/original/src/components/GiftCard/VerticalGiftCardOrdersLayout/styles.tsx +9 -0
  98. package/themes/original/src/components/GoogleMap/index.tsx +39 -18
  99. package/themes/original/src/components/Help/index.tsx +2 -0
  100. package/themes/original/src/components/HighestRatedBusinesses/index.tsx +2 -2
  101. package/themes/original/src/components/Home/index.tsx +2 -10
  102. package/themes/original/src/components/LoginForm/Otp/index.tsx +4 -19
  103. package/themes/original/src/components/LoginForm/index.tsx +4 -7
  104. package/themes/original/src/components/MessageListing/index.tsx +1 -0
  105. package/themes/original/src/components/Messages/index.tsx +8 -7
  106. package/themes/original/src/components/MomentOption/index.tsx +13 -2
  107. package/themes/original/src/components/MultiCartsPaymethodsAndWallets/index.tsx +7 -3
  108. package/themes/original/src/components/MultiCheckout/index.tsx +123 -62
  109. package/themes/original/src/components/MultiCheckout/styles.tsx +17 -0
  110. package/themes/original/src/components/MultiOrdersDetails/index.tsx +20 -14
  111. package/themes/original/src/components/MyOrders/index.tsx +21 -26
  112. package/themes/original/src/components/NavBar/index.tsx +4 -2
  113. package/themes/original/src/components/NetworkError/index.tsx +0 -5
  114. package/themes/original/src/components/NotFoundSource/index.tsx +0 -3
  115. package/themes/original/src/components/OrderDetails/OrderHistory.tsx +5 -7
  116. package/themes/original/src/components/OrderDetails/index.tsx +5 -7
  117. package/themes/original/src/components/OrderDetails/styles.tsx +0 -1
  118. package/themes/original/src/components/OrderProgress/index.tsx +22 -3
  119. package/themes/original/src/components/OrderTypeSelector/index.tsx +7 -6
  120. package/themes/original/src/components/OrdersOption/index.tsx +2 -4
  121. package/themes/original/src/components/PaymentOptionCard/index.tsx +4 -2
  122. package/themes/original/src/components/PaymentOptionStripe/index.tsx +0 -5
  123. package/themes/original/src/components/PaymentOptionWallet/index.tsx +56 -56
  124. package/themes/original/src/components/PaymentOptions/index.tsx +47 -6
  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 +16 -19
  128. package/themes/original/src/components/ProductForm/index.tsx +120 -109
  129. package/themes/original/src/components/ProductItemAccordion/index.tsx +55 -49
  130. package/themes/original/src/components/ProductItemAccordion/styles.tsx +3 -4
  131. package/themes/original/src/components/ProductOptionSubOption/index.tsx +112 -91
  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 +65 -67
  141. package/themes/original/src/components/SingleOrderCard/index.tsx +1 -2
  142. package/themes/original/src/components/SingleProductCard/index.tsx +5 -6
  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 +12 -36
  146. package/themes/original/src/components/StripeElementsForm/index.tsx +78 -59
  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/UpsellingProducts/UpsellingContent.tsx +10 -7
  150. package/themes/original/src/components/UpsellingProducts/UpsellingLayout.tsx +8 -3
  151. package/themes/original/src/components/UserFormDetails/index.tsx +83 -84
  152. package/themes/original/src/components/UserProfile/index.tsx +11 -2
  153. package/themes/original/src/components/Wallets/index.tsx +7 -4
  154. package/themes/original/src/components/WebsocketStatus/index.tsx +169 -0
  155. package/themes/original/src/components/WebsocketStatus/styles.tsx +28 -0
  156. package/themes/original/src/components/shared/OAlert.tsx +2 -1
  157. package/themes/original/src/components/shared/OButton.tsx +8 -7
  158. package/themes/original/src/components/shared/OInput.tsx +1 -4
  159. package/themes/original/src/types/index.tsx +5 -1
  160. package/themes/original/src/utils/index.tsx +12 -1
  161. package/themes/uber-eats/src/components/BusinessesListing/index.tsx +1 -1
@@ -1,6 +1,7 @@
1
1
  import React, { useState, useCallback } from 'react'
2
2
 
3
3
  import { Platform, StyleSheet, View, TouchableOpacity, ScrollView } from 'react-native';
4
+ import AntDesignIcon from 'react-native-vector-icons/AntDesign'
4
5
 
5
6
  import { OButton, OText, OLink, OModal } from '../shared'
6
7
  import {
@@ -53,6 +54,7 @@ export const OrderContentComponent = (props: OrderContent) => {
53
54
  const WIDTH_SCREEN = orientationState?.dimensions?.width
54
55
 
55
56
  const [openReviewModal, setOpenReviewModal] = useState(false)
57
+ const [showCustomFields, setShowCustomFields] = useState<boolean>(false);
56
58
 
57
59
  const [isReadMore, setIsReadMore] = useState({
58
60
  customerAddress: false,
@@ -134,27 +136,36 @@ export const OrderContentComponent = (props: OrderContent) => {
134
136
 
135
137
  {order?.metafields?.length > 0 && (
136
138
  <OrderBusiness>
137
- <OText style={{ marginBottom: 5 }} size={16} weight="600">
138
- {t('CUSTOM_FIELDS', 'Custom fields')}
139
- </OText>
140
-
141
- {order.metafields.map((field: any) => (
142
- <View
143
- key={field.id}
144
- style={{
145
- width: '100%',
146
- flexDirection: 'row',
147
- marginBottom: 5
148
- }}
149
- >
150
- <OText style={{ width: '50%' }}>
151
- {field.key}
152
- </OText>
153
- <OText style={{ width: '45%', textAlign: 'right' }}>
154
- {field.value}
155
- </OText>
156
- </View>
157
- ))}
139
+ <TouchableOpacity onPress={() => setShowCustomFields((prev: boolean) => !prev)} style={{ flexDirection: 'row', width: '100%', justifyContent: 'space-between', alignItems: 'flex-start' }}>
140
+ <OText style={{ marginBottom: 5 }} size={16} weight="600">
141
+ {t('CUSTOM_FIELDS', 'Custom fields')}
142
+ </OText>
143
+ <AntDesignIcon
144
+ name={showCustomFields ? 'up' : 'down'}
145
+ size={14}
146
+ />
147
+ </TouchableOpacity>
148
+ {showCustomFields && (
149
+ <>
150
+ {order.metafields.map((field: any) => (
151
+ <View
152
+ key={field.id}
153
+ style={{
154
+ width: '100%',
155
+ flexDirection: 'row',
156
+ marginBottom: 5
157
+ }}
158
+ >
159
+ <OText style={{ width: '50%' }}>
160
+ {field.key}
161
+ </OText>
162
+ <OText style={{ width: '45%', textAlign: 'right' }}>
163
+ {field.value}
164
+ </OText>
165
+ </View>
166
+ ))}
167
+ </>
168
+ )}
158
169
  </OrderBusiness>
159
170
  )}
160
171
 
@@ -208,8 +219,8 @@ export const OrderContentComponent = (props: OrderContent) => {
208
219
  <OLink
209
220
  PressStyle={styles.linkWithIcons}
210
221
  url={Platform.select({
211
- ios: `maps:0,0?q=${order?.business?.address}`,
212
- android: `geo:0,0?q=${order?.business?.address}`,
222
+ ios: `maps:0,0?q=${order?.business?.address}@${order?.business?.location?.lat},${order?.business?.location?.lng}`,
223
+ android: `geo:0,0?q=${order?.business?.address}@${order?.business?.location?.lat},${order?.business?.location?.lng}`,
213
224
  })}
214
225
  numberOfLines={2}
215
226
  shorcut={order?.business?.address}
@@ -219,7 +230,7 @@ export const OrderContentComponent = (props: OrderContent) => {
219
230
  )}
220
231
  {!!order?.business?.location && order?.customer?.location && (
221
232
  <OText>
222
- {t('DISTANCE_TO_THE_BUSINESS', 'Distance to the business')}: {transformDistance(calculateDistance(order?.business?.location, { latitude: order?.customer?.location?.lat, longitude: order?.customer?.location?.lng }), distanceUnit)} {t(distanceUnit.toUpperCase(), distanceUnit)}
233
+ {t('DISTANCE_TO_THE_BUSINESS', 'Distance to the business')}: {transformDistance(calculateDistance(order?.business?.location, { latitude: order?.customer?.location?.lat, longitude: order?.customer?.location?.lng }), distanceUnit)} {t(distanceUnit?.toUpperCase?.(), distanceUnit)}
223
234
  </OText>
224
235
  )}
225
236
  {!!order?.business?.address_notes && (
@@ -228,8 +239,8 @@ export const OrderContentComponent = (props: OrderContent) => {
228
239
  <OLink
229
240
  PressStyle={styles.linkWithIcons}
230
241
  url={Platform.select({
231
- ios: `maps:0,0?q=${order?.business?.address_notes}`,
232
- android: `geo:0,0?q=${order?.business?.address_notes}`,
242
+ ios: `maps:0,0?q=${order?.business?.address_notes}@${order?.business?.location?.lat},${order?.business?.location?.lng}`,
243
+ android: `geo:0,0?q=${order?.business?.address_notes}@${order?.business?.location?.lat},${order?.business?.location?.lng}`,
233
244
  })}
234
245
  shorcut={order?.business?.address_notes}
235
246
  TextStyle={styles.textLink}
@@ -349,8 +360,8 @@ export const OrderContentComponent = (props: OrderContent) => {
349
360
  <OLink
350
361
  PressStyle={{ ...styles.linkWithIcons, marginBottom: 0 }}
351
362
  url={Platform.select({
352
- ios: `maps:0,0?q=${order?.customer?.address}`,
353
- android: `geo:0,0?q=${order?.customer?.address}`,
363
+ ios: `maps:0,0?q=${order?.customer?.address}@${order?.customer?.location?.lat},${order?.customer?.location?.lng}`,
364
+ android: `geo:0,0?q=${order?.customer?.address}@${order?.customer?.location?.lat},${order?.customer?.location?.lng}`,
354
365
  })}
355
366
  onTextLayout={e => onTextLayout(e, 'customerAddress')}
356
367
  numberOfLines={isReadMore.customerAddress ? 20 : 2}
@@ -397,26 +408,16 @@ export const OrderContentComponent = (props: OrderContent) => {
397
408
  {t('ON_BEHALF_OF', 'On behalf of')}{': '} {order?.on_behalf_of}
398
409
  </OText>
399
410
  )}
400
- {((order?.delivery_option !== undefined && order?.delivery_type === 1) || !!order?.comment) && (
411
+ {(order?.delivery_option !== undefined && order?.delivery_type === 1) && (
401
412
  <View style={{ marginTop: 10 }}>
402
413
  {order?.delivery_option !== undefined && order?.delivery_type === 1 && (
403
414
  <OText>
404
- {t(order?.delivery_option?.name?.toUpperCase()?.replace(/ /g, '_'), order?.delivery_option?.name)}
415
+ {t(order?.delivery_option?.name?.toUpperCase?.()?.replace(/ /g, '_'), order?.delivery_option?.name)}
405
416
  </OText>
406
417
  )}
407
- {!!order?.comment && (
408
- <>
409
- <OText weight='500' style={{ marginBottom: 5 }}>
410
- {t('ORDER_COMMENT', 'Order Comment')}
411
- </OText>
412
- <OText style={{ fontStyle: 'italic', opacity: 0.6, marginBottom: 20 }}>
413
- {order?.comment}
414
- </OText>
415
- </>
416
- )}
417
418
  </View>
418
419
  )}
419
- {!order?.user_review && pastOrderStatuses.includes(order?.status) && (
420
+ {!order?.user_review && pastOrderStatuses.includes(order?.status) && order?.customer_id && (
420
421
  <OButton
421
422
  style={styles.btnReview}
422
423
  textStyle={{ color: theme.colors.white }}
@@ -428,10 +429,16 @@ export const OrderContentComponent = (props: OrderContent) => {
428
429
  </OrderCustomer>
429
430
 
430
431
  <OrderProducts>
431
- <OText style={{ marginBottom: 5 }} size={16} weight="600">
432
+ <OText style={{ marginBottom: 10 }} size={16} weight="600">
432
433
  {t('ORDER_DETAILS', 'Order Details')}
433
434
  </OText>
434
435
 
436
+ {!!order?.comment && (
437
+ <OText>
438
+ {`${t('ORDER_COMMENT', 'Order Comment')}: ${order?.comment}`}
439
+ </OText>
440
+ )}
441
+
435
442
  {order?.products?.length > 0 &&
436
443
  order?.products.map((product: any, i: number) => (
437
444
  <ProductItemAccordion
@@ -467,7 +474,7 @@ export const OrderContentComponent = (props: OrderContent) => {
467
474
  <Table key={offer.id}>
468
475
  <OSRow>
469
476
  <OText mBottom={4}>
470
- {t(offer.name?.toUpperCase()?.replace(/ /g, '_'), offer.name)}
477
+ {t(offer.name?.toUpperCase?.()?.replace(/ /g, '_'), offer.name)}
471
478
  {offer.rate_type === 1 && (
472
479
  <OText>{`(${verifyDecimals(offer?.rate, parsePrice)}%)`}</OText>
473
480
  )}
@@ -513,7 +520,7 @@ export const OrderContentComponent = (props: OrderContent) => {
513
520
  <Table key={tax.id}>
514
521
  <OSRow>
515
522
  <OText mBottom={4}>
516
- {t(tax?.name?.toUpperCase()?.replace(/ /g, '_'), tax?.name) || t('INHERIT_FROM_BUSINESS', 'Inherit from business')}
523
+ {t(tax?.name?.toUpperCase?.()?.replace(/ /g, '_'), tax?.name) || t('INHERIT_FROM_BUSINESS', 'Inherit from business')}
517
524
  {`(${verifyDecimals(tax?.rate, parseNumber)}%)`}{' '}
518
525
  </OText>
519
526
  </OSRow>
@@ -526,7 +533,7 @@ export const OrderContentComponent = (props: OrderContent) => {
526
533
  <Table key={fee.id}>
527
534
  <OSRow>
528
535
  <OText mBottom={4}>
529
- {t(fee?.name?.toUpperCase()?.replace(/ /g, '_'), fee?.name) || t('INHERIT_FROM_BUSINESS', 'Inherit from business')}
536
+ {t(fee?.name?.toUpperCase?.()?.replace(/ /g, '_'), fee?.name) || t('INHERIT_FROM_BUSINESS', 'Inherit from business')}
530
537
  ({fee?.fixed > 0 && `${parsePrice(fee?.fixed, { currency: order?.currency })} + `}{fee.percentage}%){' '}
531
538
  </OText>
532
539
  </OSRow>
@@ -539,7 +546,7 @@ export const OrderContentComponent = (props: OrderContent) => {
539
546
  <Table key={offer.id}>
540
547
  <OSRow>
541
548
  <OText mBottom={4}>
542
- {t(offer.name?.toUpperCase()?.replace(/ /g, '_'), offer.name)}
549
+ {t(offer.name?.toUpperCase?.()?.replace(/ /g, '_'), offer.name)}
543
550
  {offer.rate_type === 1 && (
544
551
  <OText>{`(${verifyDecimals(offer?.rate, parsePrice)}%)`}</OText>
545
552
  )}
@@ -550,7 +557,7 @@ export const OrderContentComponent = (props: OrderContent) => {
550
557
  ))
551
558
  }
552
559
  {
553
- typeof order?.summary?.delivery_price === 'number' && (
560
+ typeof order?.summary?.delivery_price === 'number' && order.delivery_type !== 2 && (
554
561
  <Table>
555
562
  <OText mBottom={4}>
556
563
  {t('DELIVERY_FEE', 'Delivery Fee')}
@@ -567,7 +574,7 @@ export const OrderContentComponent = (props: OrderContent) => {
567
574
  <Table key={offer.id}>
568
575
  <OSRow>
569
576
  <OText mBottom={4}>
570
- {t(offer.name?.toUpperCase()?.replace(/ /g, '_'), offer.name)}
577
+ {t(offer.name?.toUpperCase?.()?.replace(/ /g, '_'), offer.name)}
571
578
  {offer.rate_type === 1 && (
572
579
  <OText>{`(${verifyDecimals(offer?.rate, parsePrice)}%)`}</OText>
573
580
  )}
@@ -577,7 +584,7 @@ export const OrderContentComponent = (props: OrderContent) => {
577
584
  </Table>
578
585
  ))
579
586
  }
580
- {(order?.summary?.driver_tip > 0 || order?.driver_tip > 0) && (
587
+ {(order?.summary?.driver_tip > 0 || order?.driver_tip > 0) && order.delivery_type !== 2 && (
581
588
  <Table>
582
589
  <OText mBottom={4}>
583
590
  {t('DRIVER_TIP', 'Driver tip')}
@@ -635,13 +642,12 @@ export const OrderContentComponent = (props: OrderContent) => {
635
642
  <OText>
636
643
  {event?.wallet_event
637
644
  ? walletName[event?.wallet_event?.wallet?.type]?.name
638
- : t(event?.paymethod?.name?.toUpperCase()?.replace(/ /g, '_'), event?.paymethod?.name)}
645
+ : event?.paymethod?.gateway
646
+ ? t(event?.paymethod?.gateway?.toUpperCase?.(), event?.paymethod?.name)
647
+ : order?.paymethod?.id === event?.paymethod_id
648
+ ? t(order?.paymethod?.gateway?.toUpperCase?.(), order?.paymethod?.name)
649
+ : ''}
639
650
  </OText>
640
- {/* {event?.data?.charge_id && (
641
- <OText>
642
- {`${t('CODE', 'Code')}: ${event?.data?.charge_id}`}
643
- </OText>
644
- )} */}
645
651
  </View>
646
652
  <OText>
647
653
  {(event?.paymethod?.gateway === 'cash' && order?.cash)
@@ -22,6 +22,7 @@ import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityI
22
22
  import {
23
23
  useLanguage,
24
24
  useUtils,
25
+ useConfig
25
26
  } from 'ordering-components/native';
26
27
 
27
28
  interface OrderHeader {
@@ -49,7 +50,10 @@ export const OrderHeaderComponent = (props: OrderHeader) => {
49
50
  } = props
50
51
  const theme = useTheme();
51
52
  const [, t] = useLanguage();
52
- const [{ parseDate }] = useUtils();
53
+ const [configState] = useConfig()
54
+ const [{ parseDate, parsePrice }] = useUtils();
55
+ const paymethodsLength = order?.payment_events?.filter((item: any) => item.event === 'payment')?.length
56
+ const showExternalId = configState?.configs?.change_order_id?.value === '1'
53
57
 
54
58
  const styles = StyleSheet.create({
55
59
  icons: {
@@ -120,6 +124,30 @@ export const OrderHeaderComponent = (props: OrderHeader) => {
120
124
  ? t('CURBSIDE', 'Curbside')
121
125
  : t('DRIVER_THRU', 'Driver thru')
122
126
 
127
+ const handlePaymethodsListString = () => {
128
+ const paymethodsList = order?.payment_events?.filter((item: any) => item.event === 'payment').map((paymethod: any) => {
129
+ return paymethod?.wallet_event
130
+ ? walletName[paymethod?.wallet_event?.wallet?.type]?.name
131
+ : paymethod?.paymethod?.gateway && paymethod?.paymethod?.gateway === 'cash' && order?.cash > 0
132
+ ? `${t(paymethod?.paymethod?.gateway?.toUpperCase(), paymethod?.paymethod?.name)} (${t('CASH_CHANGE_OF', 'Change of :amount:').replace(':amount:', parsePrice(order?.cash))})`
133
+ : paymethod?.paymethod?.gateway
134
+ ? t(paymethod?.paymethod?.gateway?.toUpperCase(), paymethod?.paymethod?.name)
135
+ : t(order?.paymethod?.gateway?.toUpperCase(), order?.paymethod?.name)
136
+ })
137
+ return paymethodsList.join(', ')
138
+ }
139
+
140
+ const deliveryDate = () => {
141
+ const dateString = order?.delivery_datetime_utc ?? order?.delivery_datetime
142
+ const currentDate = new Date();
143
+ const receivedDate: any = new Date(order?.delivery_datetime);
144
+
145
+ const formattedDate = receivedDate <= currentDate
146
+ ? `${t('ASAP_ABBREVIATION', 'ASAP')}(${parseDate(dateString, { utc: !!order?.delivery_datetime_utc })})`
147
+ : parseDate(dateString, { utc: !!order?.delivery_datetime_utc })
148
+ return formattedDate
149
+ }
150
+
123
151
  return (
124
152
  <>
125
153
  {!props.isCustomView && (
@@ -182,16 +210,12 @@ export const OrderHeaderComponent = (props: OrderHeader) => {
182
210
  <OrderHeader>
183
211
  {!props.isCustomView ? (
184
212
  <OText size={13} style={{ marginBottom: 5 }}>
185
- {order?.delivery_datetime_utc
186
- ? parseDate(order?.delivery_datetime_utc)
187
- : parseDate(order?.delivery_datetime, { utc: false })}
213
+ {deliveryDate()}
188
214
  </OText>
189
215
  ) : (
190
216
  <Header style={{ alignItems: 'center' }}>
191
217
  <OText size={13} style={{ marginBottom: 5 }}>
192
- {order?.delivery_datetime_utc
193
- ? parseDate(order?.delivery_datetime_utc)
194
- : parseDate(order?.delivery_datetime, { utc: false })}
218
+ {deliveryDate()}
195
219
  </OText>
196
220
 
197
221
  {(!order?.isLogistic || (!logisticOrderStatus?.includes(order?.status) && !order?.order_group)) && (
@@ -249,7 +273,7 @@ export const OrderHeaderComponent = (props: OrderHeader) => {
249
273
 
250
274
  <OText numberOfLines={2} size={20} weight="600">
251
275
  <>
252
- {`${t('INVOICE_ORDER_NO', 'Order No.')} ${order?.id} `}
276
+ {`${t('INVOICE_ORDER_NO', 'Order No.')} ${showExternalId ? order?.external_id || order?.id : order?.id} `}
253
277
  {!order?.isLogistic && (!order?.order_group_id || !logisticOrderStatus?.includes(order?.status)) && (
254
278
  <>
255
279
  {t('IS', 'is')}{' '}
@@ -263,7 +287,7 @@ export const OrderHeaderComponent = (props: OrderHeader) => {
263
287
  )}
264
288
  </>
265
289
  </OText>
266
- {order?.external_id && (
290
+ {order?.external_id && !showExternalId && (
267
291
  <OText size={13}>
268
292
  <OText size={13} weight='bold'>{`${t('EXTERNAL_ID', 'External ID :')} `}</OText>
269
293
  {order?.external_id}
@@ -283,20 +307,10 @@ export const OrderHeaderComponent = (props: OrderHeader) => {
283
307
  )}
284
308
  <OText>
285
309
  <OText size={13} weight='bold'>
286
- {`${t('PAYMENT_METHODS', 'Payment methods')}: `}
310
+ {`${t(paymethodsLength > 1 ? 'PAYMENT_METHODS' : 'PAYMENT_METHOD', paymethodsLength > 1 ? 'Payment methods' : 'Payment method')}: `}
287
311
  </OText>
288
312
  {order?.payment_events?.length > 0 ? (
289
- <OText size={13}>
290
- {order?.payment_events?.map((event: any, idx: number) => {
291
- return event?.wallet_event
292
- ? idx < order?.payment_events?.length - 1
293
- ? `${walletName[event?.wallet_event?.wallet?.type]?.name} - `
294
- : walletName[event?.wallet_event?.wallet?.type]?.name
295
- : idx < order?.payment_events?.length - 1
296
- ? `${t(event?.paymethod?.name?.toUpperCase()?.replace(/ /g, '_'), event?.paymethod?.name)} - `
297
- : t(event?.paymethod?.name?.toUpperCase()?.replace(/ /g, '_'), event?.paymethod?.name)
298
- })}
299
- </OText>
313
+ <OText size={13}>{`${handlePaymethodsListString()}`}</OText>
300
314
  ) : (
301
315
  <OText size={13}>{t(order?.paymethod?.gateway?.toUpperCase(), order?.paymethod?.name)}</OText>
302
316
  )}
@@ -0,0 +1,220 @@
1
+ import { useConfig, useUtils, useLanguage} from 'ordering-components/native'
2
+
3
+ import { verifyDecimals, getProductPrice } from '../../utils';
4
+
5
+ /**
6
+ * Hook to create commands for star micronics printer using PassPRNT library
7
+ * @returns array of strings
8
+ */
9
+
10
+ export const usePrinterCommands = () => {
11
+ const [, t] = useLanguage()
12
+ const [{ configs }] = useConfig();
13
+ const [{ parsePrice, parseNumber, parseDate }] = useUtils();
14
+
15
+ const deliveryStatus: any = {
16
+ 1: t('DELIVERY', 'Delivery'),
17
+ 2: t('PICK_UP', 'Pick up'),
18
+ 3: t('EAT_IN', 'Eat In'),
19
+ 4: t('CURBSIDE', 'Curbside'),
20
+ 5: t('DRIVER_THRU', 'Driver thru'),
21
+ };
22
+
23
+ const walletName: any = {
24
+ cash: {
25
+ name: t('CASH_WALLET', 'Cash Wallet')
26
+ },
27
+ credit_point: {
28
+ name: t('POINTS_WALLET', 'Points Wallet')
29
+ }
30
+ }
31
+
32
+ const percentTip = (order: any) =>
33
+ parseInt(configs?.driver_tip_type?.value, 10) === 2 &&
34
+ !parseInt(configs?.driver_tip_use_custom?.value, 10) &&
35
+ verifyDecimals(order?.summary?.driver_tip, parseNumber);
36
+
37
+ const handlePaymethodsListString = (order: any) => {
38
+ const paymethodsList = order?.payment_events?.filter((item: any) => item.event === 'payment').map((paymethod: any) => {
39
+ return paymethod?.wallet_event
40
+ ? walletName[paymethod?.wallet_event?.wallet?.type]?.name
41
+ : paymethod?.paymethod?.gateway && paymethod?.paymethod?.gateway === 'cash' && order?.cash > 0
42
+ ? `${t(paymethod?.paymethod?.gateway?.toUpperCase(), paymethod?.paymethod?.name)} (${t('CASH_CHANGE_OF', 'Change of :amount:').replace(':amount:', parsePrice(order?.cash))})`
43
+ : paymethod?.paymethod?.gateway
44
+ ? t(paymethod?.paymethod?.gateway?.toUpperCase(), paymethod?.paymethod?.name)
45
+ : t(order?.paymethod?.gateway?.toUpperCase(), order?.paymethod?.name)
46
+ })
47
+ return paymethodsList.join(', ')
48
+ }
49
+
50
+ const paymethodsLength = (order: any) => order?.payment_events?.filter((item: any) => item.event === 'payment')?.length
51
+
52
+ const customerName = (order: any) => `${order?.customer?.name ?? ''} ${order?.customer?.middle_name ?? ''} ${order?.customer?.lastname ?? ''} ${order?.customer?.second_lastname ?? ''}`?.replace(' ', ' ')?.trim() ?? ''
53
+
54
+ const deliveryDate = (order: any) => {
55
+ const dateString = order?.delivery_datetime_utc ?? order?.delivery_datetime
56
+ const currentDate = new Date();
57
+ const receivedDate: any = new Date(order?.delivery_datetime);
58
+
59
+ const formattedDate = receivedDate <= currentDate
60
+ ? `${t('ASAP_ABBREVIATION', 'ASAP')}(${parseDate(dateString, { utc: !!order?.delivery_datetime_utc })})`
61
+ : parseDate(dateString, { utc: !!order?.delivery_datetime_utc })
62
+ return formattedDate
63
+ }
64
+
65
+ const generateProductsText = (order: any, { endLine }: any) => {
66
+ const list: any = []
67
+
68
+ if (order?.products.length) {
69
+ order?.products.map((product: any) => {
70
+ list.push(`${product?.quantity} ${product?.name} \t ${parsePrice(product.total ?? getProductPrice(product))}${endLine}`)
71
+
72
+ if (product?.ingredients?.length) {
73
+ list.push({ text: `\t ${t('INGREDIENTS', 'Ingredients')}:${endLine}`, props: { fontSize: 10 } })
74
+ product?.ingredients?.map((ingredient: any) => {
75
+ list.push({ text: `\t ${t('NO', 'No')} ${ingredient.name}${endLine}` , fontSize: 10 })
76
+ })
77
+ }
78
+
79
+ product.options?.map((option: any) => {
80
+ list.push({ text: `\t ${option.name}${endLine}`, props: { fontSize: 10 } })
81
+
82
+ option.suboptions?.map((suboption: any) => {
83
+ const { quantity, name, position, price } = suboption
84
+ const pos = position && position !== 'whole' ? `(${t(position.toUpperCase(), position)})` : ''
85
+ const string = name !== 'No'
86
+ ? pos
87
+ ? `${quantity} x ${name} ${pos} +${parsePrice(price)}`
88
+ : `${quantity} x ${name} +${parsePrice(price)}`
89
+ : 'No'
90
+
91
+ list.push({ text: `\t\t ${string}${endLine}`, props: { fontSize: 10 } })
92
+ })
93
+ })
94
+
95
+ if (product.comment) {
96
+ list.push({ text: `\t ${t('COMMENT', 'Comment')}${endLine}`, props: { fontSize: 10 } })
97
+ list.push({ text: `\t\t ${product.comment}${endLine}`, props: { fontSize: 10 } })
98
+ }
99
+
100
+ list.push('_separator_')
101
+ })
102
+ }
103
+
104
+ return list
105
+ }
106
+
107
+ const paymethodsList = (order: any, { endLine }: any) => {
108
+ const list: any = []
109
+
110
+ if (order?.payment_events?.length > 0) {
111
+ order?.payment_events.map((event: any) => {
112
+ const payment = event?.wallet_event
113
+ ? walletName[event?.wallet_event?.wallet?.type]?.name
114
+ : t(event?.paymethod?.name?.toUpperCase()?.replace(/ /g, '_'), event?.paymethod?.name)
115
+
116
+ const amount = (event?.paymethod?.gateway === 'cash' && order?.cash)
117
+ ? parsePrice(order?.cash, { currency: order?.currency })
118
+ : `-${parsePrice(event?.amount, { currency: order?.currency })}`
119
+
120
+ list.push(`${payment} \t ${amount}${endLine}`)
121
+ })
122
+ }
123
+
124
+ return list
125
+ }
126
+
127
+ const replaceChars = (string: string) => {
128
+ const accents: any = {
129
+ 'á': 'a',
130
+ 'é': 'e',
131
+ 'í': 'i',
132
+ 'ó': 'o',
133
+ 'ú': 'u',
134
+ 'Á': 'A',
135
+ 'É': 'E',
136
+ 'Í': 'I',
137
+ 'Ó': 'O',
138
+ 'Ú': 'U',
139
+ 'ü': 'u',
140
+ 'Ü': 'U',
141
+ 'ñ': 'n',
142
+ 'Ñ': 'N',
143
+ "'": '',
144
+ "’": '',
145
+ "`": '',
146
+ };
147
+ return string.replace(/[áéíóúÁÉÍÓÚüÜñÑ'’`]/g, (match: any) => accents[match])
148
+ }
149
+
150
+ const generateCommands = (order: any, printMode: string = 'append') => {
151
+ let commands: any = [];
152
+
153
+ const isAppendMode = printMode === 'append'
154
+ const jumpLine = isAppendMode ? '\n' : ' '
155
+ const endLine = isAppendMode ? '\n' : ''
156
+
157
+ const textProps = { fontSize: 12 }
158
+
159
+ const appends: any = [
160
+ { text: `${t('ORDER_NO', 'Order No.')} ${order.id}${endLine}`, props: { fontSize: 16 } },
161
+ jumpLine,
162
+ `${order.orderStatus}${endLine}`,
163
+ { text: `${t('ORDER_TYPE', 'Order Type')}: ${deliveryStatus[order?.delivery_type]}${endLine}`, props: { fontSize: 14 } },
164
+ { text: `${t(`PAYMENT_METHOD${paymethodsLength(order) > 1 ? 'S' : ''}`, `Payment method${paymethodsLength(order) > 1 ? 's' : ''}`)}: ${handlePaymethodsListString(order)}${endLine}`, props: { fontSize: 14 } },
165
+ `${!!order?.delivery_option ? `${t('DELIVERY_PREFERENCE', 'Delivery Preference')}: ${t(order?.delivery_option?.name?.toUpperCase()?.replace(/ /g, '_'), order?.delivery_option?.name)}${endLine}` : ''}`,
166
+ `${t('DELIVERY_DATE', 'Delivery Date')}: ${deliveryDate(order)}${endLine}`,
167
+ '_separator_',
168
+ { text: `${t('CUSTOMER_DETAILS', 'Customer details')}${endLine}`, props: { fontSize: 14 } },
169
+ `${t('FULL_NAME', 'Full Name')}: ${customerName(order)}${endLine}`,
170
+ `${t('EMAIL', 'Email')}: ${order?.customer?.email}${endLine}`,
171
+ `${!!order?.customer?.cellphone ? `${t('MOBILE_PHONE', 'Mobile Phone')}: ${order?.customer?.cellphone}${endLine}` : ''}`,
172
+ `${!!order?.customer?.phone ? `${t('MOBILE_PHONE', 'Mobile Phone')}: ${order?.customer?.phone}${endLine}` : ''}`,
173
+ `${t('FULL_ADDRESS', 'Full Addres')}: ${order?.customer?.address}${endLine}`,
174
+ `${!!order?.customer?.internal_number ? `${t('INTERNAL_NUMBER', 'Internal Number')}: ${order?.customer?.internal_number}${endLine}` : ''}`,
175
+ `${!!order?.customer?.zipcode ? `${t('ZIPCODE', 'Zipcode')}: ${order?.customer?.zipcode}${endLine}` : ''}`,
176
+ '_separator_',
177
+ { text: `${t('BUSINESS_DETAILS', 'Business details')}${endLine}`, props: { fontSize: 14 } },
178
+ `${order?.business?.name}${endLine}`,
179
+ `${order?.business?.email}${endLine}`,
180
+ `${!!order?.business?.cellphone ? `${t('BUSINESS_PHONE', 'Business Phone')}: ${order?.business?.cellphone}${endLine}` : ''}`,
181
+ `${!!order?.business?.phone ? `${t('BUSINESS_PHONE', 'Business Phone')}: ${order?.business?.phone}${endLine}` : ''}`,
182
+ `${t('ADDRESS', 'Address')}: ${order?.business?.address}${endLine}`,
183
+ `${!!order?.business?.address_notes ? `${t('SPECIAL_ADDRESS', 'Special Address')}: ${order?.business?.address_notes}${endLine}` : ''}`,
184
+ '_separator_',
185
+ { text: `${t('ORDER_DETAILS', 'Order Details')}${endLine}`, props: { fontSize: 14 } },
186
+ `${!!order?.comment ? `${t('ORDER_COMMENT', 'Order Comment')}: ${order?.comment}${endLine}` : ''}`,
187
+ ...generateProductsText(order, { endLine }),
188
+ `${t('SUBTOTAL', 'Subtotal')} \t\t ${parsePrice(order.tax_type === 1 ? (order?.summary?.subtotal + order?.summary?.tax) ?? 0 : order?.summary?.subtotal ?? 0)}${endLine}`,
189
+ `${order?.summary?.discount > 0 ? `${order?.offer_type === 1 ? `${t('DISCOUNT', 'Discount')} (${verifyDecimals(order?.offer_rate, parsePrice)}%)${endLine}` : t('DISCOUNT', 'Discount')} \t\t ${parsePrice(order?.summary?.discount)}${endLine}` : ''}`,
190
+ `${order?.tax_type !== 1 ? `${t('TAX', 'Tax')} (${verifyDecimals(order?.summary?.tax_rate, parseNumber)}%) \t\t ${parsePrice(order?.summary?.tax ?? 0)}${endLine}` : ''}`,
191
+ `${order?.summary?.delivery_price > 0 && order.delivery_type !== 2 ? `${t('DELIVERY_FEE', 'Delivery Fee')} \t\t ${parsePrice(order?.summary?.delivery_price ?? 0)}${endLine}` : ''}`,
192
+ `${(order?.summary?.driver_tip > 0 || order?.driver_tip > 0) && order.delivery_type !== 2 ? `${t('DRIVER_TIP', 'Driver tip')} ${percentTip(order) ? `(${percentTip(order)}%)` : ''} \t\t ${parsePrice(order?.summary?.driver_tip ?? 0)}${endLine}` : ''}`,
193
+ `${order?.summary?.service_fee > 0 ? `${t('SERVICE_FEE', 'Service Fee')} (${verifyDecimals(order?.summary?.service_fee, parseNumber)}%) \t\t ${parsePrice(order?.summary?.service_fee ?? 0)}${endLine}` : ''}`,
194
+ '_separator_',
195
+ `${t('TOTAL', 'Total')} \t\t ${parsePrice(order?.summary?.total ?? 0)}${endLine}`,
196
+ jumpLine,
197
+ `${order?.payment_events?.length > 0 ? `${t('PAYMENTS', 'Payments')}${endLine}` : ''}`,
198
+ ...paymethodsList(order, { endLine }),
199
+ jumpLine,
200
+ jumpLine,
201
+ ]
202
+
203
+ commands = [
204
+ ...commands,
205
+ ...appends.map((append: any) => {
206
+ return append === '_separator_'
207
+ ? { [printMode]: `---------------------------------------${endLine}` }
208
+ : {
209
+ [printMode]: replaceChars(append?.text ?? append),
210
+ ...textProps,
211
+ ...append?.props
212
+ }
213
+ })
214
+ ]
215
+
216
+ return commands
217
+ }
218
+
219
+ return { generateCommands }
220
+ }