refresh price and pool info (#164)

* refresh price and pool info

Signed-off-by: mihaisc <mihai.scarlat@smartcontrol.ro>

* lib update

Signed-off-by: mihaisc <mihai.scarlat@smartcontrol.ro>

* remove unused dependencies

Signed-off-by: mihaisc <mihai.scarlat@smartcontrol.ro>

* remove console.log

Signed-off-by: mihaisc <mihai.scarlat@smartcontrol.ro>

package-lock.json

@@ -3876,6 +3876,25 @@
         "decimal.js": "^10.2.1",
         "web3": "^1.3.0",
         "web3modal": "^1.9.1"
+      },
+      "dependencies": {
+        "@oceanprotocol/lib": {
+          "version": "0.9.8",
+          "resolved": "https://registry.npmjs.org/@oceanprotocol/lib/-/lib-0.9.8.tgz",
+          "integrity": "sha512-jV7lobTXskqqmv23Vl3iQ4SZk+0FVFxLSVkXniOKOOFP0pJ0vllSNnM+wHkG4inF3HWHHyeh8AyFNTSxOUuirA==",
+          "requires": {
+            "@ethereum-navigator/navigator": "^0.5.0",
+            "@oceanprotocol/contracts": "^0.5.7",
+            "decimal.js": "^10.2.0",
+            "fs": "0.0.1-security",
+            "lzma": "^2.3.2",
+            "node-fetch": "^2.6.1",
+            "save-file": "^2.3.1",
+            "uuid": "^8.3.0",
+            "web3": "^1.3.0",
+            "web3-eth-contract": "^1.3.0"
+          }
+        }
       }
     },
     "@oceanprotocol/typographies": {

src/components/organisms/AssetActions/Pool/Add/index.tsx

@@ -43,6 +43,7 @@ const initialValues: FormAddLiquidity = {
 
 export default function Add({
   setShowAdd,
+  refreshInfo,
   poolAddress,
   totalPoolTokens,
   totalBalance,
@@ -51,6 +52,7 @@ export default function Add({
   dtAddress
 }: {
   setShowAdd: (show: boolean) => void
+  refreshInfo: () => void
   poolAddress: string
   totalPoolTokens: string
   totalBalance: Balance
@@ -127,6 +129,7 @@ export default function Add({
 
       setTxId(result?.transactionHash)
       resetForm()
+      refreshInfo()
     } catch (error) {
       console.error(error.message)
       toast.error(error.message)

src/components/organisms/AssetActions/Pool/Remove.tsx

@@ -46,11 +46,13 @@ const contentQuery = graphql`
 
 export default function Remove({
   setShowRemove,
+  refreshInfo,
   poolAddress,
   poolTokens,
   dtSymbol
 }: {
   setShowRemove: (show: boolean) => void
+  refreshInfo: () => void
   poolAddress: string
   poolTokens: string
   dtSymbol: string
@@ -87,6 +89,7 @@ export default function Remove({
             )
 
       setTxId(result?.transactionHash)
+      refreshInfo()
     } catch (error) {
       Logger.error(error.message)
       toast.error(error.message)

src/components/organisms/AssetActions/Pool/index.tsx

@@ -43,7 +43,7 @@ export default function Pool({ ddo }: { ddo: DDO }): ReactElement {
   const content = data.content.edges[0].node.childContentJson.pool
 
   const { ocean, accountId, networkId } = useOcean()
-  const { price } = useMetadata(ddo)
+  const { price, refreshPrice } = useMetadata(ddo)
   const { dtSymbol } = usePricing(ddo)
 
   const [poolTokens, setPoolTokens] = useState<string>()
@@ -54,6 +54,8 @@ export default function Pool({ ddo }: { ddo: DDO }): ReactElement {
   const [showAdd, setShowAdd] = useState(false)
   const [showRemove, setShowRemove] = useState(false)
 
+  // the purpose of the value is just to trigger the effect
+  const [refreshPool, setRefreshPool] = useState(false)
   // TODO: put all these variables behind some useEffect
   // to prevent unneccessary updating on every render
   const hasAddedLiquidity =
@@ -115,13 +117,18 @@ export default function Pool({ ddo }: { ddo: DDO }): ReactElement {
       }
     }
     init()
-  }, [ocean, accountId, price, ddo.dataToken])
+  }, [ocean, accountId, price, ddo.dataToken, refreshPool])
 
+  const refreshInfo = async () => {
+    setRefreshPool(!refreshPool)
+    await refreshPrice()
+  }
   return (
     <>
       {showAdd ? (
         <Add
           setShowAdd={setShowAdd}
+          refreshInfo={refreshInfo}
           poolAddress={price.address}
           totalPoolTokens={totalPoolTokens}
           totalBalance={{ ocean: price.ocean, datatoken: price.datatoken }}
@@ -132,6 +139,7 @@ export default function Pool({ ddo }: { ddo: DDO }): ReactElement {
       ) : showRemove ? (
         <Remove
           setShowRemove={setShowRemove}
+          refreshInfo={refreshInfo}
           poolAddress={price.address}
           poolTokens={poolTokens}
           dtSymbol={dtSymbol}