diff --git a/src/components/molecules/AssetTeaser.tsx b/src/components/molecules/AssetTeaser.tsx index 9958f0f81..ff21d9e9b 100644 --- a/src/components/molecules/AssetTeaser.tsx +++ b/src/components/molecules/AssetTeaser.tsx @@ -1,31 +1,44 @@ -import React from 'react' +import React, { useState, useEffect } from 'react' import { Link } from 'gatsby' import Dotdotdot from 'react-dotdotdot' import { MetadataMarket } from '../../@types/Metadata' import Price from '../atoms/Price' import styles from './AssetTeaser.module.css' +import { useMetadata } from '@oceanprotocol/react' +import { DDO } from '@oceanprotocol/lib' declare type AssetTeaserProps = { - did: string + ddo: DDO metadata: MetadataMarket } const AssetTeaser: React.FC = ({ - did, + ddo, metadata }: AssetTeaserProps) => { if (!metadata.additionalInformation) return null const { name } = metadata.main - const { description, access } = metadata.additionalInformation + const { description } = metadata.additionalInformation + + const { getBestPrice } = useMetadata(ddo.id) + const [price, setPrice] = useState() + + useEffect(() => { + async function init() { + const price = await getBestPrice(ddo.dataToken) + price && setPrice(price) + } + init() + }, []) return (
- +

{name}

- {access === 'Compute' && ( + {/* {access === 'Compute' && (
{access}
- )} + )} */}
@@ -33,7 +46,9 @@ const AssetTeaser: React.FC = ({
-
{/* */}
+
+ {price && } +
) diff --git a/src/components/organisms/AssetList.tsx b/src/components/organisms/AssetList.tsx index 8e0b4d732..d31c60321 100644 --- a/src/components/organisms/AssetList.tsx +++ b/src/components/organisms/AssetList.tsx @@ -50,9 +50,7 @@ const AssetList: React.FC = ({ queryResult }) => { 'metadata' ) - return ( - - ) + return }) ) : (