ordering-ui-react-native 0.16.54 → 0.16.55-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 (202) hide show
  1. package/package.json +6 -5
  2. package/src/DeliveryApp.tsx +43 -1
  3. package/src/components/ActiveOrders/index.tsx +61 -63
  4. package/src/components/ActiveOrders/styles.tsx +8 -14
  5. package/src/components/BusinessInformation/index.tsx +33 -4
  6. package/src/components/BusinessInformation/styles.tsx +2 -2
  7. package/src/components/BusinessProductsList/index.tsx +10 -10
  8. package/src/components/BusinessesListing/index.tsx +1 -1
  9. package/src/components/Checkout/index.tsx +2 -1
  10. package/src/components/LanguageSelector/index.tsx +21 -16
  11. package/src/components/Messages/index.tsx +2 -2
  12. package/src/components/NotificationSetting/index.tsx +85 -0
  13. package/src/components/OrdersOption/index.tsx +54 -56
  14. package/src/components/PaymentOptions/index.tsx +298 -345
  15. package/src/components/PaymentOptionsWebView/index.tsx +120 -121
  16. package/src/components/SingleProductReview/index.tsx +7 -4
  17. package/src/components/StripeElementsForm/index.tsx +25 -16
  18. package/src/components/VerifyPhone/styles.tsx +1 -2
  19. package/src/components/shared/OBottomPopup.tsx +6 -2
  20. package/src/components/shared/OToast.tsx +4 -4
  21. package/src/index.tsx +2 -0
  22. package/src/types/@fatnlazycat/react-native-recaptcha-v3/index.d.ts +1 -0
  23. package/src/utils/index.tsx +2 -1
  24. package/themes/business/src/components/AcceptOrRejectOrder/index.tsx +260 -238
  25. package/themes/business/src/components/AcceptOrRejectOrder/styles.tsx +6 -4
  26. package/themes/business/src/components/BusinessController/index.tsx +2 -2
  27. package/themes/business/src/components/Chat/index.tsx +40 -32
  28. package/themes/business/src/components/DriverMap/index.tsx +7 -5
  29. package/themes/business/src/components/DriverSchedule/index.tsx +36 -19
  30. package/themes/business/src/components/LoginForm/index.tsx +111 -74
  31. package/themes/business/src/components/MapView/index.tsx +12 -1
  32. package/themes/business/src/components/MessagesOption/index.tsx +11 -1
  33. package/themes/business/src/components/NewOrderNotification/index.tsx +26 -41
  34. package/themes/business/src/components/OrderDetails/OrderContentComponent.tsx +40 -30
  35. package/themes/business/src/components/OrderDetails/OrderHeaderComponent.tsx +3 -3
  36. package/themes/business/src/components/OrdersListManager/index.tsx +10 -3
  37. package/themes/business/src/components/OrdersOption/index.tsx +76 -77
  38. package/themes/business/src/components/OrdersOption/styles.tsx +5 -1
  39. package/themes/business/src/components/OrdersOptionBusiness/index.tsx +15 -1
  40. package/themes/business/src/components/OrdersOptionCity/index.tsx +15 -1
  41. package/themes/business/src/components/OrdersOptionDate/index.tsx +19 -6
  42. package/themes/business/src/components/OrdersOptionDelivery/index.tsx +15 -1
  43. package/themes/business/src/components/OrdersOptionDriver/index.tsx +15 -1
  44. package/themes/business/src/components/OrdersOptionPaymethod/index.tsx +15 -1
  45. package/themes/business/src/components/OrdersOptionStatus/index.tsx +10 -1
  46. package/themes/business/src/components/PreviousMessages/index.tsx +17 -18
  47. package/themes/business/src/components/PreviousOrders/OrderItem.tsx +250 -0
  48. package/themes/business/src/components/PreviousOrders/OrdersGroupedItem.tsx +115 -0
  49. package/themes/business/src/components/PreviousOrders/index.tsx +440 -245
  50. package/themes/business/src/components/PreviousOrders/styles.tsx +31 -3
  51. package/themes/business/src/components/ProductItemAccordion/index.tsx +3 -2
  52. package/themes/business/src/components/ReviewCustomer/index.tsx +39 -15
  53. package/themes/business/src/components/ScheduleBlocked/index.tsx +2 -2
  54. package/themes/business/src/components/UserFormDetails/index.tsx +5 -2
  55. package/themes/business/src/components/UserProfileForm/index.tsx +2 -0
  56. package/themes/business/src/components/shared/ODropDown.tsx +42 -8
  57. package/themes/business/src/components/shared/ODropDownCalendar.tsx +36 -7
  58. package/themes/business/src/components/shared/OLink.tsx +24 -12
  59. package/themes/business/src/components/shared/OText.tsx +3 -2
  60. package/themes/business/src/types/index.tsx +25 -11
  61. package/themes/business/src/utils/index.tsx +10 -0
  62. package/themes/doordash/src/components/BusinessesListing/index.tsx +1 -1
  63. package/themes/doordash/src/components/LoginForm/index.tsx +1 -2
  64. package/themes/instacart/src/components/BusinessesListing/index.tsx +1 -1
  65. package/themes/kiosk/src/components/BusinessesListing/index.tsx +2 -1
  66. package/themes/kiosk/src/components/Checkout/index.tsx +6 -0
  67. package/themes/kiosk/src/components/LoginForm/index.tsx +121 -10
  68. package/themes/kiosk/src/components/LoginForm/styles.tsx +5 -0
  69. package/themes/kiosk/src/components/NavBar/index.tsx +14 -14
  70. package/themes/kiosk/src/components/OptionCard/index.tsx +1 -1
  71. package/themes/kiosk/src/components/OrderTypeCardSelector/index.tsx +8 -10
  72. package/themes/kiosk/src/components/ProductForm/index.tsx +1 -14
  73. package/themes/kiosk/src/components/shared/OButton.tsx +5 -18
  74. package/themes/kiosk/src/types/index.d.ts +2 -0
  75. package/themes/original/index.tsx +8 -0
  76. package/themes/original/src/components/AddressDetails/index.tsx +10 -8
  77. package/themes/original/src/components/AddressForm/index.tsx +157 -140
  78. package/themes/original/src/components/AddressList/index.tsx +1 -1
  79. package/themes/original/src/components/AppleLogin/index.tsx +4 -4
  80. package/themes/original/src/components/BusinessBasicInformation/index.tsx +53 -37
  81. package/themes/original/src/components/BusinessController/index.tsx +193 -91
  82. package/themes/original/src/components/BusinessController/styles.tsx +14 -9
  83. package/themes/original/src/components/BusinessInformation/index.tsx +10 -31
  84. package/themes/original/src/components/BusinessItemAccordion/index.tsx +12 -6
  85. package/themes/original/src/components/BusinessListingSearch/BusinessControllerSkeletons/index.tsx +57 -0
  86. package/themes/original/src/components/BusinessListingSearch/MaxSectionItem/index.tsx +59 -0
  87. package/themes/original/src/components/BusinessListingSearch/MaxSectionItem/styles.tsx +13 -0
  88. package/themes/original/src/components/BusinessListingSearch/index.tsx +85 -137
  89. package/themes/original/src/components/BusinessListingSearch/styles.tsx +10 -12
  90. package/themes/original/src/components/BusinessProductsList/SubcategoriesComponent/index.tsx +87 -0
  91. package/themes/original/src/components/BusinessProductsList/SubcategoriesComponent/styles.tsx +12 -0
  92. package/themes/original/src/components/BusinessProductsList/index.tsx +59 -61
  93. package/themes/original/src/components/BusinessProductsList/styles.tsx +0 -3
  94. package/themes/original/src/components/BusinessProductsListing/index.tsx +184 -86
  95. package/themes/original/src/components/BusinessProductsListing/styles.tsx +14 -12
  96. package/themes/original/src/components/BusinessTypeFilter/index.tsx +3 -2
  97. package/themes/original/src/components/BusinessesListing/Layout/Appointment/index.tsx +28 -29
  98. package/themes/original/src/components/BusinessesListing/Layout/Original/index.tsx +137 -135
  99. package/themes/original/src/components/BusinessesListing/Layout/Original/styles.tsx +1 -9
  100. package/themes/original/src/components/BusinessesListing/index.tsx +17 -10
  101. package/themes/original/src/components/Cart/index.tsx +82 -15
  102. package/themes/original/src/components/Cart/styles.tsx +4 -0
  103. package/themes/original/src/components/CartContent/index.tsx +27 -17
  104. package/themes/original/src/components/CartContent/styles.tsx +1 -1
  105. package/themes/original/src/components/Checkout/index.tsx +115 -118
  106. package/themes/original/src/components/Checkout/styles.tsx +4 -3
  107. package/themes/original/src/components/CitiesControl/index.tsx +89 -0
  108. package/themes/original/src/components/CitiesControl/styles.tsx +17 -0
  109. package/themes/original/src/components/DriverTips/index.tsx +4 -4
  110. package/themes/original/src/components/DriverTips/styles.tsx +2 -1
  111. package/themes/original/src/components/FavoriteList/index.tsx +69 -45
  112. package/themes/original/src/components/FloatingButton/index.tsx +0 -1
  113. package/themes/original/src/components/FloatingButton/styles.tsx +1 -1
  114. package/themes/original/src/components/GPSButton/index.tsx +20 -19
  115. package/themes/original/src/components/GPSButton/styles.ts +3 -3
  116. package/themes/original/src/components/GoogleMap/index.tsx +10 -1
  117. package/themes/original/src/components/HelpAccountAndPayment/index.tsx +25 -10
  118. package/themes/original/src/components/HelpAccountAndPayment/styles.tsx +4 -0
  119. package/themes/original/src/components/HelpGuide/index.tsx +9 -8
  120. package/themes/original/src/components/HelpOrder/index.tsx +9 -8
  121. package/themes/original/src/components/LanguageSelector/index.tsx +19 -14
  122. package/themes/original/src/components/LoginForm/Otp/index.tsx +89 -73
  123. package/themes/original/src/components/LoginForm/Otp/styles.tsx +0 -1
  124. package/themes/original/src/components/LoginForm/index.tsx +98 -41
  125. package/themes/original/src/components/LottieAnimation/index.tsx +69 -0
  126. package/themes/original/src/components/Messages/index.tsx +35 -20
  127. package/themes/original/src/components/MomentOption/index.tsx +8 -6
  128. package/themes/original/src/components/MultiCart/index.tsx +63 -0
  129. package/themes/original/src/components/MultiCartsPaymethodsAndWallets/index.tsx +92 -93
  130. package/themes/original/src/components/MultiCheckout/index.tsx +10 -2
  131. package/themes/original/src/components/MultiOrdersDetails/index.tsx +34 -16
  132. package/themes/original/src/components/MyOrders/index.tsx +89 -25
  133. package/themes/original/src/components/NavBar/index.tsx +11 -5
  134. package/themes/original/src/components/NetworkError/index.tsx +5 -3
  135. package/themes/original/src/components/NotFoundSource/index.tsx +2 -1
  136. package/themes/original/src/components/Notifications/index.tsx +148 -0
  137. package/themes/original/src/components/Notifications/styles.tsx +20 -0
  138. package/themes/original/src/components/OrderDetails/index.tsx +132 -18
  139. package/themes/original/src/components/OrderDetails/styles.tsx +15 -2
  140. package/themes/original/src/components/OrderItAgain/index.tsx +75 -0
  141. package/themes/original/src/components/OrderItAgain/styles.tsx +10 -0
  142. package/themes/original/src/components/OrderProgress/index.tsx +77 -66
  143. package/themes/original/src/components/OrderProgress/styles.tsx +5 -0
  144. package/themes/original/src/components/OrderSummary/index.tsx +2 -35
  145. package/themes/original/src/components/OrderTypeSelector/index.tsx +85 -36
  146. package/themes/original/src/components/OrderTypeSelector/styles.tsx +19 -1
  147. package/themes/original/src/components/OrdersOption/PreviousBusinessOrdered/index.tsx +94 -98
  148. package/themes/original/src/components/OrdersOption/PreviousProductsOrdered/index.tsx +3 -0
  149. package/themes/original/src/components/OrdersOption/index.tsx +95 -55
  150. package/themes/original/src/components/PaymentOptionWallet/index.tsx +56 -56
  151. package/themes/original/src/components/PaymentOptions/index.tsx +1 -2
  152. package/themes/original/src/components/PhoneInputNumber/index.tsx +1 -1
  153. package/themes/original/src/components/PlaceSpot/index.tsx +249 -47
  154. package/themes/original/src/components/PlaceSpot/styles.tsx +0 -2
  155. package/themes/original/src/components/PreviousOrders/index.tsx +3 -2
  156. package/themes/original/src/components/ProductForm/index.tsx +367 -384
  157. package/themes/original/src/components/ProductForm/styles.tsx +7 -12
  158. package/themes/original/src/components/ProductItemAccordion/index.tsx +199 -128
  159. package/themes/original/src/components/ProductOption/index.tsx +1 -1
  160. package/themes/original/src/components/ProductOptionSubOption/index.tsx +16 -8
  161. package/themes/original/src/components/ProductOptionSubOption/styles.tsx +0 -1
  162. package/themes/original/src/components/ProfessionalFilter/index.tsx +2 -1
  163. package/themes/original/src/components/ProfessionalProfile/index.tsx +19 -8
  164. package/themes/original/src/components/Promotions/index.tsx +232 -219
  165. package/themes/original/src/components/Promotions/styles.tsx +7 -2
  166. package/themes/original/src/components/ReviewDriver/index.tsx +3 -3
  167. package/themes/original/src/components/ReviewOrder/index.tsx +43 -11
  168. package/themes/original/src/components/ReviewOrder/styles.tsx +7 -0
  169. package/themes/original/src/components/ReviewProducts/index.tsx +8 -5
  170. package/themes/original/src/components/ReviewTrigger/index.tsx +28 -10
  171. package/themes/original/src/components/ReviewTrigger/styles.tsx +10 -3
  172. package/themes/original/src/components/ScheduleAccordion/index.tsx +68 -0
  173. package/themes/original/src/components/ScheduleAccordion/styles.tsx +14 -0
  174. package/themes/original/src/components/ServiceForm/index.tsx +330 -266
  175. package/themes/original/src/components/SignupForm/index.tsx +134 -89
  176. package/themes/original/src/components/SingleOrderCard/index.tsx +219 -129
  177. package/themes/original/src/components/SingleOrderCard/styles.tsx +10 -8
  178. package/themes/original/src/components/SingleProductCard/index.tsx +120 -62
  179. package/themes/original/src/components/SingleProductCard/styles.tsx +2 -9
  180. package/themes/original/src/components/SingleProductReview/index.tsx +38 -5
  181. package/themes/original/src/components/SingleProductReview/styles.tsx +12 -0
  182. package/themes/original/src/components/StripeElementsForm/index.tsx +13 -2
  183. package/themes/original/src/components/UpsellingProducts/index.tsx +15 -5
  184. package/themes/original/src/components/UserDetails/index.tsx +5 -3
  185. package/themes/original/src/components/UserFormDetails/index.tsx +6 -48
  186. package/themes/original/src/components/UserProfile/index.tsx +58 -35
  187. package/themes/original/src/components/UserProfile/styles.ts +17 -0
  188. package/themes/original/src/components/WalletTransactions/index.tsx +76 -0
  189. package/themes/original/src/components/WalletTransactions/styles.tsx +13 -0
  190. package/themes/original/src/components/Wallets/index.tsx +176 -164
  191. package/themes/original/src/components/Wallets/styles.tsx +12 -8
  192. package/themes/original/src/components/shared/CardAnimation.tsx +47 -0
  193. package/themes/original/src/components/shared/HeaderTitle.tsx +8 -3
  194. package/themes/original/src/components/shared/OBottomPopup.tsx +32 -21
  195. package/themes/original/src/components/shared/OButton.tsx +8 -3
  196. package/themes/original/src/components/shared/OIcon.tsx +8 -1
  197. package/themes/original/src/components/shared/OInput.tsx +10 -1
  198. package/themes/original/src/layouts/Container.tsx +13 -9
  199. package/themes/original/src/layouts/FloatingBottomContainer.tsx +5 -1
  200. package/themes/original/src/types/index.tsx +63 -8
  201. package/themes/original/src/utils/index.tsx +103 -58
  202. package/themes/uber-eats/src/components/BusinessesListing/index.tsx +1 -1
