cleanup and style fixes

package.json

@@ -3,7 +3,7 @@
   "version": "1.0.0",
   "description": "React + squid.js interacting in the most minimal way with Ocean Protocol.",
   "dependencies": {
-    "@oceanprotocol/squid": "^2.0.0-beta.2",
+    "@oceanprotocol/squid": "^2.0.0-beta.4",
     "react": "^16.12.0",
     "react-dom": "^16.12.0",
     "react-scripts": "^3.3.0",

src/Compute.js

@@ -2,48 +2,54 @@ import React, { useState } from 'react'
 import * as Assets from './asset'
 
 export default function Compute({ ocean, web3 }) {
-  const [ddoAsset, setDdoAsset] = useState('')
+  const [ddoAsset, setDdoAsset] = useState({ id: '' })
   const [jobStatus, setJobStatus] = useState('')
   const [jobId, setJobId] = useState('')
   const [agreementId, setAgreementId] = useState('')
-  const [ddoAlgorithm, setDdoAlgorithm] = useState('')
-  const computestate = {
-    inputdid: '',
-    algodid: '',
-    algooutput:''
-  }
+  const [ddoAlgorithm, setDdoAlgorithm] = useState({ id: '' })
+
   // publish a dataset and an algorithm
   async function publish() {
     try {
       const accounts = await ocean.accounts.list()
       console.log('Publishing asset.')
 
-      
-      const service=await Assets.createComputeService(ocean,accounts[0],"0","2020-03-10T10:00:00Z")
+      const service = await Assets.createComputeService(
+        ocean,
+        accounts[0],
+        '0',
+        '2020-03-10T10:00:00Z'
+      )
       console.log(service)
-      const ddoAssetNew = await ocean.assets.create(Assets.getAsset(), accounts[0],[service])
+      const ddoAssetNew = await ocean.assets.create(
+        Assets.getAsset(),
+        accounts[0],
+        [service]
+      )
       console.log('Asset successfully submitted.')
       console.log(ddoAssetNew)
       // keep track of this registered asset for consumption later on
       setDdoAsset(ddoAssetNew)
-      alert( 'Asset successfully submitted.'  )
+      alert('Asset successfully submitted.')
     } catch (error) {
       console.error(error.message)
     }
   }
 
-
   async function publishalgo() {
     try {
       const accounts = await ocean.accounts.list()
       console.log('Publishing algo.')
 
-      const ddoAlgorithmNew = await ocean.assets.create(Assets.getAlgoAsset(), accounts[0])
+      const ddoAlgorithmNew = await ocean.assets.create(
+        Assets.getAlgoAsset(),
+        accounts[0]
+      )
       console.log(ddoAlgorithmNew)
       console.log('Algo asset successfully submitted.')
       // keep track of this registered asset for consumption later on
       setDdoAlgorithm(ddoAlgorithmNew)
-      alert( 'Algorithm successfully submitted.'  )
+      alert('Algorithm successfully submitted.')
     } catch (error) {
       console.error(error.message)
     }
@@ -65,7 +71,7 @@ export default function Compute({ ocean, web3 }) {
       )
       setJobId(status.jobId)
       console.log(status)
-      alert( 'Job created.  You can query for status now'  )
+      alert('Job created.  You can query for status now')
     } catch (error) {
       console.error(error.message)
     }
@@ -76,11 +82,7 @@ export default function Compute({ ocean, web3 }) {
       const accounts = await ocean.accounts.list()
       // start a compute job
 
-      const status = await ocean.compute.status(
-        accounts[0],
-        agreementId,
-        jobId
-      )
+      const status = await ocean.compute.status(accounts[0], agreementId, jobId)
       setJobStatus(JSON.stringify(status, null, '\t'))
       console.log(status)
     } catch (error) {
@@ -99,7 +101,6 @@ export default function Compute({ ocean, web3 }) {
       <button onClick={() => publishalgo()} disabled={!web3}>
         2) Publish algorithm
       </button>
-      
       <button onClick={() => start()} disabled={!web3}>
         3)Order and start compute service
       </button>
@@ -107,14 +108,17 @@ export default function Compute({ ocean, web3 }) {
         4)Get Job Status
       </button>
       <hr />
-      Asset DID:<input type="text" value={ddoAsset.id}></input>
+      Asset DID:
+      <input type="text" value={ddoAsset.id} readOnly />
       <hr />
-      Algo DID:<input type="text" value={ddoAlgorithm.id}></input>
+      Algo DID:
+      <input type="text" value={ddoAlgorithm.id} readOnly />
       <hr />
-      Job ID:<input type="text" value={jobId}></input>
+      Job ID:
+      <input type="text" value={jobId} readOnly />
       <hr />
-      Compute status:<textarea rows="10" cols="180" value={jobStatus}></textarea>
-      
+      Compute status:
+      <textarea rows="10" cols="180" value={jobStatus} readOnly />
     </>
   )
 }

