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

refactor Compute flow

This commit is contained in:
Matthias Kretschmann 2020-10-19 13:23:44 +02:00
parent 018a765a23
commit 28e5a06b60
Signed by: m
GPG Key ID: 606EEEF3C479A91F
2 changed files with 21 additions and 2 deletions

View File

@ -22,3 +22,9 @@
.feedback { .feedback {
width: 100%; width: 100%;
} }
.hasTokens {
font-size: var(--font-size-small);
color: var(--color-secondary);
margin-top: calc(var(--spacer) / 4);
}

View File

@ -9,7 +9,8 @@ import {
computeOptions, computeOptions,
useCompute, useCompute,
readFileContent, readFileContent,
useOcean useOcean,
usePricing
} from '@oceanprotocol/react' } from '@oceanprotocol/react'
import styles from './Compute.module.css' import styles from './Compute.module.css'
import Button from '../../atoms/Button' import Button from '../../atoms/Button'
@ -26,9 +27,12 @@ export default function Compute({
isBalanceSufficient: boolean isBalanceSufficient: boolean
dtBalance: string dtBalance: string
}): ReactElement { }): ReactElement {
const { marketFeeAddress } = useSiteMetadata()
const { ocean } = useOcean() const { ocean } = useOcean()
const { compute, isLoading, computeStepText, computeError } = useCompute() const { compute, isLoading, computeStepText, computeError } = useCompute()
const { marketFeeAddress } = useSiteMetadata() const { buyDT, dtSymbol } = usePricing(ddo)
const computeService = ddo.findServiceByType('compute') const computeService = ddo.findServiceByType('compute')
const metadataService = ddo.findServiceByType('metadata') const metadataService = ddo.findServiceByType('metadata')
@ -50,6 +54,7 @@ export default function Compute({
computeType === '' || computeType === '' ||
!ocean || !ocean ||
!isBalanceSufficient !isBalanceSufficient
const hasDatatoken = Number(dtBalance) >= 1
const onDrop = async (files: File[]) => { const onDrop = async (files: File[]) => {
setFile(files[0]) setFile(files[0])
@ -74,6 +79,8 @@ export default function Compute({
setIsPublished(false) setIsPublished(false)
setError('') setError('')
!hasDatatoken && (await buyDT('1'))
await compute( await compute(
ddo.id, ddo.id,
computeService, computeService,
@ -101,6 +108,12 @@ export default function Compute({
</div> </div>
<div className={styles.pricewrapper}> <div className={styles.pricewrapper}>
<Price ddo={ddo} conversion /> <Price ddo={ddo} conversion />
{hasDatatoken && (
<div className={styles.hasTokens}>
You own {dtBalance} {dtSymbol} so you can use this asset without
paying again.
</div>
)}
</div> </div>
</div> </div>