ordering-ui-react-native 0.17.92 → 0.17.93

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.17.92",
3
+ "version": "0.17.93",
4
4
  "description": "Reusable components made in react native",
5
5
  "main": "src/index.tsx",
6
6
  "author": "ordering.inc",
@@ -4,14 +4,14 @@ import { IOScrollView } from 'react-native-intersection-observer'
4
4
  import { useSafeAreaInsets } from 'react-native-safe-area-context'
5
5
  import { useTheme } from 'styled-components/native';
6
6
  import {
7
- BusinessAndProductList,
8
- useLanguage,
9
- useOrder,
10
- useSession,
11
- useUtils,
12
- ToastType,
13
- useToast,
14
- useConfig
7
+ BusinessAndProductList,
8
+ useLanguage,
9
+ useOrder,
10
+ useSession,
11
+ useUtils,
12
+ ToastType,
13
+ useToast,
14
+ useConfig
15
15
  } from 'ordering-components/native'
16
16
  import { Fade, Placeholder, PlaceholderLine } from 'rn-placeholder';
17
17
  import { OButton, OIcon, OModal, OText } from '../shared'
@@ -26,14 +26,14 @@ import IconAntDesign from 'react-native-vector-icons/AntDesign';
26
26
  import { useIsFocused } from '@react-navigation/native';
27
27
 
28
28
  import {
29
- TopHeader,
30
- WrapSearchBar,
31
- WrapContent,
32
- FiltProductsContainer,
33
- BackgroundGray,
34
- ProfessionalFilterWrapper,
35
- NearBusiness,
36
- TopActions
29
+ TopHeader,
30
+ WrapSearchBar,
31
+ WrapContent,
32
+ FiltProductsContainer,
33
+ BackgroundGray,
34
+ ProfessionalFilterWrapper,
35
+ NearBusiness,
36
+ TopActions
37
37
  } from './styles'
38
38
  import { FloatingButton } from '../FloatingButton'
39
39
  import { UpsellingRedirect } from './UpsellingRedirect'
@@ -46,148 +46,148 @@ import { PageBanner } from '../PageBanner'
46
46
  const PIXELS_TO_SCROLL = 2000
47
47
 
48
48
  const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
49
- const {
50
- navigation,
51
- errors,
52
- businessState,
53
- categoryState,
54
- handleChangeSearch,
55
- categorySelected,
56
- searchValue,
57
- handleChangeCategory,
58
- handleSearchRedirect,
59
- featuredProducts,
60
- errorQuantityProducts,
61
- header,
62
- logo,
63
- alertState,
64
- setAlertState,
65
- multiRemoveProducts,
66
- getNextProducts,
67
- handleUpdateProducts,
68
- professionalSelected,
69
- handleUpdateProfessionals,
70
- handleChangeProfessionalSelected,
71
- onBusinessClick
72
- } = props
49
+ const {
50
+ navigation,
51
+ errors,
52
+ businessState,
53
+ categoryState,
54
+ handleChangeSearch,
55
+ categorySelected,
56
+ searchValue,
57
+ handleChangeCategory,
58
+ handleSearchRedirect,
59
+ featuredProducts,
60
+ errorQuantityProducts,
61
+ header,
62
+ logo,
63
+ alertState,
64
+ setAlertState,
65
+ multiRemoveProducts,
66
+ getNextProducts,
67
+ handleUpdateProducts,
68
+ professionalSelected,
69
+ handleUpdateProfessionals,
70
+ handleChangeProfessionalSelected,
71
+ onBusinessClick
72
+ } = props
73
73
 
74
- const insets = useSafeAreaInsets()
75
- const theme = useTheme();
76
- const [, t] = useLanguage()
77
- const [{ auth }] = useSession()
78
- const [orderState, { addProduct, updateProduct }] = useOrder()
79
- const [{ parsePrice }] = useUtils()
80
- const [, { showToast }] = useToast()
81
- const [{ configs }] = useConfig()
82
- const isFocused = useIsFocused();
83
- const isPreOrder = configs?.preorder_status_enabled?.value === '1'
74
+ const insets = useSafeAreaInsets()
75
+ const theme = useTheme();
76
+ const [, t] = useLanguage()
77
+ const [{ auth }] = useSession()
78
+ const [orderState, { addProduct, updateProduct }] = useOrder()
79
+ const [{ parsePrice }] = useUtils()
80
+ const [, { showToast }] = useToast()
81
+ const [{ configs }] = useConfig()
82
+ const isFocused = useIsFocused();
83
+ const isPreOrder = configs?.preorder_status_enabled?.value === '1'
84
84
 
85
- const isChewLayout = theme?.header?.components?.layout?.type?.toLowerCase() === 'chew'
86
- const showLogo = !theme?.business_view?.components?.header?.components?.business?.components?.logo?.hidden
87
- const hideBusinessNearCity = theme?.business_view?.components?.near_business?.hidden ?? true
88
- const backgroundColor = theme?.business_view?.components?.style?.backgroundColor
89
- const styles = StyleSheet.create({
90
- mainContainer: {
91
- flex: 1
92
- },
93
- BackIcon: {
94
- paddingRight: 20,
95
- },
96
- headerItem: {
97
- flexDirection: 'row',
98
- alignItems: 'center',
99
- marginVertical: 2,
100
- marginHorizontal: 20,
101
- },
102
- btnBackArrow: {
103
- borderWidth: 0,
104
- backgroundColor: theme.colors.clear,
105
- shadowColor: theme.colors.clear,
106
- padding: 40,
107
- },
108
- searchIcon: {
109
- borderWidth: 0,
110
- padding: 15,
111
- justifyContent: 'center',
112
- shadowColor: theme.colors.clear,
113
- },
114
- businessSkeleton: {
115
- borderRadius: 8,
116
- marginRight: 20,
117
- width: 56,
118
- height: 56
119
- },
120
- })
85
+ const isChewLayout = theme?.header?.components?.layout?.type === 'chew'
86
+ const showLogo = !theme?.business_view?.components?.header?.components?.business?.components?.logo?.hidden
87
+ const hideBusinessNearCity = theme?.business_view?.components?.near_business?.hidden ?? true
88
+ const backgroundColor = theme?.business_view?.components?.style?.backgroundColor
89
+ const styles = StyleSheet.create({
90
+ mainContainer: {
91
+ flex: 1
92
+ },
93
+ BackIcon: {
94
+ paddingRight: 20,
95
+ },
96
+ headerItem: {
97
+ flexDirection: 'row',
98
+ alignItems: 'center',
99
+ marginVertical: 2,
100
+ marginHorizontal: 20,
101
+ },
102
+ btnBackArrow: {
103
+ borderWidth: 0,
104
+ backgroundColor: theme.colors.clear,
105
+ shadowColor: theme.colors.clear,
106
+ padding: 40,
107
+ },
108
+ searchIcon: {
109
+ borderWidth: 0,
110
+ padding: 15,
111
+ justifyContent: 'center',
112
+ shadowColor: theme.colors.clear,
113
+ },
114
+ businessSkeleton: {
115
+ borderRadius: 8,
116
+ marginRight: 20,
117
+ width: 56,
118
+ height: 56
119
+ },
120
+ })
121
121
 
