ordering-ui-react-native 0.17.83 → 0.17.84

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.83",
3
+ "version": "0.17.84",
4
4
  "description": "Reusable components made in react native",
5
5
  "main": "src/index.tsx",
6
6
  "author": "ordering.inc",
@@ -288,7 +288,7 @@ export const ProductItemAccordion = (props: ProductItemAccordionParams) => {
288
288
  color={theme.colors.unselectText}>
289
289
  {t('COMMENT', 'Comment')}
290
290
  </OText>
291
- <OText size={12} mLeft={10} color={theme.colors.unselectText}>
291
+ <OText size={12} mLeft={10} style={{ width: '100%' }} color={theme.colors.unselectText}>
292
292
  {product.comment}
293
293
  </OText>
294
294
  </ProductComment>
@@ -340,7 +340,7 @@ const CartUI = (props: any) => {
340
340
  {orderState?.options?.type === 1 && cart?.delivery_price > 0 && (
341
341
  <OSTable>
342
342
  <OText size={12} lineHeight={18}>{t('DELIVERY_FEE', 'Delivery Fee')}</OText>
343
- <OText size={12} lineHeight={18}>{parsePrice(cart?.delivery_price)}</OText>
343
+ <OText size={12} lineHeight={18}>{parsePrice(cart?.delivery_price_with_discount ?? cart?.delivery_price)}</OText>
344
344
  </OSTable>
345
345
  )}
346
346
  {
@@ -16,7 +16,7 @@ import { BusinessController } from '../BusinessController';
16
16
  import { SingleProductCard } from '../SingleProductCard';
17
17
  import { NotFoundSource } from '../NotFoundSource';
18
18
  import moment from 'moment';
19
-
19
+ import { getOrderStatus } from '../../utils'
20
20
 
21
21
  const FavoriteListUI = (props: FavoriteParams) => {
22
22
  const {
@@ -40,40 +40,6 @@ const FavoriteListUI = (props: FavoriteParams) => {
40
40
 
41
41
  const pastOrders = [1, 2, 5, 6, 10, 11, 12, 15, 16, 17]
42
42
 
43
- const getOrderStatus = (s: any) => {
44
- const status = parseInt(s)
45
- const orderStatus = [
46
- { key: 0, value: t('PENDING', theme?.defaultLanguages?.PENDING || 'Pending') },
47
- { key: 1, value: t('COMPLETED', theme?.defaultLanguages?.COMPLETED || 'Completed') },
48
- { key: 2, value: t('REJECTED', theme?.defaultLanguages?.REJECTED || 'Rejected') },
49
- { key: 3, value: t('DRIVER_IN_BUSINESS', theme?.defaultLanguages?.DRIVER_IN_BUSINESS || 'Driver in business') },
50
- { key: 4, value: t('PREPARATION_COMPLETED', theme?.defaultLanguages?.PREPARATION_COMPLETED || 'Preparation Completed') },
51
- { key: 5, value: t('REJECTED_BY_BUSINESS', theme?.defaultLanguages?.REJECTED_BY_BUSINESS || 'Rejected by business') },
52
- { key: 6, value: t('REJECTED_BY_DRIVER', theme?.defaultLanguages?.REJECTED_BY_DRIVER || 'Rejected by Driver') },
53
- { key: 7, value: t('ACCEPTED_BY_BUSINESS', theme?.defaultLanguages?.ACCEPTED_BY_BUSINESS || 'Accepted by business') },
54
- { key: 8, value: t('ACCEPTED_BY_DRIVER', theme?.defaultLanguages?.ACCEPTED_BY_DRIVER || 'Accepted by driver') },
55
- { key: 9, value: t('PICK_UP_COMPLETED_BY_DRIVER', theme?.defaultLanguages?.PICK_UP_COMPLETED_BY_DRIVER || 'Pick up completed by driver') },
56
- { key: 10, value: t('PICK_UP_FAILED_BY_DRIVER', theme?.defaultLanguages?.PICK_UP_FAILED_BY_DRIVER || 'Pick up Failed by driver') },
57
- { key: 11, value: t('DELIVERY_COMPLETED_BY_DRIVER', theme?.defaultLanguages?.DELIVERY_COMPLETED_BY_DRIVER || 'Delivery completed by driver') },
58
- { key: 12, value: t('DELIVERY_FAILED_BY_DRIVER', theme?.defaultLanguages?.DELIVERY_FAILED_BY_DRIVER || 'Delivery Failed by driver') },
59
- { key: 13, value: t('PREORDER', theme?.defaultLanguages?.PREORDER || 'PreOrder') },
60
- { key: 14, value: t('ORDER_NOT_READY', theme?.defaultLanguages?.ORDER_NOT_READY || 'Order not ready') },
61
- { key: 15, value: t('ORDER_PICKEDUP_COMPLETED_BY_CUSTOMER', theme?.defaultLanguages?.ORDER_PICKEDUP_COMPLETED_BY_CUSTOMER || 'Order picked up completed by customer') },
62
- { key: 16, value: t('ORDER_STATUS_CANCELLED_BY_CUSTOMER', theme?.defaultLanguages?.ORDER_STATUS_CANCELLED_BY_CUSTOMER || 'Order cancelled by customer') },
63
- { key: 17, value: t('ORDER_NOT_PICKEDUP_BY_CUSTOMER', theme?.defaultLanguages?.ORDER_NOT_PICKEDUP_BY_CUSTOMER || 'Order not picked up by customer') },
64
- { key: 18, value: t('ORDER_DRIVER_ALMOST_ARRIVED_BUSINESS', theme?.defaultLanguages?.ORDER_DRIVER_ALMOST_ARRIVED_BUSINESS || 'Driver almost arrived to business') },
65
- { key: 19, value: t('ORDER_DRIVER_ALMOST_ARRIVED_CUSTOMER', theme?.defaultLanguages?.ORDER_DRIVER_ALMOST_ARRIVED_CUSTOMER || 'Driver almost arrived to customer') },
66
- { key: 20, value: t('ORDER_CUSTOMER_ALMOST_ARRIVED_BUSINESS', theme?.defaultLanguages?.ORDER_CUSTOMER_ALMOST_ARRIVED_BUSINESS || 'Customer almost arrived to business') },
67
- { key: 21, value: t('ORDER_CUSTOMER_ARRIVED_BUSINESS', theme?.defaultLanguages?.ORDER_CUSTOMER_ARRIVED_BUSINESS || 'Customer arrived to business') },
68
- { key: 22, value: t('ORDER_LOOKING_FOR_DRIVER', theme?.defaultLanguages?.ORDER_LOOKING_FOR_DRIVER || 'Looking for driver') },
69
- { key: 23, value: t('ORDER_DRIVER_ON_WAY', theme?.defaultLanguages?.ORDER_DRIVER_ON_WAY || 'Driver on way') }
70
- ]
71
-
72
- const objectStatus = orderStatus.find((o) => o.key === status)
73
-
74
- return objectStatus && objectStatus
75
- }
76
-
77
43
  const onProductClick = (product: any) => {
78
44
  const categoryId = product?.category?.id
79
45
  const businessId = product?.category?.business?.id
@@ -6,6 +6,7 @@ import { NotFoundSource } from '../NotFoundSource'
6
6
 
7
7
  import { ItemWrap } from './styles'
8
8
  import { OrdersOptionParams } from '../../types'
9
+ import { getOrderStatus } from '../../utils'
9
10
 
10
11
  import {
11
12
  Placeholder,
@@ -67,40 +68,6 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
67
68
  return moment(dateStr).format('MMMM DD,YYYY - hh:mm a');
68
69
  }
69
70
 
70
- const getOrderStatus = (s: string) => {
71
- const status = parseInt(s)
72
- const orderStatus = [
73
- { key: 0, value: t('PENDING', 'Pending') },
74
- { key: 1, value: t('COMPLETED', 'Completed') },
75
- { key: 2, value: t('REJECTED', 'Rejected') },
76
- { key: 3, value: t('DRIVER_IN_BUSINESS', 'Driver in business') },
77
- { key: 4, value: t('PREPARATION_COMPLETED', 'Preparation Completed') },
78
- { key: 5, value: t('REJECTED_BY_BUSINESS', 'Rejected by business') },
79
- { key: 6, value: t('REJECTED_BY_DRIVER', 'Rejected by Driver') },
80
- { key: 7, value: t('ACCEPTED_BY_BUSINESS', 'Accepted by business') },
81
- { key: 8, value: t('ACCEPTED_BY_DRIVER', 'Accepted by driver') },
82
- { key: 9, value: t('PICK_UP_COMPLETED_BY_DRIVER', 'Pick up completed by driver') },
83
- { key: 10, value: t('PICK_UP_FAILED_BY_DRIVER', 'Pick up Failed by driver') },
84
- { key: 11, value: t('DELIVERY_COMPLETED_BY_DRIVER', 'Delivery completed by driver') },
85
- { key: 12, value: t('DELIVERY_FAILED_BY_DRIVER', 'Delivery Failed by driver') },
86
- { key: 13, value: t('PREORDER', 'PreOrder') },
87
- { key: 14, value: t('ORDER_NOT_READY', 'Order not ready') },
88
- { key: 15, value: t('ORDER_PICKEDUP_COMPLETED_BY_CUSTOMER', 'Order picked up completed by customer') },
89
- { key: 16, value: t('CANCELLED_BY_CUSTOMER', 'Cancelled by customer') },
90
- { key: 17, value: t('ORDER_NOT_PICKEDUP_BY_CUSTOMER', 'Order not picked up by customer') },
91
- { key: 18, value: t('DRIVER_ALMOST_ARRIVED_TO_BUSINESS', 'Driver almost arrived to business') },
92
- { key: 19, value: t('DRIVER_ALMOST_ARRIVED_TO_CUSTOMER', 'Driver almost arrived to customer') },
93
- { key: 20, value: t('ORDER_CUSTOMER_ALMOST_ARRIVED_BUSINESS', 'Customer almost arrived to business') },
94
- { key: 21, value: t('ORDER_CUSTOMER_ARRIVED_BUSINESS', 'Customer arrived to business') },
95
- { key: 22, value: t('ORDER_LOOKING_FOR_DRIVER', 'Looking for driver') },
96
- { key: 23, value: t('ORDER_DRIVER_ON_WAY', 'Driver on way') }
97
- ]
98
-
99
- const objectStatus = orderStatus.find((o) => o.key === status)
100
-
101
- return objectStatus && objectStatus
102
- }
103
-
104
71
  return (
105
72
  <>
106
73
  {/* {(orders.length > 0) && (
@@ -21,6 +21,7 @@ import {
21
21
  MessageListingWrapper,
22
22
  MessageContainer
23
23
  } from './styles';
24
+ import { getOrderStatus } from '../../utils'
24
25
 
25
26
  const OrdersOptionUI = (props: OrdersOptionParams) => {
26
27
  const {
@@ -51,40 +52,6 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
51
52
  : theme.images.general.emptyPastOrders
52
53
  const orders = customArray || values || []
53
54
 
54
- const getOrderStatus = (s: string) => {
55
- const status = parseInt(s)
56
- const orderStatus = [
57
- { key: 0, value: t('PENDING', 'Pending') },
58
- { key: 1, value: t('COMPLETED', 'Completed') },
59
- { key: 2, value: t('REJECTED', 'Rejected') },
60
- { key: 3, value: t('DRIVER_IN_BUSINESS', 'Driver in business') },
61
- { key: 4, value: t('PREPARATION_COMPLETED', 'Preparation Completed') },
62
- { key: 5, value: t('REJECTED_BY_BUSINESS', 'Rejected by business') },
63
- { key: 6, value: t('REJECTED_BY_DRIVER', 'Rejected by Driver') },
64
- { key: 7, value: t('ACCEPTED_BY_BUSINESS', 'Accepted by business') },
65
- { key: 8, value: t('ACCEPTED_BY_DRIVER', 'Accepted by driver') },
66
- { key: 9, value: t('PICK_UP_COMPLETED_BY_DRIVER', 'Pick up completed by driver') },
67
- { key: 10, value: t('PICK_UP_FAILED_BY_DRIVER', 'Pick up Failed by driver') },
68
- { key: 11, value: t('DELIVERY_COMPLETED_BY_DRIVER', 'Delivery completed by driver') },
69
- { key: 12, value: t('DELIVERY_FAILED_BY_DRIVER', 'Delivery Failed by driver') },
70
- { key: 13, value: t('PREORDER', 'PreOrder') },
71
- { key: 14, value: t('ORDER_NOT_READY', 'Order not ready') },
72
- { key: 15, value: t('ORDER_PICKEDUP_COMPLETED_BY_CUSTOMER', 'Order picked up completed by customer') },
73
- { key: 16, value: t('CANCELLED_BY_CUSTOMER', 'Cancelled by customer') },
74
- { key: 17, value: t('ORDER_NOT_PICKEDUP_BY_CUSTOMER', 'Order not picked up by customer') },
75
- { key: 18, value: t('DRIVER_ALMOST_ARRIVED_TO_BUSINESS', 'Driver almost arrived to business') },
76
- { key: 19, value: t('DRIVER_ALMOST_ARRIVED_TO_CUSTOMER', 'Driver almost arrived to customer') },
77
- { key: 20, value: t('ORDER_CUSTOMER_ALMOST_ARRIVED_BUSINESS', 'Customer almost arrived to business') },
78
- { key: 21, value: t('ORDER_CUSTOMER_ARRIVED_BUSINESS', 'Customer arrived to business') },
79
- { key: 22, value: t('ORDER_LOOKING_FOR_DRIVER', 'Looking for driver') },
80
- { key: 23, value: t('ORDER_DRIVER_ON_WAY', 'Driver on way') }
81
- ]
82
-
83
- const objectStatus = orderStatus.find((o) => o.key === status)
84
-
85
- return objectStatus && objectStatus
86
- }
87
-
88
55
  const handleClickOrder = (uuid: string) => {
89
56
  setSelectedOrderId(uuid)
90
57
  setOpenMessges(true)
@@ -7,7 +7,7 @@ import {
7
7
  useValidationFields,
8
8
  useSession,
9
9
  useToast,
10
- ToastType,
10
+ ToastType,
11
11
  MultiCheckout as MultiCheckoutController
12
12
  } from 'ordering-components/native'
13
13
  import { View, StyleSheet, Platform } from 'react-native'
@@ -36,11 +36,11 @@ import {
36
36
  } from './styles'
37
37
 
38
38
  const mapConfigs = {
39
- mapZoom: 16,
40
- mapSize: {
41
- width: 640,
42
- height: 190
43
- }
39
+ mapZoom: 16,
40
+ mapSize: {
41
+ width: 640,
42
+ height: 190
43
+ }
44
44
  }
45
45
 
46
46
  const MultiCheckoutUI = (props: any) => {
@@ -54,75 +54,77 @@ const MultiCheckoutUI = (props: any) => {
54
54
  handleSelectPaymethod,
55
55
  handleSelectWallet,
56
56
  handlePaymethodDataChange,
57
- cartUuid
57
+ cartUuid,
58
+ totalCartsFee,
59
+ cartGroup
58
60
  } = props
59
61
 
60
- const theme = useTheme();
62
+ const theme = useTheme();
61
63
  const styles = StyleSheet.create({
62
64
  pagePadding: {
63
- paddingLeft: 40,
64
- paddingRight: 40
65
- },
65
+ paddingLeft: 40,
66
+ paddingRight: 40
67
+ },
66
68
  wrapperNavbar: Platform.OS === 'ios'
67
- ? { paddingVertical: 0, paddingHorizontal: 40 }
68
- : { paddingVertical: 20, paddingHorizontal: 40 }
69
+ ? { paddingVertical: 0, paddingHorizontal: 40 }
70
+ : { paddingVertical: 20, paddingHorizontal: 40 }
69
71
  })
70
72
 
71
- const [, { showToast }] = useToast();
73
+ const [, { showToast }] = useToast();
72
74
  const [, t] = useLanguage()
73
- const [{ configs }] = useConfig();
74
- const [{ parsePrice, parseDate }] = useUtils();
75
- const [{ options, carts, loading }, { confirmCart }] = useOrder();
76
- const [validationFields] = useValidationFields();
75
+ const [{ configs }] = useConfig();
76
+ const [{ parsePrice, parseDate }] = useUtils();
77
+ const [{ options, carts, loading }, { confirmCart }] = useOrder();
78
+ const [validationFields] = useValidationFields();
77
79
  const [{ user }] = useSession()
78
80
 
79
- const configTypes = configs?.order_types_allowed?.value.split('|').map((value: any) => Number(value)) || []
80
- const isPreOrder = configs?.preorder_status_enabled?.value === '1'
81
+ const configTypes = configs?.order_types_allowed?.value.split('|').map((value: any) => Number(value)) || []
82
+ const isPreOrder = configs?.preorder_status_enabled?.value === '1'
81
83
  const maximumCarts = 5
82
84
  const isDisablePlaceOrderButton = !(paymethodSelected?.paymethod_id || paymethodSelected?.wallet_id) || openCarts.length > maximumCarts || (paymethodSelected?.paymethod?.gateway === 'stripe' && !paymethodSelected?.paymethod_data)
83
85
  const walletCarts = (Object.values(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) || []
84
86
 
85
- const [isUserDetailsEdit, setIsUserDetailsEdit] = useState(false);
86
- const [phoneUpdate, setPhoneUpdate] = useState(false);
87
- const [userErrors, setUserErrors] = useState<any>([]);
87
+ const [isUserDetailsEdit, setIsUserDetailsEdit] = useState(false);
88
+ const [phoneUpdate, setPhoneUpdate] = useState(false);
89
+ const [userErrors, setUserErrors] = useState<any>([]);
88
90
  const handleMomentClick = () => {
89
- if (isPreOrder) {
90
- navigation.navigate('MomentOption')
91
- }
92
- }
91
+ if (isPreOrder) {
92
+ navigation.navigate('MomentOption')
93
+ }
94
+ }
93
95
 
94
96
  const checkValidationFields = () => {
95
- setUserErrors([])
96
- const errors = []
97
- const notFields = ['coupon', 'driver_tip', 'mobile_phone', 'address', 'zipcode', 'address_notes']
97
+ setUserErrors([])
98
+ const errors = []
99
+ const notFields = ['coupon', 'driver_tip', 'mobile_phone', 'address', 'zipcode', 'address_notes']
98
100
 
99
- Object.values(validationFields?.fields?.checkout).map((field: any) => {
100
- if (field?.required && !notFields.includes(field.code)) {
101
- if (!user[field?.code]) {
102
- errors.push(t(`VALIDATION_ERROR_${field.code.toUpperCase()}_REQUIRED`, `The field ${field?.name} is required`))
103
- }
104
- }
105
- })
101
+ Object.values(validationFields?.fields?.checkout).map((field: any) => {
102
+ if (field?.required && !notFields.includes(field.code)) {
103
+ if (!user[field?.code]) {
104
+ errors.push(t(`VALIDATION_ERROR_${field.code.toUpperCase()}_REQUIRED`, `The field ${field?.name} is required`))
105
+ }
106
+ }
107
+ })
106
108
 
107
- if (
108
- !user?.cellphone &&
109
- ((validationFields?.fields?.checkout?.cellphone?.enabled &&
110
- validationFields?.fields?.checkout?.cellphone?.required) ||
111
- configs?.verification_phone_required?.value === '1')
112
- ) {
113
- errors.push(t('VALIDATION_ERROR_MOBILE_PHONE_REQUIRED', 'The field Phone number is required'))
114
- }
109
+ if (
110
+ !user?.cellphone &&
111
+ ((validationFields?.fields?.checkout?.cellphone?.enabled &&
112
+ validationFields?.fields?.checkout?.cellphone?.required) ||
113
+ configs?.verification_phone_required?.value === '1')
114
+ ) {
115
+ errors.push(t('VALIDATION_ERROR_MOBILE_PHONE_REQUIRED', 'The field Phone number is required'))
116
+ }
115
117
 
116
- if (phoneUpdate) {
117
- errors.push(t('NECESSARY_UPDATE_COUNTRY_PHONE_CODE', 'It is necessary to update your phone number'))
118
- }
118
+ if (phoneUpdate) {
119
+ errors.push(t('NECESSARY_UPDATE_COUNTRY_PHONE_CODE', 'It is necessary to update your phone number'))
120
+ }
119
121
 
120
- setUserErrors(errors)
121
- }
122
+ setUserErrors(errors)
123
+ }
122
124
 
123
125
  const togglePhoneUpdate = (val: boolean) => {
124
- setPhoneUpdate(val)
125
- }
126
+ setPhoneUpdate(val)
127
+ }
126
128
 
127
129
  const handlePlaceOrder = () => {
128
130
  if (!userErrors.length) {
@@ -130,18 +132,18 @@ const MultiCheckoutUI = (props: any) => {
130
132
  return
131
133
  }
132
134
  let stringError = ''
133
- Object.values(userErrors).map((item: any, i: number) => {
134
- stringError += (i + 1) === userErrors.length ? `- ${item?.message || item}` : `- ${item?.message || item}\n`
135
- })
136
- showToast(ToastType.Error, stringError)
135
+ Object.values(userErrors).map((item: any, i: number) => {
136
+ stringError += (i + 1) === userErrors.length ? `- ${item?.message || item}` : `- ${item?.message || item}\n`
137
+ })
138
+ showToast(ToastType.Error, stringError)
137
139
  setIsUserDetailsEdit(true)
138
140
  }
139
141
 
140
142
  useEffect(() => {
141
- if (validationFields && validationFields?.fields?.checkout) {
142
- checkValidationFields()
143
- }
144
- }, [validationFields, user])
143
+ if (validationFields && validationFields?.fields?.checkout) {
144
+ checkValidationFields()
145
+ }
146
+ }, [validationFields, user])
145
147
 
146
148
  return (
147
149
  <>
@@ -249,7 +251,7 @@ const MultiCheckoutUI = (props: any) => {
249
251
  <View style={{ height: 8, backgroundColor: theme.colors.backgroundGray100, marginTop: 13, marginHorizontal: -40 }} />
250
252
  </React.Fragment>
251
253
  ))}
252
- {openCarts.length === 0 && (
254
+ {!cartGroup?.loading && openCarts.length === 0 && (
253
255
  <CCNotCarts>
254
256
  <OText size={24} style={{ textAlign: 'center' }}>
255
257
  {t('CARTS_NOT_FOUND', 'You don\'t have carts available')}
@@ -263,6 +265,14 @@ const MultiCheckoutUI = (props: any) => {
263
265
  )}
264
266
  {openCarts.length > 0 && (
265
267
  <ChCartsTotal>
268
+ {totalCartsFee && configs?.multi_business_checkout_show_combined_delivery_fee?.value === '1' && (
269
+ <View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>
270
+ <OText size={14} lineHeight={24} color={theme.colors.textNormal} weight={'400'}>
271
+ {t('TOTAL_DELIVERY_FEE', 'Total delivery fee')}
272
+ </OText>
273
+ <OText size={14} lineHeight={24} color={theme.colors.textNormal} weight={'400'}>{parsePrice(totalCartsFee)}</OText>
274
+ </View>
275
+ )}
266
276
  <View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>
267
277
  <OText size={16} lineHeight={24} color={theme.colors.textNormal} weight={'500'}>
268
278
  {t('TOTAL_FOR_ALL_CARTS', 'Total for all Carts')}
@@ -283,14 +293,14 @@ const MultiCheckoutUI = (props: any) => {
283
293
  </ChSection>
284
294
  </ChContainer>
285
295
  </Container>
286
-
296
+
287
297
  <FloatingButton
288
- handleClick={() => handlePlaceOrder()}
298
+ handleClick={() => handlePlaceOrder()}
289
299
  isSecondaryBtn={isDisablePlaceOrderButton}
290
300
  disabled={isDisablePlaceOrderButton}
291
301
  btnText={placing ? t('PLACING', 'Placing') : t('PLACE_ORDER', 'Place Order')}
292
302
  btnRightValueShow
293
- btnRightValue={parsePrice(totalCartsPrice)}
303
+ btnRightValue={parsePrice(totalCartsPrice)}
294
304
  iosBottom={30}
295
305
  />
296
306
  </>