From f4b4062873b619ef46f57a4ed4e7065434e896cc Mon Sep 17 00:00:00 2001 From: mihaisc Date: Tue, 28 Apr 2020 14:55:41 +0300 Subject: [PATCH 1/5] compute draft --- src/hooks/useCompute/index.ts | 1 + src/hooks/useCompute/useCompute.ts | 81 ++++++++++++++++++++++++++++++ 2 files changed, 82 insertions(+) create mode 100644 src/hooks/useCompute/index.ts create mode 100644 src/hooks/useCompute/useCompute.ts diff --git a/src/hooks/useCompute/index.ts b/src/hooks/useCompute/index.ts new file mode 100644 index 0000000..133a43b --- /dev/null +++ b/src/hooks/useCompute/index.ts @@ -0,0 +1 @@ +export * from './useCompute' diff --git a/src/hooks/useCompute/useCompute.ts b/src/hooks/useCompute/useCompute.ts new file mode 100644 index 0000000..60a0063 --- /dev/null +++ b/src/hooks/useCompute/useCompute.ts @@ -0,0 +1,81 @@ +import { useState } from 'react' +import { DID, MetaDataAlgorithm } from '@oceanprotocol/squid' +import { useOcean } from '../../providers' + +interface UseCompute { + compute: (did: DID) => Promise + computeStep?: number + computeError?: string +} + +// TODO: customize for compute +export const feedback: { [key in number]: string } = { + 99: 'Decrypting file URL...', + 0: '1/3 Asking for agreement signature...', + 1: '1/3 Agreement initialized.', + 2: '2/3 Asking for two payment confirmations...', + 3: '2/3 Payment confirmed. Requesting access...', + 4: '3/3 Access granted. Consuming file...' +} +const rawAlgorithmMeta: MetaDataAlgorithm = { + rawcode: `console.log('Hello world'!)`, + format: 'docker-image', + version: '0.1', + container: { + entrypoint: '', + image: '', + tag: '' + } +} + +function useCompute(): UseCompute { + + const { ocean, account, accountId, config } = useOcean() + const [computeStep, setComputeStep] = useState() + const [computeError, setComputeError] = useState() + + async function compute(did: DID | string): Promise { + if (!ocean || !account) return + + setComputeError(undefined) + + try { + const computeOutput = { + publishAlgorithmLog: false, + publishOutput: false, + brizoAddress: config.brizoAddress, + brizoUri: config.brizoUri, + metadataUri: config.aquariusUri, + nodeUri: config.nodeUri, + owner: accountId, + secretStoreUri: config.secretStoreUri + } + + const agreement = await ocean.compute + .order(account, did as string) + .next((step: number) => setComputeStep(step)) + + // rawAlgorithmMeta.container = computeContainer + // rawAlgorithmMeta.rawcode = 'algorithmRawCode' + + await ocean.compute.start( + account, + agreement, + undefined, + rawAlgorithmMeta, + computeOutput + ) + + + } catch (error) { + setComputeError(error.message) + } finally { + setComputeStep(undefined) + } + } + + return { compute, computeStep, computeError } +} + +export { useCompute, UseCompute } +export default UseCompute From 5999d735a3d379ade7f4fb16d05f218cc356695c Mon Sep 17 00:00:00 2001 From: mihaisc Date: Mon, 4 May 2020 15:38:41 +0300 Subject: [PATCH 2/5] readme example not tested --- src/hooks/useCompute/ComputeOptions.tsx | 28 ++++++ src/hooks/useCompute/README.md | 76 ++++++++++++++++ src/hooks/useCompute/useCompute.ts | 116 +++++++++++++----------- src/index.ts | 2 + src/utils/index.ts | 13 +++ 5 files changed, 180 insertions(+), 55 deletions(-) create mode 100644 src/hooks/useCompute/ComputeOptions.tsx create mode 100644 src/hooks/useCompute/README.md create mode 100644 src/utils/index.ts diff --git a/src/hooks/useCompute/ComputeOptions.tsx b/src/hooks/useCompute/ComputeOptions.tsx new file mode 100644 index 0000000..40f5067 --- /dev/null +++ b/src/hooks/useCompute/ComputeOptions.tsx @@ -0,0 +1,28 @@ +export interface ComputeValue { + entrypoint: string + image: string + tag: string +} +export interface ComputeOption { + name: string + value: ComputeValue +} + +export const computeOptions: ComputeOption[] = [ + { + name: 'nodejs', + value: { + entrypoint: 'node $ALGO', + image: 'node', + tag: '10' + } + }, + { + name: 'python3.7', + value: { + entrypoint: 'python $ALGO', + image: 'oceanprotocol/algo_dockers', + tag: 'python-panda' + } + } +] diff --git a/src/hooks/useCompute/README.md b/src/hooks/useCompute/README.md new file mode 100644 index 0000000..c188975 --- /dev/null +++ b/src/hooks/useCompute/README.md @@ -0,0 +1,76 @@ +# `useCompute` + +The `OceanProvider` maintains a connection to the Ocean Protocol network in multiple steps: + +1. On mount, connect to Aquarius instance right away so any asset metadata can be retrieved before, and independent of any Web3 connections. +2. Once Web3 becomes available, a connection to all Ocean Protocol network components is established. +3. Once Ocean becomes available, spits out some info about it. + +Also provides a `useOcean` helper hook to access its context values from any component. + +## Usage + +```tsx +import React from 'react' +import { + useWeb3, + useOcean, + useMetadata, + useCompute, + computeOptions, + ComputeValue, + readFileContent +} from '@oceanprotocol/react' + +const did = 'did:op:0x000000000' + +export default function MyComponent() { + // Get web3 from built-in Web3Provider context + const { web3 } = useWeb3() + + // Get Ocean instance from built-in OceanProvider context + const { ocean, account } = useOcean() + + // Get metadata for this asset + const { title, metadata } = useMetadata(did) + + + // compute asset + const { compute, computeStep } = useCompute() + // raw code text + const [algorithmRawCode, setAlgorithmRawCode] = useState('') + const [computeContainer, setComputeContainer] = useState() + async function handleCompute() { + await consume(did,algorithmRawCode,computeContainer) + } + + async function onChangeHandler(event){ + const fileText = await readFileContent(files[0]) + setAlgorithmRawCode(fileText) + } + async function handleSelectChange(event: any) { + const comType = event.target.value + setComputeContainer(comType) + } + + return ( +
+