122
- const { business, loading, error } = businessState
123
- const [openBusinessInformation, setOpenBusinessInformation] = useState(false)
124
- const [isOpenSearchBar, setIsOpenSearchBar] = useState(false)
125
- const [openUpselling, setOpenUpselling] = useState(false)
126
- const [canOpenUpselling, setCanOpenUpselling] = useState(false)
127
- const scrollViewRef = useRef<any>(null)
128
- const [categoriesLayout, setCategoriesLayout] = useState<any>({})
129
- const [productListLayout, setProductListLayout] = useState<any>(null)
130
- const [isCategoryClicked, setCategoryClicked] = useState(false)
131
- const [subcategoriesSelected, setSubcategoriesSelected] = useState([])
132
- const [openService, setOpenService] = useState(false)
133
- const [currentProduct, setCurrentProduct] = useState(null)
134
- const [searchBarHeight, setSearchBarHeight] = useState(60)
122
+ const { business, loading, error } = businessState
123
+ const [openBusinessInformation, setOpenBusinessInformation] = useState(false)
124
+ const [isOpenSearchBar, setIsOpenSearchBar] = useState(false)
125
+ const [openUpselling, setOpenUpselling] = useState(false)
126
+ const [canOpenUpselling, setCanOpenUpselling] = useState(false)
127
+ const scrollViewRef = useRef<any>(null)
128
+ const [categoriesLayout, setCategoriesLayout] = useState<any>({})
129
+ const [productListLayout, setProductListLayout] = useState<any>(null)
130
+ const [isCategoryClicked, setCategoryClicked] = useState(false)
131
+ const [subcategoriesSelected, setSubcategoriesSelected] = useState([])
132
+ const [openService, setOpenService] = useState(false)
133
+ const [currentProduct, setCurrentProduct] = useState(null)
134
+ const [searchBarHeight, setSearchBarHeight] = useState(60)
135
135
 
136
- const isCheckoutMultiBusinessEnabled: Boolean = configs?.checkout_multi_business_enabled?.value === '1'
137
- const isQuickAddProduct = configs?.add_product_with_one_click?.value === '1'
138
- const openCarts = (Object.values(orderState?.carts)?.filter((cart: any) => cart?.products && cart?.products?.length && cart?.status !== 2 && cart?.valid_schedule && cart?.valid_products && cart?.valid_address && cart?.valid_maximum && cart?.valid_minimum && !cart?.wallets) || null) || []
136
+ const isCheckoutMultiBusinessEnabled: Boolean = configs?.checkout_multi_business_enabled?.value === '1'
137
+ const isQuickAddProduct = configs?.add_product_with_one_click?.value === '1'
138
+ const openCarts = (Object.values(orderState?.carts)?.filter((cart: any) => cart?.products && cart?.products?.length && cart?.status !== 2 && cart?.valid_schedule && cart?.valid_products && cart?.valid_address && cart?.valid_maximum && cart?.valid_minimum && !cart?.wallets) || null) || []
139
139
 
140
- const currentCart: any = Object.values(orderState.carts).find((cart: any) => cart?.business?.slug === business?.slug) ?? {}
141
- const isOpenFiltProducts = isOpenSearchBar && !!searchValue
142
- const filtProductsHeight = Platform.OS === 'ios' ? 165 : 100
143
- const onRedirect = (route: string, params?: any) => {
144
- navigation.navigate(route, params)
145
- }
146
- const onProductClick = async (product: any) => {
147
- if (product.extras.length === 0 && !product.inventoried && auth && isQuickAddProduct) {
148
- const isProductAddedToCart = currentCart?.products?.find((Cproduct: any) => Cproduct.id === product.id)
149
- const productQuantity = isProductAddedToCart?.quantity
150
- const addCurrentProduct = {
151
- ...product,
152
- quantity: 1
153
- }
154
- const updateCurrentProduct = {
155
- id: product.id,
156
- code: isProductAddedToCart?.code,
157
- quantity: productQuantity + 1
158
- }
159
- Vibration.vibrate()
160
- const cartData = currentCart?.business_id ? currentCart : { business_id: business.id }
161
- if (isProductAddedToCart) {
162
- await updateProduct(updateCurrentProduct, cartData, isQuickAddProduct)
163
- } else {
164
- await addProduct(addCurrentProduct, cartData, isQuickAddProduct)
165
- }
166
- } else {
167
- const productAddedToCartLength = currentCart?.products?.reduce((productsLength: number, Cproduct: any) => { return productsLength + (Cproduct?.id === product?.id ? Cproduct?.quantity : 0) }, 0) || 0
168
- if (product?.type === 'service' && business?.professionals?.length > 0) {
169
- setCurrentProduct(product)
170
- setOpenService(true)
171
- return
172
- }
173
- onRedirect('ProductDetails', {
174
- product: product,
175
- businessSlug: business.slug,
176
- businessId: business.id,
177
- productAddedToCartLength
178
- })
179
- }
180
- }
140
+ const currentCart: any = Object.values(orderState.carts).find((cart: any) => cart?.business?.slug === business?.slug) ?? {}
141
+ const isOpenFiltProducts = isOpenSearchBar && !!searchValue
142
+ const filtProductsHeight = Platform.OS === 'ios' ? 165 : 100
143
+ const onRedirect = (route: string, params?: any) => {
144
+ navigation.navigate(route, params)
145
+ }
146
+ const onProductClick = async (product: any) => {
147
+ if (product.extras.length === 0 && !product.inventoried && auth && isQuickAddProduct) {
148
+ const isProductAddedToCart = currentCart?.products?.find((Cproduct: any) => Cproduct.id === product.id)
149
+ const productQuantity = isProductAddedToCart?.quantity
150
+ const addCurrentProduct = {
151
+ ...product,
152
+ quantity: 1
153
+ }
154
+ const updateCurrentProduct = {
155
+ id: product.id,
156
+ code: isProductAddedToCart?.code,
157
+ quantity: productQuantity + 1
158
+ }
159
+ Vibration.vibrate()
160
+ const cartData = currentCart?.business_id ? currentCart : { business_id: business.id }
161
+ if (isProductAddedToCart) {
162
+ await updateProduct(updateCurrentProduct, cartData, isQuickAddProduct)
163
+ } else {
164
+ await addProduct(addCurrentProduct, cartData, isQuickAddProduct)
165
+ }
166
+ } else {
167
+ const productAddedToCartLength = currentCart?.products?.reduce((productsLength: number, Cproduct: any) => { return productsLength + (Cproduct?.id === product?.id ? Cproduct?.quantity : 0) }, 0) || 0
168
+ if (product?.type === 'service' && business?.professionals?.length > 0) {
169
+ setCurrentProduct(product)
170
+ setOpenService(true)
171
+ return
172
+ }
173
+ onRedirect('ProductDetails', {
174
+ product: product,
175
+ businessSlug: business.slug,
176
+ businessId: business.id,
177
+ productAddedToCartLength
178
+ })
179
+ }
180
+ }
181
181
 
