diff --git a/src/components/basicUIElements/index.js b/src/components/basicUIElements/index.js
index f308548e5..da64944e5 100644
--- a/src/components/basicUIElements/index.js
+++ b/src/components/basicUIElements/index.js
@@ -1,4 +1,4 @@
-import Card from './view/card/cardView';
+import { Card } from './view/card/cardView';
import Chip from './view/chip/chipView';
import GrayWrapper from './view/grayWrapper/grayWrapperView';
import LineBreak from './view/lineBreak/lineBreakView';
diff --git a/src/components/basicUIElements/view/card/cardView.js b/src/components/basicUIElements/view/card/cardView.js
index cf9eeb04a..e8b7fe608 100644
--- a/src/components/basicUIElements/view/card/cardView.js
+++ b/src/components/basicUIElements/view/card/cardView.js
@@ -2,6 +2,4 @@ import React from 'react';
import { View } from 'react-native';
import styles from './cardStyles';
-const Card = ({ children }) => {children};
-
-export default Card;
+export const Card = ({ children }) => {children};
diff --git a/src/components/basicUIElements/view/walletLineItem/walletLineItemView.js b/src/components/basicUIElements/view/walletLineItem/walletLineItemView.js
index 5a4765b61..37b97fb22 100644
--- a/src/components/basicUIElements/view/walletLineItem/walletLineItemView.js
+++ b/src/components/basicUIElements/view/walletLineItem/walletLineItemView.js
@@ -1,13 +1,14 @@
import React from 'react';
import { View, Text } from 'react-native';
-import GrayWrapper from '../grayWrapper/grayWrapperView';
+// Components
+import GrayWrapper from '../grayWrapper/grayWrapperView';
import { Icon } from '../../../icon';
+// Styles
import styles from './walletLineItemStyles';
const WalletLineItem = ({
- circleIconColor,
description,
fitContent,
iconName,
@@ -31,7 +32,7 @@ const WalletLineItem = ({
style={[
styles.iconWrapper,
isCircleIcon && styles.circleIcon,
- circleIconColor && { backgroundColor: circleIconColor },
+ index && { backgroundColor: `${index && index % 2 !== 0 ? 'white' : '#f5f5f5'}` },
]}
>
diff --git a/src/components/points/container/pointsContainer.js b/src/components/points/container/pointsContainer.js
index c49c69332..636b9358f 100644
--- a/src/components/points/container/pointsContainer.js
+++ b/src/components/points/container/pointsContainer.js
@@ -1,17 +1,19 @@
-import React, { Component } from 'react';
+import React, { Component, Alert } from 'react';
import { connect } from 'react-redux';
// Services and Actions
import { getUser, getUserPoints } from '../../../providers/esteem/ePoint';
+// Constant
+import POINTS from '../../../constants/options/points';
// Component
import PointsView from '../view/pointsView';
/*
- * Props Name Description Value
- *@props --> props name here description here Value Type Here
- *
- */
+ * Props Name Description Value
+ *@props --> props name here description here Value Type Here
+ *
+ */
class PointsContainer extends Component {
constructor(props) {
@@ -19,6 +21,7 @@ class PointsContainer extends Component {
this.state = {
userPoints: {},
userActivities: {},
+ refreshing: false,
};
}
@@ -29,32 +32,59 @@ class PointsContainer extends Component {
// Component Functions
+ _groomUserActivities = userActivities => userActivities.map(item => ({
+ ...item,
+ icon: POINTS[item.type].icon,
+ iconType: POINTS[item.type].iconType,
+ textKey: POINTS[item.type].textKey,
+ }));
+
_fetchuserPointActivities = async () => {
const { username } = this.props;
- await getUser(username).then((userPoints) => {
- this.setState({ userPoints });
- }).catch((err) => {
- alert(err);
- });
+ this.setState({ refreshing: true });
- await getUserPoints(username).then((userActivities) => {
- // this.setState({ userPointActivities: res });
- this.setState({ userActivities });
- }).catch((err) => {
- alert(err);
- });
- }
+ await getUser(username)
+ .then((userPoints) => {
+ this.setState({ userPoints });
+ })
+ .catch((err) => {
+ Alert.alert(err);
+ });
+
+ await getUserPoints(username)
+ .then((userActivities) => {
+ this.setState({
+ userActivities: this._groomUserActivities(userActivities),
+ });
+ })
+ .catch((err) => {
+ Alert.alert(err);
+ });
+
+ this.setState({ refreshing: false });
+ };
render() {
- const { userPoints, userActivities } = this.state;
+ const {
+ userPoints, userActivities, isDarkTheme, refreshing,
+ } = this.state;
- return ;
+ return (
+
+ );
}
}
const mapStateToProps = state => ({
username: state.account.currentAccount.name,
+ isDarkTheme: state.application.isDarkTheme,
});
export default connect(mapStateToProps)(PointsContainer);
diff --git a/src/components/points/view/pointsStyles.js b/src/components/points/view/pointsStyles.js
index 25077044b..c2a71de8e 100644
--- a/src/components/points/view/pointsStyles.js
+++ b/src/components/points/view/pointsStyles.js
@@ -63,4 +63,7 @@ export default EStyleSheet.create({
activeBadge: {
backgroundColor: '$black',
},
+ listWrapper: {
+ marginHorizontal: 8,
+ },
});
diff --git a/src/components/points/view/pointsView.js b/src/components/points/view/pointsView.js
index ecc272ee5..ce54cd66f 100644
--- a/src/components/points/view/pointsView.js
+++ b/src/components/points/view/pointsView.js
@@ -1,11 +1,16 @@
import React, { Component, Fragment } from 'react';
-import { Text, View, FlatList } from 'react-native';
+import {
+ Text, View, FlatList, ScrollView, RefreshControl,
+} from 'react-native';
import { injectIntl } from 'react-intl';
// Components
-import { LineBreak } from '../../basicUIElements';
+import { LineBreak, WalletLineItem } from '../../basicUIElements';
import { IconButton } from '../../iconButton';
+// Utils
+import { getTimeFromNow } from '../../../utils/time';
+
// Styles
import styles from './pointsStyles';
@@ -24,67 +29,101 @@ class PointsView extends Component {
// Component Functions
- render() {
- const { userActivities, userPoints, intl } = this.props;
- const isActiveIcon = true;
+ refreshControl = () => {
+ const { fetchUserActivity, refreshing, isDarkTheme } = this.props;
- return (
-
-
- {userPoints.points}
- eSteem Points
+ return (
+
+ );
+ }
-
-
-
-
-
- {intl.formatMessage({ id: 'points.post' })}
-
-
-
-
-
- {intl.formatMessage({ id: 'points.comment' })}
-
-
-
-
-
- {intl.formatMessage({ id: 'points.checkin' })}
-
-
+ render() {
+ const {
+ userActivities, userPoints, intl,
+ } = this.props;
+ const isActiveIcon = true;
- (
- {item.type}
- )}
- />
-
- );
- }
+ return (
+
+
+
+ {userPoints.points}
+ eSteem Points
+
+
+
+
+
+
+ {intl.formatMessage({ id: 'points.post' })}
+
+
+
+
+
+ {intl.formatMessage({ id: 'points.comment' })}
+
+
+
+
+
+ {intl.formatMessage({ id: 'points.checkin' })}
+
+
+
+
+ (
+
+ )}
+ />
+
+
+
+ );
+ }
}
export default injectIntl(PointsView);
diff --git a/src/components/transaction/view/transactionView.js b/src/components/transaction/view/transactionView.js
index 1b72e9e46..1477b45ff 100644
--- a/src/components/transaction/view/transactionView.js
+++ b/src/components/transaction/view/transactionView.js
@@ -4,8 +4,6 @@ import { View } from 'react-native';
// Utilities
import { groomingTransactionData } from '../../../utils/wallet';
-
-// Utils
import { getTimeFromNow } from '../../../utils/time';
// Components
@@ -60,10 +58,10 @@ class TransactionView extends PureComponent {