claiming ecency points enabled

src/screens/wallet/children/coinCard.tsx

@@ -1,8 +1,7 @@
 import { View, Text, Dimensions, TouchableOpacity } from 'react-native';
-import React, { ComponentType, Fragment } from 'react';
+import React, { ComponentType, Fragment, useEffect, useState } from 'react';
 import styles from './children.styles';
-import { Icon, MainButton, SimpleChart, TextButton } from '../../../components';
-import { COIN_IDS } from '../../../constants/defaultCoins';
+import { Icon, MainButton, SimpleChart } from '../../../components';
 import { useIntl } from 'react-intl';
 import EStyleSheet from 'react-native-extended-stylesheet';
 
@@ -18,8 +17,10 @@ export interface CoinCardProps {
     ownedTokens:number;
     unclaimedRewards:string;
     enableBuy?:boolean;
+    isClaiming?:boolean;
     footerComponent:ComponentType<any>
-    onPress:()=>void
+    onCardPress:()=>void;
+    onClaimPress:()=>void;
 }
 
 export const CoinCard = ({
@@ -35,7 +36,9 @@ export const CoinCard = ({
   footerComponent,
   unclaimedRewards,
   enableBuy,
-  onPress
+  isClaiming,
+  onCardPress,
+  onClaimPress,
 }:CoinCardProps) => {
 
   if(!notCrypto && !chartData.length){
@@ -44,6 +47,20 @@ export const CoinCard = ({
 
   const intl = useIntl();
 
+  const [claimExpected, setClaimExpected] = useState(false);
+
+  useEffect(()=>{
+    if(!isClaiming && claimExpected){
+      setClaimExpected(false);
+    }
+  }, [isClaiming])
+
+
+    const _onClaimPress = () => {
+      setClaimExpected(unclaimedRewards?true:false)
+      onClaimPress();
+    }
+
     const _renderHeader = (
         <View style={styles.cardHeader}>
             {/* <View style={styles.logo} /> */}
@@ -67,11 +84,11 @@ export const CoinCard = ({
         return (
           <View style={styles.claimContainer}>
             <MainButton
-              isLoading={false}
-              isDisable={false}
+              isLoading={isClaiming && claimExpected}
+              isDisable={isClaiming && claimExpected}
               style={styles.claimBtn}
               height={50}
-              onPress={() => {}}
+              onPress={_onClaimPress}
             >
               <Fragment>
                 <Text style={styles.claimBtnTitle}>
@@ -109,7 +126,7 @@ export const CoinCard = ({
     )
 
   return (
-    <TouchableOpacity onPress={onPress} >
+    <TouchableOpacity onPress={onCardPress} >
       <View style={styles.cardContainer}>
         {_renderHeader}
         {_renderClaimSection()}

src/screens/wallet/screen/walletScreen.tsx

@@ -1,6 +1,6 @@
 /* eslint-disable react/jsx-wrap-multilines */
 import React, { Fragment, useState, useEffect } from 'react';
-import { SafeAreaView, View, RefreshControl, Text } from 'react-native';
+import { SafeAreaView, View, RefreshControl, Text, Alert } from 'react-native';
 
 // Containers
 import { FlatList } from 'react-native-gesture-handler';
@@ -30,6 +30,7 @@ import { CoinBase, CoinData } from '../../../redux/reducers/walletReducer';
 import { setCoinsData, setPriceHistory } from '../../../redux/actions/walletActions';
 import { fetchCoinsData } from '../../../utils/wallet';
 import { COIN_IDS } from '../../../constants/defaultCoins';
+import { claimPoints } from '../../../providers/ecency/ePoint';
 
 
 const CHART_DAYS_RANGE = 1;
@@ -48,6 +49,7 @@ const WalletScreen = ({navigation}) => {
 
   const [isLoading, setIsLoading] = useState(false);
   const [refreshing, setRefreshing] = useState(false);
+  const [isClaiming, setIsClaiming] = useState(false);
 
 
   useEffect(()=>{
@@ -89,21 +91,60 @@ const WalletScreen = ({navigation}) => {
     setIsLoading(false);
   }
 
+  const _claimEcencyPoints = async () => {
+    setIsClaiming(true);
 
-  const _renderItem = ({ item, index }:{item:CoinBase, index:number}) => {
+    await claimPoints()
+      .then(() => {
+        _fetchCoinData();
+      })
+      .catch((error) => {
+        if (error) {
+          Alert.alert(
+            `PointsClaim - Connection issue, try again or write to support@ecency.com \n${error.message.substr(
+              0,
+              20,
+            )}`,
+          );
+        }
+      });
 
-    const _onPress = () => {
-      navigation.navigate(ROUTES.SCREENS.COIN_DETAILS, {
-        coinId:item.id
-      } as CoinDetailsScreenParams)
+      setIsClaiming(false);
+  };
+
+  const _claimRewards = (coinId:string) => {
+    switch(coinId){
+      case COIN_IDS.ECENCY:{
+        _claimEcencyPoints();
+        break;
+      }
+    }
   }
 
+
+  const _renderItem = ({ item, index }:{item:CoinBase, index:number}) => {
     const coinData:CoinData = coinsData[item.id] || {};
 
     const _tokenMarketData:number[] = priceHistories[item.id] ? priceHistories[item.id].data : [];
     const _currentValue = coinData.currentPrice || 0;
     const _balance = coinData.balance + (coinData.savings || 0);
 
+    const _onCardPress = () => {
+      navigation.navigate(ROUTES.SCREENS.COIN_DETAILS, {
+        coinId:item.id
+      } as CoinDetailsScreenParams)
+    }
+
+    const _onClaimPress = () => {
+      if(coinData.unclaimedBalance){
+        _claimRewards(item.id);
+      } else if(item.id === COIN_IDS.ECENCY) {
+        navigation.navigate(ROUTES.SCREENS.BOOST)
+      }
+    }
+
+
+    
     //calculate percentage change
     //TODO: verify or find a way to get exact percent change. current change value slightly differs from coingecko wep app values
     const _pastPrice = _tokenMarketData.length > 0 && _tokenMarketData[0];
@@ -120,7 +161,9 @@ const WalletScreen = ({navigation}) => {
         ownedTokens={_balance}
         unclaimedRewards={coinData.unclaimedBalance}
         enableBuy={!coinData.unclaimedBalance && item.id === COIN_IDS.ECENCY}
-        onPress={_onPress}
+        isClaiming={isClaiming}
+        onCardPress={_onCardPress}
+        onClaimPress={_onClaimPress}
         footerComponent={index === 0 && <HorizontalIconList options={POINTS} optionsKeys={POINTS_KEYS} />}
         {...item} />
     );

src/utils/wallet.ts

@@ -285,7 +285,9 @@ export const fetchCoinsData = async (
       switch(coinBase.id){
         case COIN_IDS.ECENCY:{
           const balance = ecencyUser.points ? parseFloat(ecencyUser.points) : 0;
-          const unclaimedBalance = ecencyUser.unclaimed_points ? parseFloat(ecencyUser.unclaimed_points) + ' Points' : '';
+          const unclaimedFloat = parseFloat(ecencyUser.unclaimed_points || '0');
+          const unclaimedBalance = unclaimedFloat ? unclaimedFloat + ' Points' : '';
+
           coinData[coinBase.id] = {
             balance : Math.round(balance * 1000) / 1000,
             estimateValue : balance * ppEstm,
@@ -357,6 +359,7 @@ export const fetchCoinsData = async (
       }
     })
 
+    //TODO:discard unnessacry data processings towards the end of PR
     walletData.rewardHiveBalance = parseToken(userdata.reward_hive_balance);
     walletData.rewardHbdBalance = parseToken(userdata.reward_hbd_balance);
     walletData.rewardVestingHive = parseToken(userdata.reward_vesting_hive);