182
- const handleCancel = () => {
183
- setIsOpenSearchBar(false)
184
- handleChangeSearch('')
185
- }
182
+ const handleCancel = () => {
183
+ setIsOpenSearchBar(false)
184
+ handleChangeSearch('')
185
+ }
186
186
 
187
- const handleUpsellingPage = () => {
188
- setOpenUpselling(false)
189
- setCanOpenUpselling(false)
190
- const cartsAvailable: any = Object.values(orderState?.carts)?.filter((cart: any) => cart?.valid && cart?.status !== 2)
187
+ const handleUpsellingPage = () => {
188
+ setOpenUpselling(false)
189
+ setCanOpenUpselling(false)
190
+ const cartsAvailable: any = Object.values(orderState?.carts)?.filter((cart: any) => cart?.valid && cart?.status !== 2)
191
191
  if (cartsAvailable.length === 1) {
192
192
  props.onNavigationRedirect('CheckoutNavigator', {
193
193
  screen: 'CheckoutPage',
@@ -208,7 +208,10 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
208
208
  (Object.keys(groupKeys).length === 1 && Object.keys(groupKeys)[0] === 'null') ||
209
209
  Object.keys(groupKeys).length > 1
210
210
  ) {
211
- props.onNavigationRedirect('CheckoutNavigator', { screen: 'MultiCart' })
211
+ props.onNavigationRedirect('CheckoutNavigator', {
212
+ screen: 'MultiCheckout',
213
+ checkCarts: true
214
+ })
212
215
  } else {
213
216
  props.onNavigationRedirect('CheckoutNavigator', {
214
217
  screen: 'MultiCheckout',
@@ -216,396 +219,396 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
216
219
  })
217
220
  }
218
221
  }
219
- }
222
+ }
220
223
 
221
- const handleCloseUpsellingPage = () => {
222
- setOpenUpselling(false)
223
- }
224
+ const handleCloseUpsellingPage = () => {
225
+ setOpenUpselling(false)
226
+ }
224
227
 
225
- const [selectedCategoryId, setSelectedCategoryId] = useState<any>(null)
228
+ const [selectedCategoryId, setSelectedCategoryId] = useState<any>(null)
226
229
 
227
- const handlePageScroll = useCallback(({ nativeEvent }: any) => {
228
- const scrollOffset = nativeEvent.contentOffset.y
229
- if (businessState?.business?.lazy_load_products_recommended) {
230
- const height = nativeEvent.contentSize.height
231
- const hasMore = !(categoryState.pagination.totalPages === categoryState.pagination.currentPage)
232
- if (scrollOffset + PIXELS_TO_SCROLL > height && !loading && hasMore && getNextProducts) {
233
- getNextProducts()
234
- showToast(ToastType.Info, t('LOADING_MORE_PRODUCTS', 'Loading more products'))
235
- }
236
- } else {
237
- if (!scrollOffset || !categoriesLayout || !productListLayout || isCategoryClicked) return
230
+ const handlePageScroll = useCallback(({ nativeEvent }: any) => {
231
+ const scrollOffset = nativeEvent.contentOffset.y
232
+ if (businessState?.business?.lazy_load_products_recommended) {
233
+ const height = nativeEvent.contentSize.height
234
+ const hasMore = !(categoryState.pagination.totalPages === categoryState.pagination.currentPage)
235
+ if (scrollOffset + PIXELS_TO_SCROLL > height && !loading && hasMore && getNextProducts) {
236
+ getNextProducts()
237
+ showToast(ToastType.Info, t('LOADING_MORE_PRODUCTS', 'Loading more products'))
238
+ }
239
+ } else {
240
+ if (!scrollOffset || !categoriesLayout || !productListLayout || isCategoryClicked) return
238
241
 
239
- for (const key in categoriesLayout) {
240
- const categoryOffset = categoriesLayout[key].y + productListLayout?.y - 70
241
- if (scrollOffset < 10) {
242
- setSelectedCategoryId('cat_all');
243
- return;
244
- }
245
- if (categoryOffset - 50 <= scrollOffset && scrollOffset <= categoryOffset + 50) {
246
- if (selectedCategoryId !== key) {
247
- setSelectedCategoryId(key)
248
- }
249
- }
250
- }
251
- }
252
- }, [isCategoryClicked, selectedCategoryId, productListLayout])
242
+ for (const key in categoriesLayout) {
243
+ const categoryOffset = categoriesLayout[key].y + productListLayout?.y - 70
244
+ if (scrollOffset < 10) {
245
+ setSelectedCategoryId('cat_all');
246
+ return;
247
+ }
248
+ if (categoryOffset - 50 <= scrollOffset && scrollOffset <= categoryOffset + 50) {
249
+ if (selectedCategoryId !== key) {
250
+ setSelectedCategoryId(key)
251
+ }
252
+ }
253
+ }
254
+ }
255
+ }, [isCategoryClicked, selectedCategoryId, productListLayout])
253
256
 
254
- const handleTouchDrag = useCallback(() => {
255
- setCategoryClicked(false);
256
- }, []);
257
+ const handleTouchDrag = useCallback(() => {
258
+ setCategoryClicked(false);
259
+ }, []);
257
260
 
258
- const handleBackNavigation = () => {
259
- navigation?.canGoBack() ? navigation.goBack() : navigation.navigate('BottomTab')
260
- }
261
+ const handleBackNavigation = () => {
262
+ navigation?.canGoBack() ? navigation.goBack() : navigation.navigate('BottomTab')
263
+ }
261
264
 
262
- const adjustBusiness = async (adjustBusinessId: number) => {
263
- const _carts = orderState?.carts?.[adjustBusinessId]
264
- const products = _carts?.products
265
- const unavailableProducts = products.filter((product: any) => product.valid !== true)
266
- const alreadyRemoved = await _retrieveStoreData('already-removed')
267
- _removeStoreData('already-removed')
268
- if (unavailableProducts.length > 0) {
269
- multiRemoveProducts && await multiRemoveProducts(unavailableProducts, _carts)
270
- return
271
- }
265
+ const adjustBusiness = async (adjustBusinessId: number) => {
266
+ const _carts = orderState?.carts?.[adjustBusinessId]
267
+ const products = _carts?.products
268
+ const unavailableProducts = products.filter((product: any) => product.valid !== true)
269
+ const alreadyRemoved = await _retrieveStoreData('already-removed')
270
+ _removeStoreData('already-removed')
271
+ if (unavailableProducts.length > 0) {
272
+ multiRemoveProducts && await multiRemoveProducts(unavailableProducts, _carts)
273
+ return
274
+ }
272
275
 
273
- if (alreadyRemoved === 'removed') {
274
- setAlertState({ open: true, content: [t('NOT_AVAILABLE_PRODUCT', 'This product is not available.')] })
275
- }
276
- }
276
+ if (alreadyRemoved === 'removed') {
277
+ setAlertState({ open: true, content: [t('NOT_AVAILABLE_PRODUCT', 'This product is not available.')] })
278
+ }
279
+ }
277
280
 
278
- const removeCartByReOrder = async () => {
279
- const adjustBusinessId = await _retrieveStoreData('adjust-cart-products')
280
- if (currentCart && adjustBusinessId) {
281
- _removeStoreData('adjust-cart-products')
282
- adjustBusiness(adjustBusinessId)
283
- }
284
- }
281
+ const removeCartByReOrder = async () => {
282
+ const adjustBusinessId = await _retrieveStoreData('adjust-cart-products')
283
+ if (currentCart && adjustBusinessId) {
284
+ _removeStoreData('adjust-cart-products')
285
+ adjustBusiness(adjustBusinessId)
286
+ }
287
+ }
285
288
 
286
- useEffect(() => {
287
- removeCartByReOrder()
288
- }, [currentCart])
289
+ useEffect(() => {
290
+ removeCartByReOrder()
291
+ }, [currentCart])
289
292
 
290
- useEffect(() => {
291
- if (!isFocused) {
292
- handleChangeSearch('')
293
- setIsOpenSearchBar(false)
294
- }
295
- }, [isFocused])
293
+ useEffect(() => {
294
+ if (!isFocused) {
295
+ handleChangeSearch('')
296
+ setIsOpenSearchBar(false)
297
+ }
298
+ }, [isFocused])
296
299
 
297
- const subtotalWithTaxes = currentCart?.taxes?.reduce((acc: any, item: any) => {
298
- if (item?.type === 1)
299
- return acc = acc + item?.summary?.tax
300
- return acc = acc
301
- }, currentCart?.subtotal)
300
+ const subtotalWithTaxes = currentCart?.taxes?.reduce((acc: any, item: any) => {
301
+ if (item?.type === 1)
302
+ return acc = acc + item?.summary?.tax
303
+ return acc = acc
304
+ }, currentCart?.subtotal)
302
305
 
303
- return (
304
- <>
305
- <View style={{ flex: 1, backgroundColor: backgroundColor }}>
306
- <Animated.View style={{ position: 'relative' }}>
307
- <TopHeader
308
- style={{
309
- marginTop: Platform.OS === 'ios' ? insets.top : 0
310
- }}
311
- onLayout={(event: any) => setSearchBarHeight(event.nativeEvent.layout.height)}
312
- >
313
- {!isOpenSearchBar && (
314
- <>
315
- <TopActions onPress={() => handleBackNavigation()}>
316
- <OIcon src={theme.images.general.arrow_left} color={theme.colors.textNormal} />
317
- </TopActions>
318
- {!errorQuantityProducts && (
319
- <View style={{ ...styles.headerItem }}>
320
- <TouchableOpacity
321
- onPress={() => setIsOpenSearchBar(true)}
322
- style={styles.searchIcon}
323
- >
324
- <OIcon src={theme.images.general.search} color={theme.colors.textNormal} width={20} />
325
- </TouchableOpacity>
326
- </View>
327
- )}
328
- </>
329
- )}
330
- {isOpenSearchBar && (
331
- <WrapSearchBar>
332
- <SearchBar
333
- autoFocus
334
- onSearch={handleChangeSearch}
335
- onCancel={() => handleCancel()}
336
- isCancelXButtonShow
337
- noBorderShow
338
- placeholder={t('SEARCH_PRODUCTS', 'Search Products')}
339
- lazyLoad={businessState?.business?.lazy_load_products_recommended}
340
- />
341
- </WrapSearchBar>
342
- )}
343
- </TopHeader>
344
- {!hideBusinessNearCity && loading && (
345
- <NearBusiness style={{ paddingBottom: 10 }}>
346
- <Placeholder Animation={Fade}>
347
- <View style={{ flexDirection: 'row' }}>
348
- {[...Array(10).keys()].map(i => (
349
- <View style={styles.businessSkeleton} key={i}>
350
- <PlaceholderLine style={{ width: '100%', height: '100%' }} />
351
- </View>
352
- ))}
353
- </View>
354
- </Placeholder>
355
- </NearBusiness>
356
- )}
357
- {!loading && !hideBusinessNearCity && businessState?.business?.city_id && (
358
- <NearBusiness>
359
- <BusinessesListing
360
- logosLayout
361
- propsToFetch={['id', 'logo', 'location', 'timezone', 'schedule', 'open', 'slug']}
362
- cityId={businessState?.business?.city_id}
363
- onBusinessClick={onBusinessClick}
364
- actualSlug={businessState?.business?.slug}
365
- />
366
- </NearBusiness>
367
- )}
368
- </Animated.View>
306
+ return (
307
+ <>
308
+ <View style={{ flex: 1, backgroundColor: backgroundColor }}>
309
+ <Animated.View style={{ position: 'relative' }}>
310
+ <TopHeader
311
+ style={{
312
+ marginTop: Platform.OS === 'ios' ? insets.top : 0
313
+ }}
314
+ onLayout={(event: any) => setSearchBarHeight(event.nativeEvent.layout.height)}
315
+ >
316
+ {!isOpenSearchBar && (
317
+ <>
318
+ <TopActions onPress={() => handleBackNavigation()}>
319
+ <OIcon src={theme.images.general.arrow_left} color={theme.colors.textNormal} />
320
+ </TopActions>
321
+ {!errorQuantityProducts && (
322
+ <View style={{ ...styles.headerItem }}>
323
+ <TouchableOpacity
324
+ onPress={() => setIsOpenSearchBar(true)}
325
+ style={styles.searchIcon}
326
+ >
327
+ <OIcon src={theme.images.general.search} color={theme.colors.textNormal} width={20} />
328
+ </TouchableOpacity>
329
+ </View>
330
+ )}
331
+ </>
332
+ )}
333
+ {isOpenSearchBar && (
334
+ <WrapSearchBar>
335
+ <SearchBar
336
+ autoFocus
337
+ onSearch={handleChangeSearch}
338
+ onCancel={() => handleCancel()}
339
+ isCancelXButtonShow
340
+ noBorderShow
341
+ placeholder={t('SEARCH_PRODUCTS', 'Search Products')}
342
+ lazyLoad={businessState?.business?.lazy_load_products_recommended}
343
+ />
344
+ </WrapSearchBar>
345
+ )}
346
+ </TopHeader>
347
+ {!hideBusinessNearCity && loading && (
348
+ <NearBusiness style={{ paddingBottom: 10 }}>
349
+ <Placeholder Animation={Fade}>
350
+ <View style={{ flexDirection: 'row' }}>
351
+ {[...Array(10).keys()].map(i => (
352
+ <View style={styles.businessSkeleton} key={i}>
353
+ <PlaceholderLine style={{ width: '100%', height: '100%' }} />
354
+ </View>
355
+ ))}
356
+ </View>
357
+ </Placeholder>
358
+ </NearBusiness>
359
+ )}
360
+ {!loading && !hideBusinessNearCity && businessState?.business?.city_id && (
361
+ <NearBusiness>
362
+ <BusinessesListing
363
+ logosLayout
364
+ propsToFetch={['id', 'logo', 'location', 'timezone', 'schedule', 'open', 'slug']}
365
+ cityId={businessState?.business?.city_id}
366
+ onBusinessClick={onBusinessClick}
367
+ actualSlug={businessState?.business?.slug}
368
+ />
369
+ </NearBusiness>
370
+ )}
371
+ </Animated.View>
369
372
 
370
- {business?.categories?.length > 0 && isOpenFiltProducts && (
371
- <FiltProductsContainer
372
- style={{
373
- height: Dimensions.get('window').height - filtProductsHeight,
374
- top: Platform.OS === 'ios' ? (searchBarHeight - 10) + insets.top : searchBarHeight
375
- }}
376
- contentContainerStyle={{ flexGrow: 1 }}
377
- >
378
- <View style={{ padding: 20, backgroundColor: theme.colors.white }}>
379
- <BusinessProductsList
380
- categories={[
381
- { id: null, name: t('ALL', 'All') },
382
- { id: 'featured', name: t('FEATURED', 'Featured') },
383
- ...business?.categories.sort((a: any, b: any) => a.rank - b.rank)
384
- ]}
385
- category={categorySelected}
386
- categoryState={categoryState}
387
- businessId={business.id}
388
- errors={errors}
389
- onProductClick={onProductClick}
390
- handleSearchRedirect={handleSearchRedirect}
391
- featured={featuredProducts}
392
- searchValue={searchValue}
393
- handleClearSearch={handleChangeSearch}
394
- errorQuantityProducts={errorQuantityProducts}
395
- handleCancelSearch={handleCancel}
396
- categoriesLayout={categoriesLayout}
397
- subcategoriesSelected={subcategoriesSelected}
398
- lazyLoadProductsRecommended={business?.lazy_load_products_recommended}
399
- setCategoriesLayout={setCategoriesLayout}
400
- currentCart={currentCart}
401
- setSubcategoriesSelected={setSubcategoriesSelected}
402
- onClickCategory={handleChangeCategory}
403
- handleUpdateProducts={handleUpdateProducts}
404
- previouslyProducts={business?.previously_products}
405
- navigation={navigation}
406
- isFiltMode
407
- />
408
- </View>
409
- </FiltProductsContainer>
410
- )}
411
- {isOpenFiltProducts && (
412
- <BackgroundGray isIos={Platform.OS === 'ios'} />
413
- )}
414
- <IOScrollView
415
- stickyHeaderIndices={[business?.professionals?.length > 0 ? 4 : 3]}
416
- style={{
417
- ...styles.mainContainer,
418
- marginBottom: currentCart?.products?.length > 0 && categoryState.products.length !== 0 ?
419
- 50 : 0
420
- }}
421
- ref={scrollViewRef}
422
- onScroll={handlePageScroll}
423
- onScrollBeginDrag={handleTouchDrag}
424
- scrollEventThrottle={16}
425
- bounces={false}
426
- >
427
- <BusinessBasicInformation
428
- navigation={navigation}
429
- businessState={businessState}
430
- openBusinessInformation={openBusinessInformation}
431
- header={header}
432
- logo={logo}
433
- isPreOrder={isPreOrder}
434
- />
435
- {business?.professionals?.length > 0 && (
436
- <ProfessionalFilterWrapper>
437
- <OText
438
- size={16}
439
- style={{ marginBottom: 16 }}
440
- weight={Platform.OS === 'ios' ? '600' : 'bold'}
441
- >
442
- {t('PROFESSIONALS', 'Professionals')}
443
- </OText>
444
- <ProfessionalFilter
445
- professionals={business?.professionals}
446
- professionalSelected={professionalSelected}
447
- handleChangeProfessionalSelected={handleChangeProfessionalSelected}
448
- />
449
- </ProfessionalFilterWrapper>
450
- )}
451
- <PageBanner position='app_business_page' navigation={navigation} />
452
- <View
453
- style={{
454
- height: 8,
455
- backgroundColor: theme.colors.backgroundGray100,
456
- marginTop: isChewLayout && showLogo ? 10 : 0
457
- }}
458
- />
459
- {!loading && business?.id && !(business?.categories?.length === 0) && (
460
- <BusinessProductsCategories
461
- categories={[{ id: null, name: t('ALL', 'All') }, { id: 'featured', name: t('FEATURED', 'Featured') }, ...business?.categories.sort((a: any, b: any) => a.rank - b.rank)]}
462
- categorySelected={categorySelected}
463
- onClickCategory={handleChangeCategory}
464
- featured={featuredProducts}
465
- openBusinessInformation={openBusinessInformation}
466
- scrollViewRef={scrollViewRef}
467
- productListLayout={productListLayout}
468
- categoriesLayout={categoriesLayout}
469
- selectedCategoryId={selectedCategoryId}
470
- lazyLoadProductsRecommended={business?.lazy_load_products_recommended}
471
- setSelectedCategoryId={setSelectedCategoryId}
472
- setCategoryClicked={setCategoryClicked}
473
- />
474
- )}
475
- {!loading && business?.id && (
476
- <>
477
- <WrapContent
478
- onLayout={(event: any) => setProductListLayout(event.nativeEvent.layout)}
479
- style={{ paddingHorizontal: isChewLayout ? 20 : 40 }}
480
- >
481
- <BusinessProductsList
482
- categories={[
483
- { id: null, name: t('ALL', 'All') },
484
- { id: 'featured', name: t('FEATURED', 'Featured') },
485
- ...business?.categories.sort((a: any, b: any) => a.rank - b.rank)
486
- ]}
487
- category={categorySelected}
488
- categoryState={categoryState}
489
- businessId={business.id}
490
- errors={errors}
491
- onProductClick={onProductClick}
492
- handleSearchRedirect={handleSearchRedirect}
493
- featured={featuredProducts}
494
- searchValue={searchValue}
495
- handleClearSearch={handleChangeSearch}
496
- errorQuantityProducts={errorQuantityProducts}
497
- handleCancelSearch={handleCancel}
498
- categoriesLayout={categoriesLayout}
499
- subcategoriesSelected={subcategoriesSelected}
500
- lazyLoadProductsRecommended={business?.lazy_load_products_recommended}
501
- setCategoriesLayout={setCategoriesLayout}
502
- currentCart={currentCart}
503
- setSubcategoriesSelected={setSubcategoriesSelected}
504
- onClickCategory={handleChangeCategory}
505
- handleUpdateProducts={handleUpdateProducts}
506
- navigation={navigation}
507
- previouslyProducts={business?.previously_products}
508
- />
509
- </WrapContent>
510
- </>
511
- )}
512
- {loading && !error && (
513
- <>
514
- <BusinessProductsCategories
515
- categories={[]}
516
- categorySelected={categorySelected}
517
- onClickCategory={handleChangeCategory}
518
- featured={featuredProducts}
519
- openBusinessInformation={openBusinessInformation}
520
- loading={loading}
521
- />
522
- <WrapContent>
523
- <BusinessProductsList
524
- categories={[]}
525
- category={categorySelected}
526
- categoryState={categoryState}
527
- isBusinessLoading={loading}
528
- errorQuantityProducts={errorQuantityProducts}
529
- handleUpdateProducts={handleUpdateProducts}
530
- navigation={navigation}
531
- />
532
- </WrapContent>
533
- </>
534
- )}
535
- </IOScrollView>
536
- {!loading && auth && currentCart?.products?.length > 0 && categoryState.products.length !== 0 && (
537
- <View style={{ marginBottom: 0 }}>
538
- <FloatingButton
539
- btnText={
540
- openUpselling
541
- ? t('LOADING', 'Loading')
542
- : subtotalWithTaxes >= currentCart?.minimum
543
- ? t('VIEW_ORDER', 'View Order')
544
- : `${t('MINIMUN_SUBTOTAL_ORDER', 'Minimum subtotal order:')} ${parsePrice(currentCart?.minimum)}`
545
- }
546
- isSecondaryBtn={subtotalWithTaxes < currentCart?.minimum || openUpselling}
547
- btnLeftValueShow={subtotalWithTaxes >= currentCart?.minimum && currentCart?.products?.length > 0}
548
- btnRightValueShow={subtotalWithTaxes >= currentCart?.minimum && currentCart?.products?.length > 0}
549
- btnLeftValue={currentCart?.products.reduce((prev: number, product: any) => prev + product.quantity, 0)}
550
- btnRightValue={parsePrice(currentCart?.total)}
551
- disabled={subtotalWithTaxes < currentCart?.minimum || openUpselling}
552
- handleClick={() => setOpenUpselling(true)}
553
- />
554
- </View>
555
- )}
556
- {openUpselling && (
557
- <UpsellingRedirect
558
- businessId={currentCart?.business_id}
559
- business={currentCart?.business}
560
- cartProducts={currentCart?.products}
561
- cart={currentCart}
562
- setOpenUpselling={setOpenUpselling}
563
- handleUpsellingPage={handleUpsellingPage}
564
- handleCloseUpsellingPage={handleCloseUpsellingPage}
565
- openUpselling={openUpselling}
566
- canOpenUpselling={canOpenUpselling}
567
- setCanOpenUpselling={setCanOpenUpselling}
568
- onRedirect={onRedirect}
569
- />
570
- )}
571
- <Alert
572
- open={alertState?.open || false}
573
- title=''
574
- content={[t('NOT_AVAILABLE_PRODUCTS', 'These products are not available.')]}
575
- onAccept={() => setAlertState({ open: false, content: [] })}
576
- onClose={() => setAlertState({ open: false, content: [] })}
577
- />
578
- </View>
579
- <OModal
580
- open={openService}
581
- onClose={() => setOpenService(false)}
582
- entireModal
583
- >
584
- <ServiceForm
585
- navigation={navigation}
586
- product={currentProduct}
587
- businessSlug={business.slug}
588
- businessId={business.id}
589
- professionalList={business?.professionals}
590
- professionalSelected={professionalSelected}
591
- handleChangeProfessional={handleChangeProfessionalSelected}
592
- handleChangeProfessional={handleChangeProfessionalSelected}
593
- handleUpdateProfessionals={handleUpdateProfessionals}
594
- onSave={() => setOpenService(false)}
595
- onClose={() => setOpenService(false)}
596
- />
597
- </OModal>
598
- </>
599
- )
373
+ {business?.categories?.length > 0 && isOpenFiltProducts && (
374
+ <FiltProductsContainer
375
+ style={{
376
+ height: Dimensions.get('window').height - filtProductsHeight,
377
+ top: Platform.OS === 'ios' ? (searchBarHeight - 10) + insets.top : searchBarHeight
378
+ }}
379
+ contentContainerStyle={{ flexGrow: 1 }}
380
+ >
381
+ <View style={{ padding: 20, backgroundColor: theme.colors.white }}>
382
+ <BusinessProductsList
383
+ categories={[
384
+ { id: null, name: t('ALL', 'All') },
385
+ { id: 'featured', name: t('FEATURED', 'Featured') },
386
+ ...business?.categories.sort((a: any, b: any) => a.rank - b.rank)
387
+ ]}
388
+ category={categorySelected}
389
+ categoryState={categoryState}
390
+ businessId={business.id}
391
+ errors={errors}
392
+ onProductClick={onProductClick}
393
+ handleSearchRedirect={handleSearchRedirect}
394
+ featured={featuredProducts}
395
+ searchValue={searchValue}
396
+ handleClearSearch={handleChangeSearch}
397
+ errorQuantityProducts={errorQuantityProducts}
398
+ handleCancelSearch={handleCancel}
399
+ categoriesLayout={categoriesLayout}
400
+ subcategoriesSelected={subcategoriesSelected}
401
+ lazyLoadProductsRecommended={business?.lazy_load_products_recommended}
402
+ setCategoriesLayout={setCategoriesLayout}
403
+ currentCart={currentCart}
404
+ setSubcategoriesSelected={setSubcategoriesSelected}
405
+ onClickCategory={handleChangeCategory}
406
+ handleUpdateProducts={handleUpdateProducts}
407
+ previouslyProducts={business?.previously_products}
408
+ navigation={navigation}
409
+ isFiltMode
410
+ />
411
+ </View>
412
+ </FiltProductsContainer>
413
+ )}
414
+ {isOpenFiltProducts && (
415
+ <BackgroundGray isIos={Platform.OS === 'ios'} />
416
+ )}
417
+ <IOScrollView
418
+ stickyHeaderIndices={[business?.professionals?.length > 0 ? 4 : 3]}
419
+ style={{
420
+ ...styles.mainContainer,
421
+ marginBottom: currentCart?.products?.length > 0 && categoryState.products.length !== 0 ?
422
+ 50 : 0
423
+ }}
424
+ ref={scrollViewRef}
425
+ onScroll={handlePageScroll}
426
+ onScrollBeginDrag={handleTouchDrag}
427
+ scrollEventThrottle={16}
428
+ bounces={false}
429
+ >
430
+ <BusinessBasicInformation
431
+ navigation={navigation}
432
+ businessState={businessState}
433
+ openBusinessInformation={openBusinessInformation}
434
+ header={header}
435
+ logo={logo}
436
+ isPreOrder={isPreOrder}
437
+ />
438
+ {business?.professionals?.length > 0 && (
439
+ <ProfessionalFilterWrapper>
440
+ <OText
441
+ size={16}
442
+ style={{ marginBottom: 16 }}
443
+ weight={Platform.OS === 'ios' ? '600' : 'bold'}
444
+ >
445
+ {t('PROFESSIONALS', 'Professionals')}
446
+ </OText>
447
+ <ProfessionalFilter
448
+ professionals={business?.professionals}
449
+ professionalSelected={professionalSelected}
450
+ handleChangeProfessionalSelected={handleChangeProfessionalSelected}
451
+ />
452
+ </ProfessionalFilterWrapper>
453
+ )}
454
+ <PageBanner position='app_business_page' navigation={navigation} />
455
+ <View
456
+ style={{
457
+ height: 8,
458
+ backgroundColor: theme.colors.backgroundGray100,
459
+ marginTop: isChewLayout && showLogo ? 10 : 0
460
+ }}
461
+ />
462
+ {!loading && business?.id && !(business?.categories?.length === 0) && (
463
+ <BusinessProductsCategories
464
+ categories={[{ id: null, name: t('ALL', 'All') }, { id: 'featured', name: t('FEATURED', 'Featured') }, ...business?.categories.sort((a: any, b: any) => a.rank - b.rank)]}
465
+ categorySelected={categorySelected}
466
+ onClickCategory={handleChangeCategory}
467
+ featured={featuredProducts}
468
+ openBusinessInformation={openBusinessInformation}
469
+ scrollViewRef={scrollViewRef}
470
+ productListLayout={productListLayout}
471
+ categoriesLayout={categoriesLayout}
472
+ selectedCategoryId={selectedCategoryId}
473
+ lazyLoadProductsRecommended={business?.lazy_load_products_recommended}
474
+ setSelectedCategoryId={setSelectedCategoryId}
475
+ setCategoryClicked={setCategoryClicked}
476
+ />
477
+ )}
478
+ {!loading && business?.id && (
479
+ <>
480
+ <WrapContent
481
+ onLayout={(event: any) => setProductListLayout(event.nativeEvent.layout)}
482
+ style={{ paddingHorizontal: isChewLayout ? 20 : 40 }}
483
+ >
484
+ <BusinessProductsList
485
+ categories={[
486
+ { id: null, name: t('ALL', 'All') },
487
+ { id: 'featured', name: t('FEATURED', 'Featured') },
488
+ ...business?.categories.sort((a: any, b: any) => a.rank - b.rank)
489
+ ]}
490
+ category={categorySelected}
491
+ categoryState={categoryState}
492
+ businessId={business.id}
493
+ errors={errors}
494
+ onProductClick={onProductClick}
495
+ handleSearchRedirect={handleSearchRedirect}
496
+ featured={featuredProducts}
497
+ searchValue={searchValue}
498
+ handleClearSearch={handleChangeSearch}
499
+ errorQuantityProducts={errorQuantityProducts}
500
+ handleCancelSearch={handleCancel}
501
+ categoriesLayout={categoriesLayout}
502
+ subcategoriesSelected={subcategoriesSelected}
503
+ lazyLoadProductsRecommended={business?.lazy_load_products_recommended}
504
+ setCategoriesLayout={setCategoriesLayout}
505
+ currentCart={currentCart}
506
+ setSubcategoriesSelected={setSubcategoriesSelected}
507
+ onClickCategory={handleChangeCategory}
508
+ handleUpdateProducts={handleUpdateProducts}
509
+ navigation={navigation}
510
+ previouslyProducts={business?.previously_products}
511
+ />
512
+ </WrapContent>
513
+ </>
514
+ )}
515
+ {loading && !error && (
516
+ <>
517
+ <BusinessProductsCategories
518
+ categories={[]}
519
+ categorySelected={categorySelected}
520
+ onClickCategory={handleChangeCategory}
521
+ featured={featuredProducts}
522
+ openBusinessInformation={openBusinessInformation}
523
+ loading={loading}
524
+ />
525
+ <WrapContent>
526
+ <BusinessProductsList
527
+ categories={[]}
528
+ category={categorySelected}
529
+ categoryState={categoryState}
530
+ isBusinessLoading={loading}
531
+ errorQuantityProducts={errorQuantityProducts}
532
+ handleUpdateProducts={handleUpdateProducts}
533
+ navigation={navigation}
534
+ />
535
+ </WrapContent>
536
+ </>
537
+ )}
538
+ </IOScrollView>
539
+ {!loading && auth && currentCart?.products?.length > 0 && categoryState.products.length !== 0 && (
540
+ <View style={{ marginBottom: 0 }}>
541
+ <FloatingButton
542
+ btnText={
543
+ openUpselling
544
+ ? t('LOADING', 'Loading')
545
+ : subtotalWithTaxes >= currentCart?.minimum
546
+ ? t('VIEW_ORDER', 'View Order')
547
+ : `${t('MINIMUN_SUBTOTAL_ORDER', 'Minimum subtotal order:')} ${parsePrice(currentCart?.minimum)}`
548
+ }
549
+ isSecondaryBtn={subtotalWithTaxes < currentCart?.minimum || openUpselling}
550
+ btnLeftValueShow={subtotalWithTaxes >= currentCart?.minimum && currentCart?.products?.length > 0}
551
+ btnRightValueShow={subtotalWithTaxes >= currentCart?.minimum && currentCart?.products?.length > 0}
552
+ btnLeftValue={currentCart?.products.reduce((prev: number, product: any) => prev + product.quantity, 0)}
553
+ btnRightValue={parsePrice(currentCart?.total)}
554
+ disabled={subtotalWithTaxes < currentCart?.minimum || openUpselling}
555
+ handleClick={() => setOpenUpselling(true)}
556
+ />
557
+ </View>
558
+ )}
559
+ {openUpselling && (
560
+ <UpsellingRedirect
561
+ businessId={currentCart?.business_id}
562
+ business={currentCart?.business}
563
+ cartProducts={currentCart?.products}
564
+ cart={currentCart}
565
+ setOpenUpselling={setOpenUpselling}
566
+ handleUpsellingPage={handleUpsellingPage}
567
+ handleCloseUpsellingPage={handleCloseUpsellingPage}
568
+ openUpselling={openUpselling}
569
+ canOpenUpselling={canOpenUpselling}
570
+ setCanOpenUpselling={setCanOpenUpselling}
571
+ onRedirect={onRedirect}
572
+ />
573
+ )}
574
+ <Alert
575
+ open={alertState?.open || false}
576
+ title=''
577
+ content={[t('NOT_AVAILABLE_PRODUCTS', 'These products are not available.')]}
578
+ onAccept={() => setAlertState({ open: false, content: [] })}
579
+ onClose={() => setAlertState({ open: false, content: [] })}
580
+ />
581
+ </View>
582
+ <OModal
583
+ open={openService}
584
+ onClose={() => setOpenService(false)}
585
+ entireModal
586
+ >
587
+ <ServiceForm
588
+ navigation={navigation}
589
+ product={currentProduct}
590
+ businessSlug={business.slug}
591
+ businessId={business.id}
592
+ professionalList={business?.professionals}
593
+ professionalSelected={professionalSelected}
594
+ handleChangeProfessional={handleChangeProfessionalSelected}
595
+ handleChangeProfessional={handleChangeProfessionalSelected}
596
+ handleUpdateProfessionals={handleUpdateProfessionals}
597
+ onSave={() => setOpenService(false)}
598
+ onClose={() => setOpenService(false)}
599
+ />
600
+ </OModal>
601
+ </>
602
+ )
600
603
  }
