ordering-ui-react-native 0.22.67-release → 0.22.68-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.
@@ -12,358 +12,361 @@ import { OrdersOptionParams } from '../../types'
12
12
  import { _setStoreData } from '../../providers/StoreUtil';
13
13
  import { NotFoundSource } from '../NotFoundSource';
14
14
  import {
15
- Placeholder,
16
- PlaceholderLine,
17
- Fade
15
+ Placeholder,
16
+ PlaceholderLine,
17
+ Fade
18
18
  } from "rn-placeholder";
19
19
 
20
20
  import { View, ScrollView } from 'react-native'
21
21
  import { getOrderStatus, flatArray } from '../../utils'
22
22
 
23
23
  const OrdersOptionUI = (props: OrdersOptionParams) => {
24
- const {
25
- navigation,
26
- activeOrders,
27
- preOrders,
28
- orderList,
29
- pagination,
30
- titleContent,
31
- customArray,
32
- onNavigationRedirect,
33
- orderStatus,
34
- loadMoreStatus,
35
- loadMoreOrders,
36
- loadOrders,
37
- setOrdersLength,
38
- ordersLength,
39
- refreshOrders,
40
- setRefreshOrders,
41
- reorderState,
42
- handleReorder,
43
- handleUpdateOrderList,
44
- isBusiness,
45
- isProducts,
46
- businessOrderIds,
47
- products,
48
- businessesSearchList,
49
- hideOrders,
50
- BusinessControllerSkeletons,
51
- businesses,
52
- businessPaginationProps,
53
- handleUpdateProducts,
54
- handleUpdateBusinesses,
55
- businessId
56
- } = props
24
+ const {
25
+ navigation,
26
+ activeOrders,
27
+ preOrders,
28
+ orderList,
29
+ pagination,
30
+ titleContent,
31
+ customArray,
32
+ onNavigationRedirect,
33
+ orderStatus,
34
+ loadMoreStatus,
35
+ loadMoreOrders,
36
+ loadOrders,
37
+ setOrdersLength,
38
+ ordersLength,
39
+ refreshOrders,
40
+ setRefreshOrders,
41
+ reorderState,
42
+ handleReorder,
43
+ handleUpdateOrderList,
44
+ isBusiness,
45
+ isProducts,
46
+ businessOrderIds,
47
+ products,
48
+ businessesSearchList,
49
+ hideOrders,
50
+ BusinessControllerSkeletons,
51
+ businesses,
52
+ businessPaginationProps,
53
+ handleUpdateProducts,
54
+ handleUpdateBusinesses,
55
+ businessId
56
+ } = props
57
57
 
58
- const theme = useTheme();
58
+ const theme = useTheme();
59
59
 
60
- const [, t] = useLanguage()
61
- const [{ carts }] = useOrder()
62
- const [, { showToast }] = useToast()
63
- const { loading, error, orders: values } = orderList
64
- const [businessLoading, setBusinessLoading] = useState(true)
65
- const [orders, setOrders] = useState([])
60
+ const [, t] = useLanguage()
61
+ const [{ carts }] = useOrder()
62
+ const [, { showToast }] = useToast()
63
+ const { loading, error, orders: values } = orderList
64
+ const [businessLoading, setBusinessLoading] = useState(true)
65
+ const [orders, setOrders] = useState([])
66
66
 
67
- const imageFails = activeOrders
68
- ? theme.images.general.emptyActiveOrders
69
- : theme.images.general.emptyPastOrders
67
+ const imageFails = activeOrders
68
+ ? theme.images.general.emptyActiveOrders
69
+ : theme.images.general.emptyPastOrders
70
70
 
71
- const _orders = customArray || values || []
72
- const uniqueOrders: any = []
71
+ const _orders = customArray || values || []
72
+ const uniqueOrders: any = []
73
73
 
74
- useEffect(() => {
75
- if (loading || error) return
76
- const ordersReduced = _orders.map((order: any) => order?.cart_group_id
77
- ? _orders
78
- .filter((_order: any) => _order?.cart_group_id === order?.cart_group_id)
79
- .map((_o: any, _: any, _ordersList: any) => {
80
- const obj = {
81
- ..._o,
82
- id: _ordersList.map(o => o.id),
83
- review: _o.review,
84
- user_review: _o.user_review,
85
- total: _ordersList.reduce((acc: any, o: any) => acc + o.summary.total, 0),
86
- business: _ordersList.map((o: any) => o.business),
87
- business_id: _ordersList.map((o: any) => o.business_id),
88
- products: _ordersList.map((o: any) => o.products)
89
- }
90
- return obj
91
- }).find((o: any) => o)
92
- : order)
93
- const orders = ordersReduced?.filter((order: any) => {
94
- if (!order?.cart_group_id) return true
95
- const isDuplicate = uniqueOrders.includes(order?.cart_group_id)
96
- if (!isDuplicate) {
97
- uniqueOrders.push(order?.cart_group_id)
98
- return true
99
- }
100
- return false
101
- })
102
- setOrders(orders)
103
- }, [JSON.stringify(_orders)])
74
+ useEffect(() => {
75
+ if (loading || error) return
76
+ const ordersReduced = _orders.map((order: any) => order?.cart_group_id
77
+ ? _orders
78
+ .filter((_order: any) => _order?.cart_group_id === order?.cart_group_id)
79
+ .map((_o: any, _: any, _ordersList: any) => {
80
+ const obj = {
81
+ ..._o,
82
+ id: _ordersList.map(o => o.id),
83
+ review: _o.review,
84
+ user_review: _o.user_review,
85
+ total: _ordersList.reduce((acc: any, o: any) => acc + o.summary.total, 0),
86
+ business: _ordersList.map((o: any) => o.business),
87
+ business_id: _ordersList.map((o: any) => o.business_id),
88
+ products: _ordersList.map((o: any) => o.products)
89
+ }
90
+ return obj
91
+ }).find((o: any) => o)
92
+ : order)
93
+ const orders = ordersReduced?.filter((order: any) => {
94
+ if (!order?.cart_group_id) return true
95
+ const isDuplicate = uniqueOrders.includes(order?.cart_group_id)
96
+ if (!isDuplicate) {
97
+ uniqueOrders.push(order?.cart_group_id)
98
+ return true
99
+ }
100
+ return false
101
+ })
102
+ setOrders(orders)
103
+ }, [JSON.stringify(_orders)])
104
104
 
105
- const onProductClick = (product: any) => {
106
- if (product?.product_id && product?.category_id && product?.businessId &&
107
- product?.business.slug && product?.business.header && product?.business.logo) {
108
- onNavigationRedirect('ProductDetails', {
109
- isRedirect: 'business',
110
- businessId: product?.businessId,
111
- categoryId: product?.category_id,
112
- productId: product?.product_id,
113
- business: {
114
- store: product?.business.slug,
115
- header: product?.business.header,
116
- logo: product?.business.logo,
117
- }
118
- })
119
- } else {
120
- showToast(ToastType.Error, t('ERROR_FAILED_REDIRECT_IDS', 'Failed to redirect product for ids'))
121
- }
122
- }
105
+ const onProductClick = (product: any) => {
106
+ if (product?.product_id && product?.category_id && product?.businessId &&
107
+ product?.business.slug && product?.business.header && product?.business.logo) {
108
+ onNavigationRedirect('ProductDetails', {
109
+ isRedirect: 'business',
110
+ businessId: product?.businessId,
111
+ categoryId: product?.category_id,
112
+ productId: product?.product_id,
113
+ business: {
114
+ store: product?.business.slug,
115
+ header: product?.business.header,
116
+ logo: product?.business.logo,
117
+ }
118
+ })
119
+ } else {
120
+ showToast(ToastType.Error, t('ERROR_FAILED_REDIRECT_IDS', 'Failed to redirect product for ids'))
121
+ }
122
+ }
123
123
 
124
- useEffect(() => {
125
- if (reorderState?.loading) return
126
- const _businessId = 'businessId:' + reorderState?.result?.business_id
127
- if (reorderState?.error) {
128
- if (reorderState?.result?.business_id) {
129
- _setStoreData('adjust-cart-products', JSON.stringify(_businessId))
130
- navigation.navigate('Business', { store: reorderState?.result?.business?.slug })
131
- }
132
- }
133
- if (!reorderState?.error && !reorderState.loading && reorderState?.result?.business_id) {
134
- const cartProducts = carts?.[_businessId]?.products
124
+ useEffect(() => {
125
+ if (reorderState?.loading) return
126
+ const _businessId = 'businessId:' + reorderState?.result?.business_id
127
+ if (reorderState?.error) {
128
+ if (reorderState?.result?.business_id) {
129
+ _setStoreData('adjust-cart-products', JSON.stringify(_businessId))
130
+ navigation.navigate('Business', { store: reorderState?.result?.business?.slug })
131
+ }
132
+ }
133
+ if (!reorderState?.error && !reorderState.loading && reorderState?.result?.business_id) {
134
+ const cartProducts = carts?.[_businessId]?.products
135
135
 
136
- const available = cartProducts.every((product: any) => product.valid)
137
- const orderProducts = orders.find(
138
- (order: any) => Array.isArray(order?.id)
139
- ? order?.id?.includes(reorderState?.result?.orderId)
140
- : order?.id === reorderState?.result?.orderId
141
- )?.products
136
+ const available = cartProducts.every((product: any) => product.valid)
137
+ const orderProducts = orders.find(
138
+ (order: any) => Array.isArray(order?.id)
139
+ ? order?.id?.includes(reorderState?.result?.orderId)
140
+ : order?.id === reorderState?.result?.orderId
141
+ )?.products
142
142
 
143
- const productsFlatten = orderProducts?.length && flatArray(orderProducts)?.filter(product => product?.order_id === reorderState?.result?.orderId)
143
+ const productsFlatten = orderProducts?.length && flatArray(orderProducts)?.filter(product => product?.order_id === reorderState?.result?.orderId)
144
144
 
145
- if (available && reorderState?.result?.uuid && (cartProducts?.length === productsFlatten?.length)) {
146
- const multiOrders = flatArray(orderProducts)?.map(product => product.order_id)
147
- const params = multiOrders?.length > 1
148
- ? { screen: 'MultiCheckout', checkCarts: true }
149
- : { cartUuid: reorderState?.result.uuid }
145
+ if (available && reorderState?.result?.uuid && (cartProducts?.length === productsFlatten?.length)) {
146
+ const multiOrders = flatArray(orderProducts)?.map(product => product.order_id)
147
+ const params = multiOrders?.length > 1
148
+ ? { screen: 'MultiCheckout', checkCarts: true }
149
+ : { cartUuid: reorderState?.result.uuid }
150
150
 
151
- onNavigationRedirect && onNavigationRedirect('CheckoutNavigator', params)
152
- } else {
153
- _setStoreData('adjust-cart-products', JSON.stringify(_businessId))
154
- cartProducts?.length !== productsFlatten?.length && _setStoreData('already-removed', JSON.stringify('removed'))
155
- navigation.navigate('Business', { store: reorderState?.result?.business?.slug })
156
- }
157
- }
158
- }, [reorderState])
151
+ onNavigationRedirect && onNavigationRedirect('CheckoutNavigator', params)
152
+ } else {
153
+ _setStoreData('adjust-cart-products', JSON.stringify(_businessId))
154
+ cartProducts?.length !== productsFlatten?.length && _setStoreData('already-removed', JSON.stringify('removed'))
155
+ navigation.navigate('Business', { store: reorderState?.result?.business?.slug })
156
+ }
157
+ }
158
+ }, [reorderState])
159
159
 
160
- useEffect(() => {
161
- if (reorderState?.error) {
162
- showToast(ToastType.Error, reorderState?.result)
163
- }
164
- }, [reorderState])
160
+ useEffect(() => {
161
+ if (reorderState?.error) {
162
+ const errorMessage = (Array.isArray(reorderState?.result) || typeof reorderState?.result === 'string')
163
+ ? reorderState?.result
164
+ : t('CANT_REORDER_FOR_THIS_BUSINESS', 'Can’t reorder for this store, please create order manually.')
165
+ showToast(ToastType.Error, errorMessage)
166
+ }
167
+ }, [reorderState])
165
168
 
166
- useFocusEffect(
167
- React.useCallback(() => {
168
- if (!businessesSearchList) {
169
- loadOrders(false, false, false, true)
170
- }
171
- }, [navigation])
172
- )
169
+ useFocusEffect(
170
+ React.useCallback(() => {
171
+ if (!businessesSearchList) {
172
+ loadOrders(false, false, false, true)
173
+ }
174
+ }, [navigation])
175
+ )
173
176
 
174
- useEffect(() => {
175
- const hasMore = pagination?.totalPages && pagination?.currentPage !== pagination?.totalPages
176
- if (loadMoreStatus && hasMore && !loading) {
177
- loadMoreOrders()
178
- }
179
- }, [loadMoreStatus, loading, pagination])
177
+ useEffect(() => {
178
+ const hasMore = pagination?.totalPages && pagination?.currentPage !== pagination?.totalPages
179
+ if (loadMoreStatus && hasMore && !loading) {
180
+ loadMoreOrders()
181
+ }
182
+ }, [loadMoreStatus, loading, pagination])
180
183
 
181
- useEffect(() => {
182
- if (loading) return
184
+ useEffect(() => {
185
+ if (loading) return
183
186
 
184
- const updateOrders = _orders.filter((order: any) => orderStatus.includes(order.status))
187
+ const updateOrders = _orders.filter((order: any) => orderStatus.includes(order.status))
185
188
 
186
- if (activeOrders) {
187
- setOrdersLength && setOrdersLength({ ...ordersLength, activeOrdersLength: updateOrders?.length })
188
- } else if (!preOrders) {
189
- setOrdersLength && setOrdersLength({ ...ordersLength, previousOrdersLength: updateOrders?.length })
190
- } else {
191
- setOrdersLength && setOrdersLength({ ...ordersLength, preordersLength: updateOrders?.length })
192
- }
193
- }, [_orders, activeOrders, preOrders])
189
+ if (activeOrders) {
190
+ setOrdersLength && setOrdersLength({ ...ordersLength, activeOrdersLength: updateOrders?.length })
191
+ } else if (!preOrders) {
192
+ setOrdersLength && setOrdersLength({ ...ordersLength, previousOrdersLength: updateOrders?.length })
193
+ } else {
194
+ setOrdersLength && setOrdersLength({ ...ordersLength, preordersLength: updateOrders?.length })
195
+ }
196
+ }, [_orders, activeOrders, preOrders])
194
197
 
195
- useEffect(() => {
196
- if (refreshOrders) {
197
- loadOrders(false, false, false, true)
198
- setRefreshOrders && setRefreshOrders(false)
199
- }
200
- }, [refreshOrders])
198
+ useEffect(() => {
199
+ if (refreshOrders) {
200
+ loadOrders(false, false, false, true)
201
+ setRefreshOrders && setRefreshOrders(false)
202
+ }
203
+ }, [refreshOrders])
201
204
 
202
- return (
203
- <>
204
- {!loading && ordersLength.activeOrdersLength === 0 && ordersLength.previousOrdersLength === 0 && ordersLength?.preordersLength === 0 && !activeOrders && !preOrders && (
205
- <NoOrdersWrapper>
206
- <NotFoundSource
207
- hideImage
208
- btnStyle={{ borderRadius: 8 }}
209
- content={t('YOU_DONT_HAVE_ORDERS', 'You don\'t have any orders')}
210
- btnTitle={t('ORDER_NOW', 'Order now')}
211
- onClickButton={() => onNavigationRedirect && (businessId ? onNavigationRedirect('Business') : onNavigationRedirect('BusinessList'))}
212
- />
213
- </NoOrdersWrapper>
214
- )}
215
- {((ordersLength?.activeOrdersLength > 0 && activeOrders) ||
216
- (ordersLength?.previousOrdersLength > 0 && !activeOrders && !preOrders) ||
217
- (ordersLength?.preordersLength > 0 && preOrders)
218
- ) && (
219
- <>
220
- {((titleContent && ((isBusiness && businessOrderIds?.length > 0) || isProducts)) || !titleContent) && (
221
- <OptionTitle titleContent={!!titleContent} isBusinessesSearchList={!!businessesSearchList}>
222
- <OText size={16} lineHeight={24} weight={'500'} color={theme.colors.textNormal} mBottom={10} >
223
- {titleContent || (activeOrders
224
- ? t('ACTIVE', 'Active')
225
- : preOrders
226
- ? t('PREORDERS', 'Preorders')
227
- : t('PAST', 'Past'))}
228
- </OText>
229
- </OptionTitle>
230
- )}
231
- </>
232
- )}
233
- {isBusiness && !!businessesSearchList && businesses?.loading && (
234
- <ScrollView horizontal>
235
- <BusinessControllerSkeletons paginationProps={businessPaginationProps} />
236
- </ScrollView>
237
- )}
238
- {isBusiness && (
239
- <PreviousBusinessOrdered
240
- onNavigationRedirect={onNavigationRedirect}
241
- isBusinessesSearchList={!!businessesSearchList}
242
- businesses={businesses}
243
- handleUpdateBusinesses={handleUpdateBusinesses}
244
- />
245
- )}
205
+ return (
206
+ <>
207
+ {!loading && ordersLength.activeOrdersLength === 0 && ordersLength.previousOrdersLength === 0 && ordersLength?.preordersLength === 0 && !activeOrders && !preOrders && (
208
+ <NoOrdersWrapper>
209
+ <NotFoundSource
210
+ hideImage
211
+ btnStyle={{ borderRadius: 8 }}
212
+ content={t('YOU_DONT_HAVE_ORDERS', 'You don\'t have any orders')}
213
+ btnTitle={t('ORDER_NOW', 'Order now')}
214
+ onClickButton={() => onNavigationRedirect && (businessId ? onNavigationRedirect('Business') : onNavigationRedirect('BusinessList'))}
215
+ />
216
+ </NoOrdersWrapper>
217
+ )}
218
+ {((ordersLength?.activeOrdersLength > 0 && activeOrders) ||
219
+ (ordersLength?.previousOrdersLength > 0 && !activeOrders && !preOrders) ||
220
+ (ordersLength?.preordersLength > 0 && preOrders)
221
+ ) && (
222
+ <>
223
+ {((titleContent && ((isBusiness && businessOrderIds?.length > 0) || isProducts)) || !titleContent) && (
224
+ <OptionTitle titleContent={!!titleContent} isBusinessesSearchList={!!businessesSearchList}>
225
+ <OText size={16} lineHeight={24} weight={'500'} color={theme.colors.textNormal} mBottom={10} >
226
+ {titleContent || (activeOrders
227
+ ? t('ACTIVE', 'Active')
228
+ : preOrders
229
+ ? t('PREORDERS', 'Preorders')
230
+ : t('PAST', 'Past'))}
231
+ </OText>
232
+ </OptionTitle>
233
+ )}
234
+ </>
235
+ )}
236
+ {isBusiness && !!businessesSearchList && businesses?.loading && (
237
+ <ScrollView horizontal>
238
+ <BusinessControllerSkeletons paginationProps={businessPaginationProps} />
239
+ </ScrollView>
240
+ )}
241
+ {isBusiness && (
242
+ <PreviousBusinessOrdered
243
+ onNavigationRedirect={onNavigationRedirect}
244
+ isBusinessesSearchList={!!businessesSearchList}
245
+ businesses={businesses}
246
+ handleUpdateBusinesses={handleUpdateBusinesses}
247
+ />
248
+ )}
246
249
 
247
- {isProducts && !loading && (
248
- <PreviousProductsOrdered
249
- products={products}
250
- onProductClick={onProductClick}
251
- handleUpdateProducts={handleUpdateProducts}
252
- isBusinessesSearchList={!!businessesSearchList}
253
- />
254
- )}
255
- {(loading && isProducts) && (
256
- <>
257
- {[...Array(!!businessesSearchList ? 1 : 4).keys()].map(
258
- (item, i) => (
259
- <Placeholder key={i} style={{ padding: 5, paddingLeft: !!businessesSearchList ? 0 : 40, marginBottom: !!businessesSearchList ? 38 : 0 }} Animation={Fade}>
260
- <View style={{ flexDirection: 'row' }}>
261
- <PlaceholderLine
262
- width={24}
263
- height={70}
264
- style={{ marginRight: 10, marginBottom: 10 }}
265
- />
266
- <Placeholder style={{ paddingVertical: 10 }}>
267
- <PlaceholderLine width={60} style={{ marginBottom: 25 }} />
268
- <PlaceholderLine width={20} />
269
- </Placeholder>
270
- </View>
271
- </Placeholder>
272
- ),
273
- )}
274
- </>
275
- )}
276
- {!error && orders.length > 0 && !hideOrders && (
277
- preOrders ? (
278
- <ActiveOrders
279
- orders={orders.filter((order: any) => orderStatus.includes(order.status))}
280
- pagination={pagination}
281
- loadMoreOrders={loadMoreOrders}
282
- reorderLoading={reorderState?.loading}
283
- customArray={customArray}
284
- getOrderStatus={getOrderStatus}
285
- onNavigationRedirect={onNavigationRedirect}
286
- handleUpdateOrderList={handleUpdateOrderList}
287
- />
288
- ) : activeOrders ? (
289
- <ActiveOrders
290
- orders={orders.filter((order: any) => orderStatus.includes(order.status))}
291
- pagination={pagination}
292
- reorderLoading={reorderState?.loading}
293
- customArray={customArray}
294
- getOrderStatus={getOrderStatus}
295
- onNavigationRedirect={onNavigationRedirect}
296
- handleUpdateOrderList={handleUpdateOrderList}
297
- />
298
- ) : (
299
- <PreviousOrders
300
- reorderLoading={reorderState?.loading}
301
- orders={orders.filter((order: any) => orderStatus.includes(order.status)).sort((a: any, b: any) => a?.id < b?.id)}
302
- pagination={pagination}
303
- loadMoreOrders={loadMoreOrders}
304
- getOrderStatus={getOrderStatus}
305
- onNavigationRedirect={onNavigationRedirect}
306
- handleReorder={handleReorder}
307
- handleUpdateOrderList={handleUpdateOrderList}
308
- loading={loading}
309
- />
310
- )
311
- )}
312
- {loading && !hideOrders && !preOrders && (
313
- <>
314
- {!activeOrders ? (
315
- <Placeholder style={{ marginTop: 30 }} Animation={Fade}>
316
- <View style={{ width: '100%', flexDirection: 'row' }}>
317
- <PlaceholderLine width={20} height={70} style={{ marginRight: 20, marginBottom: 35 }} />
318
- <Placeholder>
319
- <PlaceholderLine width={30} style={{ marginTop: 5 }} />
320
- <PlaceholderLine width={50} />
321
- <PlaceholderLine width={70} />
322
- </Placeholder>
323
- </View>
324
- </Placeholder>
325
- ) : (
326
- <View style={{ marginTop: 30 }}>
327
- {[...Array(5)].map((item, i) => (
328
- <Placeholder key={i} Animation={Fade}>
329
- <View style={{ width: '100%', flexDirection: 'row' }}>
330
- <PlaceholderLine width={20} height={70} style={{ marginRight: 20, marginBottom: 20 }} />
331
- <Placeholder>
332
- <PlaceholderLine width={30} style={{ marginTop: 5 }} />
333
- <PlaceholderLine width={50} />
334
- <PlaceholderLine width={20} />
335
- </Placeholder>
336
- </View>
337
- </Placeholder>
338
- ))}
339
- </View>
340
- )}
341
- </>
342
- )}
343
- </>
344
- )
250
+ {isProducts && !loading && (
251
+ <PreviousProductsOrdered
252
+ products={products}
253
+ onProductClick={onProductClick}
254
+ handleUpdateProducts={handleUpdateProducts}
255
+ isBusinessesSearchList={!!businessesSearchList}
256
+ />
257
+ )}
258
+ {(loading && isProducts) && (
259
+ <>
260
+ {[...Array(!!businessesSearchList ? 1 : 4).keys()].map(
261
+ (item, i) => (
262
+ <Placeholder key={i} style={{ padding: 5, paddingLeft: !!businessesSearchList ? 0 : 40, marginBottom: !!businessesSearchList ? 38 : 0 }} Animation={Fade}>
263
+ <View style={{ flexDirection: 'row' }}>
264
+ <PlaceholderLine
265
+ width={24}
266
+ height={70}
267
+ style={{ marginRight: 10, marginBottom: 10 }}
268
+ />
269
+ <Placeholder style={{ paddingVertical: 10 }}>
270
+ <PlaceholderLine width={60} style={{ marginBottom: 25 }} />
271
+ <PlaceholderLine width={20} />
272
+ </Placeholder>
273
+ </View>
274
+ </Placeholder>
275
+ ),
276
+ )}
277
+ </>
278
+ )}
279
+ {!error && orders.length > 0 && !hideOrders && (
280
+ preOrders ? (
281
+ <ActiveOrders
282
+ orders={orders.filter((order: any) => orderStatus.includes(order.status))}
283
+ pagination={pagination}
284
+ loadMoreOrders={loadMoreOrders}
285
+ reorderLoading={reorderState?.loading}
286
+ customArray={customArray}
287
+ getOrderStatus={getOrderStatus}
288
+ onNavigationRedirect={onNavigationRedirect}
289
+ handleUpdateOrderList={handleUpdateOrderList}
290
+ />
291
+ ) : activeOrders ? (
292
+ <ActiveOrders
293
+ orders={orders.filter((order: any) => orderStatus.includes(order.status))}
294
+ pagination={pagination}
295
+ reorderLoading={reorderState?.loading}
296
+ customArray={customArray}
297
+ getOrderStatus={getOrderStatus}
298
+ onNavigationRedirect={onNavigationRedirect}
299
+ handleUpdateOrderList={handleUpdateOrderList}
300
+ />
301
+ ) : (
302
+ <PreviousOrders
303
+ reorderLoading={reorderState?.loading}
304
+ orders={orders.filter((order: any) => orderStatus.includes(order.status)).sort((a: any, b: any) => a?.id < b?.id)}
305
+ pagination={pagination}
306
+ loadMoreOrders={loadMoreOrders}
307
+ getOrderStatus={getOrderStatus}
308
+ onNavigationRedirect={onNavigationRedirect}
309
+ handleReorder={handleReorder}
310
+ handleUpdateOrderList={handleUpdateOrderList}
311
+ loading={loading}
312
+ />
313
+ )
314
+ )}
315
+ {loading && !hideOrders && !preOrders && (
316
+ <>
317
+ {!activeOrders ? (
318
+ <Placeholder style={{ marginTop: 30 }} Animation={Fade}>
319
+ <View style={{ width: '100%', flexDirection: 'row' }}>
320
+ <PlaceholderLine width={20} height={70} style={{ marginRight: 20, marginBottom: 35 }} />
321
+ <Placeholder>
322
+ <PlaceholderLine width={30} style={{ marginTop: 5 }} />
323
+ <PlaceholderLine width={50} />
324
+ <PlaceholderLine width={70} />
325
+ </Placeholder>
326
+ </View>
327
+ </Placeholder>
328
+ ) : (
329
+ <View style={{ marginTop: 30 }}>
330
+ {[...Array(5)].map((item, i) => (
331
+ <Placeholder key={i} Animation={Fade}>
332
+ <View style={{ width: '100%', flexDirection: 'row' }}>
333
+ <PlaceholderLine width={20} height={70} style={{ marginRight: 20, marginBottom: 20 }} />
334
+ <Placeholder>
335
+ <PlaceholderLine width={30} style={{ marginTop: 5 }} />
336
+ <PlaceholderLine width={50} />
337
+ <PlaceholderLine width={20} />
338
+ </Placeholder>
339
+ </View>
340
+ </Placeholder>
341
+ ))}
342
+ </View>
343
+ )}
344
+ </>
345
+ )}
346
+ </>
347
+ )
345
348
  }
