1
0
mirror of https://github.com/oceanprotocol/react.git synced 2024-12-23 01:29:49 +01:00

refactoring, context fix

This commit is contained in:
mihaisc 2020-05-08 14:11:30 +03:00
parent 495013c021
commit 7658e56683
5 changed files with 36 additions and 26 deletions

View File

@ -2,7 +2,7 @@ import { useState } from 'react'
import { DID, MetaDataAlgorithm } from '@oceanprotocol/squid'
import { useOcean } from '../../providers'
import { ComputeValue } from './ComputeOptions'
import { feedback } from './../../utils'
interface UseCompute {
compute: (
did: DID,
@ -10,17 +10,14 @@ interface UseCompute {
computeContainer: ComputeValue
) => Promise<void>
computeStep?: number
computeStepText?: string
computeError?: string
}
// TODO: customize for compute
export const computeFeedback: { [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...'
...feedback,
3: '3/3 Access granted. Starting job...',
}
const rawAlgorithmMeta: MetaDataAlgorithm = {
rawcode: `console.log('Hello world'!)`,
@ -36,6 +33,7 @@ const rawAlgorithmMeta: MetaDataAlgorithm = {
function useCompute(): UseCompute {
const { ocean, account, accountId, config } = useOcean()
const [computeStep, setComputeStep] = useState<number | undefined>()
const [computeStepText, setComputeStepText] = useState<string | undefined>()
const [computeError, setComputeError] = useState<string | undefined>()
async function compute(
@ -61,11 +59,12 @@ function useCompute(): UseCompute {
const agreement = await ocean.compute
.order(account, did as string)
.next((step: number) => setComputeStep(step))
.next((step: number) => { setComputeStep(step); setComputeStepText(computeFeedback[step]) })
rawAlgorithmMeta.container = computeContainer
rawAlgorithmMeta.rawcode = algorithmRawCode
setComputeStep(4)
setComputeStepText(computeFeedback[4])
await ocean.compute.start(
account,
agreement,
@ -73,6 +72,7 @@ function useCompute(): UseCompute {
rawAlgorithmMeta,
computeOutput
)
} catch (error) {
setComputeError(error.message)
} finally {
@ -80,7 +80,7 @@ function useCompute(): UseCompute {
}
}
return { compute, computeStep, computeError }
return { compute, computeStep, computeStepText, computeError }
}
export { useCompute, UseCompute }

View File

@ -1,22 +1,20 @@
import { useState } from 'react'
import { DID } from '@oceanprotocol/squid'
import { useOcean } from '../../providers'
import { feedback } from '../../utils'
interface UseConsume {
consume: (did: DID) => Promise<void>
consumeStep?: number
consumeStepText?: string
consumeError?: string
}
// TODO: do something with this object,
// consumeStep should probably return one of those strings
// instead of just a number
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...',
export const consumeFeedback: { [key in number]: string } = {
...feedback,
4: '3/3 Access granted. Consuming file...'
}
@ -25,6 +23,7 @@ function useConsume(): UseConsume {
// Otherwise we could just require `ocean` to be passed to `useConsume()`
const { ocean, account, accountId } = useOcean()
const [consumeStep, setConsumeStep] = useState<number | undefined>()
const [consumeStepText, setConsumeStepText] = useState<string | undefined>()
const [consumeError, setConsumeError] = useState<string | undefined>()
async function consume(did: DID | string): Promise<void> {
@ -37,15 +36,18 @@ function useConsume(): UseConsume {
accountId
)
const agreement = agreements.find((el: { did: string }) => el.did === did)
console.log('existing agre',agreement)
const agreementId = agreement
? agreement.agreementId
: await ocean.assets
.order(did as string, account)
.next((step: number) => setConsumeStep(step))
.order(did as string, account)
.next((step: number) => { setConsumeStep(step); setConsumeStepText(consumeFeedback[step]) })
console.log('aggrement ok', agreementId)
// manually add another step here for better UX
setConsumeStep(4)
setConsumeStepText(consumeFeedback[4])
await ocean.assets.consume(agreementId, did as string, account, '')
console.log('consume ok')
} catch (error) {
setConsumeError(error.message)
} finally {
@ -53,7 +55,7 @@ function useConsume(): UseConsume {
}
}
return { consume, consumeStep, consumeError }
return { consume, consumeStep, consumeStepText, consumeError }
}
export { useConsume, UseConsume }

View File

@ -1,5 +1,4 @@
import React, {
ReactNode,
useContext,
useState,
useEffect,
@ -9,6 +8,7 @@ import { Ocean, Config, Account, Aquarius, Logger } from '@oceanprotocol/squid'
import Web3 from 'web3'
import Balance from '@oceanprotocol/squid/dist/node/models/Balance'
import { connectOcean } from './utils'
import { useWeb3 } from '../Web3Provider'
enum OceanConnectionStatus {
OCEAN_CONNECTION_ERROR = -1,
@ -30,11 +30,9 @@ const OceanContext = createContext(null)
function OceanProvider({
config,
web3,
children
}: {
config: Config
web3: Web3 | undefined
children: any
}): any {
const [ocean, setOcean] = useState<Ocean | undefined>()
@ -45,6 +43,7 @@ function OceanProvider({
const [status, setStatus] = useState<OceanConnectionStatus>(
OceanConnectionStatus.NOT_CONNECTED
)
const { web3 } = useWeb3()
// -------------------------------------------------------------
// 1. On mount, connect to Aquarius instance right away
@ -58,6 +57,7 @@ function OceanProvider({
// 2. Once `web3` becomes available, connect to the whole network
// -------------------------------------------------------------
useEffect(() => {
console.log('ocean', web3)
if (!web3) return
async function init(): Promise<void> {

View File

@ -22,7 +22,7 @@ function Web3Provider({ children }: { children: any }): any {
async function initWeb3(): Promise<void> {
const web3 = await getWeb3()
setWeb3(web3)
const chainId = web3 && (await web3.eth.getChainId())
setChainId(chainId)
}
@ -35,7 +35,7 @@ function Web3Provider({ children }: { children: any }): any {
async function initUser(): Promise<void> {
const account = await web3.eth.getAccounts()[0]
setAccount(account)
if(!account) return
const balance = await web3.eth.getBalance(account)
setBalance(balance)
}
@ -66,5 +66,5 @@ function Web3Provider({ children }: { children: any }): any {
// Helper hook to access the provider values
const useWeb3 = (): Web3ProviderValue => useContext(Web3Context)
export { Web3Provider, useWeb3 }
export { Web3Provider, useWeb3,Web3ProviderValue }
export default Web3Provider

View File

@ -11,3 +11,11 @@ export function readFileContent(file: File): Promise<string> {
reader.readAsText(file)
})
}
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...',
}