{title}

+

Price: {web3.utils.fromWei(metadata.main.price)}

+ +

Your account: {account}

+ + + + +
+ ) +} +``` diff --git a/src/hooks/useCompute/useCompute.ts b/src/hooks/useCompute/useCompute.ts index 60a0063..b025ce9 100644 --- a/src/hooks/useCompute/useCompute.ts +++ b/src/hooks/useCompute/useCompute.ts @@ -1,80 +1,86 @@ import { useState } from 'react' import { DID, MetaDataAlgorithm } from '@oceanprotocol/squid' import { useOcean } from '../../providers' +import { ComputeValue } from './ComputeOptions' interface UseCompute { - compute: (did: DID) => Promise - computeStep?: number - computeError?: string + compute: ( + did: DID, + algorithmRawCode: string, + computeContainer: ComputeValue + ) => Promise + computeStep?: number + computeError?: string } // TODO: customize for compute export const feedback: { [key in number]: string } = { - 99: 'Decrypting file URL...', - 0: '1/3 Asking for agreement signature...', - 1: '1/3 Agreement initialized.', - 2: '2/3 Asking for two payment confirmations...', - 3: '2/3 Payment confirmed. Requesting access...', - 4: '3/3 Access granted. Consuming file...' + 99: 'Decrypting file URL...', + 0: '1/3 Asking for agreement signature...', + 1: '1/3 Agreement initialized.', + 2: '2/3 Asking for two payment confirmations...', + 3: '2/3 Payment confirmed. Requesting access...', + 4: '3/3 Access granted. Consuming file...' } const rawAlgorithmMeta: MetaDataAlgorithm = { - rawcode: `console.log('Hello world'!)`, - format: 'docker-image', - version: '0.1', - container: { - entrypoint: '', - image: '', - tag: '' - } + rawcode: `console.log('Hello world'!)`, + format: 'docker-image', + version: '0.1', + container: { + entrypoint: '', + image: '', + tag: '' + } } function useCompute(): UseCompute { - - const { ocean, account, accountId, config } = useOcean() - const [computeStep, setComputeStep] = useState() - const [computeError, setComputeError] = useState() + const { ocean, account, accountId, config } = useOcean() + const [computeStep, setComputeStep] = useState() + const [computeError, setComputeError] = useState() - async function compute(did: DID | string): Promise { - if (!ocean || !account) return + async function compute( + did: DID | string, + algorithmRawCode: string, + computeContainer: ComputeValue + ): Promise { + if (!ocean || !account) return - setComputeError(undefined) + setComputeError(undefined) - try { - const computeOutput = { - publishAlgorithmLog: false, - publishOutput: false, - brizoAddress: config.brizoAddress, - brizoUri: config.brizoUri, - metadataUri: config.aquariusUri, - nodeUri: config.nodeUri, - owner: accountId, - secretStoreUri: config.secretStoreUri - } + try { + const computeOutput = { + publishAlgorithmLog: false, + publishOutput: false, + brizoAddress: config.brizoAddress, + brizoUri: config.brizoUri, + metadataUri: config.aquariusUri, + nodeUri: config.nodeUri, + owner: accountId, + secretStoreUri: config.secretStoreUri + } - const agreement = await ocean.compute - .order(account, did as string) - .next((step: number) => setComputeStep(step)) + const agreement = await ocean.compute + .order(account, did as string) + .next((step: number) => setComputeStep(step)) - // rawAlgorithmMeta.container = computeContainer - // rawAlgorithmMeta.rawcode = 'algorithmRawCode' + rawAlgorithmMeta.container = computeContainer + rawAlgorithmMeta.rawcode = algorithmRawCode - await ocean.compute.start( - account, - agreement, - undefined, - rawAlgorithmMeta, - computeOutput - ) - - - } catch (error) { - setComputeError(error.message) - } finally { - setComputeStep(undefined) - } + await ocean.compute.start( + account, + agreement, + undefined, + rawAlgorithmMeta, + computeOutput + ) + } catch (error) { + setComputeError(error.message) + } finally { + setComputeStep(undefined) } + } - return { compute, computeStep, computeError } + return { compute, computeStep, computeError } } export { useCompute, UseCompute } diff --git a/src/index.ts b/src/index.ts index 441c499..779a417 100644 --- a/src/index.ts +++ b/src/index.ts @@ -3,3 +3,5 @@ import './@types/globals' export * from './providers' export * from './hooks' // export * from './components' + +export * from './utils' diff --git a/src/utils/index.ts b/src/utils/index.ts new file mode 100644 index 0000000..144ae1e --- /dev/null +++ b/src/utils/index.ts @@ -0,0 +1,13 @@ +export function readFileContent(file: File): Promise { + 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) + }) +} From e6c9eec679d475843395430c812a0d8c4505f642 Mon Sep 17 00:00:00 2001 From: mihaisc Date: Mon, 4 May 2020 15:51:10 +0300 Subject: [PATCH 3/5] test fix --- src/hooks/index.ts | 1 + src/hooks/useCompute/{ComputeOptions.tsx => ComputeOptions.ts} | 0 src/hooks/useCompute/index.ts | 1 + src/hooks/useCompute/useCompute.ts | 2 +- 4 files changed, 3 insertions(+), 1 deletion(-) rename src/hooks/useCompute/{ComputeOptions.tsx => ComputeOptions.ts} (100%) diff --git a/src/hooks/index.ts b/src/hooks/index.ts index 19a76a5..27127d3 100644 --- a/src/hooks/index.ts +++ b/src/hooks/index.ts @@ -1,2 +1,3 @@ export * from './useConsume' export * from './useMetadata' +export * from './useCompute' diff --git a/src/hooks/useCompute/ComputeOptions.tsx b/src/hooks/useCompute/ComputeOptions.ts similarity index 100% rename from src/hooks/useCompute/ComputeOptions.tsx rename to src/hooks/useCompute/ComputeOptions.ts diff --git a/src/hooks/useCompute/index.ts b/src/hooks/useCompute/index.ts index 133a43b..227cf84 100644 --- a/src/hooks/useCompute/index.ts +++ b/src/hooks/useCompute/index.ts @@ -1 +1,2 @@ export * from './useCompute' +export * from './ComputeOptions' diff --git a/src/hooks/useCompute/useCompute.ts b/src/hooks/useCompute/useCompute.ts index b025ce9..1e392be 100644 --- a/src/hooks/useCompute/useCompute.ts +++ b/src/hooks/useCompute/useCompute.ts @@ -14,7 +14,7 @@ interface UseCompute { } // TODO: customize for compute -export const feedback: { [key in number]: string } = { +export const computeFeedback: { [key in number]: string } = { 99: 'Decrypting file URL...', 0: '1/3 Asking for agreement signature...', 1: '1/3 Agreement initialized.', From d3aff1acb413e349b802e05c038270d05b63cd89 Mon Sep 17 00:00:00 2001 From: mihaisc Date: Thu, 7 May 2020 14:42:29 +0300 Subject: [PATCH 4/5] change ReactNode to any, metadata fix --- src/hooks/useMetadata/useMetadata.ts | 2 +- src/providers/OceanProvider/OceanProvider.tsx | 4 ++-- src/providers/Web3Provider/Web3Provider.tsx | 2 +- 3 files changed, 4 insertions(+), 4 deletions(-) diff --git a/src/hooks/useMetadata/useMetadata.ts b/src/hooks/useMetadata/useMetadata.ts index 66a887a..f4f6d06 100644 --- a/src/hooks/useMetadata/useMetadata.ts +++ b/src/hooks/useMetadata/useMetadata.ts @@ -56,4 +56,4 @@ function useMetadata(did?: DID | string): UseMetadata { } export { useMetadata, UseMetadata } -export default useConsume +export default useMetadata diff --git a/src/providers/OceanProvider/OceanProvider.tsx b/src/providers/OceanProvider/OceanProvider.tsx index e0ecc82..6937bdc 100644 --- a/src/providers/OceanProvider/OceanProvider.tsx +++ b/src/providers/OceanProvider/OceanProvider.tsx @@ -35,8 +35,8 @@ function OceanProvider({ }: { config: Config web3: Web3 | undefined - children: ReactNode -}): ReactNode { + children: any +}): any { const [ocean, setOcean] = useState() const [aquarius, setAquarius] = useState() const [account, setAccount] = useState() diff --git a/src/providers/Web3Provider/Web3Provider.tsx b/src/providers/Web3Provider/Web3Provider.tsx index add7e59..0808870 100644 --- a/src/providers/Web3Provider/Web3Provider.tsx +++ b/src/providers/Web3Provider/Web3Provider.tsx @@ -18,7 +18,7 @@ interface Web3ProviderValue { const Web3Context = createContext(null) -function Web3Provider({ children }: { children: ReactNode }): ReactNode { +function Web3Provider({ children }: { children: any }): any { const [web3, setWeb3] = useState() const [chainId, setChainId] = useState() const [account, setAccount] = useState() From 6da3ac8397436ee20b40919e93ed8808c9040951 Mon Sep 17 00:00:00 2001 From: Matthias Kretschmann Date: Thu, 7 May 2020 13:55:36 +0200 Subject: [PATCH 5/5] different tactic for files inclusion for TypeScript --- src/index.ts | 2 -- src/providers/Web3Provider/Web3Provider.tsx | 8 +------- tsconfig.json | 2 +- 3 files changed, 2 insertions(+), 10 deletions(-) diff --git a/src/index.ts b/src/index.ts index 441c499..74f05f3 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,5 +1,3 @@ -import './@types/globals' - export * from './providers' export * from './hooks' // export * from './components' diff --git a/src/providers/Web3Provider/Web3Provider.tsx b/src/providers/Web3Provider/Web3Provider.tsx index 0808870..6fefb7f 100644 --- a/src/providers/Web3Provider/Web3Provider.tsx +++ b/src/providers/Web3Provider/Web3Provider.tsx @@ -1,10 +1,4 @@ -import React, { - ReactNode, - useContext, - useState, - createContext, - useEffect -} from 'react' +import React, { useContext, useState, createContext, useEffect } from 'react' import Web3 from 'web3' import { getWeb3 } from './utils' diff --git a/tsconfig.json b/tsconfig.json index cfce06e..e8731c6 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -10,5 +10,5 @@ "sourceMap": true, "declaration": true }, - "files": ["./src/index.ts"] + "include": ["./src/@types", "./src/index.ts"] }