add an OceanProvider

This commit is contained in:
Matthias Kretschmann 2020-04-24 16:49:59 +02:00
parent c7558bd769
commit 7310bcafc9
Signed by: m
GPG Key ID: 606EEEF3C479A91F
1 changed files with 24 additions and 1 deletions

View File

@ -10,6 +10,25 @@ npm install @oceanprotocol/react
## Usage
First, wrap your App with the `OceanProvider`:
```tsx
import React from 'react'
import { OceanProvider } from '@oceanprotocol/react'
export default function MyApp({ children }: { children: any }) {
return (
<OceanProvider>
<h1>My App</h1>
{children}
</OceanProvider>
)
}
```
Then within your component use the provided hooks to interact with Ocean's functionality:
```tsx
import React from 'react'
import { useOcean, OceanConfig, useConsume } from '@oceanprotocol/react'
@ -21,8 +40,12 @@ const oceanConfig: OceanConfig = {
export default function MyComponent() {
// TODO: setup web3 first
// Initialize, get existing, or reinitalize Ocean
const { ocean, account } = useOcean(web3, oceanConfig)
const { consumeAsset, isLoading, step } = useConsume()
// consume asset
const { consumeAsset, isLoading, step } = useConsume(ocean, account)
async function handleClick() {
const ddo = 'did:op:0x000000000'