-
Notifications
You must be signed in to change notification settings - Fork 504
/
template.tsx
87 lines (84 loc) · 2.38 KB
/
template.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
import { HomeBalanceRow, HomeBalanceTable } from 'components/Balances'
import { Icon, Text } from 'blockchain-info-components'
import { LinkContainer } from 'react-router-bootstrap'
import { mapObjIndexed, toLower, values } from 'ramda'
import { Props, SuccessStateType } from '.'
import { SupportedWalletCurrencyType } from 'core/types'
import CoinBalance from '../CoinBalance'
import React from 'react'
import styled from 'styled-components'
const TxLink = styled(LinkContainer)`
&:hover {
cursor: pointer;
}
`
const Wrapper = styled.div`
display: flex;
align-items: center;
justify-content: space-between;
`
const Coin = styled.div`
display: flex;
align-items: center;
`
const CoinName = styled(Text)`
font-size: 20px;
font-weight: 500;
color: ${props => props.theme.grey800};
`
const CoinIcon = styled(Icon)`
font-size: 32px;
margin-right: 16px;
`
const Amount = styled.div`
display: flex;
flex-direction: column;
align-items: flex-end;
> div:last-child {
margin-top: 5px;
}
`
const Success = (props: Props & SuccessStateType) => {
const { viewType, coins } = props
return (
<HomeBalanceTable>
{values(
mapObjIndexed((coin: SupportedWalletCurrencyType, i) => {
// @ts-ignore
if (viewType === 'Hardware' && !coin.hasLockboxSupport) return
const link =
viewType === 'Hardware' ? '/lockbox' : coin.txListAppRoute
return (
coin.method &&
coin.invited && (
<HomeBalanceRow
key={i}
data-e2e={`${toLower(coin.coinCode)}BalanceTable`}
>
<TxLink to={link}>
<div>
<Wrapper>
<Coin>
<CoinIcon
color={coin.colorCode}
name={coin.icons.circleFilled}
/>
<CoinName color={'grey700'}>
{coin.displayName}
</CoinName>
</Coin>
<Amount>
<CoinBalance {...props} coin={coin.coinCode} />
</Amount>
</Wrapper>
</div>
</TxLink>
</HomeBalanceRow>
)
)
}, coins)
)}
</HomeBalanceTable>
)
}
export default Success