squid update, assetjob refactor

client/package-lock.json

@@ -2106,9 +2106,9 @@
       }
     },
     "@oceanprotocol/squid": {
-      "version": "2.0.0-beta.4",
+      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/@oceanprotocol/squid/-/squid-2.0.0-beta.4.tgz",
+      "resolved": "https://registry.npmjs.org/@oceanprotocol/squid/-/squid-2.0.0.tgz",
-      "integrity": "sha512-SZx940zRJxN6HPB2Zsk3OMjkBUBjUiVWRvYFjKNTQqwflOe80ceGxWzKRwxcBvzz/C4TN1zXQAXHIidOR8aPMQ==",
+      "integrity": "sha512-VO/7aafazsS/XWltaUKjGa78T/rmRKA5BAl7pgQXgNvFL28LOiZIJwpk5yYFdUONNEYzxAnFZ0U0TU5womKTHg==",
       "requires": {
         "@ethereum-navigator/navigator": "^0.4.1",
         "@oceanprotocol/keeper-contracts": "^0.13.2",
@@ -2117,9 +2117,16 @@
         "deprecated-decorator": "^0.1.6",
         "node-fetch": "^2.6.0",
         "save-file": "^2.3.1",
-        "uuid": "^3.4.0",
+        "uuid": "^7.0.2",
-        "web3": "^1.2.5",
+        "web3": "^1.2.6",
         "whatwg-url": "^8.0.0"
+      },
+      "dependencies": {
+        "uuid": {
+          "version": "7.0.2",
+          "resolved": "https://registry.npmjs.org/uuid/-/uuid-7.0.2.tgz",
+          "integrity": "sha512-vy9V/+pKG+5ZTYKf+VcphF5Oc6EFiu3W8Nv3P3zIh0EqVI80ZxOzuPfe9EHjkFNvf8+xuTHVeei4Drydlx4zjw=="
+        }
       }
     },
     "@oceanprotocol/typographies": {

client/package.json

@@ -14,7 +14,7 @@
   },
   "dependencies": {
     "@oceanprotocol/art": "^2.2.0",
-    "@oceanprotocol/squid": "2.0.0-beta.4",
+    "@oceanprotocol/squid": "2.0.0",
     "@oceanprotocol/typographies": "^0.1.0",
     "@sindresorhus/slugify": "^0.11.0",
     "@truffle/hdwallet-provider": "^1.0.33",

client/src/components/templates/Asset/AssetDetails.tsx

@@ -9,11 +9,11 @@ import AssetFilesDetails from './AssetFilesDetails'
 import Report from './Report'
 import Web3 from 'web3'
 import AssetsJob from './AssetJob'
+import Web3message from '../../organisms/Web3message'
 
 interface AssetDetailsProps {
     ocean: any
     metadata: MetaData
-    computeMetadata?: MetaData
     ddo: DDO
 }
 
@@ -36,15 +36,13 @@ const MetaFixedItem = ({ name, value }: { name: string; value: string }) => (
 export default function AssetDetails({
     metadata,
     ddo,
-    computeMetadata,
     ocean
 }: AssetDetailsProps) {
     const { main, additionalInformation } = metadata
     const price = main.price && Web3.utils.fromWei(main.price.toString())
 
-    console.log(computeMetadata)
+    const isCompute = !!ddo.findServiceByType('compute')
-    const isCompute = computeMetadata ? true : false
+    const isAccess = !!ddo.findServiceByType('access')
-    console.log(isCompute)
 
     const metaFixed = [
         {
@@ -131,19 +129,14 @@ export default function AssetDetails({
                         ))}
                 </ul>
             </div>
-
+            {isAccess ? (
-            {isCompute ? (
-                <AssetsJob
-                    ddo={ddo}
-                    ocean={ocean}
-                    computeMetadata={computeMetadata}
-                />
-            ) : (
                 <AssetFilesDetails
                     files={main.files ? main.files : []}
                     ddo={ddo}
                 />
-            )}
+            ) : null}
+            {isCompute ? <AssetsJob ddo={ddo} ocean={ocean} /> : null}
+            {isCompute || isAccess ? <Web3message /> : null}
         </>
     )
 }

client/src/components/templates/Asset/AssetFilesDetails.tsx

@@ -19,7 +19,6 @@ export default class AssetFilesDetails extends PureComponent<{
                         <AssetFile key={file.index} ddo={ddo} file={file} />
                     ))}
                 </div>
