ordering-ui-react-native 0.14.85 → 0.14.87-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 (142) hide show
  1. package/package.json +6 -3
  2. package/src/DeliveryApp.tsx +34 -2
  3. package/src/assets/images/no-network.png +0 -0
  4. package/src/components/BusinessTypeFilter/index.tsx +9 -2
  5. package/src/components/BusinessTypeFilter/styles.tsx +1 -1
  6. package/src/components/BusinessesListing/index.tsx +1 -1
  7. package/src/components/Cart/index.tsx +1 -1
  8. package/src/components/Checkout/index.tsx +0 -1
  9. package/src/components/Home/index.tsx +3 -5
  10. package/src/components/LanguageSelector/index.tsx +65 -97
  11. package/src/components/LanguageSelector/styles.tsx +4 -17
  12. package/src/components/Messages/index.tsx +38 -30
  13. package/src/components/MomentOption/index.tsx +3 -1
  14. package/src/components/OrderDetails/index.tsx +26 -5
  15. package/src/components/PaymentOptions/index.tsx +7 -16
  16. package/src/components/PaymentOptionsWebView/index.tsx +123 -124
  17. package/src/components/ProductForm/index.tsx +1 -1
  18. package/src/components/ProductForm/styles.tsx +1 -0
  19. package/src/components/StripeElementsForm/index.tsx +27 -48
  20. package/src/components/UserProfileForm/index.tsx +35 -1
  21. package/src/components/VerifyPhone/styles.tsx +1 -2
  22. package/src/config.json +0 -2
  23. package/src/pages/Checkout.tsx +1 -1
  24. package/src/providers/AlertProvider.tsx +4 -1
  25. package/src/theme.json +2 -1
  26. package/src/types/index.tsx +2 -9
  27. package/src/utils/index.tsx +196 -1
  28. package/themes/business/index.tsx +4 -0
  29. package/themes/business/src/components/Chat/index.tsx +32 -31
  30. package/themes/business/src/components/NetworkError/index.tsx +61 -0
  31. package/themes/business/src/components/NetworkError/styles.tsx +11 -0
  32. package/themes/business/src/components/OrderDetails/Business.tsx +1 -0
  33. package/themes/business/src/components/OrderDetails/OrderHeaderComponent.tsx +85 -17
  34. package/themes/business/src/components/OrdersListManager/index.tsx +871 -0
  35. package/themes/business/src/components/OrdersListManager/styles.tsx +123 -0
  36. package/themes/business/src/components/OrdersListManager/utils.tsx +216 -0
  37. package/themes/business/src/components/OrdersOption/index.tsx +351 -59
  38. package/themes/business/src/components/OrdersOption/styles.tsx +95 -7
  39. package/themes/business/src/components/PreviousOrders/index.tsx +65 -46
  40. package/themes/business/src/components/PreviousOrders/styles.tsx +5 -10
  41. package/themes/business/src/components/ReviewCustomer/index.tsx +11 -8
  42. package/themes/business/src/types/index.tsx +4 -0
  43. package/themes/doordash/src/components/BusinessesListing/index.tsx +1 -1
  44. package/themes/doordash/src/components/LoginForm/index.tsx +1 -2
  45. package/themes/instacart/src/components/BusinessesListing/index.tsx +1 -1
  46. package/themes/kiosk/index.tsx +2 -0
  47. package/themes/kiosk/src/components/BusinessController/index.tsx +27 -6
  48. package/themes/kiosk/src/components/BusinessController/styles.tsx +1 -1
  49. package/themes/kiosk/src/components/BusinessProductsListing/index.tsx +51 -24
  50. package/themes/kiosk/src/components/Cart/index.tsx +1 -1
  51. package/themes/kiosk/src/components/CartBottomSheet/index.tsx +1 -1
  52. package/themes/kiosk/src/components/CartBottomSheet/styles.tsx +1 -1
  53. package/themes/kiosk/src/components/CartContent/index.tsx +13 -3
  54. package/themes/kiosk/src/components/CartItem/index.tsx +20 -8
  55. package/themes/kiosk/src/components/CategoriesMenu/index.tsx +7 -5
  56. package/themes/kiosk/src/components/CustomerName/index.tsx +89 -88
  57. package/themes/kiosk/src/components/Intro/index.tsx +13 -13
  58. package/themes/kiosk/src/components/LanguageSelector/index.tsx +12 -8
  59. package/themes/kiosk/src/components/NavBar/index.tsx +14 -14
  60. package/themes/kiosk/src/components/NetworkError/index.tsx +60 -0
  61. package/themes/kiosk/src/components/NetworkError/styles.tsx +11 -0
  62. package/themes/kiosk/src/components/OptionCard/index.tsx +1 -1
  63. package/themes/kiosk/src/components/OrderDetails/index.tsx +2 -2
  64. package/themes/kiosk/src/components/OrderSummary/index.tsx +1 -1
  65. package/themes/kiosk/src/components/OrderTypeCardSelector/index.tsx +10 -12
  66. package/themes/kiosk/src/components/ProductForm/index.tsx +172 -124
  67. package/themes/kiosk/src/components/ProductForm/styles.tsx +1 -1
  68. package/themes/kiosk/src/components/ProductOption/index.tsx +1 -0
  69. package/themes/kiosk/src/components/ProductOption/styles.tsx +1 -0
  70. package/themes/kiosk/src/components/UpsellingProducts/index.tsx +48 -34
  71. package/themes/kiosk/src/components/shared/OButton.tsx +5 -18
  72. package/themes/kiosk/src/components/shared/OCard.tsx +112 -78
  73. package/themes/kiosk/src/types/index.d.ts +4 -0
  74. package/themes/original/index.tsx +28 -6
  75. package/themes/original/src/components/AddressForm/index.tsx +15 -10
  76. package/themes/original/src/components/AddressList/index.tsx +27 -1
  77. package/themes/original/src/components/AnalyticsSegment/index.tsx +127 -0
  78. package/themes/original/src/components/BusinessBasicInformation/index.tsx +11 -7
  79. package/themes/original/src/components/BusinessController/index.tsx +3 -3
  80. package/themes/original/src/components/BusinessMenuList/index.tsx +4 -2
  81. package/themes/original/src/components/BusinessPreorder/index.tsx +142 -121
  82. package/themes/original/src/components/BusinessProductsCategories/index.tsx +1 -1
  83. package/themes/original/src/components/BusinessProductsList/index.tsx +50 -6
  84. package/themes/original/src/components/BusinessProductsListing/index.tsx +13 -10
  85. package/themes/original/src/components/BusinessReviews/index.tsx +4 -3
  86. package/themes/original/src/components/BusinessesListing/index.tsx +23 -22
  87. package/themes/original/src/components/Cart/index.tsx +43 -10
  88. package/themes/original/src/components/CartContent/index.tsx +2 -2
  89. package/themes/original/src/components/Checkout/index.tsx +54 -17
  90. package/themes/original/src/components/Checkout/styles.tsx +7 -0
  91. package/themes/original/src/components/CouponControl/index.tsx +1 -0
  92. package/themes/original/src/components/DriverTips/index.tsx +1 -1
  93. package/themes/original/src/components/ForgotPasswordForm/index.tsx +8 -12
  94. package/themes/original/src/components/HighestRatedBusinesses/index.tsx +9 -2
  95. package/themes/original/src/components/LoginForm/index.tsx +83 -68
  96. package/themes/original/src/components/Messages/index.tsx +24 -21
  97. package/themes/original/src/components/Messages/styles.tsx +1 -3
  98. package/themes/original/src/components/MomentOption/index.tsx +127 -152
  99. package/themes/original/src/components/MomentOption/styles.tsx +42 -18
  100. package/themes/original/src/components/NetworkError/index.tsx +61 -0
  101. package/themes/original/src/components/NetworkError/styles.tsx +11 -0
  102. package/themes/original/src/components/OrderDetails/index.tsx +103 -124
  103. package/themes/original/src/components/OrderDetails/styles.tsx +3 -1
  104. package/themes/original/src/components/OrderProgress/index.tsx +2 -3
  105. package/themes/original/src/components/OrderSummary/index.tsx +34 -1
  106. package/themes/original/src/components/OrdersOption/index.tsx +16 -40
  107. package/themes/original/src/components/OrdersOption/styles.tsx +0 -5
  108. package/themes/original/src/components/PaymentOptionWallet/index.tsx +1 -1
  109. package/themes/original/src/components/PaymentOptions/index.tsx +20 -23
  110. package/themes/original/src/components/PhoneInputNumber/index.tsx +15 -8
  111. package/themes/original/src/components/PlaceSpot/index.tsx +114 -0
  112. package/themes/original/src/components/PlaceSpot/styles.tsx +11 -0
  113. package/themes/original/src/components/PreviousOrders/index.tsx +4 -0
  114. package/themes/original/src/components/ProductForm/index.tsx +164 -114
  115. package/themes/original/src/components/ProductForm/styles.tsx +5 -3
  116. package/themes/original/src/components/ProductOptionSubOption/index.tsx +81 -74
  117. package/themes/original/src/components/ReviewDriver/index.tsx +315 -0
  118. package/themes/original/src/components/ReviewDriver/styles.tsx +38 -0
  119. package/themes/original/src/components/ReviewOrder/index.tsx +307 -186
  120. package/themes/original/src/components/ReviewOrder/styles.tsx +24 -13
  121. package/themes/original/src/components/ReviewProducts/index.tsx +116 -0
  122. package/themes/original/src/components/ReviewProducts/styles.tsx +16 -0
  123. package/themes/original/src/components/SignupForm/index.tsx +173 -154
  124. package/themes/original/src/components/SingleProductCard/index.tsx +6 -13
  125. package/themes/original/src/components/SingleProductCard/styles.tsx +1 -1
  126. package/themes/original/src/components/SingleProductReview/index.tsx +166 -0
  127. package/themes/original/src/components/SingleProductReview/styles.tsx +27 -0
  128. package/themes/original/src/components/StripeElementsForm/index.tsx +55 -72
  129. package/themes/original/src/components/UpsellingProducts/index.tsx +6 -6
  130. package/themes/original/src/components/UserDetails/index.tsx +4 -95
  131. package/themes/original/src/components/UserFormDetails/index.tsx +2 -14
  132. package/themes/original/src/components/UserProfile/index.tsx +16 -9
  133. package/themes/original/src/components/UserProfileForm/index.tsx +16 -8
  134. package/themes/original/src/components/VerifyPhone/index.tsx +10 -7
  135. package/themes/original/src/components/VerifyPhone/styles.tsx +2 -1
  136. package/themes/original/src/components/shared/HeaderTitle.tsx +20 -0
  137. package/themes/original/src/components/shared/index.tsx +2 -0
  138. package/themes/original/src/layouts/FloatingBottomContainer.tsx +26 -0
  139. package/themes/original/src/types/index.tsx +47 -10
  140. package/themes/single-business/src/components/OrderTypeSelector/index.tsx +5 -5
  141. package/themes/uber-eats/src/components/BusinessesListing/index.tsx +1 -1
  142. package/src/components/StripeMethodForm/index.tsx +0 -163
