ordering-ui-react-native 0.22.71 → 0.22.72

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.22.71",
3
+ "version": "0.22.72",
4
4
  "description": "Reusable components made in react native",
5
5
  "main": "src/index.tsx",
6
6
  "author": "ordering.inc",
@@ -872,7 +872,7 @@ const AddressFormUI = (props: AddressFormParams) => {
872
872
  text={t('CANCEL', 'Cancel')}
873
873
  bgColor={theme.colors.secundary}
874
874
  borderColor={theme.colors.secundary}
875
- textStyle={{ color: theme.colors.black }}
875
+ textStyle={{ color: theme.colors.textNormal }}
876
876
  style={{ borderRadius: 7.6, borderWidth: 1, shadowOpacity: 0 }}
877
877
  onClick={() => navigation?.canGoBack() && navigation.goBack()}
878
878
  />
@@ -58,6 +58,7 @@ export const BusinessItemAccordion = (props: any) => {
58
58
  }, cart?.subtotal)
59
59
 
60
60
  const bgStyle = (subtotalWithTaxes < cart?.minimum || !cart?.valid_address) ? theme.colors.secundary : theme.colors.primary
61
+ const textStyles = (subtotalWithTaxes < cart?.minimum || !cart?.valid_address) ? theme.colors.black : theme.colors.white
61
62
 