-                <Web3message />
             </>
         ) : (
             <div>No files attached.</div>

client/src/components/templates/Asset/AssetJob.module.scss

@@ -12,34 +12,6 @@
     padding-top: 10px;
 }
 
-.buttonWrapper {
-    width: 100%;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-    height: 120px;
-}
-
-.error {
-    color: $red;
-    align-items: center;
-    justify-content: center;
-}
-
-.bold {
-    font-weight: 900;
-}
-
-.expiry {
-    color: $brand-grey-light;
-    float: right;
-}
-
-.job {
-    border-top: 1px solid #e2e2e2;
-}
-
 .dragndrop {
     display: flex;
     flex-direction: column;
@@ -86,15 +58,8 @@
     margin-top: $spacer / 4;
 }
 
-.table {
+.error {
-    margin-top: $spacer / 2;
+    text-align: center;
-    margin-bottom: 0;
+    color: $red;
-}
+    font-size: $font-size-small;
-
-.spinner {
-    padding-bottom: 30px;
-}
-
-.jobloading {
-    padding-left: 23px;
 }

client/src/components/templates/Asset/AssetJob.tsx

@@ -1,5 +1,5 @@
 import React, { ChangeEvent, useState } from 'react'
-import { DDO, MetaData } from '@oceanprotocol/squid'
+import { DDO } from '@oceanprotocol/squid'
 import Input from '../../atoms/Form/Input'
 import computeOptions from '../../../data/computeOptions.json'
 import styles from './AssetJob.module.scss'
@@ -7,15 +7,15 @@ import Spinner from '../../atoms/Spinner'
 import Button from '../../atoms/Button'
 import { messages } from './AssetFile'
 import ReactDropzone from 'react-dropzone'
+import { readFileContent } from '../../../utils/utils'
 
 interface JobsProps {
     ocean: any
-    computeMetadata?: MetaData
     ddo: DDO
 }
 
-export default function AssetsJobs({ ddo, computeMetadata, ocean }: JobsProps) {
+export default function AssetsJobs({ ddo, ocean }: JobsProps) {
-    let rawAlgorithmMeta = {
+    const rawAlgorithmMeta = {
         rawcode: `console.log('Hello world'!)`,
         format: 'docker-image',
         version: '0.1',
@@ -24,6 +24,7 @@ export default function AssetsJobs({ ddo, computeMetadata, ocean }: JobsProps) {
 
     const [isJobStarting, setIsJobStarting] = useState(false)
     const [step, setStep] = useState(99)
+    const [error, setError] = useState('')
 
     const [computeType, setComputeType] = useState('')
     const [computeValue, setComputeValue] = useState({})
@@ -46,19 +47,11 @@ export default function AssetsJobs({ ddo, computeMetadata, ocean }: JobsProps) {
         if (selectedComputeOption !== undefined)
             setComputeValue(selectedComputeOption.value)
     }
-    const readFileContent = (file: File): Promise<string> => {
-        return new Promise(resolve => {
-            const reader = new FileReader()
-            reader.onload = function(e) {
-                resolve(reader.result as string)
-            }
-            reader.readAsText(file)
-        })
-    }
 
     const startJob = async () => {
         try {
             setIsJobStarting(true)
+            setError('')
             const accounts = await ocean.accounts.list()
             const ComputeOutput = {
                 publishAlgorithmLog: false,
@@ -78,17 +71,15 @@ export default function AssetsJobs({ ddo, computeMetadata, ocean }: JobsProps) {
             rawAlgorithmMeta.container = computeValue
             rawAlgorithmMeta.rawcode = algorithmRawCode
 
-            const status = await ocean.compute.start(
+            await ocean.compute.start(
                 accounts[0],
                 agreement,
                 undefined,
-                encodeURIComponent(JSON.stringify(rawAlgorithmMeta)),
+                rawAlgorithmMeta,
                 ComputeOutput
             )
-
-            console.log(status)
         } catch (error) {
-            console.error(error.message)
+            setError('Failed to start job!')
         }
         setIsJobStarting(false)
     }
@@ -152,6 +143,9 @@ export default function AssetsJobs({ ddo, computeMetadata, ocean }: JobsProps) {
                         </div>
                     </div>
                     {isJobStarting ? <Spinner message={messages[step]} /> : ''}
+                    {error !== '' && (
+                        <div className={styles.error}>{error}</div>
+                    )}
                 </div>
             </div>
         </>

client/src/components/templates/Asset/index.tsx

@@ -23,14 +23,12 @@ interface AssetState {
     ocean: any
     ddo: DDO
     metadata: MetaData
-    computeMetadata?: MetaData
     error: string
     isLoading: boolean
 }
 
 class Asset extends Component<AssetProps, AssetState> {
     public static contextType = User
-
     public state = {
         ocean: undefined,
         ddo: ({} as any) as DDO,
@@ -48,19 +46,12 @@ class Asset extends Component<AssetProps, AssetState> {
         try {
             const { ocean } = this.context
             const ddo = await ocean.assets.resolve(this.props.match.params.did)
-
             const { attributes } = ddo.findServiceByType('metadata')
-            let computeAttributes
-
-            try {
-                computeAttributes = ddo.findServiceByType('compute')
-            } catch (error) {}
 
             this.setState({
                 ocean,
                 ddo,
                 metadata: attributes,
-                computeMetadata: computeAttributes,
                 isLoading: false
             })
         } catch (error) {
@@ -108,12 +99,7 @@ class Asset extends Component<AssetProps, AssetState> {
                 }
             >
                 <Content>
-                    <AssetDetails
+                    <AssetDetails metadata={metadata} ddo={ddo} ocean={ocean} />
-                        metadata={metadata}
-                        ddo={ddo}
-                        computeMetadata={computeMetadata}
-                        ocean={ocean}
-                    />
                 </Content>
             </Route>
         )

client/src/data/form-publish.json

@@ -17,6 +17,7 @@
           "type": "select",
           "required": true,
           "options": [
+            "both",
             "access",
             "compute"
           ]

client/src/routes/Publish/index.tsx

@@ -12,9 +12,10 @@ import { allowPricing } from '../../config'
 import { steps } from '../../data/form-publish.json'
 import Content from '../../components/atoms/Content'
 import withTracker from '../../hoc/withTracker'
+import { createComputeService } from '../../utils/createComputeService'
 
 type AssetType = 'dataset' | 'algorithm' | 'container' | 'workflow' | 'other'
-type DatasetType = 'compute' | 'access'
+type DatasetType = 'both' | 'compute' | 'access'
 interface PublishState {
     name?: string
     dateCreated?: string
@@ -61,7 +62,7 @@ class Publish extends Component<{}, PublishState> {
         license: '',
         copyrightHolder: '',
         categories: '',
-        datasetType: 'access' as DatasetType,
+        datasetType: 'both' as DatasetType,
 
         currentStep: 1,
         isPublishing: false,
@@ -259,32 +260,6 @@ class Publish extends Component<{}, PublishState> {
         }
     }
 
-    private async createComputeService(
-        ocean: any,
-        publisher: any,
-        price: string,
-        datePublished: string
-    ) {
-        const { templates } = ocean.keeper
-        const serviceAgreementTemplate = await templates.escrowComputeExecutionTemplate.getServiceAgreementTemplate()
-        const name = 'dataAssetComputingServiceAgreement'
-        return {
-            type: 'compute',
-            serviceEndpoint: ocean.brizo.getComputeEndpoint(),
-            templateId: templates.escrowComputeExecutionTemplate.getId(),
-            attributes: {
-                main: {
-                    creator: publisher.getId(),
-                    datePublished,
-                    price,
-                    timeout: 3600,
-                    name
-                },
-                serviceAgreementTemplate
-            }
-        }
-    }
-
     private handleRegisterAsset = async (event: FormEvent<HTMLFormElement>) => {
         event.preventDefault()
 
@@ -334,21 +309,36 @@ class Publish extends Component<{}, PublishState> {
         }
 
         try {
-            let computeService: any[] = []
+            const services: any[] = []
-            console.log('dataset type ', this.state.datasetType)
+
-            if (this.state.datasetType === 'compute') {
+            if (
-                const service = await this.createComputeService(
+                this.state.datasetType === 'compute' ||
+                this.state.datasetType === 'both'
+            ) {
+                const service = await createComputeService(
                     ocean,
                     account[0],
                     this.state.price,
                     this.state.dateCreated
                 )
-                computeService = [service]
+                services.push(service)
-                console.log('compute ', computeService)
             }
 
+            if (
+                this.state.datasetType === 'access' ||
+                this.state.datasetType === 'both'
+            ) {
+                const service = await ocean.assets.createAccessServiceAttributes(
+                    account[0],
+                    this.state.price,
+                    this.state.dateCreated
+                )
+                services.push(service)
+            }
+            console.log(services)
+
             const asset = await this.context.ocean.assets
-                .create(newAsset, account[0], computeService)
+                .create(newAsset, account[0], services)
                 .next((publishingStep: number) =>
                     this.setState({ publishingStep })
                 )

client/src/utils/createComputeService.tsx

@@ -0,0 +1,25 @@
+export async function createComputeService(
+    ocean: any,
+    publisher: any,
+    price: string,
+    datePublished: string
+) {
+    const { templates } = ocean.keeper
+    const serviceAgreementTemplate = await templates.escrowComputeExecutionTemplate.getServiceAgreementTemplate()
+    const name = 'dataAssetComputingServiceAgreement'
+    return {
+        type: 'compute',
+        serviceEndpoint: ocean.brizo.getComputeEndpoint(),
+        templateId: templates.escrowComputeExecutionTemplate.getId(),
+        attributes: {
+            main: {
+                creator: publisher.getId(),
+                datePublished,
+                price,
+                timeout: 3600,
+                name
+            },
+            serviceAgreementTemplate
+        }
+    }
+}

client/src/utils/utils.test.ts

@@ -1,5 +1,11 @@
 import mockAxios from 'jest-mock-axios'
-import { formatBytes, pingUrl, arraySum, readFileAsync } from './utils'
+import {
+    formatBytes,
+    pingUrl,
+    arraySum,
+    readFileAsync,
+    readFileContent
+} from './utils'
 
 describe('formatBytes', () => {
     it('outputs as expected', () => {
@@ -67,3 +73,15 @@ describe('readFileAsync', () => {
         expect(output).toBeInstanceOf(ArrayBuffer)
     })
 })
+
+describe('readFileContent', () => {
+    it('outputs as expected', async () => {
+        const file = new File(['ABC'], 'filename.txt', {
+            type: 'text/plain',
+            lastModified: Date.now()
+        })
+
+        const output = await readFileContent(file)
+        expect(output).toBeInstanceOf(String)
+    })
+})

client/src/utils/utils.ts

@@ -61,3 +61,16 @@ export function readFileAsync(file: File) {
         reader.readAsArrayBuffer(file)
     })
 }
+export function readFileContent(file: File): Promise<string> {
+    return new Promise((resolve, reject) => {
+        const reader = new FileReader()
+        reader.onerror = () => {
+            reader.abort()
+            reject(new DOMException('Problem parsing input file.'))
+        }
+        reader.onload = () => {
+            resolve(reader.result as string)
+        }
+        reader.readAsText(file)
+    })
+}