@@ -1,5 +1,5 @@
1
1
  import React, { useState, useEffect } from 'react';
2
- import { StyleSheet, TouchableOpacity, View } from 'react-native';
2
+ import { StyleSheet, TouchableOpacity, View, Platform, PlatformIOSStatic } from 'react-native';
3
3
  import { useTheme } from 'styled-components/native';
4
4
  import moment from 'moment'
5
5
  import { useLanguage, useUtils } from 'ordering-components/native';
@@ -8,6 +8,10 @@ import {
8
8
  Card, Logo, Information, MyOrderOptions, NotificationIcon, AcceptOrRejectOrder, Timestatus
9
9
  } from './styles';
10
10
  import EntypoIcon from 'react-native-vector-icons/Entypo'
11
+ import { DeviceOrientationMethods } from '../../../../../src/hooks/DeviceOrientation'
12
+ import DeviceInfo from 'react-native-device-info';
13
+
14
+ const { useDeviceOrientation, PORTRAIT } = DeviceOrientationMethods
11
15
 
12
16
  export const PreviousOrders = (props: any) => {
13
17
  const {
@@ -16,42 +20,51 @@ export const PreviousOrders = (props: any) => {
16
20
  getOrderStatus,
17
21
  handleClickOrder,
18
22
  isLogisticOrder,
19
- handleClickLogisticOrder
23
+ handleClickLogisticOrder,
24
+ slaSettingTime,
25
+ currentTabSelected,
26
+ currentOrdenSelected
20
27
  } = props;
21
28
  const [, t] = useLanguage();
22
29
  const [{ parseDate, optimizeImage }] = useUtils();
23
30
  const theme = useTheme();
24
31
  const [currentTime, setCurrentTime] = useState()
32
+ const [orientationState] = useDeviceOrientation();
33
+
34
+ const IS_PORTRAIT = orientationState.orientation === PORTRAIT
35
+
36
+ const platformIOS = Platform as PlatformIOSStatic
37
+ const isIpad = platformIOS.isPad
38
+ const isTablet = DeviceInfo.isTablet();
25
39
 
26
40
  const handlePressOrder = (order: any) => {
27
41
  if (order?.locked && isLogisticOrder) return
28
42
  handleClickOrder && handleClickOrder(order)
29
- onNavigationRedirect &&
30
- onNavigationRedirect('OrderDetails', { order: { ...order, isLogistic: isLogisticOrder }, handleClickLogisticOrder });
43
+ if (props.handleClickEvent) {
44
+ props.handleClickEvent({ ...order, isLogistic: isLogisticOrder })
45
+ } else {
46
+ onNavigationRedirect &&
47
+ onNavigationRedirect('OrderDetails', { order: { ...order, isLogistic: isLogisticOrder }, handleClickLogisticOrder });
48
+ }
31
49
  };
32
50
 
33
51
  const styles = StyleSheet.create({
34
52
  cardButton: {
35
53
  flex: 1,
36
- minHeight: isLogisticOrder ? 50 : 64,
37
- marginBottom: isLogisticOrder ? 0 : 30,
54
+ paddingVertical: (isIpad || isTablet) ? 20 : 0,
55
+ marginBottom: IS_PORTRAIT ? 25 : 0,
38
56
  marginLeft: 3,
39
57
  },
40
58
  icon: {
41
59
  borderRadius: 7.6,
42
- width: 75,
43
- height: 75,
60
+ width: 60,
61
+ height: 60
44
62
  },
45
63
  logo: {
46
64
  borderRadius: 10,
47
- shadowColor: "#000",
48
- shadowOffset: {
49
- width: 0,
50
- height: 1,
51
- },
52
- shadowOpacity: 0.20,
53
- shadowRadius: 1.41,
54
- elevation: 2,
65
+ shadowColor: "#0000006e",
66
+ shadowRadius: 10,
67
+ elevation: 15,
55
68
  justifyContent: 'center',
56
69
  alignItems: 'center',
57
70
  marginLeft: 3,
@@ -99,9 +112,9 @@ export const PreviousOrders = (props: any) => {
99
112
 
100
113
  useEffect(() => {
101
114
  const interval = setInterval(() => {
102
- const date:any = Date.now()
115
+ const date: any = Date.now()
103
116
  setCurrentTime(date)
104
- }, 60000)
117
+ }, slaSettingTime)
105
118
 
106
119
  return () => clearInterval(interval)
107
120
  }, [])
@@ -118,8 +131,9 @@ export const PreviousOrders = (props: any) => {
118
131
  return (
119
132
  <View
120
133
  style={{
121
- backgroundColor: order?.locked && isLogisticOrder ? '#ccc' : '#fff',
122
- marginBottom: isLogisticOrder ? 10 : 0
134
+ backgroundColor: currentOrdenSelected === order?.id ? theme.colors.gray100 : order?.locked && isLogisticOrder ? '#ccc' : '#fff',
135
+ marginBottom: isLogisticOrder ? 10 : 0,
136
+ // justifyContent: 'center'
123
137
  }}
124
138
  key={order.id}
125
139
  >
@@ -130,7 +144,7 @@ export const PreviousOrders = (props: any) => {
130
144
  activeOpacity={1}
131
145
  >
132
146
  <Card key={order.id}>
133
- <Timestatus style={{backgroundColor: order?.time_status === 'in_time' ? '#00D27A' : order?.time_status === 'at_risk' ? '#FFC700' : order?.time_status === 'delayed' ? '#E63757' : '' }}/>
147
+ <Timestatus style={{ backgroundColor: order?.time_status === 'in_time' ? '#00D27A' : order?.time_status === 'at_risk' ? '#FFC700' : order?.time_status === 'delayed' ? '#E63757' : '' }} />
134
148
  {
135
149
  order.business?.logo && (
136
150
  <Logo style={styles.logo}>
@@ -163,7 +177,7 @@ export const PreviousOrders = (props: any) => {
163
177
  />
164
178
  </NotificationIcon>
165
179
  )}
166
- <View style={{flexDirection: 'row'}}>
180
+ <View style={{ flexDirection: 'row', flexWrap: 'wrap' }}>
167
181
  <OText
168
182
  style={styles.date}
169
183
  color={theme.colors.unselectText}
@@ -173,9 +187,14 @@ export const PreviousOrders = (props: any) => {
173
187
  {(order?.order_group_id && order?.order_group && isLogisticOrder ? `${order?.order_group?.orders?.length} ${t('ORDERS', 'Orders')}` : (t('NO', 'Order No.') + order.id)) + ' · '}
174
188
  {order?.delivery_datetime_utc
175
189
  ? parseDate(order?.delivery_datetime_utc, { outputFormat: 'MM/DD/YY · HH:mm a' })
176
- : parseDate(order?.delivery_datetime, { utc: false })}{' · '}
190
+ : parseDate(order?.delivery_datetime, { utc: false })}
177
191
  </OText>
178
- <OText style={styles.date} color={order?.time_status === 'in_time' ? '#00D27A' : order?.time_status === 'at_risk' ? '#FFC700' : order?.time_status === 'delayed' ? '#E63757' : '' } >{getDelayTime(order)}</OText>
192
+ {(currentTabSelected === 'pending' || currentTabSelected === 'inProgress') && (
193
+ <>
194
+ <OText> · </OText>
195
+ <OText style={styles.date} color={order?.time_status === 'in_time' ? '#00D27A' : order?.time_status === 'at_risk' ? '#FFC700' : order?.time_status === 'delayed' ? '#E63757' : ''} >{getDelayTime(order)}</OText>
196
+ </>
197
+ )}
179
198
  </View>
180
199
  {!isLogisticOrder && (
181
200
  <MyOrderOptions>
@@ -215,28 +234,28 @@ export const PreviousOrders = (props: any) => {
215
234
  textStyle={{ color: theme.colors.primary }}
216
235
  />
217
236
  ) : (
218
- <>
219
- <OButton
220
- text={t('REJECT', 'Reject')}
221
- onClick={() => handleClickLogisticOrder(2, _order?.id)}
222
- bgColor={theme.colors.danger}
223
- borderColor={theme.colors.danger}
224
- imgRightSrc={null}
225
- style={{ borderRadius: 7, height: 40 }}
226
- parentStyle={{ width: '45%' }}
227
- textStyle={{ color: theme.colors.dangerText }}
228
- />
229
- <OButton
230
- text={t('ACCEPT', 'Accept')}
231
- onClick={() => handleClickLogisticOrder(1, _order?.id)}
232
- bgColor={theme.colors.successOrder}
233
- borderColor={theme.colors.successOrder}
234
- imgRightSrc={null}
235
- style={{ borderRadius: 7, height: 40 }}
236
- parentStyle={{ width: '45%' }}
237
- textStyle={{ color: theme.colors.successText }}
238
- />
239
- </>
237
+ <>
238
+ <OButton
239
+ text={t('REJECT', 'Reject')}
240
+ onClick={() => handleClickLogisticOrder(2, _order?.id)}
241
+ bgColor={theme.colors.danger}
242
+ borderColor={theme.colors.danger}
243
+ imgRightSrc={null}
244
+ style={{ borderRadius: 7, height: 40 }}
245
+ parentStyle={{ width: '45%' }}
246
+ textStyle={{ color: theme.colors.dangerText }}
247
+ />
248
+ <OButton
249
+ text={t('ACCEPT', 'Accept')}
250
+ onClick={() => handleClickLogisticOrder(1, _order?.id)}
251
+ bgColor={theme.colors.successOrder}
252
+ borderColor={theme.colors.successOrder}
253
+ imgRightSrc={null}
254
+ style={{ borderRadius: 7, height: 40 }}
255
+ parentStyle={{ width: '45%' }}
256
+ textStyle={{ color: theme.colors.successText }}
257
+ />
258
+ </>
240
259
  )}
241
260
  </AcceptOrRejectOrder>
242
261
  )}
@@ -8,16 +8,16 @@ export const Card = styled.View`
8
8
  `;
9
9
 
10
10
  export const Logo = styled.View`
11
- height: 75px;
12
- width: 75px;
11
+ height: 65px;
12
+ width: 65px;
13
13
  `;
14
14
 
15
15
  export const Information = styled.View`
16
16
  position: relative;
17
17
  justify-content: flex-start;
18
- margin-horizontal: 10px;
18
+ margin-horizontal: 5px;
19
19
  flex: 1;
20
- max-height: 70px;
20
+ max-height: 60px;
21
21
  `;
22
22
 
23
23
  export const MyOrderOptions = styled.View`
@@ -39,12 +39,7 @@ export const AcceptOrRejectOrder = styled.View`
39
39
  export const Timestatus = styled.View`
40
40
  position: relative;;
41
41
  width: 4px;
42
- height: 65px;
42
+ height: 55px;
43
43
  border-radius: 20px;
44
44
  top: 5px;
45
- margin-right: 5px;
46
- ${(props: any) => props.theme?.rtl && css`
47
- left: unset;
48
- right: -5px;
49
- `}
50
45
  `
@@ -20,6 +20,8 @@ import { FloatingButton } from '../FloatingButton'
20
20
  import LinearGradient from 'react-native-linear-gradient'
21
21
  import Alert from '../../providers/AlertProvider'
22
22
 
23
+ import { reviewCommentList } from '../../../../../src/utils'
24
+
23
25
  import {
24
26
  Content,
25
27
  ActionButtonWrapper,
@@ -36,7 +38,6 @@ const ReviewCustomerUI = (props: ReviewCustomerParams) => {
36
38
  reviewState,
37
39
  setReviewState,
38
40
  actionState,
39
- handleChangeQualification,
40
41
  handleSendCustomerReview
41
42
  } = props
42
43
 
@@ -101,11 +102,13 @@ const ReviewCustomerUI = (props: ReviewCustomerParams) => {
101
102
  { key: 5, text: t('GREAT', 'Great'), percent: 1, parentStyle: { right: '0%' }, isInnerStyle: false, pointerColor: false }
102
103
  ]
103
104
 
104
- const commentsList = [
105
- { key: 0, content: t('RESPECTFUL', 'Respectful') },
106
- { key: 1, content: t('EXCELLENT_COMMUNICATION', "Excellent communication") },
107
- { key: 2, content: t('CORDIAL_SERVICE', 'Cordial service') }
108
- ]
105
+ const commentsList = reviewCommentList('customer')
106
+
107
+ const handleChangeQualification = (index: any) => {
108
+ if (index) setReviewState({ ...reviewState, qualification: index, comment: '' })
109
+ setComments([])
110
+ }
111
+
109
112
  const isSelectedComment = (commentKey: number) => {
110
113
  const found = comments.find((comment: any) => comment?.key === commentKey)
111
114
  return found
@@ -251,10 +254,10 @@ const ReviewCustomerUI = (props: ReviewCustomerParams) => {
251
254
  size={12}
252
255
  style={{ marginTop: 30 }}
253
256
  >
254
- {t('COMMENTS', 'Comments')}
257
+ {commentsList[reviewState?.qualification || 1]?.title}
255
258
  </OText>
256
259
  <CommentsButtonGroup>
257
- {commentsList.map(commentItem => (
260
+ {commentsList[reviewState?.qualification || 1]?.list?.map(commentItem => (
258
261
  <OButton
259
262
  key={commentItem.key}
260
263
  text={commentItem.content}
@@ -575,3 +575,7 @@ export interface ReviewCustomerParams {
575
575
  handleChangeQualification?: any,
576
576
  handleSendCustomerReview?: any,
577
577
  }
578
+
579
+ export interface NoNetworkParams {
580
+ image?: any;
581
+ }
@@ -197,7 +197,7 @@ const BusinessesListingUI = (props: BusinessesListingParams) => {
197
197
  {isFarAway && (
198
198
  <FarAwayMessage style={styles.farAwayMsg}>
199
199
  <Ionicons name='md-warning-outline' style={styles.iconStyle} />
200
- <OText size={12} numberOfLines={1} ellipsizeMode={'tail'} color={theme.colors.textNormal}>{t('YOU_ARE_FAR_FROM_ADDRESS', 'You are far from this address')}</OText>
200
+ <OText size={12} numberOfLines={1} ellipsizeMode={'tail'} color={theme.colors.textNormal}>{t('YOU_ARE_FAR_FROM_ADDRESS', 'Your are far from this address')}</OText>
201
201
  </FarAwayMessage>
202
202
  )}
203
203
  {!auth && (
@@ -410,8 +410,7 @@ const LoginFormUI = (props: LoginParams) => {
410
410
  textInputProps={{
411
411
  returnKeyType: 'next',
412
412
  onSubmitEditing: () => inputRef?.current?.focus?.(),
413
- style: { borderWidth: 0, fontSize: 12 },
414
- maxLength: 10
413
+ style: { borderWidth: 0, fontSize: 12 }
415
414
  }}
416
415
  textWrapStyle={{ borderColor: theme.colors.clear, borderWidth: 0, height: 40, paddingStart: 0 }}
417
416
  />
@@ -155,7 +155,7 @@ const BusinessesListingUI = (props: BusinessesListingParams) => {
155
155
  {isFarAway && (
156
156
  <FarAwayMessage style={styles.farAwayMsg}>
157
157
  <Ionicons name='md-warning-outline' style={styles.iconStyle} />
158
- <OText size={12} numberOfLines={1} ellipsizeMode={'tail'} color={theme.colors.textNormal}>{t('YOU_ARE_FAR_FROM_ADDRESS', 'You are far from this address')}</OText>
158
+ <OText size={12} numberOfLines={1} ellipsizeMode={'tail'} color={theme.colors.textNormal}>{t('YOU_ARE_FAR_FROM_ADDRESS', 'Your are far from this address')}</OText>
159
159
  </FarAwayMessage>
160
160
  )}
161
161
  <View style={styles.wrapperOrderOptions}>
@@ -14,6 +14,7 @@ import { LanguageSelector } from './src/components/LanguageSelector'
14
14
  import { LoginForm } from './src/components/LoginForm'
15
15
  import { LogoutPopup } from './src/components/LogoutPopup'
16
16
  import Navbar from './src/components/NavBar'
17
+ import { NetworkError } from './src/components/NetworkError'
17
18
  import { NotFoundSource } from './src/components/NotFoundSource'
18
19
  import OptionCard from './src/components/OptionCard'
19
20
  import { OrderDetails } from './src/components/OrderDetails'
@@ -82,6 +83,7 @@ export {
82
83
  LoginForm,
83
84
  LogoutPopup,
84
85
  Navbar,
86
+ NetworkError,
85
87
  NotFoundSource,
86
88
  OptionCard,
87
89
  OrderDetails,
@@ -6,6 +6,7 @@ import {
6
6
  BusinessController as BusinessSingleCard,
7
7
  useUtils,
8
8
  } from 'ordering-components/native';
9
+ import FastImage from 'react-native-fast-image'
9
10
 
10
11
  import { Card, BusinessLogo } from './styles';
11
12
 
@@ -26,6 +27,16 @@ export const BusinessControllerUI = (props: any) => {
26
27
  alignItems: 'center',
27
28
  textAlign: 'center',
28
29
  marginTop: 10
30
+ },
31
+ logoStyle: {
32
+ width: 120,
33
+ height: 120,
34
+ borderRadius: 8,
35
+ borderWidth: 1,
36
+ borderColor: theme.colors.border,
37
+ flexDirection: 'column',
38
+ justifyContent: 'center',
39
+ alignItems: 'center',
29
40
  }
30
41
  });
31
42
 
@@ -39,12 +50,22 @@ export const BusinessControllerUI = (props: any) => {
39
50
  activeOpacity={1}
40
51
  onPress={() => handleBusinessClick(business)}
41
52
  >
42
- <BusinessLogo
43
- source={business?.logo ? {
44
- uri: optimizeImage(business?.logo, 'h_120,c_limit'),
45
- } : theme.images.dummies.businessLogo}
46
- resizeMode='contain'
47
- />
53
+ {business?.logo ? (
54
+ <FastImage
55
+ style={styles.logoStyle}
56
+ source={{
57
+ uri: business?.logo,
58
+ priority: FastImage.priority.high,
59
+ cache:FastImage.cacheControl.web
60
+ }}
61
+ resizeMode={FastImage.resizeMode.contain}
62
+ />
63
+ ) : (
64
+ <BusinessLogo
65
+ source={theme.images.dummies.businessLogo}
66
+ resizeMode='contain'
67
+ />
68
+ )}
48
69
  <OText
49
70
  size={WIDTH_SCREEN * 0.012}
50
71
  numberOfLines={2}
@@ -3,7 +3,7 @@ import styled, { css } from 'styled-components/native';
3
3
  export const Card = styled.TouchableOpacity`
4
4
  display: flex;
5
5
  flex-direction: column;
6
- justify-content: center;
6
+ justify-content: flex-start;
7
7
  align-items: center;
8
8
  margin: 0 15px 20px;
9
9
  width: 120px;
@@ -1,5 +1,5 @@
1
1
  import React from 'react'
2
- import { View, StyleSheet, ScrollView, TouchableOpacity } from 'react-native'
2
+ import { View, StyleSheet, ScrollView, TouchableOpacity, ImageBackground } from 'react-native'
3
3
  import { BusinessAndProductList, useLanguage } from 'ordering-components/native'
4
4
  import { BusinessProductsListingParams, Business } from '../../types'
5
5
  import { OCard, OText, OIcon } from '../shared'
@@ -7,6 +7,7 @@ import GridContainer from '../../layouts/GridContainer'
7
7
  import Spinner from 'react-native-loading-spinner-overlay';
8
8
  import { LANDSCAPE, useDeviceOrientation } from '../../../../../src/hooks/DeviceOrientation';
9
9
  import styled, { useTheme } from 'styled-components/native';
10
+ import FastImage from 'react-native-fast-image'
10
11
 
11
12
  const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
12
13
  const {navigation, businessState, resetInactivityTimeout, clearInactivityTimeout, bottomSheetVisibility } = props;
@@ -38,7 +39,7 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
38
39
  },
39
40
  });
40
41
 
41
- const _categories: any = business?.original?.categories;
42
+ const _categories: any = business?.categories;
42
43
  let _promos: any = [];
43
44
  _categories?.forEach((categ: any) => {
44
45
  const _featuredProds = categ?.products?.filter(
@@ -59,17 +60,17 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
59
60
  );
60
61
 
61
62
  const RenderCategories = ({ item, cardStyle, widthScreen }: any) => {
62
- const Category = styled.ImageBackground`
63
- position: relative;
64
- height: 150px;
65
- width: ${(props: any) => props.w * 0.45}px;
66
- border-radius: 10px;
67
- padding: 10px;
68
- display: flex;
69
- flex-direction: column;
70
- justify-content: center;
71
- align-items: center;
72
- `
63
+ const stylesCat = StyleSheet.create({
64
+ categoryStyle: {
65
+ height: 150,
66
+ borderRadius: 10,
67
+ padding: 10,
68
+ flexDirection: 'column',
69
+ justifyContent: 'center',
70
+ alignItems: 'center',
71
+ }
72
+ })
73
+
73
74
  const WrapText = styled.View`
74
75
  height: 90px;
75
76
  display: flex;
@@ -78,6 +79,25 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
78
79
  border-radius: 10px;
79
80
  `
80
81
 
82
+ const Category = (props: any) => {
83
+ const imageProps = {
84
+ style: props.style,
85
+ source: props.source,
86
+ resizeMode: props.resizeMode,
87
+ }
88
+ return (
89
+ props.uri ? (
90
+ <FastImage {...imageProps}>
91
+ {props.children}
92
+ </FastImage>
93
+ ) : (
94
+ <ImageBackground {...imageProps}>
95
+ {props.children}
96
+ </ImageBackground>
97
+ )
98
+ )
99
+ }
100
+
81
101
  return (
82
102
  <TouchableOpacity
83
103
  key={item.id}
@@ -92,11 +112,17 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
92
112
  }}
93
113
  >
94
114
  <Category
95
- style={cardStyle}
96
- source={{uri: item.images}}
97
- resizeMode="cover"
98
- w={widthScreen}
99
- borderRadius={16}
115
+ style={{ ...cardStyle, ...stylesCat.categoryStyle, width: widthScreen * 0.45 }}
116
+ uri={!!item.images}
117
+ source={!!item.images
118
+ ? {
119
+ uri: item.images,
120
+ priority: FastImage.priority.high,
121
+ cache:FastImage.cacheControl.web
122
+ }
123
+ : theme.images.categories.all
124
+ }
125
+ resizeMode={FastImage.resizeMode.cover}
100
126
  >
101
127
  {item?.inventoried && (
102
128
  <View style={styles.soldOut}>
@@ -111,7 +137,6 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
111
137
  mLeft={0}
112
138
  size={32}
113
139
  numberOfLines={1}
114
- // mBottom={8}
115
140
  style={{...props?.titleStyle}}
116
141
  weight="bold"
117
142
  >
@@ -121,7 +146,6 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
121
146
  <OText
122
147
  color={theme.colors.white}
123
148
  numberOfLines={1}
124
- // mBottom={4}
125
149
  size={18}
126
150
  style={{...props?.descriptionStyle}}
127
151
  weight="400"
@@ -161,7 +185,7 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
161
185
  const _renderCategories = (): React.ReactElement => (
162
186
  <>
163
187
  {_renderTitle(t('CATEGORIES', 'Categories'))}
164
- <GridContainer
188
+ <GridContainer
165
189
  style={{
166
190
  paddingLeft: orientationState?.orientation === LANDSCAPE
167
191
  ? bottomSheetVisibility ? orientationState?.dimensions?.width * 0.004 :orientationState?.dimensions?.width * 0.008
@@ -171,9 +195,12 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
171
195
  {_categories && _categories.map((category: any) => (
172
196
  <OCard
173
197
  key={category.id}
198
+ isCentered
199
+ isUri={!!category.image}
174
200
  title={category?.name || ''}
175
- image={{uri: category?.image}}
201
+ image={category.image ? {uri: category.image} : theme.images.categories.all}
176
202
  style={{
203
+ borderRadius: 10,
177
204
  width:
178
205
  orientationState?.orientation === LANDSCAPE
179
206
  ? bottomSheetVisibility ? orientationState?.dimensions?.width * 0.145 :orientationState?.dimensions?.width * 0.16
@@ -183,8 +210,8 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
183
210
  resetInactivityTimeout()
184
211
  navigation.navigate('Category', {
185
212
  category,
186
- categories: business.original.categories,
187
- businessId: business?.api?.businessId,
213
+ categories: business?.categories,
214
+ businessId: business?.id,
188
215
  businessSlug: business?.slug,
189
216
  clearInactivityTimeout,
190
217
  resetInactivityTimeout,
@@ -379,7 +379,7 @@ const CartUI = (props: any) => {
379
379
  <ProductForm
380
380
  productCart={curProduct}
381
381
  businessSlug={cart?.business?.slug}
382
- businessId={curProduct?.business_id}
382
+ businessId={cart?.business_id}
383
383
  categoryId={curProduct?.category_id}
384
384
  productId={curProduct?.id}
385
385
  onSave={handlerProductAction}
@@ -179,7 +179,7 @@ const CartBottomSheetUI = (props: CartBottomSheetUIProps): React.ReactElement |
179
179
  <ProductForm
180
180
  productCart={curProduct}
181
181
  businessSlug={cart?.business?.slug}
182
- businessId={curProduct?.business_id}
182
+ businessId={cart?.business_id}
183
183
  categoryId={curProduct?.category_id}
184
184
  productId={curProduct?.id}
185
185
  onSave={handlerProductAction}
@@ -5,7 +5,7 @@ export const StyledContainer = styled.ScrollView`
5
5
  zIndex: 1000;
6
6
  width: 100%;
7
7
  background-color: #fff;
8
- padding: 20px 20px 20px 0px;
8
+ padding: 20px 0 0;
9
9
  bottom: 0;
10
10
  shadow-color: #000;
11
11
  shadow-opacity: 0.4;
@@ -1,6 +1,6 @@
1
1
  import React, { useEffect, useState } from 'react';
2
2
  import { useLanguage } from 'ordering-components/native';
3
-
3
+ import { useCartBottomSheet } from '../../providers/CartBottomSheetProvider';
4
4
  import { CCNotCarts } from './styles';
5
5
 
6
6
  import { Cart } from '../Cart';
@@ -22,6 +22,7 @@ export const CartContent = (props: any) => {
22
22
 
23
23
  const [, t] = useLanguage()
24
24
  const [isCartsLoading, setIsCartsLoading] = useState(false)
25
+ const [, { hideCartBottomSheet }] = useCartBottomSheet();
25
26
 
26
27
  const cartProps = {
27
28
  navigation,
@@ -33,6 +34,15 @@ export const CartContent = (props: any) => {
33
34
  resetInactivityTimeout,
34
35
  }
35
36
 
37
+ useEffect(() => {
38
+ if (!cart && showNotFound) {
39
+ navigation?.canGoBack()
40
+ ? navigation.goBack()
41
+ : props.onNavigationRedirect && props.onNavigationRedirect('Business')
42
+ hideCartBottomSheet()
43
+ }
44
+ }, [cart])
45
+
36
46
  const content = (
37
47
  <>
38
48
  {(isOrderStateCarts && cart) && (
@@ -46,13 +56,13 @@ export const CartContent = (props: any) => {
46
56
  }
47
57
  </>
48
58
  )}
49
- {(!cart && showNotFound) && (
59
+ {/* {(!cart && showNotFound) && (
50
60
  <CCNotCarts>
51
61
  <OText size={24} style={{ textAlign: 'center' }}>
52
62
  {t('CARTS_NOT_FOUND', 'You don\'t have carts available')}
53
63
  </OText>
54
64
  </CCNotCarts>
55
- )}
65
+ )} */}
56
66
  <Spinner visible={isCartsLoading} />
57
67
  </>
58
68
  )