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

pricing feedback fixes

Browse Source
This commit is contained in:
Matthias Kretschmann 2021-11-24 13:18:53 +00:00
parent 5bf8543150
commit e2b5707859
Signed by: m
GPG Key ID: 606EEEF3C479A91F
2 changed files with 14 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/components/Publish/Pricing/Dynamic.module.css
View File

@ -18,8 +18,13 @@
} }
} }
.summary { .subtitle {
margin-top: var(--spacer); display: inline-block;
color: var(--color-secondary);
margin-left: calc(var(--spacer) / 4);
font-family: var(--font-family-base);
font-weight: var(--font-weight-base);
font-size: var(--font-size-small);
} }
.alertArea { .alertArea {

20
src/components/Publish/Pricing/Dynamic.tsx
View File

@ -8,13 +8,11 @@ import Fees from './Fees'
import { FormikContextType, useFormikContext } from 'formik' import { FormikContextType, useFormikContext } from 'formik'
import Price from './Price' import Price from './Price'
import Decimal from 'decimal.js' import Decimal from 'decimal.js'
import { useOcean } from '@context/Ocean'
import { useWeb3 } from '@context/Web3' import { useWeb3 } from '@context/Web3'
import { FormPublishData } from '../_types' import { FormPublishData } from '../_types'
export default function Dynamic({ content }: { content: any }): ReactElement { export default function Dynamic({ content }: { content: any }): ReactElement {
const { networkId, balance } = useWeb3() const { networkId, accountId, balance } = useWeb3()
const { account } = useOcean()
const [firstPrice, setFirstPrice] = useState<string>() const [firstPrice, setFirstPrice] = useState<string>()
// Connect with form // Connect with form
@ -51,14 +49,14 @@ export default function Dynamic({ content }: { content: any }): ReactElement {
// Check: account, network & insufficient balance // Check: account, network & insufficient balance
useEffect(() => { useEffect(() => {
if (!account) { if (!accountId) {
setError(`No account connected. Please connect your Web3 wallet.`) setError(`No account connected. Please connect your Web3 wallet.`)
} else if (Number(balance.ocean) < Number(price)) { } else if (Number(balance.ocean) < Number(amountOcean)) {
setError(`Insufficient balance. You need at least ${price} OCEAN`) setError(`Insufficient balance. You need at least ${amountOcean} OCEAN.`)
} else { } else {
setError(undefined) setError(undefined)
} }
}, [price, networkId, account, balance]) }, [amountOcean, networkId, accountId, balance])
return ( return (
<> <>
@ -71,7 +69,8 @@ export default function Dynamic({ content }: { content: any }): ReactElement {
<Price firstPrice={firstPrice} /> <Price firstPrice={firstPrice} />
<h4 className={styles.title}> <h4 className={styles.title}>
Datatoken Liquidity Pool <Tooltip content={content.tooltips.poolInfo} /> Datatoken Liquidity Pool <Tooltip content={content.tooltips.poolInfo} />{' '}
<span className={styles.subtitle}>100% share of pool</span>
</h4> </h4>
<div className={styles.tokens}> <div className={styles.tokens}>
@ -93,11 +92,6 @@ export default function Dynamic({ content }: { content: any }): ReactElement {
<Fees tooltips={content.tooltips} pricingType="dynamic" /> <Fees tooltips={content.tooltips} pricingType="dynamic" />
<footer className={styles.summary}>
You will get: <br />
100% share of pool
</footer>
{error && ( {error && (
<div className={styles.alertArea}> <div className={styles.alertArea}>
<Alert text={error} state="error" /> <Alert text={error} state="error" />