created wallet refresh feature

This commit is contained in:
ue 2019-12-09 21:15:27 +03:00
parent f7dc850be1
commit ed7a238b1e
9 changed files with 37 additions and 19 deletions

View File

@ -29,6 +29,9 @@ const WalletHeaderView = ({
valueDescriptions,
showBuyButton,
index,
fetchUserActivity,
reload,
refreshing,
}) => {
const intl = useIntl();
const dropdownRef = useRef();
@ -39,6 +42,18 @@ const WalletHeaderView = ({
}
}, [componentDidUpdate, currentIndex, index]);
useEffect(() => {
if (reload && fetchUserActivity && index === currentIndex) {
fetchUserActivity();
}
}, [reload, currentIndex, index]);
useEffect(() => {
if (reload && !refreshing && index === currentIndex) {
componentDidUpdate();
}
}, [reload]);
const _getBalanceItem = (balance, options, key) =>
balance !== undefined && (
<View style={styles.balanceWrapper}>

View File

@ -130,7 +130,7 @@ const PointsContainer = ({
}),
);
const _fetchUserPointActivities = useCallback(async _username => {
const _fetchUserPointActivities = useCallback(async (_username = username) => {
if (!_username) {
return;
}

View File

@ -189,6 +189,7 @@ const WalletContainer = ({
};
const _handleOnWalletRefresh = () => {
if (refreshing) return;
setRefreshing(true);
getAccount(selectedUser.name)

View File

@ -7,7 +7,7 @@ import { PointsContainer } from '../../../containers';
import globalStyles from '../../../globalStyles';
const EstmView = ({ handleOnSelected, index, currentIndex }) => (
const EstmView = ({ handleOnSelected, index, currentIndex, refreshing: reload }) => (
<View style={globalStyles.swipeItemWrapper}>
<PointsContainer>
{({
@ -24,6 +24,7 @@ const EstmView = ({ handleOnSelected, index, currentIndex }) => (
<WalletHeader
componentDidUpdate={() => handleOnSelected(userActivities, isLoading, fetchUserActivity)}
index={index}
reload={reload}
showIconList
claim={claim}
fetchUserActivity={fetchUserActivity}

View File

@ -6,7 +6,7 @@ import { SteemWalletContainer, AccountContainer } from '../../../containers';
import globalStyles from '../../../globalStyles';
const SbdView = ({ handleOnSelected, index, currentIndex }) => (
const SbdView = ({ handleOnSelected, index, currentIndex, refreshing: reload }) => (
<View style={globalStyles.swipeItemWrapper}>
<AccountContainer>
{({ currentAccount }) => (
@ -29,6 +29,7 @@ const SbdView = ({ handleOnSelected, index, currentIndex }) => (
componentDidUpdate={() => handleOnSelected(transferHistory, isLoading)}
index={index}
claim={claimRewardBalance}
reload={reload}
fetchUserActivity={handleOnWalletRefresh}
isClaiming={isClaiming}
isLoading={isLoading}

View File

@ -6,7 +6,7 @@ import { SteemWalletContainer, AccountContainer } from '../../../containers';
import globalStyles from '../../../globalStyles';
const SpView = ({ handleOnSelected, index, currentIndex }) => (
const SpView = ({ handleOnSelected, index, currentIndex, refreshing: reload }) => (
<View style={globalStyles.swipeItemWrapper}>
<AccountContainer>
{({ currentAccount }) => (
@ -29,6 +29,7 @@ const SpView = ({ handleOnSelected, index, currentIndex }) => (
componentDidUpdate={() => handleOnSelected(userActivities, isLoading)}
index={index}
claim={claimRewardBalance}
reload={reload}
fetchUserActivity={handleOnWalletRefresh}
isClaiming={isClaiming}
isLoading={isLoading}

View File

@ -6,7 +6,7 @@ import { SteemWalletContainer, AccountContainer } from '../../../containers';
import globalStyles from '../../../globalStyles';
const SteemView = ({ handleOnSelected, index, currentIndex }) => (
const SteemView = ({ handleOnSelected, index, currentIndex, refreshing: reload }) => (
<View style={globalStyles.swipeItemWrapper}>
<AccountContainer>
{({ currentAccount }) => (
@ -30,6 +30,7 @@ const SteemView = ({ handleOnSelected, index, currentIndex }) => (
index={index}
claim={claimRewardBalance}
fetchUserActivity={handleOnWalletRefresh}
reload={reload}
isClaiming={isClaiming}
isLoading={isLoading}
refreshing={refreshing}

View File

@ -1,6 +1,7 @@
/* eslint-disable react/jsx-wrap-multilines */
import React, { Fragment, useState } from 'react';
import Swiper from 'react-native-swiper';
import { SafeAreaView, Animated, ScrollView } from 'react-native';
import { SafeAreaView, Animated, ScrollView, RefreshControl } from 'react-native';
// Containers
import { LoggedInContainer } from '../../../containers';
@ -21,7 +22,7 @@ const HEADER_COLLAPSED_HEIGHT = 20;
const WalletScreen = () => {
const [selectedUserActivities, setSelectedUserActivities] = useState(null);
const [isLoading, setIsLoading] = useState('points');
const [isLoading, setIsLoading] = useState(false);
const [currentIndex, setCurrentIndex] = useState(0);
const [refreshing, setRefreshing] = useState(false);
const [scrollY] = useState(new Animated.Value(0));
@ -29,6 +30,7 @@ const WalletScreen = () => {
const _handleSwipeItemChange = (userActivities, _isLoading) => {
setSelectedUserActivities(userActivities);
setIsLoading(_isLoading);
setRefreshing(false);
};
const headerHeight = scrollY.interpolate({
@ -79,6 +81,13 @@ const WalletScreen = () => {
</Animated.View>
<ScrollView
contentContainerStyle={styles.scrollContainer}
refreshControl={
<RefreshControl
refreshing={refreshing}
tintColor={!true ? '#357ce6' : '#96c0ff'}
onRefresh={() => setRefreshing(true)}
/>
}
onScroll={Animated.event([
{
nativeEvent: {
@ -93,7 +102,7 @@ const WalletScreen = () => {
<Transaction
type="wallet"
transactions={selectedUserActivities}
refreshing={refreshing}
refreshing={false}
setRefreshing={setRefreshing}
isLoading={isLoading}
/>

View File

@ -1,21 +1,10 @@
import EStyleSheet from 'react-native-extended-stylesheet';
import { Dimensions } from 'react-native';
const HEADER_EXPANDED_HEIGHT = 260;
const { width: SCREEN_WIDTH } = Dimensions.get('screen');
export default EStyleSheet.create({
scrollContainer: {
padding: 0,
paddingTop: HEADER_EXPANDED_HEIGHT,
},
header: {
position: 'absolute',
width: SCREEN_WIDTH,
backgroundColor: '$primaryBackgroundColor',
top: 0,
left: 0,
zIndex: 9999,
},
});