1
0
mirror of https://github.com/oceanprotocol/market.git synced 2024-11-15 01:34:57 +01:00
This commit is contained in:
Matthias Kretschmann 2020-08-20 12:54:54 +02:00
parent bfa0f3ba5c
commit 0af06792e6
Signed by: m
GPG Key ID: 606EEEF3C479A91F
2 changed files with 19 additions and 7 deletions

View File

@ -1,6 +1,6 @@
.token { .token {
font-weight: var(--font-weight-bold); font-weight: var(--font-weight-bold);
margin-bottom: calc(var(--spacer) / 4); margin-bottom: calc(var(--spacer) / 3);
white-space: nowrap; white-space: nowrap;
} }
@ -17,6 +17,7 @@
padding: 0.3rem; padding: 0.3rem;
vertical-align: middle; vertical-align: middle;
margin-right: calc(var(--spacer) / 8); margin-right: calc(var(--spacer) / 8);
margin-top: -0.3rem;
} }
.icon svg { .icon svg {
@ -32,6 +33,7 @@
stroke-linejoin: round; stroke-linejoin: round;
} }
.icon[class*='%'] { .icon[class*='%'],
.icon[class*='BPT'] {
opacity: 0; opacity: 0;
} }

View File

@ -10,7 +10,6 @@ import Add from './Add'
import Remove from './Remove' import Remove from './Remove'
import Tooltip from '../../../atoms/Tooltip' import Tooltip from '../../../atoms/Tooltip'
import Conversion from '../../../atoms/Price/Conversion' import Conversion from '../../../atoms/Price/Conversion'
import { ReactComponent as External } from '../../../../images/external.svg'
import EtherscanLink from '../../../atoms/EtherscanLink' import EtherscanLink from '../../../atoms/EtherscanLink'
interface Balance { interface Balance {
@ -19,9 +18,10 @@ interface Balance {
} }
export default function Pool({ ddo }: { ddo: DDO }): ReactElement { export default function Pool({ ddo }: { ddo: DDO }): ReactElement {
const { ocean, accountId } = useOcean() const { ocean, accountId, account } = useOcean()
const { getBestPool } = useMetadata() const { getBestPool } = useMetadata()
const [poolAddress, setPoolAddress] = useState<string>() const [poolAddress, setPoolAddress] = useState<string>()
const [poolTokens, setPoolTokens] = useState<string>()
const [totalBalance, setTotalBalance] = useState<Balance>() const [totalBalance, setTotalBalance] = useState<Balance>()
const [dtPrice, setDtPrice] = useState<string>() const [dtPrice, setDtPrice] = useState<string>()
const [dtSymbol, setDtSymbol] = useState<string>() const [dtSymbol, setDtSymbol] = useState<string>()
@ -56,16 +56,25 @@ export default function Pool({ ddo }: { ddo: DDO }): ReactElement {
dt: dtReserve dt: dtReserve
}) })
const sharesBalance = await ocean.pool.sharesBalance( const poolTokens = await ocean.pool.sharesBalance(
accountId, accountId,
poolAddress poolAddress
) )
setPoolTokens(poolTokens)
// TODO: figure out how to get that
const totalPoolTokens = await ocean.accounts.getTokenBalance(
poolAddress,
account
)
console.log(totalPoolTokens)
// TODO: replace `dtReserve` with `totalPoolTokens`
const userBalance = { const userBalance = {
ocean: `${ ocean: `${
(Number(sharesBalance) / Number(dtReserve)) * Number(oceanReserve) (Number(poolTokens) / Number(dtReserve)) * Number(oceanReserve)
}`, }`,
dt: sharesBalance dt: '0'
} }
setUserBalance(userBalance) setUserBalance(userBalance)
@ -118,6 +127,7 @@ export default function Pool({ ddo }: { ddo: DDO }): ReactElement {
</h3> </h3>
<Token symbol="OCEAN" balance={userBalance.ocean} /> <Token symbol="OCEAN" balance={userBalance.ocean} />
<Token symbol={dtSymbol} balance={userBalance.dt} /> <Token symbol={dtSymbol} balance={userBalance.dt} />
<Token symbol="BPT" balance={poolTokens} />
<Token symbol="%" balance={poolShare} /> <Token symbol="%" balance={poolShare} />
</div> </div>