mirror of
https://github.com/ecency/ecency-mobile.git
synced 2025-01-02 19:06:39 +03:00
linked navigation with coin actions
This commit is contained in:
parent
195280d764
commit
87e71ffa3d
@ -68,8 +68,8 @@
|
|||||||
"next": "NEXT",
|
"next": "NEXT",
|
||||||
"delegate": "Delegate",
|
"delegate": "Delegate",
|
||||||
"power_down": "Power Down",
|
"power_down": "Power Down",
|
||||||
"withdraw_hive": "Withdraw HIVE",
|
"withdraw_hive": "Withdraw Savings",
|
||||||
"withdraw_hbd": "Withdraw HBD",
|
"withdraw_hbd": "Withdraw Savings",
|
||||||
"transfer_to_savings": "To Savings",
|
"transfer_to_savings": "To Savings",
|
||||||
"convert": "Convert",
|
"convert": "Convert",
|
||||||
"escrow_transfer": "Escrow Transfer",
|
"escrow_transfer": "Escrow Transfer",
|
||||||
|
@ -42,6 +42,7 @@ export interface CoinActivity {
|
|||||||
}
|
}
|
||||||
|
|
||||||
interface State {
|
interface State {
|
||||||
|
tokenAddress:string;
|
||||||
selectedCoins:CoinBase[];
|
selectedCoins:CoinBase[];
|
||||||
coinsData:{
|
coinsData:{
|
||||||
[key: string]: CoinData;
|
[key: string]: CoinData;
|
||||||
@ -56,6 +57,7 @@ interface State {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const initialState:State = {
|
const initialState:State = {
|
||||||
|
tokenAddress:'',
|
||||||
selectedCoins:DEFAULT_COINS,
|
selectedCoins:DEFAULT_COINS,
|
||||||
coinsData:{},
|
coinsData:{},
|
||||||
priceHistories:{},
|
priceHistories:{},
|
||||||
@ -75,6 +77,7 @@ export default function (state = initialState, action) {
|
|||||||
case SET_COINS_DATA:{
|
case SET_COINS_DATA:{
|
||||||
return {
|
return {
|
||||||
...state,
|
...state,
|
||||||
|
//TODO: pass and asign tokenAddress
|
||||||
coinsData:payload,
|
coinsData:payload,
|
||||||
updateTimestamp:new Date().getTime()
|
updateTimestamp:new Date().getTime()
|
||||||
}
|
}
|
||||||
|
@ -1,25 +1,22 @@
|
|||||||
import React, { Fragment } from 'react'
|
import React, { Fragment } from 'react'
|
||||||
import { useIntl } from 'react-intl'
|
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 { TouchableOpacity } from 'react-native-gesture-handler'
|
||||||
|
import { withNavigation } from 'react-navigation'
|
||||||
import styles from './children.styles'
|
import styles from './children.styles'
|
||||||
|
|
||||||
interface CoinActionsProps {
|
interface CoinActionsProps {
|
||||||
coinId:string;
|
|
||||||
actions:string[];
|
actions:string[];
|
||||||
|
onActionPress:(action:string)=>void;
|
||||||
}
|
}
|
||||||
|
|
||||||
const CoinActions = ({coinId, actions}:CoinActionsProps) => {
|
export const CoinActions = withNavigation(({actions, onActionPress}:CoinActionsProps) => {
|
||||||
const intl = useIntl();
|
const intl = useIntl();
|
||||||
|
|
||||||
const _navigate = (action:string) => {
|
|
||||||
Alert.alert("Action Press", action)
|
|
||||||
}
|
|
||||||
|
|
||||||
const _renderItem = (item) => {
|
const _renderItem = (item) => {
|
||||||
|
|
||||||
const _onPress = () => {
|
const _onPress = () => {
|
||||||
_navigate(item)
|
onActionPress(item)
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
@ -38,6 +35,4 @@ const CoinActions = ({coinId, actions}:CoinActionsProps) => {
|
|||||||
{actions.map(_renderItem)}
|
{actions.map(_renderItem)}
|
||||||
</View>
|
</View>
|
||||||
)
|
)
|
||||||
}
|
});
|
||||||
|
|
||||||
export default CoinActions
|
|
@ -1,21 +1,22 @@
|
|||||||
import React from 'react'
|
import React from 'react'
|
||||||
import { View } from 'react-native'
|
import { View } from 'react-native'
|
||||||
import { CoinBasics, CoinChart } from '.'
|
import { CoinActions, CoinBasics, CoinChart } from '.'
|
||||||
import { FormattedCurrency } from '../../../components'
|
import { FormattedCurrency } from '../../../components'
|
||||||
import { COIN_IDS } from '../../../constants/defaultCoins'
|
import { COIN_IDS } from '../../../constants/defaultCoins'
|
||||||
import { CoinData, DataPair } from '../../../redux/reducers/walletReducer'
|
import { CoinData, DataPair } from '../../../redux/reducers/walletReducer'
|
||||||
import CoinActions from './coinActions'
|
|
||||||
|
|
||||||
export interface CoinSummaryProps {
|
export interface CoinSummaryProps {
|
||||||
id:string;
|
id:string;
|
||||||
coinSymbol:string;
|
coinSymbol:string;
|
||||||
coinData:CoinData;
|
coinData:CoinData;
|
||||||
|
onActionPress:(action:string)=>void;
|
||||||
}
|
}
|
||||||
|
|
||||||
export const CoinSummary = ({
|
export const CoinSummary = ({
|
||||||
coinSymbol,
|
coinSymbol,
|
||||||
id,
|
id,
|
||||||
coinData,
|
coinData,
|
||||||
|
onActionPress,
|
||||||
}:CoinSummaryProps) => {
|
}:CoinSummaryProps) => {
|
||||||
const {
|
const {
|
||||||
balance,
|
balance,
|
||||||
@ -49,7 +50,7 @@ export const CoinSummary = ({
|
|||||||
return (
|
return (
|
||||||
<View>
|
<View>
|
||||||
<CoinBasics valuePairs={valuePairs} extraData={extraDataPairs} coinSymbol={coinSymbol} />
|
<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} />
|
id !== COIN_IDS.ECENCY && id !== COIN_IDS.HP && <CoinChart coinId={id} />
|
||||||
}
|
}
|
||||||
|
@ -3,3 +3,4 @@ export * from './coinChart';
|
|||||||
export * from './rangeSelector';
|
export * from './rangeSelector';
|
||||||
export * from './coinSummary';
|
export * from './coinSummary';
|
||||||
export * from './activitiesList';
|
export * from './activitiesList';
|
||||||
|
export * from './coinActions';
|
@ -9,6 +9,10 @@ import { useAppDispatch, useAppSelector } from '../../../hooks'
|
|||||||
import { CoinActivity, CoinData } from '../../../redux/reducers/walletReducer';
|
import { CoinActivity, CoinData } from '../../../redux/reducers/walletReducer';
|
||||||
import { fetchCoinActivities } from '../../../utils/wallet';
|
import { fetchCoinActivities } from '../../../utils/wallet';
|
||||||
import { setCoinActivities } from '../../../redux/actions/walletActions';
|
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 {
|
export interface CoinDetailsScreenParams {
|
||||||
coinId:string;
|
coinId:string;
|
||||||
@ -28,12 +32,13 @@ const CoinDetailsScreen = ({navigation}:CoinDetailsScreenProps) => {
|
|||||||
|
|
||||||
const currentAccount = useAppSelector(state=>state.account.currentAccount);
|
const currentAccount = useAppSelector(state=>state.account.currentAccount);
|
||||||
const globalProps = useAppSelector(state=>state.account.globalProps);
|
const globalProps = useAppSelector(state=>state.account.globalProps);
|
||||||
|
const tokenAddress = useAppSelector(state=>state.wallet.tokenAddress);
|
||||||
const selectedCoins = useAppSelector(state=>state.wallet.selectedCoins);
|
const selectedCoins = useAppSelector(state=>state.wallet.selectedCoins);
|
||||||
const coinData:CoinData = useAppSelector(state=>state.wallet.coinsData[coinId]);
|
const coinData:CoinData = useAppSelector(state=>state.wallet.coinsData[coinId]);
|
||||||
const coinActivities:CoinActivity[] = useAppSelector(state=>state.wallet.coinsActivities[coinId]);
|
const coinActivities:CoinActivity[] = useAppSelector(state=>state.wallet.coinsActivities[coinId]);
|
||||||
|
const isPinCodeOpen = useAppSelector(state=>state.application.isPinCodeOpen);
|
||||||
|
|
||||||
|
const [symbol] = useState(selectedCoins.find((item)=>item.id===coinId).symbol);
|
||||||
const {symbol, id } = selectedCoins.find((item)=>item.id===coinId)
|
|
||||||
|
|
||||||
|
|
||||||
useEffect(()=>{
|
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 = (
|
const _renderHeaderComponent = (
|
||||||
<>
|
<>
|
||||||
<CoinSummary {...{
|
<CoinSummary
|
||||||
id,
|
id={coinId}
|
||||||
coinSymbol:symbol,
|
coinSymbol={symbol}
|
||||||
coinData,
|
coinData={coinData}
|
||||||
}} />
|
onActionPress={_onActionPress}
|
||||||
|
/>
|
||||||
<Text style={styles.textActivities}>Activities</Text>
|
<Text style={styles.textActivities}>Activities</Text>
|
||||||
</>
|
</>
|
||||||
)
|
)
|
||||||
|
Loading…
Reference in New Issue
Block a user