@@ -1,5 +1,5 @@
1
- import React, { useState, useEffect } from 'react';
2
- import { View, StyleSheet, BackHandler, Platform, Linking } from 'react-native';
1
+ import React, { useState, useEffect, useMemo } from 'react';
2
+ import { View, StyleSheet, BackHandler, Platform, Linking, RefreshControl } from 'react-native';
3
3
  import LinearGradient from 'react-native-linear-gradient';
4
4
  import { _setStoreData } from '../../providers/StoreUtil';
5
5
  import {
@@ -10,6 +10,7 @@ import {
10
10
  useConfig
11
11
  } from 'ordering-components/native';
12
12
  import { useTheme } from 'styled-components/native';
13
+ import { showLocation } from 'react-native-map-link';
13
14
  import {
14
15
  OrderDetailsContainer,
15
16
  Header,
@@ -30,7 +31,9 @@ import {
30
31
  OrderDriver,
31
32
  Map,
32
33
  Divider,
33
- OrderAction
34
+ OrderAction,
35
+ PlaceSpotWrapper,
36
+ ProfessionalPhoto
34
37
  } from './styles';
35
38
  import { OButton, OIcon, OModal, OText } from '../shared';
36
39
  import { ProductItemAccordion } from '../ProductItemAccordion';
@@ -44,6 +47,7 @@ import { TaxInformation } from '../TaxInformation';
44
47
  import { Placeholder, PlaceholderLine } from 'rn-placeholder';
45
48
  import NavBar from '../NavBar'
46
49
  import { OrderHistory } from './OrderHistory';
50
+ import { PlaceSpot } from '../PlaceSpot'
47
51
  export const OrderDetailsUI = (props: OrderDetailsParams) => {
48
52
  const {
49
53
  navigation,
@@ -54,7 +58,8 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
54
58
  driverLocation,
55
59
  onNavigationRedirect,
56
60
  reorderState,
57
- handleReorder
61
+ handleReorder,
62
+ getOrder
58
63
  } = props;
59
64
 
60
65
  const theme = useTheme();
@@ -65,6 +70,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
65
70
  },
66
71
  statusBar: {
67
72
  height: 12,
73
+ borderRadius: 8
68
74
  },
69
75
  logo: {
70
76
  width: 75,
@@ -90,6 +96,12 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
90
96
  display: 'flex',
91
97
  alignItems: 'center',
92
98
  flexDirection: 'row'
99
+ },
100
+ professionalBlock: {
101
+ borderBottomColor: theme.colors.border,
102
+ borderBottomWidth: 1,
103
+ marginVertical: 10,
104
+ paddingVertical: 5
93
105
  }
94
106
  });
