integrated coin actions

src/redux/reducers/walletReducer.ts

@@ -20,7 +20,9 @@ export interface CoinData {
     unclaimedBalance:string,
     estimateValue?:number;
     vsCurrency:string;
-    extraDataPairs?:DataPair[]
+    actions:string[];
+    extraDataPairs?:DataPair[];
+
 }
 
 export interface PriceHistory {

src/screens/coinDetails/children/children.styles.ts

@@ -96,5 +96,27 @@ export default EStyleSheet.create({
     paddingBottom:56,
     marginHorizontal:16
   } as ViewStyle ,
+
+  //COIN ACTIONS STYLES
+  actionBtnContainer:{
+    flexGrow:1
+  } as ViewStyle,
+  actionsContainer:{
+    flexDirection:'row', 
+    flexWrap:'wrap'
+  } as ViewStyle,
+  actionContainer:{
+    paddingHorizontal:16,
+    marginVertical:8,
+    marginHorizontal:4,
+    backgroundColor:'$primaryLightBackground',
+    height: 40,
+    borderRadius:20,
+    justifyContent:'center',
+    alignItems:'center',
+  } as ViewStyle,
+  actionText:{
+    color: '$primaryBlack'
+  } as TextStyle
 });
 

src/screens/coinDetails/children/coinActions.tsx

@@ -0,0 +1,43 @@
+import React, { Fragment } from 'react'
+import { useIntl } from 'react-intl'
+import { View, Text, Alert } from 'react-native'
+import { TouchableOpacity } from 'react-native-gesture-handler'
+import styles from './children.styles'
+
+interface CoinActionsProps {
+    coinId:string;
+    actions:string[];
+}
+
+const CoinActions = ({coinId, actions}:CoinActionsProps) => {
+    const intl = useIntl();
+
+    const _navigate = (action:string) => {
+       Alert.alert("Action Press", action)
+    }
+
+    const _renderItem = (item) => {
+
+        const _onPress = () => {
+            _navigate(item)
+        }
+
+        return (
+            <TouchableOpacity style={styles.actionContainer} containerStyle={styles.actionBtnContainer} onPress={_onPress}>
+                <Fragment>
+                    <Text style={styles.actionText}>
+                        {intl.formatMessage({id:`wallet.${item}`})}
+                    </Text>
+                </Fragment>
+            </TouchableOpacity>
+        )
+    }
+
+    return (
+        <View style={styles.actionsContainer}>
+            {actions.map(_renderItem)}
+        </View>
+    )
+}
+
+export default CoinActions

src/screens/coinDetails/children/coinSummary.tsx

@@ -3,18 +3,28 @@ import { View } from 'react-native'
 import { CoinBasics, CoinChart } from '.'
 import { FormattedCurrency } from '../../../components'
 import { COIN_IDS } from '../../../constants/defaultCoins'
-import { DataPair } from '../../../redux/reducers/walletReducer'
+import { CoinData, DataPair } from '../../../redux/reducers/walletReducer'
+import CoinActions from './coinActions'
 
 export interface CoinSummaryProps {
-    balance:number;
-    estimateValue:number;
-    savings:number;
-    coinSymbol:string;
     id:string;
-    extraData?:DataPair[]
+    coinSymbol:string;
+    coinData:CoinData;
 }
 
-export const CoinSummary = ({balance, estimateValue, savings, coinSymbol, id, extraData}:CoinSummaryProps) => {
+export const CoinSummary = ({
+    coinSymbol, 
+    id, 
+    coinData,
+}:CoinSummaryProps) => {
+    const { 
+        balance, 
+        estimateValue, 
+        savings,    
+        extraDataPairs, 
+        actions 
+    } = coinData
+
     const valuePairs = [
         {
             label:'Balance',
@@ -38,7 +48,8 @@ export const CoinSummary = ({balance, estimateValue, savings, coinSymbol, id, ex
 
     return (
         <View>
-            <CoinBasics valuePairs={valuePairs} extraData={extraData} coinSymbol={coinSymbol}  />
+            <CoinBasics valuePairs={valuePairs} extraData={extraDataPairs} coinSymbol={coinSymbol}  />
+            <CoinActions actions={actions} />
             {
                 id !== COIN_IDS.ECENCY && id !== COIN_IDS.HP && <CoinChart coinId={id} />
             }

src/screens/coinDetails/screen/coinDetailsScreen.tsx

@@ -56,12 +56,9 @@ const CoinDetailsScreen = ({navigation}:CoinDetailsScreenProps) => {
   const _renderHeaderComponent = (
     <>
       <CoinSummary {...{
-        balance:coinData.balance,
-        estimateValue:coinData.estimateValue,
-        savings:coinData.savings,
         id,
         coinSymbol:symbol,
-        extraData:coinData.extraDataPairs
+        coinData,
       }} />
       <Text style={styles.textActivities}>Activities</Text>
     </>

src/utils/wallet.ts

@@ -34,6 +34,25 @@ export const transferTypes = [
   'fill_vesting_withdraw',
 ];
 
+const ECENCY_ACTIONS = [
+  'dropdown_transfer', 'dropdown_promote', 'dropdown_boost'
+];
+const HIVE_ACTIONS = [
+  'purchase_estm',
+  'transfer_token',
+  'transfer_to_savings',
+  'transfer_to_vesting',
+  'withdraw_hive'
+];
+const HBD_ACTIONS = [
+  'purchase_estm', 
+  'transfer_token', 
+  'transfer_to_savings', 
+  'convert',
+  'withdraw_hbd'
+];
+const HIVE_POWER_ACTIONS = ['delegate', 'power_down'];
+
 
 export const groomingTransactionData = (transaction, hivePerMVests) => {
   if (!transaction || !hivePerMVests) {
@@ -332,6 +351,7 @@ export const fetchCoinsData = async (
             vsCurrency:vsCurrency,
             currentPrice:ppEstm,
             unclaimedBalance: unclaimedBalance,
+            actions:ECENCY_ACTIONS,
           }
           break;
         }
@@ -346,6 +366,7 @@ export const fetchCoinsData = async (
             vsCurrency:vsCurrency,
             currentPrice:ppHive,
             unclaimedBalance:'',
+            actions:HIVE_ACTIONS,
           }
           break;
         }
@@ -361,6 +382,7 @@ export const fetchCoinsData = async (
             vsCurrency:vsCurrency,
             currentPrice:ppHbd,
             unclaimedBalance:'',
+            actions:HBD_ACTIONS,
           }
           break;
         }
@@ -396,6 +418,7 @@ export const fetchCoinsData = async (
             unclaimedBalance,
             vsCurrency:vsCurrency,
             currentPrice:ppHive,
+            actions:HIVE_POWER_ACTIONS,
             extraDataPairs:[
               {
                 label:'Delegated Hive Power',