@propel-nsl/propel-react-native-sdk 1.2.0 → 1.2.1

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 (5) hide show
  1. package/package.json +1 -1
  2. package/src/screens/ProductDetails/index.tsx +6 -4
  3. package/src/screens/ProductDetails/styles.ts +24 -20
  4. package/src/screens/Reedem/index.tsx +18 -14
  5. package/src/screens/Reedem/styles.ts +24 -18
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@propel-nsl/propel-react-native-sdk",
3
- "version": "1.2.0",
3
+ "version": "1.2.1",
4
4
  "description": "Propel Mobile SDK - React Native Core",
5
5
  "files": [
6
6
  "src/",
package/src/screens/ProductDetails/index.tsx CHANGED
@@ -484,21 +484,23 @@ const ProductDetail: React.FC = () => {
484
484
 
485
485
  return (
486
486
  <SafeAreaView style={styles.container}>
487
- <View style={styles.header}>
488
- <View style={styles.headerContent}>
487
+ <View style={styles.headerSection}>
488
+ <View style={styles.userInfo}>
489
489
  <TouchableOpacity
490
490
  onPress={() => handleGoBack()}
491
491
  >
492
492
  <BackIcon />
493
493
  </TouchableOpacity>
494
+ </View>
495
+ <View style={styles.headerIcons}>
494
496
  <TouchableOpacity
495
497
  activeOpacity={0.7}
496
- style={styles.cartBadge}
498
+ style={styles.cartButton}
497
499
  onPress={() => navigateToCart()}
498
500
  >
499
501
  <View style={styles.cartCountContainer}>
500
502
  <Text style={styles.cartCountText}>
501
- {viewMyCartData?.items?.length}
503
+ {viewMyCartData?.items?.length || 0}
502
504
  </Text>
503
505
  </View>
504
506
  <CustomImage source={Images.cart} imgStyle={styles.cartIcon} />
package/src/screens/ProductDetails/styles.ts CHANGED
@@ -9,11 +9,12 @@ const styles = StyleSheet.create({
9
9
  flex: 1,
10
10
  backgroundColor: colors.white,
11
11
  },
12
- header: {
13
- backgroundColor: colors.white,
14
- paddingHorizontal: 20,
15
- paddingTop: 20,
16
- paddingBottom: 20,
12
+ headerSection: {
13
+ flexDirection: 'row',
14
+ justifyContent: 'space-between',
15
+ alignItems: 'center',
16
+ paddingHorizontal: SCALE(20),
17
+ paddingBottom: VSCALE(16),
17
18
  },
18
19
  statusBar: {
19
20
  flexDirection: 'row',
@@ -41,19 +42,20 @@ const styles = StyleSheet.create({
41
42
  justifyContent: 'space-between',
42
43
  alignItems: 'center',
43
44
  },
44
- cartButton: {
45
- width: 42,
46
- height: 42,
47
- borderRadius: 100,
48
- backgroundColor: colors.white,
49
- justifyContent: 'center',
45
+ userInfo: {
46
+ flexDirection: 'row',
47
+ alignItems: 'center',
48
+ gap: SCALE(12),
49
+ },
50
+ headerIcons: {
51
+ flexDirection: 'row',
50
52
  alignItems: 'center',
51
- position: 'relative',
53
+ },
54
+ cartButton: {
55
+ padding: SCALE(8),
52
56
  },
53
57
  cartBadge: {
54
- position: 'absolute',
55
- top: 0,
56
- right: 9,
58
+ padding: SCALE(8),
57
59
  width: 11,
58
60
  height: 12,
59
61
  justifyContent: 'center',
@@ -282,8 +284,8 @@ const styles = StyleSheet.create({
282
284
  color: colors.white,
283
285
  },
284
286
  cartIcon: {
285
- width: 24,
286
- height: 26,
287
+ width: SCALE(20),
288
+ height: SCALE(20),
287
289
  resizeMode: 'contain',
288
290
  },
289
291
  variantTitle: {
@@ -312,12 +314,14 @@ const styles = StyleSheet.create({
312
314
  },
313
315
  cartCountContainer: {
314
316
  position: 'absolute',
315
- right: SCALE(-4),
317
+ top: VSCALE(2),
318
+ right: SCALE(8),
319
+ backgroundColor: colors.error,
320
+ borderRadius: SCALE(10),
316
321
  width: SCALE(16),
317
- height: VSCALE(14),
322
+ height: SCALE(16),
318
323
  justifyContent: 'center',
319
324
  alignItems: 'center',
320
- top: VSCALE(-8),
321
325
  },
322
326
  cartCountText: {
323
327
  fontFamily: FontFamily.LEXEND_REGULAR,
package/src/screens/Reedem/index.tsx CHANGED
@@ -261,20 +261,24 @@ const Redeem: React.FC = () => {
261
261
 
262
262
  return (
263
263
  <SafeAreaView style={styles.container}>
264
- <View style={styles.headerContent}>
265
- <Text style={styles.headerTitle}>{ROUTES.REDEEM}</Text>
266
- <TouchableOpacity
267
- activeOpacity={0.7}
268
- style={styles.cartBadge}
269
- onPress={navigateToCart}
270
- >
271
- <View style={styles.cartCountContainer}>
272
- <Text style={styles.cartCountText}>
273
- {viewMyCartData?.items?.length}
274
- </Text>
275
- </View>
276
- <CustomImage source={Images.cart} imgStyle={styles.cartIcon} />
277
- </TouchableOpacity>
264
+ <View style={styles.headerSection}>
265
+ <View style={styles.userInfo}>
266
+ <Text style={styles.headerTitle}>{ROUTES.REDEEM}</Text>
267
+ </View>
268
+ <View style={styles.headerIcons}>
269
+ <TouchableOpacity
270
+ activeOpacity={0.7}
271
+ style={styles.cartButton}
272
+ onPress={navigateToCart}
273
+ >
274
+ <View style={styles.cartCountContainer}>
275
+ <Text style={styles.cartCountText}>
276
+ {viewMyCartData?.items?.length || 0}
277
+ </Text>
278
+ </View>
279
+ <CustomImage source={Images.cart} imgStyle={styles.cartIcon} />
280
+ </TouchableOpacity>
281
+ </View>
278
282
  </View>
279
283
  <View style={styles.searchSection}>
280
284
  <View style={styles.searchBar}>
package/src/screens/Reedem/styles.ts CHANGED
@@ -8,11 +8,12 @@ const styles = StyleSheet.create({
8
8
  flex: 1,
9
9
  backgroundColor: colors.background,
10
10
  },
11
- header: {
12
- backgroundColor: colors.background,
11
+ headerSection: {
12
+ flexDirection: 'row',
13
+ justifyContent: 'space-between',
14
+ alignItems: 'center',
13
15
  paddingHorizontal: SCALE(20),
14
- paddingTop: VSCALE(20),
15
- paddingBottom: VSCALE(28),
16
+ paddingBottom: VSCALE(16),
16
17
  },
17
18
  statusBar: {
18
19
  flexDirection: 'row',
@@ -35,8 +36,14 @@ const styles = StyleSheet.create({
35
36
  width: SCALE(77),
36
37
  height: VSCALE(13),
37
38
  },
38
- headerContent: {
39
- marginTop: VSCALE(30),
39
+ userInfo: {
40
+ flexDirection: 'row',
41
+ alignItems: 'center',
42
+ gap: SCALE(12),
43
+ },
44
+ headerIcons: {
45
+ flexDirection: 'row',
46
+ alignItems: 'center',
40
47
  },
41
48
  headerTitle: {
42
49
  fontFamily: FontFamily.LEXEND_REGULAR,
@@ -46,14 +53,11 @@ const styles = StyleSheet.create({
46
53
  textTransform: 'capitalize',
47
54
  textAlign: 'center',
48
55
  },
56
+ headerContent: {
57
+ marginTop: VSCALE(30),
58
+ },
49
59
  cartButton: {
50
- width: SCALE(42),
51
- height: SCALE(42),
52
- borderRadius: SCALE(100),
53
- backgroundColor: 'rgba(255, 255, 255, 0.45)',
54
- justifyContent: 'center',
55
- alignItems: 'center',
56
- position: 'relative',
60
+ padding: SCALE(8),
57
61
  },
58
62
  cartBadge: {
59
63
  position: 'absolute',
@@ -235,8 +239,8 @@ const styles = StyleSheet.create({
235
239
  alignItems: 'center',
236
240
  },
237
241
  cartIcon: {
238
- width: SCALE(24),
239
- height: VSCALE(26),
242
+ width: SCALE(20),
243
+ height: SCALE(20),
240
244
  resizeMode: 'contain',
241
245
  },
242
246
  emptyText: {
@@ -247,12 +251,14 @@ const styles = StyleSheet.create({
247
251
  },
248
252
  cartCountContainer: {
249
253
  position: 'absolute',
250
- right: SCALE(0),
254
+ top: VSCALE(2),
255
+ right: SCALE(8),
256
+ backgroundColor: colors.error,
257
+ borderRadius: SCALE(10),
251
258
  width: SCALE(16),
252
- height: VSCALE(14),
259
+ height: SCALE(16),
253
260
  justifyContent: 'center',
254
261
  alignItems: 'center',
255
- top: VSCALE(-5),
256
262
  },
257
263
  cartCountText: {
258
264
  fontFamily: FontFamily.LEXEND_REGULAR,