mirror of
https://github.com/oceanprotocol/market.git
synced 2024-06-28 00:27:49 +02:00
* Wip start compute job * Wip select algorithm design * Asset selection form component, for start compute job (#442) * prototype AssetSelection * assetselection styling * typing "fix" * put back file info icon * AssetSelection styling in context * update start job method, fixed algo select, and fixed option typing * compute logic update * add has previous orders for algo asset * fixed search algorithm assets in start compute form * fixed lint errors * updated previous order for algo logic and compute flow * update use price hook and added buy DT for algo * display only alg of type exchange and sort by value * display only trusted algo for asset if field is set * added logic for allow all published algorithms or no algorithms allowed * asset selection style & spacing tweaks * refactor get algorithms for compute and edit compute * fixed form options and more refactoring * new ButtonBuy component * shared component between consume/compute * dealing with various states: loading, previous orders, help text output * effect dependencies * move error output into toast * formik data flow refactor * ditch custom field change handler * fix initialValues * typed form data & validation * fixes multiple form validation issues along the way * isInitialValid → validateOnMount * metadata display tweaks * error feedback tweaks * oler assets checks, confeti on succes job, market fee on order, removed algo compute logic * more startJob logging * feedback & messaging changes * metadata display * return all algos, fixed & dynamic priced ones * fix DOM nesting * messaging updates * copy tweaks * check algorithm previous history for both acces and compute sercive types * handle start compute error * extra checks on start compute response * styling tweaks, fix toast UI errors * AssetSelection: empty screen, tweak min/max height * fix FRE issues on start compute * check is ordarable before start compute job * logging tweaks * disable eslint no-unused-vars rule for some Apollo code blocks * fix metadata editing for compute assets * consider dataset timeout for compute too Co-authored-by: Matthias Kretschmann <m@kretschmann.io>
95 lines
2.3 KiB
TypeScript
95 lines
2.3 KiB
TypeScript
import React, { ReactElement, useState, useEffect } from 'react'
|
|
import styles from './index.module.css'
|
|
import Compute from './Compute'
|
|
import Consume from './Consume'
|
|
import { Logger } from '@oceanprotocol/lib'
|
|
import Tabs from '../../atoms/Tabs'
|
|
import compareAsBN from '../../../utils/compareAsBN'
|
|
import Pool from './Pool'
|
|
import Trade from './Trade'
|
|
import { useAsset } from '../../../providers/Asset'
|
|
import { useOcean } from '../../../providers/Ocean'
|
|
import { useWeb3 } from '../../../providers/Web3'
|
|
|
|
export default function AssetActions(): ReactElement {
|
|
const { accountId } = useWeb3()
|
|
const { ocean, balance, account } = useOcean()
|
|
const { price, ddo, metadata } = useAsset()
|
|
|
|
const [isBalanceSufficient, setIsBalanceSufficient] = useState<boolean>()
|
|
const [dtBalance, setDtBalance] = useState<string>()
|
|
|
|
const isCompute = Boolean(ddo?.findServiceByType('compute'))
|
|
|
|
// Get and set user DT balance
|
|
useEffect(() => {
|
|
if (!ocean || !accountId) return
|
|
|
|
async function init() {
|
|
try {
|
|
const dtBalance = await ocean.datatokens.balance(
|
|
ddo.dataToken,
|
|
accountId
|
|
)
|
|
setDtBalance(dtBalance)
|
|
} catch (e) {
|
|
Logger.error(e.message)
|
|
}
|
|
}
|
|
init()
|
|
}, [ocean, accountId, ddo.dataToken])
|
|
|
|
// Check user balance against price
|
|
useEffect(() => {
|
|
if (!price?.value || !account || !balance?.ocean || !dtBalance) return
|
|
|
|
setIsBalanceSufficient(
|
|
compareAsBN(balance.ocean, `${price.value}`) || Number(dtBalance) >= 1
|
|
)
|
|
|
|
return () => {
|
|
setIsBalanceSufficient(false)
|
|
}
|
|
}, [balance, account, price, dtBalance])
|
|
|
|
const UseContent = isCompute ? (
|
|
<Compute
|
|
ddo={ddo}
|
|
dtBalance={dtBalance}
|
|
isBalanceSufficient={isBalanceSufficient}
|
|
file={metadata?.main.files[0]}
|
|
/>
|
|
) : (
|
|
<Consume
|
|
ddo={ddo}
|
|
dtBalance={dtBalance}
|
|
isBalanceSufficient={isBalanceSufficient}
|
|
file={metadata?.main.files[0]}
|
|
/>
|
|
)
|
|
|
|
const tabs = [
|
|
{
|
|
title: 'Use',
|
|
content: UseContent
|
|
}
|
|
]
|
|
|
|
// Check from metadata, cause that is available earlier
|
|
const hasPool = ddo?.price?.type === 'pool'
|
|
|
|
hasPool &&
|
|
tabs.push(
|
|
{
|
|
title: 'Pool',
|
|
content: <Pool />
|
|
},
|
|
{
|
|
title: 'Trade',
|
|
content: <Trade />
|
|
}
|
|
)
|
|
|
|
return <Tabs items={tabs} className={styles.actions} />
|
|
}
|