ecency/ecency-mobile
1
1
Fork 0
mirror of https://github.com/ecency/ecency-mobile.git synced 2024-12-20 11:51:52 +03:00
Code Issues Actions Packages Projects Releases Wiki Activity

Merge pull request #1012 from esteemapp/feature/freeESTM

Browse Source 
first part Feature/free estm
This commit is contained in:
Mustafa Buyukcelebi 2019-08-05 14:56:41 +03:00 committed by GitHub
commit 6a88e27050
6 changed files with 146 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/basicUIElements/index.js
View File

@ -18,6 +18,7 @@ import ProfileSummaryPlaceHolder from './view/placeHolder/profileSummaryPlaceHol
import WalletDetailsPlaceHolder from './view/placeHolder/walletDetailsPlaceHolder';
import WalletUnclaimedPlaceHolder from './view/placeHolder/walletUnclaimedPlaceHolder';
import ListPlaceHolder from './view/placeHolder/listPlaceHolderView';
import BoostPlaceHolder from './view/placeHolder/boostPlaceHolderView';
export {
Card,
@ -26,6 +27,7 @@ export {
LineBreak,
ListItemPlaceHolder,
ListPlaceHolder,
BoostPlaceHolder,
NoInternetConnection,
NoPost,
PostCardPlaceHolder,

24
src/components/basicUIElements/view/placeHolder/boostPlaceHolderStyles.js Normal file
View File

@ -0,0 +1,24 @@
import EStyleSheet from 'react-native-extended-stylesheet';
export default EStyleSheet.create({
container: {
backgroundColor: '$primaryBackgroundColor',
borderColor: '$primaryLightBackground',
marginRight: 0,
marginLeft: 0,
flexDirection: 'column',
},
paragraphWrapper: {
marginLeft: 30,
},
line: {
flexDirection: 'row',
marginVertical: 10,
alignContent: 'center',
alignItems: 'center',
justifyContent: 'space-between',
},
rightBox: {
marginRight: 20,
},
});

44
src/components/basicUIElements/view/placeHolder/boostPlaceHolderView.js Normal file
View File

@ -0,0 +1,44 @@
/* eslint-disable radix */
import React from 'react';
import { connect } from 'react-redux';
import { Dimensions, View } from 'react-native';
import times from 'lodash/times';
import Placeholder from 'rn-placeholder';
import styles from './boostPlaceHolderStyles';
const HEIGHT = Dimensions.get('window').height;
const BoostPlaceHolder = ({ isDarkTheme }) => {
const color = isDarkTheme ? '#2e3d51' : '#f5f5f5';
const ratio = (HEIGHT - 300) / 50 / 1.3;
const listElements = [];
times(parseInt(ratio), i => {
listElements.push(
<View style={styles.container} key={i}>
<View style={styles.line}>
<Placeholder.Box color={color} width={90} height={40} animate="fade" />
<View style={styles.paragraphWrapper}>
<Placeholder.Box color={color} width={140} radius={25} height={50} animate="fade" />
</View>
<Placeholder.Box
style={styles.rightBox}
color={color}
width={20}
height={10}
animate="fade"
/>
</View>
</View>,
);
});
return <View style={styles.container}>{listElements}</View>;
};
const mapStateToProps = state => ({
isDarkTheme: state.application.isDarkTheme,
});
export default connect(mapStateToProps)(BoostPlaceHolder);

1
src/constants/routeNames.js
View File

@ -22,6 +22,7 @@ export default {
BOOST: `Boost${SCREEN_SUFFIX}`,
BOOST_POST: `BoostPost${SCREEN_SUFFIX}`,
PROMOTE: `Promote${SCREEN_SUFFIX}`,
FREE_ESTM: `FreeEstm${SCREEN_SUFFIX}`,
},
DRAWER: {
MAIN: `Main${DRAWER_SUFFIX}`,

57
src/screens/boost/container/boostContainer.js
View File

@ -1,6 +1,7 @@
import React, { Component } from 'react';
import { connect } from 'react-redux';
import { Platform, Alert } from 'react-native';
import { withNavigation } from 'react-navigation';
import RNIap, {
purchaseErrorListener,
purchaseUpdatedListener,
@ -12,12 +13,8 @@ import { injectIntl } from 'react-intl';
// import { toastNotification } from '../../../redux/actions/uiAction';
// Middleware
// Constants
// import { default as ROUTES } from '../../../constants/routeNames';
// Utilities
import { default as ROUTES } from '../../../constants/routeNames';
// Component
import BoostScreen from '../screen/boostScreen';
@ -39,6 +36,8 @@ class BoostContainer extends Component {
this.state = {
receipt: '',
productList: [],
isLoading: true,
isProccesing: false,
};
}
@ -67,20 +66,39 @@ class BoostContainer extends Component {
_getItems = async () => {
try {
const products = await RNIap.getProducts(ITEM_SKUS);
console.log('Products', products);
products.sort((a, b) => parseFloat(a.price) - parseFloat(b.price)).reverse();
this.setState({ productList: products });
await this.setState({ productList: products });
} catch (err) {
console.warn(err.code, err.message);
Alert.alert(
`Fetching data from server failed, please try again or notify us at info@esteem.app \n${err.message.substr(
0,
20,
)}`,
);
}
await this.setState({ isLoading: false });
};
_buyItem = async sku => {
try {
RNIap.requestPurchase(sku);
} catch (err) {
console.warn(err.code, err.message);
const { navigation } = this.props;
await this.setState({ isProccesing: true });
if (sku !== 'freePoints') {
try {
await RNIap.requestPurchase(sku);
} catch (err) {
console.warn(err.code, err.message);
}
} else {
navigation.navigate({
routeName: ROUTES.SCREENS.FREE_ESTM,
});
}
this.setState({ isProccesing: false });
};
// _buyItem = async sku => {
@ -103,9 +121,18 @@ class BoostContainer extends Component {
// };
render() {
const { productList } = this.state;
const { productList, isLoading, isProccesing } = this.state;
// const FREE_ESTM = { productId: 'freePoints', title: 'free estm' };
return <BoostScreen boostData={productList} buyItem={this._buyItem} />;
return (
<BoostScreen
// productList={[...productList, FREE_ESTM]}
productList={productList}
buyItem={this._buyItem}
isLoading={isLoading}
isProccesing={isProccesing}
/>
);
}
}
@ -113,4 +140,4 @@ const mapStateToProps = state => ({
currentAccount: state.account.currentAccount,
});
export default injectIntl(connect(mapStateToProps)(BoostContainer));
export default withNavigation(injectIntl(connect(mapStateToProps)(BoostContainer)));

59
src/screens/boost/screen/boostScreen.js
View File

@ -7,6 +7,7 @@ import get from 'lodash/get';
import { BasicHeader } from '../../../components/basicHeader';
import { MainButton } from '../../../components/mainButton';
import { Icon } from '../../../components/icon';
import { BoostPlaceHolder } from '../../../components/basicUIElements';
// Styles
import globalStyles from '../../../globalStyles';
@ -50,7 +51,7 @@ class BoostScreen extends PureComponent {
};
render() {
const { intl, buyItem, boostData } = this.props;
const { intl, buyItem, productList, isLoading, isProccesing } = this.props;
const { selectedBoost } = this.state;
return (
@ -61,34 +62,40 @@ class BoostScreen extends PureComponent {
})}
/>
{boostData.map(item => (
<View style={styles.boostLine} key={get(item, 'productId')}>
{this._renderDeal(item)}
<View style={styles.buttonWrapper}>
<MainButton
style={styles.button}
onPress={() => buyItem(item.productId)}
height={50}
text={intl.formatMessage({
id: 'boost.buy',
})}
isDisable={false}
isLoading={false}
>
<View style={styles.buttonContent}>
<Text style={styles.buttonText}>{this._getTitle(get(item, 'title'))}</Text>
<View style={styles.buttonIconWrapper}>
<Icon name="add" iconType="MaterialIcons" color="#357ce6" size={23} />
{isLoading ? (
<BoostPlaceHolder />
) : (
productList.map(item => (
<View style={styles.boostLine} key={get(item, 'productId')}>
{this._renderDeal(item)}
<View style={styles.buttonWrapper}>
<MainButton
style={styles.button}
onPress={() => buyItem(item.productId)}
height={50}
text={intl.formatMessage({
id: 'boost.buy',
})}
isDisable={isProccesing}
isLoading={false}
>
<View style={styles.buttonContent}>
<Text style={styles.buttonText}>{get(item, 'title', '').toUpperCase()}</Text>
<View style={styles.buttonIconWrapper}>
<Icon name="add" iconType="MaterialIcons" color="#357ce6" size={23} />
</View>
</View>
</View>
</MainButton>
</View>
</MainButton>
</View>
<View style={styles.priceWrapper}>
<Text style={styles.priceText}>{get(item, 'localizedPrice', 0)}</Text>
<View style={styles.priceWrapper}>
{get(item, 'localizedPrice', null) && (
<Text style={styles.priceText}>{get(item, 'localizedPrice', 0)}</Text>
)}
</View>
</View>
</View>
))}
))
)}
</View>
);
}