src/asset.js

@@ -1,6 +1,4 @@
-
-
-   export function getAsset(){
+export function getAsset() {
   const asset = {
     main: {
       name: '10 Monkey Species Small',
@@ -47,30 +45,30 @@
         {
           name: 'example code',
           type: 'example code',
-                  url: 'https://github.com/slothkong/CNN_classification_10_monkey_species'
+          url:
+            'https://github.com/slothkong/CNN_classification_10_monkey_species'
         }
       ],
       inLanguage: 'en'
     }
   }
-    return(asset)
-   }
+  return asset
+}
 
-
-   export function getAlgoAsset(){
+export function getAlgoAsset() {
   const algoasset = {
     main: {
       name: 'My great algo',
       dateCreated: '2012-02-01T10:55:11Z',
       author: 'Alex',
-              type: "algorithm",
+      type: 'algorithm',
       algorithm: {
-                  format: "docker-image",
-                  version: "0.1",
+        format: 'docker-image',
+        version: '0.1',
         container: {
-                      entrypoint: "node $ALGO",
-                      image: "node",
-                      tag: "10"
+          entrypoint: 'node $ALGO',
+          image: 'node',
+          tag: '10'
         }
       },
       license: 'CC0: Public Domain',
@@ -82,7 +80,8 @@
           contentLength: '12057507',
           compression: 'zip',
           encoding: 'UTF-8',
-                    url: 'https://raw.githubusercontent.com/oceanprotocol/test-algorithm/master/javascript/algo.js'
+          url:
+            'https://raw.githubusercontent.com/oceanprotocol/test-algorithm/master/javascript/algo.js'
         }
       ]
     },
@@ -90,11 +89,15 @@
       description: 'My super algo '
     }
   }
-  return(algoasset)
-  }
+  return algoasset
+}
 
-
-  export async function createComputeService(ocean: Ocean,publisher: Account,price: string,datePublished: string){
+export async function createComputeService(
+  ocean,
+  publisher,
+  price,
+  datePublished
+) {
   const { templates } = ocean.keeper
   const serviceAgreementTemplate = await templates.escrowComputeExecutionTemplate.getServiceAgreementTemplate()
   const name = 'dataAssetComputingServiceAgreement'
@@ -113,9 +116,5 @@
       serviceAgreementTemplate
     }
   }
-      return(service)
-  }
-
-
-
-//export default Assets
+  return service
+}

src/index.js

@@ -42,7 +42,10 @@ class App extends Component {
   async registerAsset() {
     try {
       const accounts = await this.state.ocean.accounts.list()
-      const ddo = await this.state.ocean.assets.create(Assets.getAsset(), accounts[0])
+      const ddo = await this.state.ocean.assets.create(
+        Assets.getAsset(),
+        accounts[0]
+      )
       console.log('Asset successfully submitted.')
       console.log(ddo)
       // keep track of this registered asset for consumption later on