1
0
mirror of https://github.com/oceanprotocol/market.git synced 2024-12-02 05:57:29 +01:00

output liquidity provider fee from pool

This commit is contained in:
Matthias Kretschmann 2020-08-31 14:17:40 +02:00
parent 5e772ca843
commit d9a4b5697c
Signed by: m
GPG Key ID: 606EEEF3C479A91F
2 changed files with 23 additions and 5 deletions

View File

@ -21,7 +21,9 @@
}
.output {
text-align: center;
display: grid;
gap: var(--spacer);
grid-template-columns: 1fr 1fr;
}
.output p {

View File

@ -1,4 +1,4 @@
import React, { ReactElement, useState, ChangeEvent } from 'react'
import React, { ReactElement, useState, ChangeEvent, useEffect } from 'react'
import styles from './Add.module.css'
import { useOcean } from '@oceanprotocol/react'
import Header from './Header'
@ -24,6 +24,7 @@ export default function Add({
}): ReactElement {
const { ocean, accountId, balance } = useOcean()
const [amount, setAmount] = useState('')
const [swapFee, setSwapFee] = useState<string>()
const [txId, setTxId] = useState<string>('')
const [isLoading, setIsLoading] = useState<boolean>()
@ -35,6 +36,14 @@ export default function Add({
totalBalance &&
((Number(newPoolTokens) / Number(totalPoolTokens)) * 100).toFixed(2)
useEffect(() => {
async function getFee() {
const swapFee = await ocean.pool.getSwapFee(accountId, poolAddress)
setSwapFee(swapFee)
}
getFee()
}, [])
async function handleAddLiquidity() {
setIsLoading(true)
@ -78,9 +87,16 @@ export default function Add({
</div>
<div className={styles.output}>
<p>You will receive</p>
<Token symbol="BPT" balance={newPoolTokens} />
<Token symbol="% of pool" balance={newPoolShare} />
<div>
<p>You will receive</p>
<Token symbol="BPT" balance={newPoolTokens} />
<Token symbol="% of pool" balance={newPoolShare} />
</div>
<div>
<p>You will earn</p>
<Token symbol="%" balance={swapFee} />
of each pool transaction
</div>
</div>
<Actions