Fixed boost design issues for android

This commit is contained in:
Mustafa Buyukcelebi 2019-07-25 18:12:59 +03:00
parent 95c20818bb
commit db9de01e5e
2 changed files with 25 additions and 44 deletions

View File

@ -1,6 +1,6 @@
import React, { Component } from 'react';
import { connect } from 'react-redux';
import { Platform } from 'react-native';
import { Platform, Alert } from 'react-native';
import RNIap, {
purchaseErrorListener,
purchaseUpdatedListener,
@ -33,37 +33,6 @@ const ITEM_SKUS = Platform.select({
android: ['099points', '199points', '499points', '999points', '4999points', '9999points'],
});
const BOOST_DATA = Platform.select({
ios: [
{
id: '099points',
name: '10000 ESTM',
priceText: '100$',
price: 100,
description: 'BEST DEAL!',
},
{ id: '199points', name: '5000 ESTM', quantity: 500, price: 50, description: 'POPULAR' },
{ id: '499points', name: '1000 ESTM', quantity: 10000, price: 10, description: '' },
{ id: '999points', name: '500 ESTM', quantity: 500, price: 5, description: '' },
{ id: '4999points', name: '200 ESTM', quantity: 200, price: 2, description: '' },
{ id: '9999points', name: '100 ESTM', quantity: 100, price: 1, description: '' },
],
android: [
{
id: '099points',
name: '10000 ESTM',
priceText: '100$',
price: 100,
description: 'BEST DEAL!',
},
{ id: '199points', name: '5000 ESTM', quantity: 500, price: 50, description: 'POPULAR' },
{ id: '499points', name: '1000 ESTM', quantity: 10000, price: 10, description: '' },
{ id: '999points', name: '500 ESTM', quantity: 500, price: 5, description: '' },
{ id: '4999points', name: '200 ESTM', quantity: 200, price: 2, description: '' },
{ id: '9999points', name: '100 ESTM', quantity: 100, price: 1, description: '' },
],
});
class BoostContainer extends Component {
constructor(props) {
super(props);
@ -97,10 +66,9 @@ class BoostContainer extends Component {
_getItems = async () => {
try {
console.log(ITEM_SKUS);
const products = await RNIap.getProducts(ITEM_SKUS);
// const products = await RNIap.getSubscriptions(itemSkus);
console.log('Products', products);
products.sort((a, b) => parseFloat(a.price) - parseFloat(b.price)).reverse();
this.setState({ productList: products });
} catch (err) {
console.warn(err.code, err.message);

View File

@ -12,6 +12,8 @@ import { Icon } from '../../../components/icon';
import globalStyles from '../../../globalStyles';
import styles from './boostScreenStyles';
const DEALS = { '9999points': 'BEST DEAL!', '4999points': 'POPULAR!' };
class BoostScreen extends PureComponent {
/* Props
* ------------------------------------------------
@ -28,6 +30,24 @@ class BoostScreen extends PureComponent {
// Component Life Cycles
// Component Functions
_renderDeal = item => {
if (DEALS[item.productId]) {
return (
<View style={styles.descriptionWrapper}>
<Fragment>
<Text style={styles.description}>{DEALS[item.productId]}</Text>
<View style={styles.triangle} />
</Fragment>
</View>
);
}
};
_getTitle = title => {
const lastIndex = title.lastIndexOf(' ');
return title.substring(0, lastIndex);
};
render() {
const { intl, buyItem, boostData } = this.props;
@ -43,14 +63,7 @@ class BoostScreen extends PureComponent {
{boostData.map(item => (
<View style={styles.boostLine} key={get(item, 'productId')}>
{!!get(item, 'description', null) && (
<View style={styles.descriptionWrapper}>
<Fragment>
<Text style={styles.description}>{get(item, 'description')}</Text>
<View style={styles.triangle} />
</Fragment>
</View>
)}
{this._renderDeal(item)}
<View style={styles.buttonWrapper}>
<MainButton
style={styles.button}
@ -63,7 +76,7 @@ class BoostScreen extends PureComponent {
isLoading={false}
>
<View style={styles.buttonContent}>
<Text style={styles.buttonText}>{get(item, 'title')}</Text>
<Text style={styles.buttonText}>{this._getTitle(get(item, 'title'))}</Text>
<View style={styles.buttonIconWrapper}>
<Icon name="add" iconType="MaterialIcons" color="#357ce6" size={23} />
</View>
@ -72,7 +85,7 @@ class BoostScreen extends PureComponent {
</View>
<View style={styles.priceWrapper}>
<Text style={styles.priceText}>{`$${get(item, 'price', 0).toFixed(2)}`}</Text>
<Text style={styles.priceText}>{get(item, 'localizedPrice', 0)}</Text>
</View>
</View>
))}