95
107
 
@@ -101,8 +113,12 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
101
113
  const [isReviewed, setIsReviewed] = useState(false)
102
114
  const [isOrderHistory, setIsOrderHistory] = useState(false)
103
115
  const [openTaxModal, setOpenTaxModal] = useState<any>({ open: false, tax: null, type: '' })
116
+ const [refreshing] = useState(false);
104
117
  const { order, businessData } = props.order;
105
118
  const mapValidStatuses = [9, 19, 23]
119
+ const placeSpotTypes = [3, 4, 5]
120
+ const directionTypes = [2, 3, 4, 5]
121
+ const enabledPoweredByOrdering = configs?.powered_by_ordering_module?.value
106
122
 
107
123
  const walletName: any = {
108
124
  cash: {
@@ -380,6 +396,11 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
380
396
  ) && !order.review && !isReviewed && handleClickOrderReview(order)
381
397
  }
382
398
 
399
+
400
+ const resfreshOrder = () => {
401
+ getOrder()
402
+ }
403
+
383
404
  useEffect(() => {
384
405
  const _businessId = 'businessId:' + businessData?.id
385
406
  if (reorderState?.error) {
@@ -437,6 +458,59 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
437
458
  lng: parseFloat(location?.location?.split(',')[1].replace(/[^-.0-9]/g, ''))
438
459
  } : location)
439
460
 
461
+ const getProductList = () => {
462
+ const professionalList = order?.products.reduce((prev: any, current: any) => {
463
+ const found = prev.find((item: any) => item.id === current?.calendar_event?.professional?.id)
464
+ if (found || !current?.calendar_event) {
465
+ return prev
466
+ }
467
+ return [...prev, current?.calendar_event?.professional]
468
+ }, [])
469
+
470
+ return (
471
+ <>
472
+ {professionalList?.length > 0 && professionalList.map((professional: any, i: number) => (
473
+ <View key={i} style={styles.professionalBlock}>
474
+ <View style={{ flexDirection: 'row', alignItems: 'center', width: '100%' }}>
475
+ {professional?.photo ? (
476
+ <ProfessionalPhoto
477
+ source={{
478
+ uri: professional?.photo
479
+ }}
480
+ imageStyle={{ borderRadius: 8 }}
481
+ />
482
+ ) : (
483
+ <OIcon
484
+ src={theme.images.general.user}
485
+ cover={false}
486
+ width={80}
487
+ height={80}
488
+ />
489
+ )}
490
+ <OText size={12} lineHeight={18} weight={'500'} numberOfLines={1}>{professional?.name} {professional?.lastname}</OText>
491
+ </View>
492
+ {order?.products.filter((product: any) => product?.calendar_event?.professional?.id === professional?.id).map((product: any, i: number) => (
493
+ <ProductItemAccordion
494
+ key={product?.id || i}
495
+ product={product}
496
+ isFromCheckout
497
+ />
498
+ ))}
499
+ </View>
500
+ ))}
501
+ {order?.products.filter((product: any) => !product?.calendar_event).map((product: any, i: number) => (
502
+ <ProductItemAccordion
503
+ key={product?.id || i}
504
+ product={product}
505
+ isFromCheckout
506
+ />
507
+ ))}
508
+ </>
509
+ )
510
+ }
511
+
512
+ const sortedProductList = useMemo(() => getProductList(), [order?.products])
513
+
440
514
  useEffect(() => {
441
515
  if (driverLocation) {
442
516
  parsedLocations[0] = {
@@ -447,7 +521,15 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
447
521
  }, [driverLocation]);
448
522
 
449
523
  return (
450
- <OrderDetailsContainer keyboardShouldPersistTaps="handled">
524
+ <OrderDetailsContainer
525
+ keyboardShouldPersistTaps="handled"
526
+ refreshControl={
527
+ <RefreshControl
528
+ refreshing={refreshing}
529
+ onRefresh={() => resfreshOrder()}
530
+ />
531
+ }
532
+ >
451
533
  {(!order || Object.keys(order).length === 0) && (
452
534
  <Placeholder style={{ marginTop: 30 }}>
453
535
  <Header>
@@ -518,6 +600,13 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
518
600
  : parseDate(order?.delivery_datetime, { utc: false })}
519
601
  </OText>}
520
602
  />
603
+ {enabledPoweredByOrdering && (
604
+ <View style={{ display: 'flex', justifyContent: 'center', alignItems: 'center' }}>
605
+ <OText>
606
+ Powered By Ordering.co
607
+ </OText>
608
+ </View>
609
+ )}
521
610
  <OrderInfo>
522
611
  <OrderData>
523
612
  <View style={styles.linkWrapper}>
@@ -533,7 +622,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
533
622
  onPress={() => handleClickOrderReview(order)}
534
623
  >
535
624
  <OText
536
- size={10}
625
+ size={12}
537
626
  lineHeight={15}
538
627
  color={theme.colors.primary}
539
628
  style={{ textDecorationLine: 'underline' }}
@@ -549,7 +638,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
549
638
 
550
639
  >
551
640
  <OText
552
- size={10}
641
+ size={12}
553
642
  lineHeight={15}
554
643
  color={theme.colors.primary}
555
644
  style={{ textDecorationLine: 'underline', textTransform: 'capitalize' }}
@@ -664,7 +753,39 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
664
753
  {order?.business?.address}
665
754
  </OText>
666
755
  </View>
756
+ {directionTypes.includes(order?.delivery_type) && (
757
+ <OButton
758
+ text={t('GET_DIRECTIONS', 'Get Directions')}
759
+ imgRightSrc=''
760
+ textStyle={{ color: theme.colors.white }}
761
+ style={{
762
+ alignSelf: 'center',
763
+ borderRadius: 10,
764
+ marginTop: 30
765
+ }}
766
+ onClick={() => showLocation({
767
+ latitude: order?.business?.location?.lat,
768
+ longitude: order?.business?.location?.lng,
769
+ naverCallerName: 'com.reactnativeappstemplate5',
770
+ dialogTitle: t('GET_DIRECTIONS', 'Get Directions'),
771
+ dialogMessage: t('WHAT_APP_WOULD_YOU_USE', 'What app would you like to use?'),
772
+ cancelText: t('CANCEL', 'Cancel'),
773
+ })}
774
+ />
775
+ )}
667
776
  </OrderBusiness>
777
+
778
+ {placeSpotTypes.includes(order?.delivery_type) && (
779
+ <PlaceSpotWrapper>
780
+ <PlaceSpot
781
+ isInputMode
782
+ cart={order}
783
+ spotNumberDefault={order?.spot_number}
784
+ vehicleDefault={order?.vehicle}
785
+ />
786
+ </PlaceSpotWrapper>
787
+ )}
788
+
668
789
  <View
669
790
  style={{
670
791
  height: 8,
@@ -731,7 +852,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
731
852
  <>
732
853
  {order?.driver?.location && mapValidStatuses.includes(parseInt(order?.status)) && (
733
854
  <Map>
734
- <GoogleMap
855
+ <GoogleMap
735
856
  location={typeof order?.driver?.location?.location === 'string'
736
857
  ? {
737
858
  lat: parseFloat(driverLocationString[0]),
@@ -845,14 +966,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
845
966
  </OrderAction>
846
967
  </HeaderInfo>
847
968
  <OrderProducts>
848
- {order?.products?.length &&
849
- order?.products.map((product: any, i: number) => (
850
- <ProductItemAccordion
851
- key={product?.id || i}
852
- product={product}
853
- isFromCheckout
854
- />
855
- ))}
969
+ {sortedProductList}
856
970
  </OrderProducts>
857
971
  <OrderBill>
858
972
  <View style={{ height: 1, backgroundColor: theme.colors.border, marginBottom: 17 }} />
@@ -1020,8 +1134,8 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
1020
1134
  )}
1021
1135
  <Total>
1022
1136
  <Table>
1023
- <OText size={20} lineHeight={30} weight={'600'} color={theme.colors.textNormal}>{t('TOTAL', 'Total')}</OText>
1024
- <OText size={20} lineHeight={30} weight={'600'} color={theme.colors.textNormal}>
1137
+ <OText size={14} style={{ fontWeight: 'bold' }} color={theme.colors.textNormal}>{t('TOTAL', 'Total')}</OText>
1138
+ <OText size={14} style={{ fontWeight: 'bold' }} color={theme.colors.textNormal}>
1025
1139
  {parsePrice(order?.summary?.total ?? order?.total)}
1026
1140
  </OText>
1027
1141
  </Table>
@@ -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
 
@@ -127,4 +126,18 @@ export const Divider = styled.View`
127
126
  `
128
127
  export const OrderAction = styled.View`
129
128
  flex-direction: row;
130
- `
129
+ `
130
+
131
+ export const PlaceSpotWrapper = styled.View`
132
+ padding-horizontal: 40px;
133
+ `
134
+
135
+ export const ProfessionalPhoto = styled.ImageBackground`
136
+ width: 100%;
137
+ position: relative;
138
+ max-height: 80px;
139
+ height: 80px;
140
+ width: 80px;
141
+ resize-mode: cover;
142
+ margin-right: 10px;
143
+ `;
@@ -0,0 +1,75 @@
1
+ import React from 'react'
2
+ import { OText } from '../shared'
3
+ import { useLanguage } from 'ordering-components/native'
4
+ import { useTheme } from 'styled-components/native'
5
+ import { SingleProductCard } from '../SingleProductCard'
6
+ import { OrderItAgainParams } from '../../types'
7
+ import { ScrollView, Dimensions } from 'react-native'
8
+ import moment from 'moment';
9
+ import {
10
+ Container,
11
+ ProductWrapper
12
+ } from './styles'
13
+
14
+ export const OrderItAgain = (props: OrderItAgainParams) => {
15
+ const {
16
+ onProductClick,
17
+ productList,
18
+ businessId,
19
+ categoryState,
20
+ currentCart,
21
+ handleUpdateProducts,
22
+ navigation,
23
+ searchValue
24
+ } = props
25
+
26
+ const [, t] = useLanguage()
27
+ const theme = useTheme()
28
+ const { width } = Dimensions.get('window');
29
+ const productsFilterd = productList?.length > 0 && productList.filter((product : any) => !searchValue || product?.name?.toLowerCase()?.includes(searchValue?.toLowerCase()))?.sort((a: any, b:any) => moment(b?.last_ordered_date).valueOf() - moment(a?.last_ordered_date).valueOf())
30
+ return (
31
+ productsFilterd?.length > 0 ? (
32
+ <Container>
33
+ <OText
34
+ size={16}
35
+ lineHeight={24}
36
+ color={theme.colors.textNormal}
37
+ style={{
38
+ fontWeight: '600',
39
+ marginBottom: 6
40
+ }}
41
+ >
42
+ {t('ORDER_IT_AGAIN', 'Order it again')}
43
+ </OText>
44
+ <OText
45
+ size={12}
46
+ lineHeight={18}
47
+ color={theme.colors.disabled}
48
+ >
49
+ {t('ORDER_IT_AGAIN_DESC', 'Quickly add items from your past orders.')}
50
+ </OText>
51
+ <ScrollView
52
+ horizontal
53
+ showsVerticalScrollIndicator={false}
54
+ showsHorizontalScrollIndicator={false}
55
+ >
56
+ {productsFilterd.map((product: any, i: number) => (
57
+ <ProductWrapper key={'prod_' + product.id + `_${i}`} style={{ width: width - 120, }}>
58
+ <SingleProductCard
59
+ isSoldOut={product.inventoried && !product.quantity}
60
+ product={product}
61
+ businessId={businessId}
62
+ categoryState={categoryState}
63
+ onProductClick={() => onProductClick(product)}
64
+ productAddedToCartLength={currentCart?.products?.reduce((productsLength: number, Cproduct: any) => { return productsLength + (Cproduct?.id === product?.id ? Cproduct?.quantity : 0) }, 0)}
65
+ handleUpdateProducts={handleUpdateProducts}
66
+ navigation={navigation}
67
+ isPreviously
68
+ />
69
+ </ProductWrapper>
70
+ ))}
71
+ </ScrollView>
72
+ </Container>
73
+ ) : null
74
+ )
75
+ }
@@ -0,0 +1,10 @@
1
+ import styled from 'styled-components/native'
2
+
3
+ export const Container = styled.View`
4
+ margin-top: 20px;
5
+ `
6
+
7
+ export const ProductWrapper = styled.View`
8
+ margin-right: 20px;
9
+ padding-top: 30px;
10
+ `
@@ -17,7 +17,8 @@ import {
17
17
  ProgressBar,
18
18
  TimeWrapper,
19
19
  ProgressTextWrapper,
20
- OrderInfoWrapper
20
+ OrderInfoWrapper,
21
+ OrderProgressWrapper
21
22
  } from './styles'
22
23
  const OrderProgressUI = (props: any) => {
23
24
  const {
@@ -33,6 +34,7 @@ const OrderProgressUI = (props: any) => {
33
34
  const [{ optimizeImage, parseDate, parseTime }] = useUtils()
34
35
  const [lastOrder, setLastOrder] = useState<any>(null)
35
36
  const imageFails = theme.images.general.emptyActiveOrders
37
+ const [initialLoaded, setInitialLoaded] = useState(false)
36
38
 
37
39
  const styles = StyleSheet.create({
38
40
  main: {
@@ -46,9 +48,9 @@ const OrderProgressUI = (props: any) => {
46
48
  height: 1
47
49
  },
48
50
  shadowColor: '#000',
49
- shadowOpacity: 0.1,
50
- shadowRadius: 1,
51
- elevation: 2
51
+ shadowOpacity: 0.2,
52
+ shadowRadius: 2,
53
+ elevation: 3
52
54
  },
53
55
  logoWrapper: {
54
56
  overflow: 'hidden',
@@ -135,73 +137,82 @@ const OrderProgressUI = (props: any) => {
135
137
  }
136
138
  }, [isFocused])
137
139
 
140
+ useEffect(() => {
141
+ if (orderList.loading || initialLoaded) return
142
+ setInitialLoaded(true)
143
+ }, [orderList.loading, initialLoaded])
144
+
138
145
  return (
139
146
  <>
140
- {orderList?.loading && (
141
- <Placeholder Animation={Fade} height={Platform.OS === 'ios' ? 147.5 : 158}>
142
- <PlaceholderLine height={60} style={{ borderRadius: 8, marginBottom: 10 }} />
143
- <PlaceholderLine height={20} style={{ marginBottom: 10 }} />
144
- <PlaceholderLine height={40} style={{ borderRadius: 8, marginBottom: 10 }} />
145
- </Placeholder>
147
+ {(orderList?.loading && !initialLoaded) && (
148
+ <OrderProgressWrapper>
149
+ <Placeholder Animation={Fade} height={Platform.OS === 'ios' ? 147.5 : 158}>
150
+ <PlaceholderLine height={60} style={{ borderRadius: 8, marginBottom: 10 }} />
151
+ <PlaceholderLine height={20} style={{ marginBottom: 10 }} />
152
+ <PlaceholderLine height={40} style={{ borderRadius: 8, marginBottom: 10 }} />
153
+ </Placeholder>
154
+ </OrderProgressWrapper>
146
155
  )}
147
- {!orderList?.loading && orderList?.orders?.length > 0 && lastOrder && (
148
- <View style={styles.main}>
149
- <OrderInfoWrapper style={{ flex: 1 }}>
150
- <View style={styles.logoWrapper}>
151
- <FastImage
152
- style={{ width: 50, height: 50 }}
153
- source={{
154
- uri: optimizeImage(lastOrder?.business?.logo, 'h_50,c_limit'),
155
- priority: FastImage.priority.normal,
156
- }}
157
- resizeMode={FastImage.resizeMode.cover}
158
- />
159
- </View>
160
- <View style={{
161
- paddingHorizontal: 10,
162
- flex: 1
163
- }}
164
- >
165
- <OText
166
- size={13}
167
- style={{
168
- fontWeight: 'bold',
169
- marginBottom: 3
170
- }}
171
- >{t('ORDER_IN_PROGRESS', 'Order in progress')}</OText>
172
- <OText size={11} numberOfLines={1} ellipsizeMode='tail'>{t('RESTAURANT_PREPARING_YOUR_ORDER', 'The restaurant is preparing your order')}</OText>
173
- <TouchableOpacity onPress={() => handleGoToOrder('MyOrders')}>
174
- <View style={styles.navigationButton}>
175
- <OText size={11} color={theme.colors.primary}>{t('GO_TO_MY_ORDERS', 'Go to my orders')}</OText>
176
- <IconAntDesign
177
- name='arrowright'
178
- color={theme.colors.primary}
179
- size={13}
180
- style={{ marginHorizontal: 5 }}
181
- />
182
- </View>
183
- </TouchableOpacity>
156
+ {(!orderList?.loading || initialLoaded) && orderList?.orders?.length > 0 && lastOrder && (
157
+ <OrderProgressWrapper>
158
+ <View style={styles.main}>
159
+ <OrderInfoWrapper style={{ flex: 1 }}>
160
+ <View style={styles.logoWrapper}>
161
+ <FastImage
162
+ style={{ width: 50, height: 50 }}
163
+ source={{
164
+ uri: optimizeImage(lastOrder?.business?.logo, 'h_50,c_limit'),
165
+ priority: FastImage.priority.normal,
166
+ }}
167
+ resizeMode={FastImage.resizeMode.cover}
168
+ />
169
+ </View>
170
+ <View style={{
171
+ paddingHorizontal: 10,
172
+ flex: 1
173
+ }}
174
+ >
175
+ <OText
176
+ size={13}
177
+ style={{
178
+ fontWeight: 'bold',
179
+ marginBottom: 3
180
+ }}
181
+ >{t('ORDER_IN_PROGRESS', 'Order in progress')}</OText>
182
+ <OText size={11} numberOfLines={1} ellipsizeMode='tail'>{t('RESTAURANT_PREPARING_YOUR_ORDER', 'The restaurant is preparing your order')}</OText>
183
+ <TouchableOpacity onPress={() => handleGoToOrder('MyOrders')}>
184
+ <View style={styles.navigationButton}>
185
+ <OText size={11} color={theme.colors.primary}>{t('GO_TO_MY_ORDERS', 'Go to my orders')}</OText>
186
+ <IconAntDesign
187
+ name='arrowright'
188
+ color={theme.colors.primary}
189
+ size={13}
190
+ style={{ marginHorizontal: 5 }}
191
+ />
192
+ </View>
193
+ </TouchableOpacity>
194
+ </View>
195
+ </OrderInfoWrapper>
196
+ <View style={{ flex: 1 }}>
197
+ <ProgressContentWrapper>
198
+ <ProgressBar style={{ width: getOrderStatus(lastOrder.status)?.percentage ? `${getOrderStatus(lastOrder.status)?.percentage}%` : '0%' }} />
199
+ </ProgressContentWrapper>
200
+ <ProgressTextWrapper>
201
+ <OText size={12} style={{ width: '50%' }}>{getOrderStatus(lastOrder.status)?.value}</OText>
202
+ <TimeWrapper>
203
+ <OText size={11}>{t('ESTIMATED_DELIVERY', 'Estimated delivery')}</OText>
204
+ <OText size={11}>
205
+ {lastOrder?.delivery_datetime_utc
206
+ ? parseTime(lastOrder?.delivery_datetime_utc, { outputFormat: 'hh:mm A' })
207
+ : parseTime(lastOrder?.delivery_datetime, { utc: false })}
208
+ &nbsp;-&nbsp;
209
+ {convertDiffToHours(lastOrder)}
210
+ </OText>
211
+ </TimeWrapper>
212
+ </ProgressTextWrapper>
184
213
  </View>
185
- </OrderInfoWrapper>
186
- <View style={{ flex: 1 }}>
187
- <ProgressContentWrapper>
188
- <ProgressBar style={{ width: getOrderStatus(lastOrder.status)?.percentage ? `${getOrderStatus(lastOrder.status)?.percentage}%` : '0%' }} />
189
- </ProgressContentWrapper>
190
- <ProgressTextWrapper>
191
- <OText size={12} style={{ width: '50%' }}>{getOrderStatus(lastOrder.status)?.value}</OText>
192
- <TimeWrapper>
193
- <OText size={11}>{t('ESTIMATED_DELIVERY', 'Estimated delivery')}</OText>
194
- <OText size={11}>
195
- {lastOrder?.delivery_datetime_utc
196
- ? parseTime(lastOrder?.delivery_datetime_utc, { outputFormat: 'hh:mm A' })
197
- : parseTime(lastOrder?.delivery_datetime, { utc: false })}
198
- &nbsp;-&nbsp;
199
- {convertDiffToHours(lastOrder)}
200
- </OText>
201
- </TimeWrapper>
202
- </ProgressTextWrapper>
203
214
  </View>
204
- </View>
215
+ </OrderProgressWrapper>
205
216
  )}
206
217
  {/* {!orderList?.loading && orderList?.orders?.length === 0 && (
207
218
  <NotFoundSource
@@ -29,3 +29,8 @@ export const OrderInfoWrapper = styled.View`
29
29
  align-items: center;
30
30
  margin-bottom: 15px;
31
31
  `
32
+ export const OrderProgressWrapper = styled.View`
33
+ margin-top: 37px;
34
+ margin-bottom: 20px;
35
+ padding-horizontal: 40px;
36
+ `
@@ -26,7 +26,6 @@ import AntIcon from 'react-native-vector-icons/AntDesign'
26
26
  import { TaxInformation } from '../TaxInformation';
27
27
  import { TouchableOpacity } from 'react-native';
28
28
  import { OAlert } from '../../../../../src/components/shared'
29
- import { PlaceSpot } from '../PlaceSpot'
30
29
 
31
30
  const OrderSummaryUI = (props: any) => {
32
31
  const {
@@ -50,9 +49,7 @@ const OrderSummaryUI = (props: any) => {
50
49
  const [validationFields] = useValidationFields();
51
50
  const [openTaxModal, setOpenTaxModal] = useState<any>({ open: false, data: null, type: '' })
52
51
  const [confirm, setConfirm] = useState<any>({ open: false, content: null, handleOnAccept: null, id: null, title: null })
53
- const [openPlaceModal, setOpenPlaceModal] = useState(false)
54
52
  const isCouponEnabled = validationFields?.fields?.checkout?.coupon?.enabled;
55
- const placeSpotTypes = [3, 4]
56
53
 
57
54
  const handleDeleteClick = (product: any) => {
58
55
  removeProduct(product, cart)
@@ -295,33 +292,15 @@ const OrderSummaryUI = (props: any) => {
295
292
  {cart?.total >= 1 && (
296
293
  <View style={{ marginTop: 15, borderTopWidth: 1, borderTopColor: '#d9d9d9' }}>
297
294
  <OSTable style={{ marginTop: 15 }}>
298
- <OText size={14} style={{ fontWeight: 'bold' }}>
295
+ <OText size={14} style={{ fontWeight: 'bold' }} color={theme.colors.textNormal}>
299
296
  {t('TOTAL', 'Total')}
300
297
  </OText>
301
- <OText size={14} style={{ fontWeight: 'bold' }} >
298
+ <OText size={14} style={{ fontWeight: 'bold' }} color={theme.colors.textNormal}>
302
299
  {parsePrice(cart?.balance >= 0 ? cart?.balance : 0)}
303
300
  </OText>
304
301
  </OSTable>
305
302
  </View>
306
303
  )}
307
- {placeSpotTypes.includes(orderState?.options?.type) && (
308
- <OSTable style={{ marginTop: 15 }}>
309
- <OText size={14} lineHeight={21} weight={'600'}>
310
- {t('SPOT', 'Spot')}: {cart?.place?.name || t('NO_SELECTED', 'No selected')}
311
- </OText>
312
- <TouchableOpacity onPress={() => setOpenPlaceModal(true)}>
313
- <OText
314
- size={14}
315
- lineHeight={21}
316
- weight={'600'}
317
- color={theme.colors.primary}
318
- style={{ textDecorationLine: 'underline' }}
319
- >
320
- {t('EDIT', 'Edit')}
321
- </OText>
322
- </TouchableOpacity>
323
- </OSTable>
324
- )}
325
304
  {cart?.status !== 2 && (
326
305
  <OSTable>
327
306
  <View style={{ width: '100%', marginTop: 20 }}>
@@ -370,18 +349,6 @@ const OrderSummaryUI = (props: any) => {
370
349
  products={cart?.products}
371
350
  />
372
351
  </OModal>
373
- <OModal
374
- open={openPlaceModal}
375
- title={t('CHOOSE_YOUR_SPOT', 'Choose your spot')}
376
- onClose={() => setOpenPlaceModal(false)}
377
- entireModal
378
- >
379
- <PlaceSpot
380
- cart={cart}
381
- isOpenPlaceSpot={openPlaceModal}
382
- setOpenPlaceModal={setOpenPlaceModal}
383
- />
384
- </OModal>
385
352
  <OAlert
386
353
  open={confirm.open}
387
354
  title={confirm.title}