62
63
  useEffect(() => {
63
64
  if (isActive && !isFromUpselling) {
@@ -155,7 +156,7 @@ export const BusinessItemAccordion = (props: any) => {
155
156
  {cart?.valid_products && (
156
157
  <OButton
157
158
  onClick={handleClickCheckout}
158
- textStyle={{ color: 'white', textAlign: 'center', flex: 1 }}
159
+ textStyle={{ color: textStyles, textAlign: 'center', flex: 1 }}
159
160
  style={{ width: 180, flexDirection: 'row', justifyContent: 'center', borderRadius: 7.6, shadowOpacity: 0 }}
160
161
  text={t('CHECKOUT', 'Checkout')}
161
162
  bgColor={bgStyle}
@@ -243,7 +243,7 @@ export const BusinessSearchFooter = (props: any) => {
243
243
  onClick={() => handleChangePriceRange(price?.level)}
244
244
  text={`${price.content} ${(filters?.price_level === price?.level) ? ' X' : ''}`}
245
245
  style={styles.priceItem}
246
- textStyle={{ fontSize: 10, color: (filters?.price_level === price?.level) ? theme.colors.backgroundLight : theme.colors.textNormal }}
246
+ textStyle={{ fontSize: 10, color: (filters?.price_level === price?.level) ? theme.colors.white : theme.colors.textNormal }}
247
247
  />
248
248
  ))}
249
249
  </View>
@@ -284,7 +284,7 @@ export const BusinessSearchFooter = (props: any) => {
284
284
  onClick={() => handleChangeActiveBusinessType(type)}
285
285
  text={`${t(`BUSINESS_TYPE_${type.name.replace(/\s/g, '_').toUpperCase()}`, type.name)} ${filters?.business_types?.includes(type?.id) ? 'X' : ''}`}
286
286
  style={styles.categoryStyle}
287
- textStyle={{ fontSize: 10, color: (filters?.business_types?.includes(type?.id) || (type?.id === null && filters?.business_types?.length === 0)) ? '#fff' : theme.colors.textNormal }}
287
+ textStyle={{ fontSize: 10, color: (filters?.business_types?.includes(type?.id) || (type?.id === null && filters?.business_types?.length === 0)) ? theme.colors.white : theme.colors.textNormal }}
288
288
  />
289
289
  ))}
290
290
  </View>
@@ -296,7 +296,6 @@ export const BusinessSearchFooter = (props: any) => {
296
296
  <OButton
297
297
  text={t('APPLY', 'Apply')}
298
298
  parentStyle={styles.applyButton}
299
- textStyle={{ color: '#fff' }}
300
299
  onClick={() => handleApplyFilters()}
301
300
  />
302
301
  </View>
@@ -16,7 +16,7 @@ interface SubcategoriesComponentParams {
16
16
  onClickSubcategory: any
17
17
  }
18
18
 
19
- const SubcategoriesComponent = (props : SubcategoriesComponentParams) => {
19
+ const SubcategoriesComponent = (props: SubcategoriesComponentParams) => {
20
20
  const {
21
21
  subcategoriesSelected,
22
22
  category,
@@ -56,10 +56,10 @@ const SubcategoriesComponent = (props : SubcategoriesComponentParams) => {
56
56
  >
57
57
  <OButton
58
58
  onClick={() => onClickSubcategory(null, category)}
59
- bgColor={allsubcategorySelected ? theme.colors.primary : theme.colors.backgroundGray}
60
59
  text={`${t('ALL', 'All')} ${allsubcategorySelected ? 'X' : ''}`}
61
60
  style={bpStyles.categoryButtonStyle}
62
- textStyle={{ color: allsubcategorySelected ? theme.colors.white : theme.colors.textNormal, fontSize: 12 }}
61
+ textStyle={{ fontSize: 12 }}
62
+ isDisabled={!allsubcategorySelected}
63
63
  />
64
64
  </ContainerButton>
65
65
  {category?.subcategories?.map((subcategory: any) => {
@@ -71,10 +71,10 @@ const SubcategoriesComponent = (props : SubcategoriesComponentParams) => {
71
71
  >
72
72
  <OButton
73
73
  onClick={() => onClickSubcategory(subcategory, category)}
74
- bgColor={isSubcategorySelected ? theme.colors.primary : theme.colors.backgroundGray}
75
74
  text={`${subcategory?.name} ${isSubcategorySelected ? 'X' : ''}`}
76
75
  style={bpStyles.categoryButtonStyle}
77
- textStyle={{ color: isSubcategorySelected ? theme.colors.white : theme.colors.textNormal, fontSize: 12 }}
76
+ textStyle={{ fontSize: 12 }}
77
+ isDisabled={!allsubcategorySelected}
78
78
  />
79
79
  </ContainerButton>
80
80
  )
@@ -214,11 +214,11 @@ const BusinessProductsListUI = (props: BusinessProductsListParams) => {
214
214
  text={t('VIEW_MORE', 'View more')}
215
215
  parentStyle={{ padding: 0 }}
216
216
  onClick={() => setOpenDescription(category)}
217
- bgColor='transparent'
217
+ bgColor={theme.colors.white}
218
+ borderColor={theme.colors.primary}
218
219
  textStyle={{
219
220
  fontSize: 12,
220
221
  borderBottomWidth: 1,
221
- borderBottomColor: theme.colors.primary,
222
222
  color: theme.colors.primary
223
223
  }}
224
224
  />
@@ -26,9 +26,9 @@ import { BusinessTypeFilterParams } from '../../types';
26
26
  const windowWidth = Dimensions.get('window').width;
27
27
 
28
28
  export const BusinessTypeFilterUI = (props: BusinessTypeFilterParams) => {
29
- const {
30
- typesState,
31
- currentTypeSelected,
29
+ const {
30
+ typesState,
31
+ currentTypeSelected,
32
32
  handleChangeBusinessType,
33
33
  setBusinessTypes,
34
34
  isAppoint
@@ -38,13 +38,13 @@ export const BusinessTypeFilterUI = (props: BusinessTypeFilterParams) => {
38
38
 
39
39
  const theme = useTheme();
40
40
  const [isOpenAllCategories, setIsOpenAllCategories] = useState(false)
41
- const defaultImage = (name : string) => theme.images?.categories?.[name.toLowerCase().replace(' ', '')]
41
+ const defaultImage = (name: string) => theme.images?.categories?.[name.toLowerCase().replace(' ', '')]
42
42
 
43
43
  useEffect(() => {
44
- if(typesState?.types?.length > 0){
45
- setBusinessTypes && setBusinessTypes(typesState?.types)
44
+ if (typesState?.types?.length > 0) {
45
+ setBusinessTypes && setBusinessTypes(typesState?.types)
46
46
  }
47
- }, [typesState])
47
+ }, [typesState])
48
48
 
49
49
  const handleChangeServiceType = (serviceId: any) => {
50
50
  if (serviceId === currentTypeSelected) {
@@ -119,10 +119,11 @@ export const BusinessTypeFilterUI = (props: BusinessTypeFilterParams) => {
119
119
  <OButton
120
120
  key={i}
121
121
  bgColor={(currentTypeSelected === businessType?.id) ? theme.colors.primary : theme.colors.backgroundGray200}
122
+ borderColor={(currentTypeSelected === businessType?.id) ? theme.colors.primary : theme.colors.backgroundGray200}
122
123
  onClick={() => handleChangeServiceType(businessType?.id)}
123
124
  text={`${businessType?.name} ${(currentTypeSelected === businessType?.id) ? ' X' : ''}`}
124
125
  style={styles.businessType}
125
- textStyle={{ fontSize: 10, color: (currentTypeSelected === businessType?.id) ? theme.colors.backgroundLight : theme.colors.textNormal }}
126
+ textStyle={{ fontSize: 10, color: (currentTypeSelected === businessType?.id) ? theme.colors.white : theme.colors.textNormal }}
126
127
  />
127
128
  ))}
128
129
  </ServiceWrapper>
@@ -392,10 +392,11 @@ const BusinessesListingUI = (props: BusinessesListingParams) => {
392
392
  <OButton
393
393
  key={i}
394
394
  bgColor={(priceLevelSelected === price?.level) ? theme.colors.primary : theme.colors.backgroundGray200}
395
+ borderColor={(priceLevelSelected === price?.level) ? theme.colors.primary : theme.colors.backgroundGray200}
395
396
  onClick={() => handleChangePriceLevel(price?.level)}
396
397
  text={`${price.content} ${(priceLevelSelected === price?.level) ? ' X' : ''}`}
397
398
  style={styles.priceLevel}
398
- textStyle={{ fontSize: 10, color: (priceLevelSelected === price?.level) ? theme.colors.backgroundLight : theme.colors.textNormal }}
399
+ textStyle={{ fontSize: 10, color: (priceLevelSelected === price?.level) ? theme.colors.backgroundLight : theme.colors.black }}
399
400
  />
400
401
  ))}
401
402
  </ScrollView>
@@ -561,6 +561,7 @@ const CartUI = (props: any) => {
561
561
  `${t('MINIMUN_SUBTOTAL_ORDER', 'Minimum subtotal order:')} ${parsePrice(cart?.minimum)}`
562
562
  )}
563
563
  bgColor={(subtotalWithTaxes < cart?.minimum || !cart?.valid_address) ? theme.colors.secundary : theme.colors.primary}
564
+ borderColor={(subtotalWithTaxes < cart?.minimum || !cart?.valid_address) ? theme.colors.secundary : theme.colors.primary}
564
565
  isDisabled={(openUpselling && !canOpenUpselling) || subtotalWithTaxes < cart?.minimum || !cart?.valid_address}
565
566
  imgRightSrc={null}
566
567
  textStyle={{ textAlign: 'center', flex: 1 }}
@@ -174,9 +174,7 @@ export const CartContent = (props: any) => {
174
174
  <CheckoutAction style={{ marginTop: 0 }}>
175
175
  <OButton
176
176
  text={t('CHECKOUT', 'Checkout')}
177
- bgColor={!cartsAvailable.length ? theme.colors.secundary : theme.colors.primary}
178
177
  isDisabled={!cartsAvailable.length}
179
- borderColor={!cartsAvailable.length ? theme.colors.secundary : theme.colors.primary}
180
178
  imgRightSrc={null}
181
179
  onClick={() => handleCheckoutRedirect()}
182
180
  style={{ width: '100%', flexDirection: 'row', justifyContent: 'center', borderRadius: 7.6, shadowOpacity: 0 }}
@@ -208,8 +208,7 @@ const ForgotPasswordUI = (props: any) => {
208
208
 
209
209
  <OButton
210
210
  text={emailSent && !formState.result?.error ? t('LINK_SEND_FORGOT_PASSWORD', 'Link Sent') : t('FRONT_RECOVER_PASSWORD', 'Recover Password')}
211
- bgColor={emailSent && !formState.result?.error ? theme.colors.disabled : theme.colors.primary}
212
- borderColor={emailSent && !formState.result?.error ? theme.colors.disabled : theme.colors.primary}
211
+ isDisabled={formState.loading || emailSent && !formState.result?.error}
213
212
  isLoading={formState.loading}
214
213
  imgRightSrc={null}
215
214
  onClick={emailSent && !formState.result?.error ? () => { } : handleSubmit(onSubmit)}
@@ -399,9 +399,6 @@ const MultiCheckoutUI = (props: any) => {
399
399
  />
400
400
  <OButton
401
401
  text={t('LOGIN', 'Login')}
402
- textStyle={{ color: theme.colors.primary }}
403
- bgColor={theme.colors.white}
404
- borderColor={theme.colors.primary}
405
402
  style={{ borderRadius: 7.6, marginTop: 20 }}
406
403
  onClick={() => setOpenModal({ ...openModal, login: true })}
407
404
  />
@@ -832,8 +832,8 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
832
832
  <OButton
833
833
  text={t('YOUR_ORDERS', 'Your Orders')}
834
834
  textStyle={{ fontSize: 14, color: theme.colors.primary }}
835
+ bgColor={theme.colors.white}
835
836
  imgRightSrc={null}
836
- bgColor={theme.colors.clear}
837
837
  style={{ borderRadius: 7.6, borderWidth: 1, height: 44, shadowOpacity: 0 }}
838
838
  parentStyle={{ marginTop: 29, marginEnd: 15 }}
839
839
  onClick={() => navigation.navigate('BottomTab', { screen: 'MyOrders' })}
@@ -43,9 +43,9 @@ export const ActionButton = (props: any) => {
43
43
  style={{
44
44
  width: isHaveWeight ? '100%' : ((isSoldOut || maxProductQuantity <= 0) ? '60%' : '40%'),
45
45
  }}>
46
- {((productCart &&
46
+ {(productCart &&
47
47
  auth &&
48
- (orderState.options?.address_id || isAllowUnaddressOrderType)) || (isSoldOut || maxProductQuantity <= 0)) && (
48
+ ((orderState.options?.address_id || isAllowUnaddressOrderType) || (isSoldOut || maxProductQuantity <= 0))) && (
49
49
  <OButton
50
50
  onClick={() => handleSaveProduct()}
51
51
  imgRightSrc=""
@@ -57,15 +57,11 @@ export const ActionButton = (props: any) => {
57
57
  ? t('UPDATE', 'Update')
58
58
  : t('ADD', 'Add')
59
59
  }`}
60
- isDisabled={isSoldOut || maxProductQuantity <= 0 || (product?.minimum_per_order && ((productCart?.quantity + productAddedToCartLength) < product?.minimum_per_order)) || (product?.maximum_per_order && ((productCart?.quantity + productAddedToCartLength) > product?.maximum_per_order))}
60
+ isDisabled={buttonColor}
61
61
  textStyle={{
62
- color: theme.colors.white,
63
62
  fontSize: orderState.loading || editMode ? 10 : 14
64
63
  }}
65
- bgColor={buttonColor ? theme.colors.lightGray : theme.colors.primary}
66
- borderColor={buttonColor ? theme.colors.lightGray : theme.colors.primary}
67
64
  style={{
68
- opacity: saveErrors || isSoldOut || maxProductQuantity <= 0 ? 0.3 : 1,
69
65
  borderRadius: 7.6,
70
66
  height: 44,
71
67
  shadowOpacity: 0,
@@ -96,12 +92,12 @@ export const ActionButton = (props: any) => {
96
92
  : t('LOGIN_SIGNUP', 'Login / Sign Up')
97
93
  }
98
94
  imgRightSrc=""
99
- textStyle={{ fontSize: 13, textAlign: 'center', color: theme.colors.primary }}
95
+ textStyle={{ fontSize: 13, textAlign: 'center' }}
100
96
  style={{
101
97
  height: 42,
102
- backgroundColor: theme.colors.white,
103
98
  paddingLeft: 0,
104
- paddingRight: 0
99
+ paddingRight: 0,
100
+ borderRadius: 7.6
105
101
  }}
106
102
  />
107
103
  )}
@@ -314,9 +314,7 @@ const SingleProductCardUI = React.memo((props: SingleProductCardParams) => {
314
314
  height: 40
315
315
 
316
316
  }}
317
- bgColor={isSoldOut ? '#B8B8B8' : theme?.colors?.white}
318
- borderColor={isSoldOut ? '#B8B8B8' : theme?.colors?.white}
319
- textStyle={{ color: isSoldOut ? theme?.colors?.white : theme?.colors?.primary }}
317
+ isDisabled={isSoldOut}
320
318
  text={t('ADD', 'Add')}
321
319
  />
322
320
  )}
@@ -95,8 +95,8 @@ const OButton = (props: Props): React.ReactElement => {
95
95
  if (props.isDisabled) {
96
96
  return (
97
97
  <View style={props.parentStyle}>
98
- <StyledButtonDisabled style={props.style}>
99
- <StyledTextDisabled style={props.textStyle}>
98
+ <StyledButtonDisabled style={{ ...props.style, backgroundColor: theme.colors.disabled }}>
99
+ <StyledTextDisabled style={{ ...props.textStyle, color: theme.colors.backgroundGray200 }}>
100
100
  {props.text}
101
101
  </StyledTextDisabled>
102
102
  </StyledButtonDisabled>