601
604
 
602
605
  export const BusinessProductsListing = (props: BusinessProductsListingParams) => {
603
- const businessProductslistingProps = {
604
- ...props,
605
- isForceSearch: Platform.OS === 'ios',
606
- UIComponent: BusinessProductsListingUI
607
- }
608
- return (
609
- <BusinessAndProductList {...businessProductslistingProps} />
610
- )
606
+ const businessProductslistingProps = {
607
+ ...props,
608
+ isForceSearch: Platform.OS === 'ios',
609
+ UIComponent: BusinessProductsListingUI
610
+ }
611
+ return (
612
+ <BusinessAndProductList {...businessProductslistingProps} />
613
+ )
611
614
  }
@@ -125,7 +125,10 @@ const CartUI = (props: any) => {
125
125
  (Object.keys(groupKeys).length === 1 && Object.keys(groupKeys)[0] === 'null') ||
126
126
  Object.keys(groupKeys).length > 1
127
127
  ) {
128
- onNavigationRedirect('CheckoutNavigator', { screen: 'MultiCart' })
128
+ onNavigationRedirect('CheckoutNavigator', {
129
+ screen: 'MultiCheckout',
130
+ checkCarts: true
131
+ })
129
132
  } else {
130
133
  onNavigationRedirect('CheckoutNavigator', {
131
134
  screen: 'MultiCheckout',
@@ -20,7 +20,7 @@ export const CartContent = (props: any) => {
20
20
  const [{ configs }] = useConfig()
21
21
  const [isCartsLoading, setIsCartsLoading] = useState(false)
22
22
 
23
- const isChewLayout = theme?.header?.components?.layout?.type?.toLowerCase() === 'chew'
23
+ const isChewLayout = theme?.header?.components?.layout?.type === 'chew'
24
24
  const isMultiCheckout = configs?.checkout_multi_business_enabled?.value === '1'
25
25
  const cartsAvailable: any = Object.values(carts)?.filter((cart: any) => cart?.valid && cart?.status !== 2)
26
26
 
@@ -45,7 +45,10 @@ export const CartContent = (props: any) => {
45
45
  (Object.keys(groupKeys).length === 1 && Object.keys(groupKeys)[0] === 'null') ||
46
46
  Object.keys(groupKeys).length > 1
47
47
  ) {
48
- onNavigationRedirect('CheckoutNavigator', { screen: 'MultiCart' })
48
+ onNavigationRedirect('CheckoutNavigator', {
49
+ screen: 'MultiCheckout',
50
+ checkCarts: true
51
+ })
49
52
  } else {
50
53
  onNavigationRedirect('CheckoutNavigator', {
51
54
  screen: 'MultiCheckout',
@@ -18,6 +18,7 @@ import { OText, OIcon, OModal } from '../shared';
18
18
  import { getTypesText } from '../../utils';
19
19
  import { UserDetails } from '../UserDetails'
20
20
  import { AddressDetails } from '../AddressDetails'
21
+ import { MultiCart as MultiCartController } from '../MultiCart'
21
22
  import { MultiCartsPaymethodsAndWallets } from '../MultiCartsPaymethodsAndWallets'
22
23
  import { Cart } from '../Cart'
23
24
  import { FloatingButton } from '../FloatingButton'
@@ -345,9 +346,34 @@ const MultiCheckoutUI = (props: any) => {
345
346
  }
346
347
 
347
348
  export const MultiCheckout = (props: any) => {
349
+ const [loadMultiCarts, setLoadMultiCarts] = useState(!!props.route?.params?.checkCarts)
350
+ const [cartUuid, setCartUuid] = useState('')
351
+
348
352
  const multiCheckoutProps = {
349
353
  ...props,
354
+ cartUuid: props.route?.params?.cartUuid ?? cartUuid,
350
355
  UIComponent: MultiCheckoutUI
351
356
  }
352
- return <MultiCheckoutController {...multiCheckoutProps} />
357
+
358
+ const multiCartProps = {
359
+ ...props,
360
+ handleOnRedirectMultiCheckout: (cartUuid: string) => {
361
+ setCartUuid(cartUuid)
362
+ setLoadMultiCarts(false)
363
+ },
364
+ handleOnRedirectCheckout: (cartUuid: string) => {
365
+ props.navigation.navigate('CheckoutNavigator', {
366
+ screen: 'CheckoutPage',
367
+ cartUuid: cartUuid
368
+ })
369
+ }
370
+ }
371
+
372
+ return (
373
+ loadMultiCarts ? (
374
+ <MultiCartController {...multiCartProps} />
375
+ ) : (
376
+ <MultiCheckoutController {...multiCheckoutProps} />
377
+ )
378
+ )
353
379
  }