linked navigation with coin actions

src/config/locales/en-US.json

@@ -68,8 +68,8 @@
     "next": "NEXT",
     "delegate": "Delegate",
     "power_down": "Power Down",
-    "withdraw_hive": "Withdraw HIVE",
-    "withdraw_hbd": "Withdraw HBD",
+    "withdraw_hive": "Withdraw Savings",
+    "withdraw_hbd": "Withdraw Savings",
     "transfer_to_savings": "To Savings",
     "convert": "Convert",
     "escrow_transfer": "Escrow Transfer",

src/redux/reducers/walletReducer.ts

@@ -42,6 +42,7 @@ export interface CoinActivity {
 }
 
 interface State {
+    tokenAddress:string;
     selectedCoins:CoinBase[];
     coinsData:{
         [key: string]: CoinData;
@@ -56,6 +57,7 @@ interface State {
 }
 
 const initialState:State = {
+    tokenAddress:'',
     selectedCoins:DEFAULT_COINS,
     coinsData:{},
     priceHistories:{},
@@ -75,6 +77,7 @@ export default function (state = initialState, action) {
     case SET_COINS_DATA:{
         return {
             ...state,
+            //TODO: pass and asign tokenAddress
             coinsData:payload,
             updateTimestamp:new Date().getTime()
         }

src/screens/coinDetails/children/coinActions.tsx

@@ -1,25 +1,22 @@
 import React, { Fragment } from 'react'
 import { useIntl } from 'react-intl'
-import { View, Text, Alert } from 'react-native'
+import { View, Text } from 'react-native'
 import { TouchableOpacity } from 'react-native-gesture-handler'
+import { withNavigation } from 'react-navigation'
 import styles from './children.styles'
 
 interface CoinActionsProps {
-    coinId:string;
     actions:string[];
+    onActionPress:(action:string)=>void;
 }
 
-const CoinActions = ({coinId, actions}:CoinActionsProps) => {
+export const CoinActions = withNavigation(({actions, onActionPress}:CoinActionsProps) => {
     const intl = useIntl();
 
-    const _navigate = (action:string) => {
-       Alert.alert("Action Press", action)
-    }
-
     const _renderItem = (item) => {
 
         const _onPress = () => {
-            _navigate(item)
+            onActionPress(item)
         }
 
         return (
@@ -38,6 +35,4 @@ const CoinActions = ({coinId, actions}:CoinActionsProps) => {
             {actions.map(_renderItem)}
         </View>
     )
-}
-
-export default CoinActions
+});

src/screens/coinDetails/children/coinSummary.tsx

@@ -1,21 +1,22 @@
 import React from 'react'
 import { View } from 'react-native'
-import { CoinBasics, CoinChart } from '.'
+import { CoinActions, CoinBasics, CoinChart } from '.'
 import { FormattedCurrency } from '../../../components'
 import { COIN_IDS } from '../../../constants/defaultCoins'
 import { CoinData, DataPair } from '../../../redux/reducers/walletReducer'
-import CoinActions from './coinActions'
 
 export interface CoinSummaryProps {
     id:string;
     coinSymbol:string;
     coinData:CoinData;
+    onActionPress:(action:string)=>void;
 }
 
 export const CoinSummary = ({
     coinSymbol, 
     id, 
     coinData,
+    onActionPress,
 }:CoinSummaryProps) => {
     const { 
         balance, 
@@ -49,7 +50,7 @@ export const CoinSummary = ({
     return (
         <View>
             <CoinBasics valuePairs={valuePairs} extraData={extraDataPairs} coinSymbol={coinSymbol}  />
-            <CoinActions actions={actions} />
+            <CoinActions actions={actions} onActionPress={onActionPress}/>
             {
                 id !== COIN_IDS.ECENCY && id !== COIN_IDS.HP && <CoinChart coinId={id} />
             }

src/screens/coinDetails/children/index.ts

@@ -2,4 +2,5 @@ export * from './coinBasics';
 export * from './coinChart';
 export * from './rangeSelector'; 
 export * from './coinSummary';
-export * from './activitiesList';
+export * from './activitiesList';
+export * from './coinActions';

src/screens/coinDetails/screen/coinDetailsScreen.tsx

@@ -9,6 +9,10 @@ import { useAppDispatch, useAppSelector } from '../../../hooks'
 import { CoinActivity, CoinData } from '../../../redux/reducers/walletReducer';
 import { fetchCoinActivities } from '../../../utils/wallet';
 import { setCoinActivities } from '../../../redux/actions/walletActions';
+import { openPinCodeModal } from '../../../redux/actions/applicationActions';
+import { navigate } from '../../../navigation/service';
+import ROUTES from '../../../constants/routeNames';
+import { COIN_IDS } from '../../../constants/defaultCoins';
 
 export interface CoinDetailsScreenParams {
   coinId:string;
@@ -28,12 +32,13 @@ const CoinDetailsScreen = ({navigation}:CoinDetailsScreenProps) => {
 
   const currentAccount = useAppSelector(state=>state.account.currentAccount);
   const globalProps = useAppSelector(state=>state.account.globalProps);
+  const tokenAddress =  useAppSelector(state=>state.wallet.tokenAddress);
   const selectedCoins = useAppSelector(state=>state.wallet.selectedCoins);
   const coinData:CoinData = useAppSelector(state=>state.wallet.coinsData[coinId]);
   const coinActivities:CoinActivity[] = useAppSelector(state=>state.wallet.coinsActivities[coinId]);
-  
+  const isPinCodeOpen = useAppSelector(state=>state.application.isPinCodeOpen);
 
-  const {symbol, id } = selectedCoins.find((item)=>item.id===coinId)
+  const [symbol] = useState(selectedCoins.find((item)=>item.id===coinId).symbol);
 
 
   useEffect(()=>{
@@ -52,14 +57,55 @@ const CoinDetailsScreen = ({navigation}:CoinDetailsScreenProps) => {
   }
 
 
+  const _onActionPress = (transferType:string) => {
+    let balance = 0;
+    let fundType = symbol;
+
+    if (
+      (transferType === 'transfer_token' || transferType === 'purchase_estm') &&
+      coinId === COIN_IDS.HIVE
+    ) {
+      balance = Math.round(coinData.balance * 1000) / 1000;
+    }
+    if (
+      (transferType === 'transfer_token' ||
+        transferType === 'convert' ||
+        transferType === 'purchase_estm') &&
+        coinId === COIN_IDS.HBD
+    ) {
+      balance = Math.round(coinData.balance * 1000) / 1000;
+    }
+    if (transferType === 'withdraw_hive' && coinId === COIN_IDS.HIVE) {
+      balance = Math.round(coinData.savings * 1000) / 1000;
+    }
+    if (transferType === 'withdraw_hbd' && coinId === COIN_IDS.HBD) {
+      balance = Math.round(coinData.savings * 1000) / 1000;
+    }
+
+    if (isPinCodeOpen) {
+      dispatch(
+        openPinCodeModal({
+          navigateTo: ROUTES.SCREENS.TRANSFER,
+          navigateParams: { transferType, fundType, balance, tokenAddress },
+        }),
+      );
+    } else {
+      navigate({
+        routeName: ROUTES.SCREENS.TRANSFER,
+        params: { transferType, fundType, balance, tokenAddress },
+      });
+    }
+  } 
+
 
   const _renderHeaderComponent = (
     <>
-      <CoinSummary {...{
-        id,
-        coinSymbol:symbol,
-        coinData,
-      }} />
+      <CoinSummary
+        id={coinId}
+        coinSymbol={symbol}
+        coinData={coinData}
+        onActionPress={_onActionPress}
+      />
       <Text style={styles.textActivities}>Activities</Text>
     </>
   )