1
0
mirror of https://github.com/oceanprotocol/market.git synced 2024-06-20 11:23:24 +02:00
This commit is contained in:
Matthias Kretschmann 2020-07-21 14:04:32 +02:00
parent f08b7da22a
commit a73fac1611
Signed by: m
GPG Key ID: 606EEEF3C479A91F
8 changed files with 88 additions and 82 deletions

6
package-lock.json generated
View File

@ -3762,9 +3762,9 @@
}
},
"@oceanprotocol/react": {
"version": "0.0.26",
"resolved": "https://registry.npmjs.org/@oceanprotocol/react/-/react-0.0.26.tgz",
"integrity": "sha512-EGy2kP9nEiKDT1wbTUWqogqWud/hrhUQzXnAoW0Sw5M6m7t6Jg7svbbCmI/J5YtLF+ldQv1siP8Bh0Ii+QdzBw==",
"version": "0.0.27",
"resolved": "https://registry.npmjs.org/@oceanprotocol/react/-/react-0.0.27.tgz",
"integrity": "sha512-qaPD5W51rtP/ql4vEP14DqPKbe0aoyIxWNc2oxwz4xUMP+svQLgPnJyL8+9vy/qblt/bOYkO5H9GMfsjYPTOnQ==",
"requires": {
"@oceanprotocol/lib": "^0.1.8",
"axios": "^0.19.2",

View File

@ -21,7 +21,7 @@
"dependencies": {
"@loadable/component": "^5.13.1",
"@oceanprotocol/art": "^3.0.0",
"@oceanprotocol/react": "^0.0.26",
"@oceanprotocol/react": "^0.0.27",
"@oceanprotocol/typographies": "^0.1.0",
"@sindresorhus/slugify": "^1.0.0",
"@tippyjs/react": "^4.1.0",

View File

@ -10,7 +10,6 @@ import {
computeOptions,
useCompute,
readFileContent,
useMetadata,
useOcean
} from '@oceanprotocol/react'
import styles from './Compute.module.css'
@ -18,12 +17,10 @@ import Button from '../../atoms/Button'
import Input from '../../atoms/Input'
import Alert from '../../atoms/Alert'
export default function Compute({ did }: { did: string }): ReactElement {
export default function Compute({ ddo }: { ddo: DDO }): ReactElement {
const { ocean } = useOcean()
const { ddo } = useMetadata(did)
const { compute, isLoading, computeStepText, computeError } = useCompute()
const computeService = new DDO(ddo).findServiceByType('compute').attributes
.main
const computeService = ddo.findServiceByType('compute').attributes.main
const [isJobStarting, setIsJobStarting] = useState(false)
const [, setError] = useState('')
@ -81,7 +78,7 @@ export default function Compute({ did }: { did: string }): ReactElement {
setError('')
await compute(
did,
ddo.id,
computeService,
ddo.dataToken,
algorithmRawCode,

View File

@ -20,11 +20,10 @@ export default function Consume({
}): ReactElement {
const accessService = ddo.findServiceByType('access')
const { cost } = accessService.attributes.main
const { ocean } = useOcean()
const { consumeStepText, consume, consumeError } = useConsume()
// const isFree = cost === '0'
const isFree = cost === '0'
// const isBalanceSufficient =
// isFree || compareAsBN(balanceInOcean, fromWei(cost), Comparisson.gte)
const isDisabled = !ocean
@ -42,8 +41,7 @@ export default function Consume({
onClick={() => consume(ddo.id, ddo.dataToken, 'access')}
disabled={isDisabled}
>
Download
{/* {isFree ? 'Download' : 'Buy'} */}
{isFree ? 'Download' : 'Buy'}
</Button>
)

View File

@ -4,7 +4,7 @@ import styles from './index.module.css'
import Compute from './Compute'
import Consume from './Consume'
import { MetadataMarket } from '../../../@types/Metadata'
import { MetadataStore, Logger, DDO } from '@oceanprotocol/lib'
import { DDO } from '@oceanprotocol/lib'
export default function AssetActions({
metadata,

View File

@ -7,7 +7,7 @@ import MetaFull from './MetaFull'
import MetaSecondary from './MetaSecondary'
import styles from './index.module.css'
import AssetActions from '../AssetActions'
import { MetadataStore, Logger, DDO } from '@oceanprotocol/lib'
import { DDO } from '@oceanprotocol/lib'
export interface AssetContentProps {
metadata: MetadataMarket

View File

@ -0,0 +1,73 @@
import React, { useState, useEffect, ReactElement } from 'react'
import { Router } from '@reach/router'
import AssetContent from '../../components/organisms/AssetContent'
import Layout from '../../components/Layout'
import { MetadataMarket, ServiceMetadataMarket } from '../../@types/Metadata'
import { MetadataStore, Logger, DDO } from '@oceanprotocol/lib'
import Alert from '../../components/atoms/Alert'
import Loader from '../../components/atoms/Loader'
import { useSiteMetadata } from '../../hooks/useSiteMetadata'
export default function PageTemplateAssetDetails({
did,
uri
}: {
did: string
uri: string
}): ReactElement {
const { appConfig } = useSiteMetadata()
const [metadata, setMetadata] = useState<MetadataMarket>()
const [title, setTitle] = useState<string>()
const [error, setError] = useState<string>()
const [ddo, setDdo] = useState<DDO>()
useEffect(() => {
async function init() {
try {
const metadataStore = new MetadataStore(
appConfig.oceanConfig.metadataStoreUri,
Logger
)
const ddo = await metadataStore.retrieveDDO(did)
setDdo(ddo)
if (!ddo) {
setTitle('Could not retrieve asset')
setError('The DDO was not found in MetadataStore.')
return
}
const { attributes }: ServiceMetadataMarket = ddo.findServiceByType(
'metadata'
)
setTitle(attributes.main.name)
setMetadata(attributes)
} catch (error) {
setTitle('Error retrieving asset')
setError(error.message)
}
}
init()
}, [did])
return did && metadata ? (
<Layout title={title} uri={uri}>
<Router basepath="/asset">
<AssetContent
ddo={ddo}
metadata={metadata as MetadataMarket}
path=":did"
/>
</Router>
</Layout>
) : error ? (
<Layout title={title} noPageHeader uri={uri}>
<Alert title={title} text={error} state="error" />
</Layout>
) : (
<Layout title="Loading..." uri={uri}>
<Loader />
</Layout>
)
}

View File

@ -1,70 +1,8 @@
import React, { useState, useEffect, ReactElement } from 'react'
import { Router } from '@reach/router'
import AssetContent from '../../components/organisms/AssetContent'
import Layout from '../../components/Layout'
import React, { ReactElement } from 'react'
import { PageProps } from 'gatsby'
import { MetadataMarket, ServiceMetadataMarket } from '../../@types/Metadata'
import { MetadataStore, Logger, DDO } from '@oceanprotocol/lib'
import Alert from '../../components/atoms/Alert'
import Loader from '../../components/atoms/Loader'
import { useSiteMetadata } from '../../hooks/useSiteMetadata'
export default function AssetRoute(props: PageProps): ReactElement {
const { appConfig } = useSiteMetadata()
const [metadata, setMetadata] = useState<MetadataMarket>()
const [title, setTitle] = useState<string>()
const [error, setError] = useState<string>()
const [ddo, setDdo] = useState<DDO>()
import PageTemplateAssetDetails from '../../components/templates/AssetDetails'
export default function PageGatsbyAssetDetails(props: PageProps): ReactElement {
const did = props.location.pathname.split('/')[2]
useEffect(() => {
async function init() {
try {
const metadataStore = new MetadataStore(
appConfig.oceanConfig.metadataStoreUri,
Logger
)
const ddo = await metadataStore.retrieveDDO(did)
setDdo(ddo)
if (!ddo) {
setTitle('Could not retrieve asset')
setError('The DDO was not found in MetadataStore.')
return
}
const { attributes }: ServiceMetadataMarket = ddo.findServiceByType(
'metadata'
)
setTitle(attributes.main.name)
setMetadata(attributes)
} catch (error) {
setTitle('Error retrieving asset')
setError(error.message)
}
}
init()
}, [did])
return did && metadata ? (
<Layout title={title} uri={props.location.pathname}>
<Router basepath="/asset">
<AssetContent
ddo={ddo}
metadata={metadata as MetadataMarket}
path=":did"
/>
</Router>
</Layout>
) : error ? (
<Layout title={title} noPageHeader uri={props.location.pathname}>
<Alert title={title} text={error} state="error" />
</Layout>
) : (
<Layout title="Loading..." uri={props.location.pathname}>
<Loader />
</Layout>
)
return <PageTemplateAssetDetails did={did} uri={props.location.pathname} />
}