readme update

README.md

@@ -64,7 +64,8 @@ export default function MyComponent() {
   const { ocean, web3, account } = useOcean()
 
   // Get metadata for this asset
-  const { title, metadata } = useMetadata(did)
+  const { title, metadata, isLoaded, getBestPrice } = useMetadata(did)
+  const [price, setPrice] = useState<string>()
 
   // publish asset
   const { publish, publishStep } = usePublish()
@@ -72,6 +73,16 @@ export default function MyComponent() {
   // consume asset
   const { consume, consumeStep } = useConsume()
 
+  useEffect(() => {
+    async function init(): Promise<void> {
+      if (isLoaded) {
+        const price = await getBestPrice()
+        setPrice(price)
+        }
+      }
+    init()
+  }, [isLoaded])
+
   async function handleDownload() {
     await consume(did)
   }
@@ -79,7 +90,7 @@ export default function MyComponent() {
   return (
     <div>
       <h1>{title}</h1>
-      <p>Price: {web3.utils.fromWei(metadata.main.price)}</p>
+      <p>Price: {price}</p>
 
       <p>Your account: {account}</p>
       <button onClick={handleDownload}>

example/src/MetadataExample.tsx

@@ -2,18 +2,18 @@ import React, { useEffect, useState } from 'react'
 import { useMetadata } from '@oceanprotocol/react'
 
 export function MetadataExample({ did }: { did: string }) {
-  const { title, getBestPrice } = useMetadata(did)
+  const { title, isLoaded, getBestPrice } = useMetadata(did)
   const [price, setPrice] = useState<string>()
 
   useEffect(() => {
     async function init(): Promise<void> {
-      if (title) {
+      if (isLoaded) {
         const price = await getBestPrice()
         setPrice(price)
       }
     }
     init()
-  }, [title])
+  }, [isLoaded])
 
   return (
     <>