mirror of
https://github.com/oceanprotocol/market.git
synced 2024-12-02 05:57:29 +01:00
Merge branch 'main' into feature/account_page
This commit is contained in:
commit
7965b74302
@ -4,6 +4,7 @@ import classNames from 'classnames/bind'
|
|||||||
import Conversion from './Conversion'
|
import Conversion from './Conversion'
|
||||||
import styles from './PriceUnit.module.css'
|
import styles from './PriceUnit.module.css'
|
||||||
import { useUserPreferences } from '../../../providers/UserPreferences'
|
import { useUserPreferences } from '../../../providers/UserPreferences'
|
||||||
|
import { useOcean } from '../../../providers/Ocean'
|
||||||
import Badge from '../Badge'
|
import Badge from '../Badge'
|
||||||
|
|
||||||
const cx = classNames.bind(styles)
|
const cx = classNames.bind(styles)
|
||||||
@ -48,7 +49,7 @@ export default function PriceUnit({
|
|||||||
<>
|
<>
|
||||||
<div>
|
<div>
|
||||||
{Number.isNaN(Number(price)) ? '-' : formatPrice(price, locale)}{' '}
|
{Number.isNaN(Number(price)) ? '-' : formatPrice(price, locale)}{' '}
|
||||||
<span className={styles.symbol}>{symbol || 'OCEAN'}</span>
|
<span className={styles.symbol}>{symbol}</span>
|
||||||
{type && type === 'pool' && (
|
{type && type === 'pool' && (
|
||||||
<Badge label="pool" className={styles.badge} />
|
<Badge label="pool" className={styles.badge} />
|
||||||
)}
|
)}
|
||||||
|
@ -1,9 +1,9 @@
|
|||||||
import React, { ReactElement } from 'react'
|
import React, { ReactElement } from 'react'
|
||||||
import styles from './index.module.css'
|
import styles from './index.module.css'
|
||||||
import { BestPrice } from '@oceanprotocol/lib'
|
|
||||||
import Loader from '../Loader'
|
import Loader from '../Loader'
|
||||||
import Tooltip from '../Tooltip'
|
import Tooltip from '../Tooltip'
|
||||||
import PriceUnit from './PriceUnit'
|
import PriceUnit from './PriceUnit'
|
||||||
|
import { BestPrice } from '../../../models/BestPrice'
|
||||||
|
|
||||||
export default function Price({
|
export default function Price({
|
||||||
price,
|
price,
|
||||||
@ -19,6 +19,7 @@ export default function Price({
|
|||||||
return price?.value || price?.type === 'free' ? (
|
return price?.value || price?.type === 'free' ? (
|
||||||
<PriceUnit
|
<PriceUnit
|
||||||
price={`${price.value}`}
|
price={`${price.value}`}
|
||||||
|
symbol={price.oceanSymbol}
|
||||||
className={className}
|
className={className}
|
||||||
small={small}
|
small={small}
|
||||||
conversion={conversion}
|
conversion={conversion}
|
||||||
|
@ -2,13 +2,13 @@ import React from 'react'
|
|||||||
import { Link } from 'gatsby'
|
import { Link } from 'gatsby'
|
||||||
import Dotdotdot from 'react-dotdotdot'
|
import Dotdotdot from 'react-dotdotdot'
|
||||||
import Price from '../atoms/Price'
|
import Price from '../atoms/Price'
|
||||||
import { DDO, BestPrice } from '@oceanprotocol/lib'
|
import { DDO } from '@oceanprotocol/lib'
|
||||||
import removeMarkdown from 'remove-markdown'
|
import removeMarkdown from 'remove-markdown'
|
||||||
import Publisher from '../atoms/Publisher'
|
import Publisher from '../atoms/Publisher'
|
||||||
import AssetType from '../atoms/AssetType'
|
import AssetType from '../atoms/AssetType'
|
||||||
import NetworkName from '../atoms/NetworkName'
|
import NetworkName from '../atoms/NetworkName'
|
||||||
import { useOcean } from '../../providers/Ocean'
|
|
||||||
import styles from './AssetTeaser.module.css'
|
import styles from './AssetTeaser.module.css'
|
||||||
|
import { BestPrice } from '../../models/BestPrice'
|
||||||
|
|
||||||
declare type AssetTeaserProps = {
|
declare type AssetTeaserProps = {
|
||||||
ddo: DDO
|
ddo: DDO
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
import { useUserPreferences } from '../../providers/UserPreferences'
|
import { useUserPreferences } from '../../providers/UserPreferences'
|
||||||
import React, { ReactElement, useEffect, useState } from 'react'
|
import React, { ReactElement, useEffect, useState } from 'react'
|
||||||
import Table from '../atoms/Table'
|
import Table from '../atoms/Table'
|
||||||
import { DDO, Logger, BestPrice } from '@oceanprotocol/lib'
|
import { Logger } from '@oceanprotocol/lib'
|
||||||
import Price from '../atoms/Price'
|
import Price from '../atoms/Price'
|
||||||
import Tooltip from '../atoms/Tooltip'
|
import Tooltip from '../atoms/Tooltip'
|
||||||
import AssetTitle from './AssetListTitle'
|
import AssetTitle from './AssetListTitle'
|
||||||
|
@ -4,7 +4,7 @@ import { Field, Form, FormikContextType, useFormikContext } from 'formik'
|
|||||||
import Input from '../../../atoms/Input'
|
import Input from '../../../atoms/Input'
|
||||||
import { FormFieldProps } from '../../../../@types/Form'
|
import { FormFieldProps } from '../../../../@types/Form'
|
||||||
import { useStaticQuery, graphql } from 'gatsby'
|
import { useStaticQuery, graphql } from 'gatsby'
|
||||||
import { DDO, BestPrice } from '@oceanprotocol/lib'
|
import { DDO } from '@oceanprotocol/lib'
|
||||||
import { AssetSelectionAsset } from '../../../molecules/FormFields/AssetSelection'
|
import { AssetSelectionAsset } from '../../../molecules/FormFields/AssetSelection'
|
||||||
import compareAsBN from '../../../../utils/compareAsBN'
|
import compareAsBN from '../../../../utils/compareAsBN'
|
||||||
import ButtonBuy from '../../../atoms/ButtonBuy'
|
import ButtonBuy from '../../../atoms/ButtonBuy'
|
||||||
@ -12,6 +12,7 @@ import PriceOutput from './PriceOutput'
|
|||||||
import { useAsset } from '../../../../providers/Asset'
|
import { useAsset } from '../../../../providers/Asset'
|
||||||
import { useOcean } from '../../../../providers/Ocean'
|
import { useOcean } from '../../../../providers/Ocean'
|
||||||
import { useWeb3 } from '../../../../providers/Web3'
|
import { useWeb3 } from '../../../../providers/Web3'
|
||||||
|
import { BestPrice } from '../../../../models/BestPrice'
|
||||||
|
|
||||||
const contentQuery = graphql`
|
const contentQuery = graphql`
|
||||||
query StartComputeDatasetQuery {
|
query StartComputeDatasetQuery {
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
import { BestPrice } from '@oceanprotocol/lib'
|
|
||||||
import React, { ReactElement } from 'react'
|
import React, { ReactElement } from 'react'
|
||||||
|
import { BestPrice } from '../../../../models/BestPrice'
|
||||||
import { useAsset } from '../../../../providers/Asset'
|
import { useAsset } from '../../../../providers/Asset'
|
||||||
import PriceUnit from '../../../atoms/Price/PriceUnit'
|
import PriceUnit from '../../../atoms/Price/PriceUnit'
|
||||||
import Tooltip from '../../../atoms/Tooltip'
|
import Tooltip from '../../../atoms/Tooltip'
|
||||||
|
@ -3,8 +3,7 @@ import {
|
|||||||
DDO,
|
DDO,
|
||||||
File as FileMetadata,
|
File as FileMetadata,
|
||||||
Logger,
|
Logger,
|
||||||
publisherTrustedAlgorithm,
|
publisherTrustedAlgorithm
|
||||||
BestPrice
|
|
||||||
} from '@oceanprotocol/lib'
|
} from '@oceanprotocol/lib'
|
||||||
import { toast } from 'react-toastify'
|
import { toast } from 'react-toastify'
|
||||||
import Price from '../../../atoms/Price'
|
import Price from '../../../atoms/Price'
|
||||||
@ -40,6 +39,7 @@ import AlgorithmDatasetsListForCompute from '../../AssetContent/AlgorithmDataset
|
|||||||
import { getPreviousOrders, getPrice } from '../../../../utils/subgraph'
|
import { getPreviousOrders, getPrice } from '../../../../utils/subgraph'
|
||||||
import AssetActionHistoryTable from '../../AssetActionHistoryTable'
|
import AssetActionHistoryTable from '../../AssetActionHistoryTable'
|
||||||
import ComputeJobs from '../../../pages/Profile/History/ComputeJobs'
|
import ComputeJobs from '../../../pages/Profile/History/ComputeJobs'
|
||||||
|
import { BestPrice } from '../../../../models/BestPrice'
|
||||||
|
|
||||||
const SuccessAction = () => (
|
const SuccessAction = () => (
|
||||||
<Button style="text" to="/profile?defaultTab=ComputeJobs" size="small">
|
<Button style="text" to="/profile?defaultTab=ComputeJobs" size="small">
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
import React, { ReactElement, useEffect, useState } from 'react'
|
import React, { ReactElement, useEffect, useState } from 'react'
|
||||||
import { toast } from 'react-toastify'
|
import { toast } from 'react-toastify'
|
||||||
import { File as FileMetadata, DDO, BestPrice } from '@oceanprotocol/lib'
|
import { File as FileMetadata, DDO } from '@oceanprotocol/lib'
|
||||||
import File from '../../atoms/File'
|
import File from '../../atoms/File'
|
||||||
import Price from '../../atoms/Price'
|
import Price from '../../atoms/Price'
|
||||||
import { useSiteMetadata } from '../../../hooks/useSiteMetadata'
|
import { useSiteMetadata } from '../../../hooks/useSiteMetadata'
|
||||||
@ -16,6 +16,7 @@ import ButtonBuy from '../../atoms/ButtonBuy'
|
|||||||
import { secondsToString } from '../../../utils/metadata'
|
import { secondsToString } from '../../../utils/metadata'
|
||||||
import AlgorithmDatasetsListForCompute from '../AssetContent/AlgorithmDatasetsListForCompute'
|
import AlgorithmDatasetsListForCompute from '../AssetContent/AlgorithmDatasetsListForCompute'
|
||||||
import styles from './Consume.module.css'
|
import styles from './Consume.module.css'
|
||||||
|
import { BestPrice } from '../../../models/BestPrice'
|
||||||
|
|
||||||
const previousOrderQuery = gql`
|
const previousOrderQuery = gql`
|
||||||
query PreviousOrder($id: String!, $account: String!) {
|
query PreviousOrder($id: String!, $account: String!) {
|
||||||
|
@ -8,6 +8,7 @@ export default function TokenList({
|
|||||||
title,
|
title,
|
||||||
children,
|
children,
|
||||||
ocean,
|
ocean,
|
||||||
|
oceanSymbol,
|
||||||
dt,
|
dt,
|
||||||
dtSymbol,
|
dtSymbol,
|
||||||
poolShares,
|
poolShares,
|
||||||
@ -18,6 +19,7 @@ export default function TokenList({
|
|||||||
title: string | ReactNode
|
title: string | ReactNode
|
||||||
children: ReactNode
|
children: ReactNode
|
||||||
ocean: string
|
ocean: string
|
||||||
|
oceanSymbol: string
|
||||||
dt: string
|
dt: string
|
||||||
dtSymbol: string
|
dtSymbol: string
|
||||||
poolShares: string
|
poolShares: string
|
||||||
@ -30,7 +32,7 @@ export default function TokenList({
|
|||||||
<h3 className={styles.title}>{title}</h3>
|
<h3 className={styles.title}>{title}</h3>
|
||||||
<div className={styles.tokens}>
|
<div className={styles.tokens}>
|
||||||
<div>
|
<div>
|
||||||
<Token symbol="OCEAN" balance={ocean} />
|
<Token symbol={oceanSymbol} balance={ocean} />
|
||||||
<Token symbol={dtSymbol} balance={dt} />
|
<Token symbol={dtSymbol} balance={dt} />
|
||||||
{conversion.greaterThan(0) && (
|
{conversion.greaterThan(0) && (
|
||||||
<Conversion
|
<Conversion
|
||||||
|
@ -55,7 +55,9 @@ const poolLiquidityQuery = gql`
|
|||||||
swapFee
|
swapFee
|
||||||
spotPrice
|
spotPrice
|
||||||
tokens {
|
tokens {
|
||||||
tokenAddress
|
address
|
||||||
|
symbol
|
||||||
|
isDatatoken
|
||||||
balance
|
balance
|
||||||
denormWeight
|
denormWeight
|
||||||
}
|
}
|
||||||
@ -85,9 +87,10 @@ export default function Pool(): ReactElement {
|
|||||||
|
|
||||||
const { accountId } = useWeb3()
|
const { accountId } = useWeb3()
|
||||||
const { ocean } = useOcean()
|
const { ocean } = useOcean()
|
||||||
|
const [dtSymbol, setDtSymbol] = useState<string>()
|
||||||
|
const [oceanSymbol, setOceanSymbol] = useState<string>()
|
||||||
const { isInPurgatory, ddo, owner, price, refreshInterval, isAssetNetwork } =
|
const { isInPurgatory, ddo, owner, price, refreshInterval, isAssetNetwork } =
|
||||||
useAsset()
|
useAsset()
|
||||||
const dtSymbol = ddo?.dataTokenInfo.symbol
|
|
||||||
|
|
||||||
const [poolTokens, setPoolTokens] = useState<string>()
|
const [poolTokens, setPoolTokens] = useState<string>()
|
||||||
const [totalPoolTokens, setTotalPoolTokens] = useState<string>()
|
const [totalPoolTokens, setTotalPoolTokens] = useState<string>()
|
||||||
@ -174,6 +177,12 @@ export default function Pool(): ReactElement {
|
|||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Set symbols
|
||||||
|
dataLiquidity.pool.tokens.forEach((token) => {
|
||||||
|
token.isDatatoken
|
||||||
|
? setDtSymbol(token.symbol)
|
||||||
|
: setOceanSymbol(token.symbol)
|
||||||
|
})
|
||||||
// Total pool shares
|
// Total pool shares
|
||||||
const totalPoolTokens = dataLiquidity.pool.totalShares
|
const totalPoolTokens = dataLiquidity.pool.totalShares
|
||||||
setTotalPoolTokens(totalPoolTokens)
|
setTotalPoolTokens(totalPoolTokens)
|
||||||
@ -188,7 +197,7 @@ export default function Pool(): ReactElement {
|
|||||||
|
|
||||||
// Get weights
|
// Get weights
|
||||||
const weightDt = dataLiquidity.pool.tokens.filter(
|
const weightDt = dataLiquidity.pool.tokens.filter(
|
||||||
(token: any) => token.tokenAddress === ddo.dataToken.toLowerCase()
|
(token: any) => token.address === ddo.dataToken.toLowerCase()
|
||||||
)[0].denormWeight
|
)[0].denormWeight
|
||||||
|
|
||||||
const weightDtDecimal = isValidNumber(weightDt)
|
const weightDtDecimal = isValidNumber(weightDt)
|
||||||
@ -391,7 +400,7 @@ export default function Pool(): ReactElement {
|
|||||||
<>
|
<>
|
||||||
<div className={styles.dataToken}>
|
<div className={styles.dataToken}>
|
||||||
<PriceUnit price="1" symbol={dtSymbol} /> ={' '}
|
<PriceUnit price="1" symbol={dtSymbol} /> ={' '}
|
||||||
<PriceUnit price={`${price?.value}`} />
|
<PriceUnit price={`${price?.value}`} symbol={oceanSymbol} />
|
||||||
<Tooltip content={content.tooltips.price} />
|
<Tooltip content={content.tooltips.price} />
|
||||||
<div className={styles.dataTokenLinks}>
|
<div className={styles.dataTokenLinks}>
|
||||||
<ExplorerLink
|
<ExplorerLink
|
||||||
@ -426,6 +435,7 @@ export default function Pool(): ReactElement {
|
|||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
ocean={`${userLiquidity?.ocean}`}
|
ocean={`${userLiquidity?.ocean}`}
|
||||||
|
oceanSymbol={oceanSymbol}
|
||||||
dt={`${userLiquidity?.datatoken}`}
|
dt={`${userLiquidity?.datatoken}`}
|
||||||
dtSymbol={dtSymbol}
|
dtSymbol={dtSymbol}
|
||||||
poolShares={poolTokens}
|
poolShares={poolTokens}
|
||||||
@ -438,6 +448,7 @@ export default function Pool(): ReactElement {
|
|||||||
<TokenList
|
<TokenList
|
||||||
title="Pool Creator Statistics"
|
title="Pool Creator Statistics"
|
||||||
ocean={`${creatorLiquidity?.ocean}`}
|
ocean={`${creatorLiquidity?.ocean}`}
|
||||||
|
oceanSymbol={oceanSymbol}
|
||||||
dt={`${creatorLiquidity?.datatoken}`}
|
dt={`${creatorLiquidity?.datatoken}`}
|
||||||
dtSymbol={dtSymbol}
|
dtSymbol={dtSymbol}
|
||||||
poolShares={creatorPoolTokens}
|
poolShares={creatorPoolTokens}
|
||||||
@ -462,6 +473,7 @@ export default function Pool(): ReactElement {
|
|||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
ocean={`${price?.ocean}`}
|
ocean={`${price?.ocean}`}
|
||||||
|
oceanSymbol={oceanSymbol}
|
||||||
dt={`${price?.datatoken}`}
|
dt={`${price?.datatoken}`}
|
||||||
dtSymbol={dtSymbol}
|
dtSymbol={dtSymbol}
|
||||||
poolShares={totalPoolTokens}
|
poolShares={totalPoolTokens}
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
import React, { ReactElement, useState } from 'react'
|
import React, { ReactElement, useState } from 'react'
|
||||||
import { BestPrice, DDO, Logger } from '@oceanprotocol/lib'
|
import { DDO, Logger } from '@oceanprotocol/lib'
|
||||||
import * as Yup from 'yup'
|
import * as Yup from 'yup'
|
||||||
import { Formik } from 'formik'
|
import { Formik } from 'formik'
|
||||||
import Actions from '../Pool/Actions'
|
import Actions from '../Pool/Actions'
|
||||||
@ -15,6 +15,7 @@ import Decimal from 'decimal.js'
|
|||||||
import { useOcean } from '../../../../providers/Ocean'
|
import { useOcean } from '../../../../providers/Ocean'
|
||||||
import { useWeb3 } from '../../../../providers/Web3'
|
import { useWeb3 } from '../../../../providers/Web3'
|
||||||
import { useAsset } from '../../../../providers/Asset'
|
import { useAsset } from '../../../../providers/Asset'
|
||||||
|
import { BestPrice } from '../../../../models/BestPrice'
|
||||||
|
|
||||||
const contentQuery = graphql`
|
const contentQuery = graphql`
|
||||||
query TradeQuery {
|
query TradeQuery {
|
||||||
|
@ -12,9 +12,11 @@ Decimal.set({ toExpNeg: -18, precision: 18, rounding: 1 })
|
|||||||
|
|
||||||
export default function Output({
|
export default function Output({
|
||||||
dtSymbol,
|
dtSymbol,
|
||||||
|
oceanSymbol,
|
||||||
poolAddress
|
poolAddress
|
||||||
}: {
|
}: {
|
||||||
dtSymbol: string
|
dtSymbol: string
|
||||||
|
oceanSymbol: string
|
||||||
poolAddress: string
|
poolAddress: string
|
||||||
}): ReactElement {
|
}): ReactElement {
|
||||||
const { ocean } = useOcean()
|
const { ocean } = useOcean()
|
||||||
@ -78,14 +80,14 @@ export default function Output({
|
|||||||
<div>
|
<div>
|
||||||
<p>Minimum Received</p>
|
<p>Minimum Received</p>
|
||||||
<Token
|
<Token
|
||||||
symbol={values.type === 'buy' ? dtSymbol : 'OCEAN'}
|
symbol={values.type === 'buy' ? dtSymbol : oceanSymbol}
|
||||||
balance={maxOutput}
|
balance={maxOutput}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<p>Swap fee</p>
|
<p>Swap fee</p>
|
||||||
<Token
|
<Token
|
||||||
symbol={`${values.type === 'buy' ? `OCEAN` : dtSymbol} ${
|
symbol={`${values.type === 'buy' ? oceanSymbol : dtSymbol} ${
|
||||||
swapFee ? `(${swapFee}%)` : ''
|
swapFee ? `(${swapFee}%)` : ''
|
||||||
}`}
|
}`}
|
||||||
balance={swapFeeValue}
|
balance={swapFeeValue}
|
||||||
|
@ -33,10 +33,10 @@ export default function Swap({
|
|||||||
setMaximumDt: (value: string) => void
|
setMaximumDt: (value: string) => void
|
||||||
setMaximumOcean: (value: string) => void
|
setMaximumOcean: (value: string) => void
|
||||||
}): ReactElement {
|
}): ReactElement {
|
||||||
const { ocean } = useOcean()
|
const { ocean, config } = useOcean()
|
||||||
const [oceanItem, setOceanItem] = useState<TradeItem>({
|
const [oceanItem, setOceanItem] = useState<TradeItem>({
|
||||||
amount: '0',
|
amount: '0',
|
||||||
token: 'OCEAN',
|
token: config.oceanTokenSymbol,
|
||||||
maxAmount: '0'
|
maxAmount: '0'
|
||||||
})
|
})
|
||||||
const [dtItem, setDtItem] = useState<TradeItem>({
|
const [dtItem, setDtItem] = useState<TradeItem>({
|
||||||
@ -194,7 +194,11 @@ export default function Swap({
|
|||||||
handleValueChange={handleValueChange}
|
handleValueChange={handleValueChange}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<Output dtSymbol={dtItem.token} poolAddress={price?.address} />
|
<Output
|
||||||
|
dtSymbol={dtItem.token}
|
||||||
|
oceanSymbol={oceanItem.token}
|
||||||
|
poolAddress={price?.address}
|
||||||
|
/>
|
||||||
|
|
||||||
<PriceImpact
|
<PriceImpact
|
||||||
totalValue={totalValue}
|
totalValue={totalValue}
|
||||||
|
@ -38,9 +38,9 @@ const poolSharesQuery = gql`
|
|||||||
datatokenAddress
|
datatokenAddress
|
||||||
valueLocked
|
valueLocked
|
||||||
tokens {
|
tokens {
|
||||||
tokenId {
|
id
|
||||||
symbol
|
isDatatoken
|
||||||
}
|
symbol
|
||||||
}
|
}
|
||||||
oceanReserve
|
oceanReserve
|
||||||
datatokenReserve
|
datatokenReserve
|
||||||
@ -60,13 +60,17 @@ interface Asset {
|
|||||||
createTime: number
|
createTime: number
|
||||||
}
|
}
|
||||||
|
|
||||||
function findValidToken(tokens: PoolSharePoolIdTokens[]) {
|
function findTokenByType(tokens: PoolSharePoolIdTokens[], type: string) {
|
||||||
const symbol = tokens.find((token) => token.tokenId !== null)
|
const { symbol } = tokens.find((token) =>
|
||||||
return symbol.tokenId.symbol
|
type === 'datatoken'
|
||||||
|
? token.isDatatoken === true
|
||||||
|
: token.isDatatoken === false
|
||||||
|
)
|
||||||
|
return symbol
|
||||||
}
|
}
|
||||||
|
|
||||||
function Symbol({ tokens }: { tokens: PoolSharePoolIdTokens[] }) {
|
function Symbol({ tokens }: { tokens: PoolSharePoolIdTokens[] }) {
|
||||||
return <>{findValidToken(tokens)}</>
|
return <>{findTokenByType(tokens, 'datatoken')}</>
|
||||||
}
|
}
|
||||||
|
|
||||||
function Liquidity({ row, type }: { row: Asset; type: string }) {
|
function Liquidity({ row, type }: { row: Asset; type: string }) {
|
||||||
@ -104,9 +108,13 @@ function Liquidity({ row, type }: { row: Asset; type: string }) {
|
|||||||
className={styles.totalLiquidity}
|
className={styles.totalLiquidity}
|
||||||
hideApproximateSymbol
|
hideApproximateSymbol
|
||||||
/>
|
/>
|
||||||
<Token symbol="OCEAN" balance={oceanTokenBalance} noIcon />
|
|
||||||
<Token
|
<Token
|
||||||
symbol={findValidToken(row.poolShare.poolId.tokens)}
|
symbol={findTokenByType(row.poolShare.poolId.tokens, 'ocean')}
|
||||||
|
balance={oceanTokenBalance}
|
||||||
|
noIcon
|
||||||
|
/>
|
||||||
|
<Token
|
||||||
|
symbol={findTokenByType(row.poolShare.poolId.tokens, 'datatoken')}
|
||||||
balance={dataTokenBalance}
|
balance={dataTokenBalance}
|
||||||
noIcon
|
noIcon
|
||||||
/>
|
/>
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
import { DDO, Logger, BestPrice } from '@oceanprotocol/lib'
|
import { DDO, Logger } from '@oceanprotocol/lib'
|
||||||
import { useState } from 'react'
|
import { useState } from 'react'
|
||||||
import { TransactionReceipt } from 'web3-core'
|
import { TransactionReceipt } from 'web3-core'
|
||||||
import { Decimal } from 'decimal.js'
|
import { Decimal } from 'decimal.js'
|
||||||
@ -13,6 +13,7 @@ import { sleep } from '../utils'
|
|||||||
|
|
||||||
import { useOcean } from '../providers/Ocean'
|
import { useOcean } from '../providers/Ocean'
|
||||||
import { useWeb3 } from '../providers/Web3'
|
import { useWeb3 } from '../providers/Web3'
|
||||||
|
import { BestPrice } from '../models/BestPrice'
|
||||||
|
|
||||||
interface PriceOptions {
|
interface PriceOptions {
|
||||||
price: number
|
price: number
|
||||||
|
12
src/models/BestPrice.ts
Normal file
12
src/models/BestPrice.ts
Normal file
@ -0,0 +1,12 @@
|
|||||||
|
export interface BestPrice {
|
||||||
|
type: 'pool' | 'exchange' | 'free' | ''
|
||||||
|
address: string
|
||||||
|
value: number
|
||||||
|
isConsumable?: 'true' | 'false' | ''
|
||||||
|
ocean?: number
|
||||||
|
oceanSymbol?: string
|
||||||
|
datatoken?: number
|
||||||
|
datatokenSymbol?: string
|
||||||
|
exchangeId?: string
|
||||||
|
pools: string[]
|
||||||
|
}
|
@ -7,7 +7,7 @@ import React, {
|
|||||||
useCallback,
|
useCallback,
|
||||||
ReactNode
|
ReactNode
|
||||||
} from 'react'
|
} from 'react'
|
||||||
import { Logger, DDO, BestPrice, MetadataMain } from '@oceanprotocol/lib'
|
import { Logger, DDO, MetadataMain } from '@oceanprotocol/lib'
|
||||||
import { PurgatoryData } from '@oceanprotocol/lib/dist/node/ddo/interfaces/PurgatoryData'
|
import { PurgatoryData } from '@oceanprotocol/lib/dist/node/ddo/interfaces/PurgatoryData'
|
||||||
import getAssetPurgatoryData from '../utils/purgatory'
|
import getAssetPurgatoryData from '../utils/purgatory'
|
||||||
import axios, { CancelToken } from 'axios'
|
import axios, { CancelToken } from 'axios'
|
||||||
@ -16,6 +16,7 @@ import { getPrice } from '../utils/subgraph'
|
|||||||
import { MetadataMarket } from '../@types/MetaData'
|
import { MetadataMarket } from '../@types/MetaData'
|
||||||
import { useWeb3 } from './Web3'
|
import { useWeb3 } from './Web3'
|
||||||
import { useSiteMetadata } from '../hooks/useSiteMetadata'
|
import { useSiteMetadata } from '../hooks/useSiteMetadata'
|
||||||
|
import { BestPrice } from '../models/BestPrice'
|
||||||
|
|
||||||
interface AssetProviderValue {
|
interface AssetProviderValue {
|
||||||
isInPurgatory: boolean
|
isInPurgatory: boolean
|
||||||
|
@ -15,8 +15,7 @@ export function getOceanConfig(network: string | number): ConfigHelperConfig {
|
|||||||
network === 2021000
|
network === 2021000
|
||||||
? undefined
|
? undefined
|
||||||
: process.env.GATSBY_INFURA_PROJECT_ID
|
: process.env.GATSBY_INFURA_PROJECT_ID
|
||||||
)
|
) as ConfigHelperConfig
|
||||||
|
|
||||||
return config as ConfigHelperConfig
|
return config as ConfigHelperConfig
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
import { gql, OperationResult, TypedDocumentNode, OperationContext } from 'urql'
|
import { gql, OperationResult, TypedDocumentNode, OperationContext } from 'urql'
|
||||||
import { DDO, BestPrice } from '@oceanprotocol/lib'
|
import { DDO } from '@oceanprotocol/lib'
|
||||||
import { getUrqlClientInstance } from '../providers/UrqlProvider'
|
import { getUrqlClientInstance } from '../providers/UrqlProvider'
|
||||||
import { getOceanConfig } from './ocean'
|
import { getOceanConfig } from './ocean'
|
||||||
import web3 from 'web3'
|
import web3 from 'web3'
|
||||||
@ -24,6 +24,7 @@ import {
|
|||||||
PoolShares as PoolSharesList,
|
PoolShares as PoolSharesList,
|
||||||
PoolShares_poolShares as PoolShare
|
PoolShares_poolShares as PoolShare
|
||||||
} from '../@types/apollo/PoolShares'
|
} from '../@types/apollo/PoolShares'
|
||||||
|
import { BestPrice } from '../models/BestPrice'
|
||||||
|
|
||||||
export interface UserTVL {
|
export interface UserTVL {
|
||||||
price: string
|
price: string
|
||||||
@ -104,6 +105,10 @@ const PoolQuery = gql`
|
|||||||
datatokenAddress
|
datatokenAddress
|
||||||
datatokenReserve
|
datatokenReserve
|
||||||
oceanReserve
|
oceanReserve
|
||||||
|
tokens(where: { isDatatoken: false }) {
|
||||||
|
isDatatoken
|
||||||
|
symbol
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
`
|
`
|
||||||
@ -117,6 +122,9 @@ const AssetPoolPriceQuerry = gql`
|
|||||||
datatokenAddress
|
datatokenAddress
|
||||||
datatokenReserve
|
datatokenReserve
|
||||||
oceanReserve
|
oceanReserve
|
||||||
|
tokens {
|
||||||
|
symbol
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
`
|
`
|
||||||
@ -281,6 +289,7 @@ function transformPriceToBestPrice(
|
|||||||
? poolPrice[0]?.spotPrice
|
? poolPrice[0]?.spotPrice
|
||||||
: poolPrice[0]?.consumePrice,
|
: poolPrice[0]?.consumePrice,
|
||||||
ocean: poolPrice[0]?.oceanReserve,
|
ocean: poolPrice[0]?.oceanReserve,
|
||||||
|
oceanSymbol: poolPrice[0]?.tokens[0]?.symbol,
|
||||||
datatoken: poolPrice[0]?.datatokenReserve,
|
datatoken: poolPrice[0]?.datatokenReserve,
|
||||||
pools: [poolPrice[0]?.id],
|
pools: [poolPrice[0]?.id],
|
||||||
isConsumable: poolPrice[0]?.consumePrice === '-1' ? 'false' : 'true'
|
isConsumable: poolPrice[0]?.consumePrice === '-1' ? 'false' : 'true'
|
||||||
@ -293,7 +302,7 @@ function transformPriceToBestPrice(
|
|||||||
type: 'exchange',
|
type: 'exchange',
|
||||||
value: frePrice[0]?.rate,
|
value: frePrice[0]?.rate,
|
||||||
address: frePrice[0]?.id,
|
address: frePrice[0]?.id,
|
||||||
exchange_id: frePrice[0]?.id,
|
exchangeId: frePrice[0]?.id,
|
||||||
ocean: 0,
|
ocean: 0,
|
||||||
datatoken: 0,
|
datatoken: 0,
|
||||||
pools: [],
|
pools: [],
|
||||||
@ -305,7 +314,7 @@ function transformPriceToBestPrice(
|
|||||||
type: 'free',
|
type: 'free',
|
||||||
value: 0,
|
value: 0,
|
||||||
address: freePrice[0]?.datatoken.id,
|
address: freePrice[0]?.datatoken.id,
|
||||||
exchange_id: '',
|
exchangeId: '',
|
||||||
ocean: 0,
|
ocean: 0,
|
||||||
datatoken: 0,
|
datatoken: 0,
|
||||||
pools: [],
|
pools: [],
|
||||||
@ -317,7 +326,7 @@ function transformPriceToBestPrice(
|
|||||||
type: '',
|
type: '',
|
||||||
value: 0,
|
value: 0,
|
||||||
address: '',
|
address: '',
|
||||||
exchange_id: '',
|
exchangeId: '',
|
||||||
ocean: 0,
|
ocean: 0,
|
||||||
datatoken: 0,
|
datatoken: 0,
|
||||||
pools: [],
|
pools: [],
|
||||||
@ -563,7 +572,7 @@ export async function getAccountNumberOfOrders(
|
|||||||
return numberOfOrders
|
return numberOfOrders
|
||||||
}
|
}
|
||||||
|
|
||||||
export function calculateUserLiquidity(poolShare: PoolShare) {
|
export function calculateUserLiquidity(poolShare: PoolShare): number {
|
||||||
const ocean =
|
const ocean =
|
||||||
(poolShare.balance / poolShare.poolId.totalShares) *
|
(poolShare.balance / poolShare.poolId.totalShares) *
|
||||||
poolShare.poolId.oceanReserve
|
poolShare.poolId.oceanReserve
|
||||||
|
Loading…
Reference in New Issue
Block a user