ordering-ui-react-native 0.15.80 → 0.15.81

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.
Files changed (2) hide show
  1. package/package.json +1 -1
  2. package/themes/original/src/components/Promotions/index.tsx +128 -128
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ordering-ui-react-native",
3
- "version": "0.15.80",
3
+ "version": "0.15.81",
4
4
  "description": "Reusable components made in react native",
5
5
  "main": "src/index.tsx",
6
6
  "author": "ordering.inc",
package/themes/original/src/components/Promotions/index.tsx CHANGED
@@ -1,5 +1,5 @@
1
1
  import React, { useState } from 'react'
2
- import { PromotionsController, useLanguage, useUtils, useEvent } from 'ordering-components/native'
2
+ import { PromotionsController, useLanguage, useUtils } from 'ordering-components/native'
3
3
  import {
4
4
  PromotionsContainer,
5
5
  SingleOfferContainer,
@@ -17,9 +17,11 @@ import { useTheme } from 'styled-components/native';
17
17
  import { OButton, OIcon, OModal, OText } from '../shared'
18
18
  import { Placeholder, PlaceholderLine } from 'rn-placeholder'
19
19
  import { NotFoundSource } from '../NotFoundSource'
20
- import { View, StyleSheet, ScrollView } from 'react-native'
20
+ import { View, StyleSheet, ScrollView, Platform } from 'react-native'
21
21
  import FastImage from 'react-native-fast-image'
22
22
  import { PromotionParams } from '../../types'
23
+ import { Container } from '../../layouts/Container'
24
+
23
25
  const PromotionsUI = (props: PromotionParams) => {
24
26
  const {
25
27
  navigation,
@@ -85,139 +87,137 @@ const PromotionsUI = (props: PromotionParams) => {
85
87
  : t('SERVICE_FEE', 'Service fee')
86
88
 
87
89
  return (
88
- <PromotionsContainer>
90
+ <Container noPadding>
89
91
  <NavBar
90
- onActionLeft={() => navigation.goBack()}
91
- btnStyle={{ paddingLeft: 0 }}
92
- paddingTop={20}
93
- style={{ paddingBottom: 0, flexDirection: 'column', alignItems: 'flex-start' }}
94
92
  title={t('PROMOTIONS', 'Promotions')}
95
93
  titleAlign={'center'}
96
- titleStyle={{ fontSize: 16, marginRight: 0, marginLeft: 0, marginBottom: 10 }}
97
- titleWrapStyle={{ paddingHorizontal: 0 }}
94
+ onActionLeft={() => navigation.goBack()}
95
+ showCall={false}
98
96
  />
99
- <SearchBarContainer>
100
- <SearchBar
101
- placeholder={t('SEARCH_OFFERS', 'Search offers')}
102
- onSearch={handleSearchValue}
103
- />
104
- </SearchBarContainer>
97
+ <PromotionsContainer>
98
+ <SearchBarContainer>
99
+ <SearchBar
100
+ placeholder={t('SEARCH_OFFERS', 'Search offers')}
101
+ onSearch={handleSearchValue}
102
+ />
103
+ </SearchBarContainer>
105
104
 
106
- {offersState?.loading && (
107
- <>
108
- {[...Array(5).keys()].map((key, i) => (
109
- <Placeholder key={i} style={{ flexDirection: 'row', marginBottom: 20 }}>
110
- <PlaceholderLine height={10} width={45} />
111
- <PlaceholderLine height={10} width={60} />
112
- <PlaceholderLine height={10} width={75} />
113
- </Placeholder>
114
- ))}
115
- </>
116
- )}
117
- {((!offersState?.loading && filteredOffers?.length === 0) || offersState?.error) && (
118
- <NotFoundSource
119
- content={offersState?.error || t('NOT_FOUND_OFFERS', 'Not found offers')}
120
- />
121
- )}
122
- <ScrollView>
123
- {!offersState?.loading && offersState.offers?.length > 0 && filteredOffers?.map((offer: any) => (
124
- <SingleOfferContainer key={offer.id}>
125
- <OfferInformation>
126
- <OText style={styles.offerTitle} numberOfLines={2}>{offer?.name}</OText>
127
- {offer?.description && (
128
- <OText style={styles.offerDescription} numberOfLines={2}>{offer?.description}</OText>
129
- )}
130
- <OText style={styles.offerExtraInfo}>
131
- {t('EXPIRES', 'Expires')} {parseDate(offer?.end, { outputFormat: 'MMM DD, YYYY' })}
132
- </OText>
133
- <AvailableBusinesses>
134
- <OText style={styles.offerExtraInfo} numberOfLines={1}>
135
- {t('APPLY_FOR', 'Apply for')}:
136
- {offer.businesses.map((business: any, i: number) => (
137
- <React.Fragment key={i}>{' '}{business?.name}{i + 1 < offer.businesses?.length ? ',' : ''}</React.Fragment>
138
- ))}
105
+ {offersState?.loading && (
106
+ <>
107
+ {[...Array(5).keys()].map((key, i) => (
108
+ <Placeholder key={i} style={{ flexDirection: 'row', marginBottom: 20 }}>
109
+ <PlaceholderLine height={10} width={45} />
110
+ <PlaceholderLine height={10} width={60} />
111
+ <PlaceholderLine height={10} width={75} />
112
+ </Placeholder>
113
+ ))}
114
+ </>
115
+ )}
116
+ {((!offersState?.loading && filteredOffers?.length === 0) || offersState?.error) && (
117
+ <NotFoundSource
118
+ content={offersState?.error || t('NOT_FOUND_OFFERS', 'Not found offers')}
119
+ />
120
+ )}
121
+ <ScrollView>
122
+ {!offersState?.loading && offersState.offers?.length > 0 && filteredOffers?.map((offer: any) => (
123
+ <SingleOfferContainer key={offer.id}>
124
+ <OfferInformation>
125
+ <OText style={styles.offerTitle} numberOfLines={2}>{offer?.name}</OText>
126
+ {offer?.description && (
127
+ <OText style={styles.offerDescription} numberOfLines={2}>{offer?.description}</OText>
128
+ )}
129
+ <OText style={styles.offerExtraInfo}>
130
+ {t('EXPIRES', 'Expires')} {parseDate(offer?.end, { outputFormat: 'MMM DD, YYYY' })}
139
131
  </OText>
140
- </AvailableBusinesses>
141
- </OfferInformation>
142
- <OButton
143
- onClick={() => handleClickOffer(offer)}
144
- text={t('VIEW', 'View')}
145
- style={styles.buttonStyle}
146
- textStyle={{ fontSize: 10, color: '#fff', flexWrap: 'nowrap' }}
147
- />
148
- </SingleOfferContainer>
149
- ))}
150
- </ScrollView>
151
- <OModal
152
- open={openModal}
153
- onClose={() => setOpenModal(false)}
154
- entireModal
132
+ <AvailableBusinesses>
133
+ <OText style={styles.offerExtraInfo} numberOfLines={1}>
134
+ {t('APPLY_FOR', 'Apply for')}:
135
+ {offer.businesses.map((business: any, i: number) => (
136
+ <React.Fragment key={i}>{' '}{business?.name}{i + 1 < offer.businesses?.length ? ',' : ''}</React.Fragment>
137
+ ))}
138
+ </OText>
139
+ </AvailableBusinesses>
140
+ </OfferInformation>
141
+ <OButton
142
+ onClick={() => handleClickOffer(offer)}
143
+ text={t('VIEW', 'View')}
144
+ style={styles.buttonStyle}
145
+ textStyle={{ fontSize: 10, color: '#fff', flexWrap: 'nowrap' }}
146
+ />
147
+ </SingleOfferContainer>
148
+ ))}
149
+ </ScrollView>
150
+ <OModal
151
+ open={openModal}
152
+ onClose={() => setOpenModal(false)}
153
+ entireModal
155
154
 
156
- title={``}
157
- >
158
- <View style={{ padding: 20 }}>
159
- <OText style={{ alignSelf: 'center', fontWeight: '700' }} mBottom={20}>
160
- {offerSelected?.name} / {t('VALUE_OF_OFFER', 'Value of offer')}: {offerSelected?.rate_type === 1 ? `${offerSelected?.rate}%` : `${parsePrice(offerSelected?.rate)}`}
161
- </OText>
162
- <OfferData>
163
- {offerSelected?.type === 2 && (
164
- <Code>
165
- <OText>{t('YOUR_CODE', 'Your code')}</OText>
166
- <OText color={theme.colors.primary}>{offerSelected.coupon}</OText>
167
- </Code>
168
- )}
169
- <OText>{t('APPLIES_TO', 'Applies to')}: {targetString}</OText>
170
- {offerSelected?.auto && (
171
- <OText>{t('OFFER_AUTOMATIC', 'This offer applies automatic')}</OText>
172
- )}
173
- {offerSelected?.minimum && (
174
- <OText>{t('MINIMUM_PURCHASE_FOR_OFFER', 'Minimum purchase for use this offer')}: {parsePrice(offerSelected?.minimum)}</OText>
175
- )}
176
- {offerSelected?.max_discount && (
177
- <OText>{t('MAX_DISCOUNT_ALLOWED', 'Max discount allowed')}: {parsePrice(offerSelected?.max_discount)}</OText>
178
- )}
179
- {offerSelected?.description && (
180
- <OText>{offerSelected?.description}</OText>
181
- )}
182
- </OfferData>
183
- <OText style={{ marginTop: 10, marginBottom: 10 }}>
184
- {t('AVAILABLE_BUSINESSES_FOR_OFFER', 'Available businesses for this offer')}:
185
- </OText>
186
- <ScrollView style={{ height: '75%' }}>
187
- {offerSelected?.businesses?.map((business: any) => {
188
- return (
189
- <SingleBusinessOffer key={business.id}>
190
- {business?.logo ? (
191
- <FastImage
192
- style={styles.productStyle}
193
- source={{
194
- uri: optimizeImage(business?.logo, 'h_250,c_limit'),
195
- priority: FastImage.priority.normal,
196
- }}
197
- resizeMode={FastImage.resizeMode.cover}
198
- />
199
- ) : (
200
- <OIcon
201
- src={theme?.images?.dummies?.product}
202
- style={styles.productStyle}
203
- />
204
- )}
205
- <BusinessInfo>
206
- <OText style={{ maxWidth: '60%' }}>{business.name}</OText>
207
- <OButton
208
- onClick={() => handleBusinessClick(business)}
209
- text={t('GO_TO_BUSINESSS', 'Go to business')}
210
- style={styles.modalButtonStyle}
211
- textStyle={{ fontSize: 10, color: '#fff' }}
212
- />
213
- </BusinessInfo>
214
- </SingleBusinessOffer>
215
- )
216
- })}
217
- </ScrollView>
218
- </View>
219
- </OModal>
220
- </PromotionsContainer>
155
+ title={``}
156
+ >
157
+ <View style={{ padding: 20 }}>
158
+ <OText style={{ alignSelf: 'center', fontWeight: '700' }} mBottom={20}>
159
+ {offerSelected?.name} / {t('VALUE_OF_OFFER', 'Value of offer')}: {offerSelected?.rate_type === 1 ? `${offerSelected?.rate}%` : `${parsePrice(offerSelected?.rate)}`}
160
+ </OText>
161
+ <OfferData>
162
+ {offerSelected?.type === 2 && (
163
+ <Code>
164
+ <OText>{t('YOUR_CODE', 'Your code')}</OText>
165
+ <OText color={theme.colors.primary}>{offerSelected.coupon}</OText>
166
+ </Code>
167
+ )}
168
+ <OText>{t('APPLIES_TO', 'Applies to')}: {targetString}</OText>
169
+ {offerSelected?.auto && (
170
+ <OText>{t('OFFER_AUTOMATIC', 'This offer applies automatic')}</OText>
171
+ )}
172
+ {offerSelected?.minimum && (
173
+ <OText>{t('MINIMUM_PURCHASE_FOR_OFFER', 'Minimum purchase for use this offer')}: {parsePrice(offerSelected?.minimum)}</OText>
174
+ )}
175
+ {offerSelected?.max_discount && (
176
+ <OText>{t('MAX_DISCOUNT_ALLOWED', 'Max discount allowed')}: {parsePrice(offerSelected?.max_discount)}</OText>
177
+ )}
178
+ {offerSelected?.description && (
179
+ <OText>{offerSelected?.description}</OText>
180
+ )}
181
+ </OfferData>
182
+ <OText style={{ marginTop: 10, marginBottom: 10 }}>
183
+ {t('AVAILABLE_BUSINESSES_FOR_OFFER', 'Available businesses for this offer')}:
184
+ </OText>
185
+ <ScrollView style={{ height: '75%' }}>
186
+ {offerSelected?.businesses?.map((business: any) => {
187
+ return (
188
+ <SingleBusinessOffer key={business.id}>
189
+ {business?.logo ? (
190
+ <FastImage
191
+ style={styles.productStyle}
192
+ source={{
193
+ uri: optimizeImage(business?.logo, 'h_250,c_limit'),
194
+ priority: FastImage.priority.normal,
195
+ }}
196
+ resizeMode={FastImage.resizeMode.cover}
197
+ />
198
+ ) : (
199
+ <OIcon
200
+ src={theme?.images?.dummies?.product}
201
+ style={styles.productStyle}
202
+ />
203
+ )}
204
+ <BusinessInfo>
205
+ <OText style={{ maxWidth: '60%' }}>{business.name}</OText>
206
+ <OButton
207
+ onClick={() => handleBusinessClick(business)}
208
+ text={t('GO_TO_BUSINESSS', 'Go to business')}
209
+ style={styles.modalButtonStyle}
210
+ textStyle={{ fontSize: 10, color: '#fff' }}
211
+ />
212
+ </BusinessInfo>
213
+ </SingleBusinessOffer>
214
+ )
215
+ })}
216
+ </ScrollView>
217
+ </View>
218
+ </OModal>
219
+ </PromotionsContainer>
220
+ </Container>
221
221
  )
222
222
  }
223
223