346
349
 
347
350
  export const OrdersOption = (props: OrdersOptionParams) => {
348
- const getAllOrders = props.activeOrders && props.pastOrders && props.preOrders
351
+ const getAllOrders = props.activeOrders && props.pastOrders && props.preOrders
349
352
 
350
- const MyOrdersProps = {
351
- ...props,
352
- UIComponent: OrdersOptionUI,
353
- noGiftCardOrders: true,
354
- orderStatus: getAllOrders
355
- ? [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26]
356
- : props.preOrders ? [13] : props.activeOrders
357
- ? [0, 3, 4, 7, 8, 9, 14, 18, 19, 20, 21, 22, 23, 24, 25, 26]
358
- : [1, 2, 5, 6, 10, 11, 12, 15, 16, 17],
359
- useDefualtSessionManager: true,
360
- paginationSettings: {
361
- initialPage: 1,
362
- pageSize: getAllOrders ? 30 : 10,
363
- controlType: 'infinity'
364
- }
365
- }
353
+ const MyOrdersProps = {
354
+ ...props,
355
+ UIComponent: OrdersOptionUI,
356
+ noGiftCardOrders: true,
357
+ orderStatus: getAllOrders
358
+ ? [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26]
359
+ : props.preOrders ? [13] : props.activeOrders
360
+ ? [0, 3, 4, 7, 8, 9, 14, 18, 19, 20, 21, 22, 23, 24, 25, 26]
361
+ : [1, 2, 5, 6, 10, 11, 12, 15, 16, 17],
362
+ useDefualtSessionManager: true,
363
+ paginationSettings: {
364
+ initialPage: 1,
365
+ pageSize: getAllOrders ? 30 : 10,
366
+ controlType: 'infinity'
367
+ }
368
+ }
366
369
 
367
- return <OrderList {...MyOrdersProps} />
370
+ return <OrderList {...MyOrdersProps} />
368
371
 
369
372
  }