ordering-ui-react-native 0.18.39 → 0.18.40-test

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.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ordering-ui-react-native",
3
- "version": "0.18.39",
3
+ "version": "0.18.40-test",
4
4
  "description": "Reusable components made in react native",
5
5
  "main": "src/index.tsx",
6
6
  "author": "ordering.inc",
@@ -453,7 +453,7 @@ export const DriverMap = (props: GoogleMapsParams) => {
453
453
  {order?.delivery_datetime_utc
454
454
  ? parseDate(order?.delivery_datetime_utc)
455
455
  : parseDate(order?.delivery_datetime, { utc: false })}
456
- {` - ${order?.paymethod?.name}`}
456
+ {` - ${t(order?.paymethod?.name?.replace(/\s+/g, '_')?.toUpperCase(), order?.paymethod?.name)}`}
457
457
  </OText>
458
458
  <OText weight="bold">
459
459
  {t('INVOICE_ORDER_NO', 'Order No.')} {order?.id}
@@ -1,4 +1,4 @@
1
- import React, { useState } from 'react';
1
+ import React, { useContext, useState } from 'react';
2
2
  import { OText, OIconButton } from '../shared';
3
3
  import { StyleSheet, View, Platform, Alert } from 'react-native';
4
4
  import {
@@ -23,7 +23,11 @@ import { useTheme } from 'styled-components/native';
23
23
 
24
24
  import { ProductItemAccordion } from '../ProductItemAccordion';
25
25
 
26
- export const OrderSummary = ({ order, navigation, orderStatus }: any) => {
26
+ export const OrderSummary = ({ order, navigation, orderStatus, permissions,
27
+ askBluetoothPermission,
28
+ getPermissions,
29
+ isGrantedPermissions,
30
+ checkBluetoothPermission }: any) => {
27
31
  const handleArrowBack: any = () => {
28
32
  navigation?.canGoBack() && navigation.goBack();
29
33
  };
@@ -48,10 +52,10 @@ export const OrderSummary = ({ order, navigation, orderStatus }: any) => {
48
52
  const getSuboptions = (suboptions: any) => {
49
53
  const array: any = []
50
54
  suboptions?.length > 0 &&
51
- suboptions?.map((suboption: any) => {
52
- const string = `&nbsp;&nbsp;&nbsp;${getFormattedSubOptionName(suboption)}<br/>`
53
- array.push(string)
54
- })
55
+ suboptions?.map((suboption: any) => {
56
+ const string = `&nbsp;&nbsp;&nbsp;${getFormattedSubOptionName(suboption)}<br/>`
57
+ array.push(string)
58
+ })
55
59
 
56
60
  return array.join('')
57
61
  }
@@ -60,12 +64,12 @@ export const OrderSummary = ({ order, navigation, orderStatus }: any) => {
60
64
  const array: any = [];
61
65
 
62
66
  options?.length &&
63
- options?.map((option: any) => {
64
- const string =
65
- ` ${option.name}<br/>${getSuboptions(option.suboptions)}`;
67
+ options?.map((option: any) => {
68
+ const string =
69
+ ` ${option.name}<br/>${getSuboptions(option.suboptions)}`;
66
70
 
67
- array.push(string)
68
- })
71
+ array.push(string)
72
+ })
69
73
 
70
74
  if (productComment) {
71
75
  array.push(`${t('COMMENT', 'Comment')}<br/>&nbsp;&nbsp;&nbsp;&nbsp;${productComment}`)
@@ -88,46 +92,38 @@ export const OrderSummary = ({ order, navigation, orderStatus }: any) => {
88
92
 
89
93
  ${orderStatus} </br>
90
94
 
91
- ${t('DELIVERY_TYPE', 'Delivery Type')}: ${
92
- deliveryStatus[order?.delivery_type]
93
- }
95
+ ${t('DELIVERY_TYPE', 'Delivery Type')}: ${deliveryStatus[order?.delivery_type]
96
+ }
94
97
  </br>
95
- ${t('DELIVERY_DATE', 'Delivery Date')}: ${
96
- order?.delivery_datetime_utc
98
+ ${t('DELIVERY_DATE', 'Delivery Date')}: ${order?.delivery_datetime_utc
97
99
  ? parseDate(order?.delivery_datetime_utc)
98
100
  : parseDate(order?.delivery_datetime, { utc: false })
99
- }
101
+ }
100
102
  </br>
101
103
  ${t('PAYMENT_METHOD')}: ${order?.paymethod?.name}
102
104
  </p>
103
105
 
104
106
  <h1>${t('CUSTOMER_DETAILS', 'Customer details')}</h1>
105
- <p style="font-size: 27px"> ${t('FULL_NAME', 'Full Name')}: ${
106
- order?.customer?.name
107
- } ${order?.customer?.middle_name} ${order?.customer?.lastname} ${
108
- order?.customer?.second_lastname
109
- }
107
+ <p style="font-size: 27px"> ${t('FULL_NAME', 'Full Name')}: ${order?.customer?.name
108
+ } ${order?.customer?.middle_name} ${order?.customer?.lastname} ${order?.customer?.second_lastname
109
+ }
110
110
  </br>
111
111
  ${t('EMAIL', 'Email')}: ${order?.customer?.email}
112
112
  </br>
113
113
  ${t('MOBILE_PHONE', 'Mobile Phone')}: ${order?.customer?.cellphone}
114
114
  </br>
115
- ${
116
- !!order?.customer?.phone
117
- ? `${t('MOBILE_PHONE', 'Mobile Phone')}: ${
118
- order?.customer?.phone
119
- } </br>`
120
- : ''
121
- }
115
+ ${!!order?.customer?.phone
116
+ ? `${t('MOBILE_PHONE', 'Mobile Phone')}: ${order?.customer?.phone
117
+ } </br>`
118
+ : ''
119
+ }
122
120
  ${t('FULL_ADDRESS', 'Full Addres')}: ${order?.customer?.address}
123
121
  </br>
124
- ${
125
- !!order?.customer?.internal_number
126
- ? `${t('INTERNAL_NUMBER', 'Internal Number')}: ${
127
- order?.customer?.internal_number
128
- } </br>`
129
- : ''
130
- }
122
+ ${!!order?.customer?.internal_number
123
+ ? `${t('INTERNAL_NUMBER', 'Internal Number')}: ${order?.customer?.internal_number
124
+ } </br>`
125
+ : ''
126
+ }
131
127
  ${t('ZIPCODE', 'Zipcode')}: ${order?.customer.zipcode}
132
128
  </p>
133
129
 
@@ -139,30 +135,26 @@ export const OrderSummary = ({ order, navigation, orderStatus }: any) => {
139
135
  </br>
140
136
  ${t('BUSINESS_PHONE', 'Business Phone')}: ${order?.business?.cellphone}
141
137
  </br>
142
- ${
143
- !!order?.business?.phone
144
- ? `${t('BUSINESS_PHONE', 'Business Phone')}: ${
145
- order?.business?.phone
146
- } </br>`
147
- : ''
148
- }
138
+ ${!!order?.business?.phone
139
+ ? `${t('BUSINESS_PHONE', 'Business Phone')}: ${order?.business?.phone
140
+ } </br>`
141
+ : ''
142
+ }
149
143
 
150
144
  ${t('ADDRESS', 'Address')}: ${order?.business?.address}
151
145
  </br>
152
- ${
153
- !!order?.business?.address_notes
154
- ? `${t('SPECIAL_ADDRESS', 'Special Address')}: ${
155
- order?.business?.address_notes
156
- } `
157
- : ''
158
- }
146
+ ${!!order?.business?.address_notes
147
+ ? `${t('SPECIAL_ADDRESS', 'Special Address')}: ${order?.business?.address_notes
148
+ } `
149
+ : ''
150
+ }
159
151
  </p>
160
152
  <h1> ${t('ORDER_DETAILS', 'Order Details')}</h1>
161
153
 
162
154
  ${order?.products.length &&
163
- order?.products.map(
164
- (product: any, i: number) =>
165
- `<div style="display: flex;flexDirection:row;flex-wrap:wrap">
155
+ order?.products.map(
156
+ (product: any, i: number) =>
157
+ `<div style="display: flex;flexDirection:row;flex-wrap:wrap">
166
158
  <div style="display:flex;width:100%">
167
159
  <div style="display:flex; justify-content: flex-start; font-size: 26px; width: 70%">
168
160
  ${product?.quantity} ${product?.name}
@@ -179,8 +171,8 @@ export const OrderSummary = ({ order, navigation, orderStatus }: any) => {
179
171
  </div>
180
172
  </div>
181
173
  </div>`
182
- )
183
- }
174
+ )
175
+ }
184
176
  <div style="display: flex;">
185
177
 
186
178
  <div style="display:flex; justify-content: flex-start; font-size: 26px; width: 70%">
@@ -189,62 +181,58 @@ export const OrderSummary = ({ order, navigation, orderStatus }: any) => {
189
181
 
190
182
  <div style="display:flex; justify-content: flex-end; font-size: 26px; width: 30%">
191
183
  ${parsePrice(
192
- order.tax_type === 1
193
- ? order?.summary?.subtotal + order?.summary?.tax ?? 0
194
- : order?.summary?.subtotal ?? 0,
195
- )}
184
+ order.tax_type === 1
185
+ ? order?.summary?.subtotal + order?.summary?.tax ?? 0
186
+ : order?.summary?.subtotal ?? 0,
187
+ )}
196
188
  </div>
197
189
 
198
190
  </div>
199
191
 
200
192
  <div style="display: flex">
201
- ${
202
- order?.summary?.discount > 0
203
- ? order?.offer_type === 1
204
- ? `<div style="display:flex; justify-content: flex-start; font-size: 26px; width: 70%">
193
+ ${order?.summary?.discount > 0
194
+ ? order?.offer_type === 1
195
+ ? `<div style="display:flex; justify-content: flex-start; font-size: 26px; width: 70%">
205
196
  ${t('DISCOUNT', 'Discount')} (${verifyDecimals(
206
- order?.offer_rate,
207
- parsePrice,
208
- )}%)
197
+ order?.offer_rate,
198
+ parsePrice,
199
+ )}%)
209
200
  </div>`
210
- : `<div style="display:flex; justify-content: flex-start; font-size: 26px; width: 70%"> ${t(
211
- 'DISCOUNT',
212
- 'Discount',
213
- )}
201
+ : `<div style="display:flex; justify-content: flex-start; font-size: 26px; width: 70%"> ${t(
202
+ 'DISCOUNT',
203
+ 'Discount',
204
+ )}
214
205
  </div>`
215
- : ''
216
- }
217
- ${
218
- order?.summary?.discount > 0
219
- ? `<div style="display:flex; justify-content: flex-end; font-size: 26px; width: 30%">- ${parsePrice(
220
- order?.summary?.discount,
221
- )}
206
+ : ''
207
+ }
208
+ ${order?.summary?.discount > 0
209
+ ? `<div style="display:flex; justify-content: flex-end; font-size: 26px; width: 30%">- ${parsePrice(
210
+ order?.summary?.discount,
211
+ )}
222
212
  </div>`
223
- : ''
224
- }
213
+ : ''
214
+ }
225
215
  </div>
226
216
 
227
- ${
228
- order?.tax_type !== 1
229
- ? `<div style="font-size: 25px">
217
+ ${order?.tax_type !== 1
218
+ ? `<div style="font-size: 25px">
230
219
  ${t('TAX', 'Tax')}
231
220
  ${verifyDecimals(order?.summary?.tax_rate, parseNumber)}%
232
221
  ${parsePrice(order?.summary?.tax ?? 0)}
233
222
  ${t('TAX', 'Tax')}
234
223
  ${verifyDecimals(order?.summary?.tax_rate, parseNumber)}%
235
224
  </div>`
236
- : ''
237
- }
238
-
239
- ${
240
- order?.summary?.delivery_price > 0
241
- ? `<div style="font-size: 25px;"> ${t(
242
- 'DELIVERY_FEE',
243
- 'Delivery Fee',
244
- )}
225
+ : ''
226
+ }
227
+
228
+ ${order?.summary?.delivery_price > 0
229
+ ? `<div style="font-size: 25px;"> ${t(
230
+ 'DELIVERY_FEE',
231
+ 'Delivery Fee',
232
+ )}
245
233
  </div>`
246
- : ''
247
- }
234
+ : ''
235
+ }
248
236
 
249
237
  <div style="display: flex">
250
238
 
@@ -336,6 +324,25 @@ export const OrderSummary = ({ order, navigation, orderStatus }: any) => {
336
324
  },
337
325
  });
338
326
 
327
+ const handlePrint = async () => {
328
+ if (Platform.OS === 'ios') {
329
+ silentPrint()
330
+ return
331
+ }
332
+ const _permissions = await getPermissions()
333
+
334
+ if (!isGrantedPermissions) {
335
+ checkBluetoothPermission()
336
+ }
337
+ if (isGrantedPermissions) {
338
+ const response = await askBluetoothPermission();
339
+ const isGranted = _permissions.reduce((allPermissions: boolean, _permission: string) => allPermissions && response?.[_permission] === 'granted', true)
340
+ if (isGranted) {
341
+ printPDF()
342
+ }
343
+ }
344
+ };
345
+
339
346
  return (
340
347
  <>
341
348
  <Content>
@@ -364,17 +371,15 @@ export const OrderSummary = ({ order, navigation, orderStatus }: any) => {
364
371
  </OText>
365
372
 
366
373
  <OText style={{ marginBottom: 5 }}>
367
- {`${t('DELIVERY_TYPE', 'Delivery Type')}: ${
368
- deliveryStatus[order?.delivery_type]
369
- }`}
374
+ {`${t('DELIVERY_TYPE', 'Delivery Type')}: ${deliveryStatus[order?.delivery_type]
375
+ }`}
370
376
  </OText>
371
377
 
372
378
  <OText style={{ marginBottom: 5 }}>
373
- {`${t('DELIVERY_DATE', 'Delivery Date')}: ${
374
- order?.delivery_datetime_utc
375
- ? parseDate(order?.delivery_datetime_utc)
376
- : parseDate(order?.delivery_datetime, { utc: false })
377
- }`}
379
+ {`${t('DELIVERY_DATE', 'Delivery Date')}: ${order?.delivery_datetime_utc
380
+ ? parseDate(order?.delivery_datetime_utc)
381
+ : parseDate(order?.delivery_datetime, { utc: false })
382
+ }`}
378
383
  </OText>
379
384
 
380
385
  <OText style={{ marginBottom: 5 }}>{`${t('PAYMENT_METHOD')}: ${t(
@@ -399,11 +404,9 @@ export const OrderSummary = ({ order, navigation, orderStatus }: any) => {
399
404
  adjustsFontSizeToFit
400
405
  ellipsizeMode="tail"
401
406
  color={theme.colors.textGray}>
402
- {`${t('FULL_NAME', 'Full Name')}: ${order?.customer?.name} ${
403
- order?.customer?.middle_name
404
- } ${order?.customer?.lastname} ${
405
- order?.customer?.second_lastname
406
- }`}
407
+ {`${t('FULL_NAME', 'Full Name')}: ${order?.customer?.name} ${order?.customer?.middle_name
408
+ } ${order?.customer?.lastname} ${order?.customer?.second_lastname
409
+ }`}
407
410
  </OText>
408
411
 
409
412
  <OText
@@ -423,9 +426,8 @@ export const OrderSummary = ({ order, navigation, orderStatus }: any) => {
423
426
  adjustsFontSizeToFit
424
427
  ellipsizeMode="tail"
425
428
  color={theme.colors.textGray}>
426
- {`${t('MOBILE_PHONE', 'Mobile Phone')}: ${
427
- order?.customer?.cellphone
428
- }`}
429
+ {`${t('MOBILE_PHONE', 'Mobile Phone')}: ${order?.customer?.cellphone
430
+ }`}
429
431
  </OText>
430
432
 
431
433
  {!!order?.customer?.phone && (
@@ -436,9 +438,8 @@ export const OrderSummary = ({ order, navigation, orderStatus }: any) => {
436
438
  adjustsFontSizeToFit
437
439
  ellipsizeMode="tail"
438
440
  color={theme.colors.textGray}>
439
- {`${t('MOBILE_PHONE', 'Mobile Phone')}: ${
440
- order?.customer?.phone
441
- }`}
441
+ {`${t('MOBILE_PHONE', 'Mobile Phone')}: ${order?.customer?.phone
442
+ }`}
442
443
  </OText>
443
444
  )}
444
445
 
@@ -508,9 +509,8 @@ export const OrderSummary = ({ order, navigation, orderStatus }: any) => {
508
509
  numberOfLines={2}
509
510
  ellipsizeMode="tail"
510
511
  color={theme.colors.textGray}>
511
- {`${t('BUSINESS_PHONE', 'Business Phone')}: ${
512
- order?.business?.cellphone
513
- }`}
512
+ {`${t('BUSINESS_PHONE', 'Business Phone')}: ${order?.business?.cellphone
513
+ }`}
514
514
  </OText>
515
515
  )}
516
516
 
@@ -521,9 +521,8 @@ export const OrderSummary = ({ order, navigation, orderStatus }: any) => {
521
521
  numberOfLines={2}
522
522
  ellipsizeMode="tail"
523
523
  color={theme.colors.textGray}>
524
- {`${t('BUSINESS_PHONE', 'Business Phone')}: ${
525
- order?.business?.phone
526
- }`}
524
+ {`${t('BUSINESS_PHONE', 'Business Phone')}: ${order?.business?.phone
525
+ }`}
527
526
  </OText>
528
527
  )}
529
528
 
@@ -545,9 +544,8 @@ export const OrderSummary = ({ order, navigation, orderStatus }: any) => {
545
544
  adjustsFontSizeToFit
546
545
  ellipsizeMode="tail"
547
546
  color={theme.colors.textGray}>
548
- {`${t('SPECIAL_ADDRESS', 'Special Address')}: ${
549
- order?.business?.address_notes
550
- }`}
547
+ {`${t('SPECIAL_ADDRESS', 'Special Address')}: ${order?.business?.address_notes
548
+ }`}
551
549
  </OText>
552
550
  )}
553
551
  </OrderBusiness>
@@ -686,9 +684,7 @@ export const OrderSummary = ({ order, navigation, orderStatus }: any) => {
686
684
 
687
685
  <View style={{ marginBottom: 0 }}>
688
686
  <FloatingButton
689
- firstButtonClick={() =>
690
- Platform.OS === 'ios' ? silentPrint() : printPDF()
691
- }
687
+ firstButtonClick={() => handlePrint()}
692
688
  btnText={t('PRINT', 'Print')}
693
689
  color={theme.colors.green}
694
690
  widthButton={'100%'}
@@ -1,5 +1,5 @@
1
1
  import React, { useState, useEffect } from 'react';
2
- import { StyleSheet, View, TouchableOpacity, Linking, Pressable } from 'react-native';
2
+ import { StyleSheet, View, TouchableOpacity, Linking, Pressable, Image } from 'react-native';
3
3
  import FastImage from 'react-native-fast-image'
4
4
  import { useUtils, useOrder, useLanguage } from 'ordering-components/native';
5
5
  import { useTheme } from 'styled-components/native';
@@ -45,6 +45,7 @@ export const BusinessBasicInformation = (
45
45
  const [openBusinessReviews, setOpenBusinessReviews] = useState(false);
46
46
  const [businessInformationObtained, setBusinessInformationObtained] = useState(false)
47
47
  const [businessReviewsObtained, setBusinessReviewsObtainedbtained] = useState(false)
48
+ const [imageRealSize, setImageRealSize] = useState({ width: 16, height: 9, loading: true })
48
49
  const isChewLayout = theme?.header?.components?.layout?.type?.toLowerCase() === 'chew'
49
50
  const hideLogo = theme?.business_view?.components?.header?.components?.business?.components?.logo?.hidden
50
51
  const hideDeliveryFee = theme?.business_view?.components?.header?.components?.business?.components?.fee?.hidden
@@ -61,7 +62,7 @@ export const BusinessBasicInformation = (
61
62
  height: 150,
62
63
  },
63
64
  headerStyle: {
64
- height: isChewLayout ? 170 : 260,
65
+ aspectRatio: imageRealSize?.width / imageRealSize?.height
65
66
  },
66
67
  logoStyle: {
67
68
  width: 72,
@@ -195,6 +196,20 @@ export const BusinessBasicInformation = (
195
196
  }
196
197
  }, [businessState?.business])
197
198
 
199
+ useEffect(() => {
200
+ const bannerImage = header || businessState?.business?.header
201
+ if (!bannerImage) {
202
+ setImageRealSize({ width: 16, height: 9, loading: false })
203
+ return
204
+ }
205
+ Image.getSize(bannerImage, (width: number, height: number) => {
206
+ setImageRealSize({ width: width, height: height, loading: false });
207
+ }, (error: any) => {
208
+ setImageRealSize({ ...imageRealSize, loading: false });
209
+ console.log(error);
210
+ });
211
+ }, [header, businessState?.business?.header])
212
+
198
213
  const SocialIcons = () => {
199
214
  return (
200
215
  <>
@@ -283,7 +298,7 @@ export const BusinessBasicInformation = (
283
298
  ? styles.businesInfoheaderStyle
284
299
  : { ...styles.headerStyle, backgroundColor: theme.colors.backgroundGray }
285
300
  }
286
- {...(!loading && {
301
+ {...(!loading && !imageRealSize?.loading && {
287
302
  source: (header || businessState?.business?.header || typeof theme?.images?.dummies?.businessHeader === 'string') ? {
288
303
  uri: optimizeImage(businessState?.business?.header, 'h_250,c_limit') || header || theme?.images?.dummies?.businessHeader
289
304
  } : theme?.images?.dummies?.businessHeader
@@ -8,9 +8,6 @@ export const BusinessContainer = styled.View`
8
8
  export const BusinessHeader = styled.ImageBackground`
9
9
  width: 100%;
10
10
  position: relative;
11
- max-height: 258px;
12
- height: 258px;
13
- resize-mode: cover;
14
11
  `;
15
12
  export const BusinessLogo = styled.View`
16
13
  position: absolute;
@@ -95,6 +95,7 @@ export const BusinessListingSearchUI = (props: BusinessSearchParams) => {
95
95
  },
96
96
  searchInput: {
97
97
  fontSize: 12,
98
+ height: 44
98
99
  },
99
100
  productsContainer: {
100
101
  marginTop: 20
@@ -249,7 +250,7 @@ export const BusinessListingSearchUI = (props: BusinessSearchParams) => {
249
250
  display: 'flex',
250
251
  flexDirection: 'row',
251
252
  alignItems: 'center',
252
- paddingHorizontal: isChewLayout ? 20 : 40,
253
+ paddingHorizontal: hideBrowse && !isChewLayout ? 40 : 20,
253
254
  }}>
254
255
  {hideBrowse && !isChewLayout && (
255
256
  <OButton
@@ -275,6 +276,7 @@ export const BusinessListingSearchUI = (props: BusinessSearchParams) => {
275
276
  />
276
277
  )}
277
278
  <HeaderTitle ph={20} text={t('SEARCH', 'Search')} />
279
+ <AntDesignIcon name='filter' size={18} style={{ marginLeft: 'auto', marginTop: 55, paddingHorizontal: 20 }} onPress={() => handleOpenfilters()} />
278
280
  </View>
279
281
  <BContainer
280
282
  style={{ paddingHorizontal: isChewLayout ? 20 : 40 }}
@@ -287,7 +289,6 @@ export const BusinessListingSearchUI = (props: BusinessSearchParams) => {
287
289
  placeholder={t('SEARCH_BUSINESSES', 'Search Businesses')}
288
290
  onSearch={(val: string) => handleChangeTermValue(val)}
289
291
  value={termValue}
290
- iconCustomRight={<AntDesignIcon name='filter' size={16} style={{ bottom: 2 }} onPress={() => handleOpenfilters()} />}
291
292
  />
292
293
  </SearchWrapper>
293
294
  <OText size={12} lineHeight={20} color={theme.colors.textThird} mLeft={5}>
@@ -13,7 +13,7 @@ const UpsellingRedirectUI = (props: any) => {
13
13
  if (!upsellingProducts.loading) {
14
14
  if (upsellingProducts?.products?.length) {
15
15
  onRedirect &&
16
- onRedirect('UpsellingPage', props)
16
+ onRedirect('UpsellingPage', {...props, products: upsellingProducts?.products })
17
17
  } else {
18
18
  handleUpsellingPage && handleUpsellingPage()
19
19
  }
@@ -139,6 +139,7 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
139
139
  const [searchBarHeight, setSearchBarHeight] = useState(60)
140
140
  const [keyboardHeight, setKeyboardHeight] = useState(0);
141
141
  const [viewedCategory, setViewedCategory] = useState<any>(null)
142
+ const [showTitle, setShowTitle] = useState(false)
142
143
 
143
144
  const isCheckoutMultiBusinessEnabled: Boolean = configs?.checkout_multi_business_enabled?.value === '1'
144
145
  const isQuickAddProduct = configs?.add_product_with_one_click?.value === '1'
@@ -244,6 +245,8 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
244
245
 
245
246
  const handlePageScroll = useCallback(({ nativeEvent }: any) => {
246
247
  const scrollOffset = nativeEvent.contentOffset.y
248
+ setShowTitle(scrollOffset > 30)
249
+
247
250
  if (businessState?.business?.lazy_load_products_recommended) {
248
251
  const height = nativeEvent.contentSize.height
249
252
  const hasMore = !(categoryState.pagination.totalPages === categoryState.pagination.currentPage)
@@ -398,6 +401,17 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
398
401
  />
399
402
  </TopActions>
400
403
  )}
404
+ {showTitle && (
405
+ <OText
406
+ size={16}
407
+ style={{ flex: 1, textAlign: 'center' }}
408
+ weight={Platform.OS === 'ios' ? '600' : 'bold'}
409
+ numberOfLines={2}
410
+ ellipsizeMode='tail'
411
+ >
412
+ {business?.name}
413
+ </OText>
414
+ )}
401
415
  {!errorQuantityProducts && (
402
416
  <View style={{ ...styles.headerItem }}>
403
417
  <TouchableOpacity
@@ -1,8 +1,8 @@
1
1
  import React, { useState } from 'react';
2
2
  import { View } from 'react-native';
3
- import { useLanguage, useConfig } from 'ordering-components/native';
3
+ import { useLanguage, useConfig, useUtils } from 'ordering-components/native';
4
4
  import { useTheme } from 'styled-components/native';
5
- import { CCContainer, CCNotCarts, CCList, CheckoutAction } from './styles';
5
+ import { CCContainer, CCNotCarts, CCList, CheckoutAction, ChCartsTotal } from './styles';
6
6
 
7
7
  import { Cart } from '../Cart';
8
8
  import { OButton, OText } from '../shared';
@@ -19,12 +19,18 @@ export const CartContent = (props: any) => {
19
19
  const theme = useTheme();
20
20
  const [, t] = useLanguage()
21
21
  const [{ configs }] = useConfig()
22
+ const [{ parsePrice }] = useUtils();
22
23
  const [isCartsLoading, setIsCartsLoading] = useState(false)
23
24
 
24
25
  const isChewLayout = theme?.header?.components?.layout?.type === 'chew'
25
26
  const isMultiCheckout = configs?.checkout_multi_business_enabled?.value === '1'
26
27
  const cartsAvailable: any = Object.values(carts)?.filter((cart: any) => cart?.valid && cart?.status !== 2)
27
28
 
29
+ const totalCartsPrice = cartsAvailable?.length && cartsAvailable.reduce((total: any, cart: any) => { return total + cart?.total }, 0)
30
+ const totalCartsFee = cartsAvailable?.length && cartsAvailable
31
+ ?.filter((cart: any) => cart?.status !== 1 && cart?.valid && cart?.products?.length)
32
+ ?.reduce((total: any, cart: any) => { return total + (cart?.delivery_price_with_discount) }, 0)
33
+
28
34
  const handleCheckoutRedirect = () => {
29
35
  if (cartsAvailable.length === 1) {
30
36
  onNavigationRedirect('CheckoutNavigator', {
@@ -80,6 +86,9 @@ export const CartContent = (props: any) => {
80
86
  isMultiCheckout={isMultiCheckout}
81
87
  hideUpselling
82
88
  businessConfigs={cart?.business?.configs}
89
+ hideCouponInput={configs?.multi_business_checkout_coupon_input_style?.value === 'group'}
90
+ hideDeliveryFee={configs?.multi_business_checkout_show_combined_delivery_fee?.value === '1'}
91
+ hideDriverTip={configs?.multi_business_checkout_show_combined_driver_tip?.value === '1'}
83
92
  />
84
93
  <View style={{ height: 8, backgroundColor: theme.colors.backgroundGray100, marginHorizontal: -40, marginTop: 20 }} />
85
94
  </>
@@ -87,18 +96,51 @@ export const CartContent = (props: any) => {
87
96
  </CCList>
88
97
  ))}
89
98
  {isMultiCheckout && (
90
- <CheckoutAction style={{ marginTop: 0 }}>
91
- <OButton
92
- text={t('CHECKOUT', 'Checkout')}
93
- bgColor={!cartsAvailable.length ? theme.colors.secundary : theme.colors.primary}
94
- isDisabled={!cartsAvailable.length}
95
- borderColor={theme.colors.primary}
96
- imgRightSrc={null}
97
- textStyle={{ color: 'white', textAlign: 'center', flex: 1 }}
98
- onClick={() => handleCheckoutRedirect()}
99
- style={{ width: '100%', flexDirection: 'row', justifyContent: 'center', borderRadius: 7.6, shadowOpacity: 0 }}
100
- />
101
- </CheckoutAction>
99
+ <>
100
+ {!!cartsAvailable.length && (
101
+ <ChCartsTotal>
102
+ {!!totalCartsFee && configs?.multi_business_checkout_show_combined_delivery_fee?.value === '1' && (
103
+ <View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>
104
+ <OText size={14} lineHeight={24} color={theme.colors.textNormal} weight={'400'}>
105
+ {t('TOTAL_DELIVERY_FEE', 'Total delivery fee')}
106
+ </OText>
107
+ <OText size={14} lineHeight={24} color={theme.colors.textNormal} weight={'400'}>
108
+ {parsePrice(totalCartsFee)}
109
+ </OText>
110
+ </View>
111
+ )}
112
+ {cartsAvailable.reduce((sum: any, cart: any) => sum + cart?.driver_tip, 0) > 0 &&
113
+ configs?.multi_business_checkout_show_combined_driver_tip?.value === '1' && (
114
+ <View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>
115
+ <OText size={14} lineHeight={24} color={theme.colors.textNormal} weight={'400'}>
116
+ {t('DRIVER_TIP', 'Driver tip')}
117
+ </OText>
118
+ <OText size={14} lineHeight={24} color={theme.colors.textNormal} weight={'400'}>
119
+ {parsePrice(cartsAvailable.reduce((sum: any, cart: any) => sum + cart?.driver_tip, 0))}
120
+ </OText>
121
+ </View>
122
+ )}
123
+ <View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>
124
+ <OText size={16} lineHeight={24} color={theme.colors.textNormal} weight={'500'}>
125
+ {t('TOTAL_FOR_ALL_CARTS', 'Total for all Carts')}
126
+ </OText>
127
+ <OText size={16} lineHeight={24} color={theme.colors.textNormal} weight={'500'}>{parsePrice(totalCartsPrice)}</OText>
128
+ </View>
129
+ </ChCartsTotal>
130
+ )}
131
+ <CheckoutAction style={{ marginTop: 0 }}>
132
+ <OButton
133
+ text={t('CHECKOUT', 'Checkout')}
134
+ bgColor={!cartsAvailable.length ? theme.colors.secundary : theme.colors.primary}
135
+ isDisabled={!cartsAvailable.length}
136
+ borderColor={theme.colors.primary}
137
+ imgRightSrc={null}
138
+ textStyle={{ color: 'white', textAlign: 'center', flex: 1 }}
139
+ onClick={() => handleCheckoutRedirect()}
140
+ style={{ width: '100%', flexDirection: 'row', justifyContent: 'center', borderRadius: 7.6, shadowOpacity: 0 }}
141
+ />
142
+ </CheckoutAction>
143
+ </>
102
144
  )}
103
145
  </>
104
146
  )}
@@ -23,3 +23,7 @@ export const CheckoutAction = styled.View`
23
23
  margin-top: 10px;
24
24
  margin-bottom: 10px;
25
25
  `
26
+
27
+ export const ChCartsTotal = styled.View`
28
+ margin-bottom: 16px;
29
+ `
@@ -115,11 +115,12 @@ const MultiCheckoutUI = (props: any) => {
115
115
  }
116
116
  }
117
117
 
118
- const loyaltyRewardValue = creditPointPlanOnBusiness?.accumulation_rate
119
- ? Math.round(
120
- openCarts.reduce((sum: any, cart: any) => sum + cart?.subtotal + getIncludedTaxes(cart), 0) /
121
- creditPointPlanOnBusiness?.accumulation_rate
122
- ) : 0
118
+ const subtotalAmount = openCarts.reduce((sum: any, cart: any) => sum + (cart?.subtotal + getIncludedTaxes(cart)), 0) *
119
+ creditPointPlanOnBusiness?.accumulation_rate
120
+
121
+ const loyaltyRewardValue = (creditPointPlanOnBusiness?.accumulation_rate
122
+ ? (Math.trunc(subtotalAmount * 100) / 100).toFixed(configs.format_number_decimal_length?.value ?? 2)
123
+ : 0)
123
124
 
124
125
  const handleMomentClick = () => {
125
126
  if (isPreOrder) {
@@ -75,7 +75,7 @@ const OrderSummaryUI = (props: any) => {
75
75
 
76
76
  const getIncludedTaxes = () => {
77
77
  if (cart?.taxes === null || !cart?.taxes) {
78
- return cart.business.tax_type === 1 ? cart?.tax : 0
78
+ return cart?.business?.tax_type === 1 ? cart?.tax : 0
79
79
  } else {
80
80
  return cart?.taxes.reduce((taxIncluded: number, tax: any) => {
81
81
  return taxIncluded + (tax.type === 1 ? tax.summary?.tax : 0)
@@ -83,7 +83,9 @@ const OrderSummaryUI = (props: any) => {
83
83
  }
84
84
  }
85
85
 
86
- const loyaltyRewardValue = Math.round((cart?.subtotal + getIncludedTaxes()) / loyaltyRewardRate)
86
+ const loyaltyRewardValue = ((
87
+ Math.trunc(((cart?.subtotal + getIncludedTaxes()) * loyaltyRewardRate) * 100) / 100
88
+ ).toFixed(configs.format_number_decimal_length?.value ?? 2), 10)
87
89
 
88
90
  const handleDeleteClick = (product: any) => {
89
91
  removeProduct(product, cart)
@@ -205,6 +205,7 @@ export const ProductOptionsUI = (props: any) => {
205
205
  const [isScrollAvailable, setIsScrollAvailable] = useState(null)
206
206
  const [editionsLayoutY, setEditionsLayoutY] = useState(null)
207
207
  const [viewedProduct, setViewedProduct] = useState<any>(null)
208
+ const [showTitle, setShowTitle] = useState(false)
208
209
 
209
210
  const guestCheckoutEnabled = configs?.guest_checkout_enabled?.value === '1'
210
211
  const orderTypeEnabled = !orderTypeList[orderState?.options?.type - 1] || configs?.allowed_order_types_guest_checkout?.value?.includes(orderTypeList[orderState?.options?.type - 1])
@@ -362,7 +363,7 @@ export const ProductOptionsUI = (props: any) => {
362
363
  );
363
364
 
364
365
  const handleScroll = ({ nativeEvent: { contentOffset, layoutMeasurement } }: any) => {
365
-
366
+ setShowTitle(contentOffset.y > 30)
366
367
  const _topOption = Object.keys(optionLayout).find(((option: any) => Math.abs(contentOffset?.y - layoutMeasurement?.height - optionLayout[option]?.y) < 20))
367
368
  if (_topOption) {
368
369
  const _topOptionId = Number(_topOption.replace('id:', ''))
@@ -526,12 +527,24 @@ export const ProductOptionsUI = (props: any) => {
526
527
  return (
527
528
  <SafeAreaView style={{ flex: 1 }}>
528
529
  <View style={styles.wrapperNavbar}>
529
- <NavBar
530
- onActionLeft={() => handleGoBack()}
531
- showCall={false}
532
- btnStyle={{ paddingLeft: 0 }}
533
- paddingTop={4}
534
- />
530
+ <TopHeader>
531
+ <>
532
+ <TopActions onPress={() => handleGoBack()}>
533
+ <OIcon src={theme.images.general.arrow_left} color={theme.colors.textNormal} />
534
+ </TopActions>
535
+ {showTitle && (
536
+ <OText
537
+ size={16}
538
+ style={{ flex: 1, textAlign: 'center' }}
539
+ weight={Platform.OS === 'ios' ? '600' : 'bold'}
540
+ numberOfLines={2}
541
+ ellipsizeMode='tail'
542
+ >
543
+ {product?.name}
544
+ </OText>
545
+ )}
546
+ </>
547
+ </TopHeader>
535
548
  </View>
536
549
  {!error && (
537
550
  <ScrollView
@@ -1,4 +1,4 @@
1
- import React, { useState } from 'react';
1
+ import React, { useState, useEffect } from 'react';
2
2
  import {
3
3
  SingleOrderCard as SingleOrderCardController,
4
4
  useUtils,
@@ -11,6 +11,7 @@ import { OIcon, OText, OButton } from '../shared';
11
11
  import { SingleOrderCardParams } from '../../types';
12
12
  import { OAlert } from '../../../../../src/components/shared'
13
13
  import { OrderEta } from '../OrderDetails/OrderEta'
14
+ import { useIsFocused } from '@react-navigation/native';
14
15
  import {
15
16
  InnerContainer,
16
17
  Logo,
@@ -44,6 +45,7 @@ const SingleOrderCardUI = (props: SingleOrderCardParams) => {
44
45
  const [, t] = useLanguage();
45
46
  const [{ carts }] = useOrder()
46
47
  const theme = useTheme();
48
+ const isFocused = useIsFocused();
47
49
 
48
50
  const [reorderSelected, setReorderSelected] = useState<number | null>(null);
49
51
  const [confirm, setConfirm] = useState<any>({ open: false, content: null, handleOnAccept: null, id: null, title: null })
@@ -198,6 +200,10 @@ const SingleOrderCardUI = (props: SingleOrderCardParams) => {
198
200
  const hideFavorite = theme?.orders?.components?.favorite?.hidden
199
201
  const hideOrderStatus = theme?.orders?.components?.order_status?.hidden
200
202
 
203
+ useEffect(() => {
204
+ if (isFocused) setReorderSelected(null)
205
+ }, [isFocused])
206
+
201
207
  return (
202
208
  <>
203
209
  <CardAnimation
@@ -288,7 +288,11 @@ const ProfileUI = (props: ProfileParams) => {
288
288
  showCall={false}
289
289
  btnStyle={{ paddingLeft: 0 }}
290
290
  />
291
- <KeyboardAvoidingView behavior={Platform.OS == 'ios' ? 'padding' : 'height'} enabled style={{ flex: 1, flexDirection: 'column', justifyContent: 'center' }}>
291
+ <KeyboardAvoidingView
292
+ behavior={Platform.OS == 'ios' ? 'padding' : 'height'}
293
+ enabled={Platform.OS === 'ios' ? true : false}
294
+ style={{ flex: 1, flexDirection: 'column', justifyContent: 'center' }}
295
+ >
292
296
  <CenterView>
293
297
  <View style={styles.photo}>
294
298
  {user?.photo ? (
@@ -63,12 +63,12 @@ export const WalletTransactions = (props: any) => {
63
63
  (transactionsList?.error ||
64
64
  !transactionsList.list?.[`wallet:${currentWalletSelected?.id}`]?.length) &&
65
65
  (
66
- <NotFoundSource
67
- content={transactionsList?.error
66
+ <OText color={theme.colors.disabled} size={16} style={{ textAlign: 'center' }}>
67
+ {transactionsList?.error
68
68
  ? t('ERROR_NOT_FOUND_TRANSACTIONS', 'Sorry, an error has occurred')
69
69
  : t('NOT_FOUND_TRANSACTIONS', 'No transactions to show at this time.')
70
70
  }
71
- />
71
+ </OText>
72
72
  )}
73
73
  </View>
74
74
  </Container>
@@ -213,9 +213,9 @@ const WalletsUI = (props: any) => {
213
213
  <LoyaltyContent>
214
214
  <LoyaltyWrapp>
215
215
  <OText size={20}>
216
- {`${t('LOYALTY_LEVEL_TITLE', 'Your level is')}:`}
216
+ {`${t('LOYALTY_LEVEL_TITLE', 'Your level is')}`}
217
217
  </OText>
218
- {/* {loyaltyLevel.image ? (
218
+ {loyaltyLevel.image ? (
219
219
  <FastImage
220
220
  style={styles.logoStyle}
221
221
  source={{
@@ -230,7 +230,7 @@ const WalletsUI = (props: any) => {
230
230
  source={theme.images.dummies.loyaltyLevel}
231
231
  resizeMode='contain'
232
232
  />
233
- )} */}
233
+ )}
234
234
  <OText
235
235
  size={22}
236
236
  weight='bold'