2019-02-15 15:23:13 +01:00
|
|
|
import React, { PureComponent } from 'react'
|
|
|
|
import { Link } from 'react-router-dom'
|
2019-03-25 17:31:32 +01:00
|
|
|
import { Logger } from '@oceanprotocol/squid'
|
2019-04-15 11:40:25 +02:00
|
|
|
import { User } from '../../context'
|
2019-02-15 17:26:28 +01:00
|
|
|
import Spinner from '../atoms/Spinner'
|
2019-05-23 18:18:51 +02:00
|
|
|
import AssetTeaser from '../molecules/AssetTeaser'
|
2019-02-15 15:23:13 +01:00
|
|
|
import styles from './AssetsUser.module.scss'
|
|
|
|
|
2019-03-25 17:31:32 +01:00
|
|
|
export default class AssetsUser extends PureComponent<
|
2019-03-26 16:28:08 +01:00
|
|
|
{ list?: boolean; recent?: number },
|
2019-03-25 17:31:32 +01:00
|
|
|
{ results: any[]; isLoading: boolean }
|
|
|
|
> {
|
2019-09-10 00:15:13 +02:00
|
|
|
public static contextType = User
|
|
|
|
|
2019-02-15 17:26:28 +01:00
|
|
|
public state = { results: [], isLoading: true }
|
2019-02-15 15:23:13 +01:00
|
|
|
|
2019-09-02 13:25:46 +02:00
|
|
|
public _isMounted = false
|
2019-04-12 18:19:55 +02:00
|
|
|
|
2019-02-15 15:23:13 +01:00
|
|
|
public componentDidMount() {
|
2019-04-12 18:19:55 +02:00
|
|
|
this._isMounted = true
|
|
|
|
this._isMounted && this.searchOcean()
|
|
|
|
}
|
|
|
|
|
|
|
|
public componentWillUnmount() {
|
|
|
|
this._isMounted = false
|
2019-02-15 15:23:13 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
private async searchOcean() {
|
2019-04-12 18:19:55 +02:00
|
|
|
const { account, ocean } = this.context
|
|
|
|
|
|
|
|
if (account) {
|
|
|
|
ocean.keeper.didRegistry.contract.getPastEvents(
|
2019-03-28 13:15:26 +01:00
|
|
|
'DIDAttributeRegistered',
|
|
|
|
{
|
2019-04-12 18:19:55 +02:00
|
|
|
filter: { _owner: account },
|
2019-03-28 13:15:26 +01:00
|
|
|
fromBlock: 0,
|
|
|
|
toBlock: 'latest'
|
|
|
|
},
|
|
|
|
async (error: any, events: any) => {
|
|
|
|
if (error) {
|
|
|
|
Logger.log('error retrieving', error)
|
2019-04-12 18:19:55 +02:00
|
|
|
this._isMounted && this.setState({ isLoading: false })
|
2019-03-28 13:15:26 +01:00
|
|
|
} else {
|
|
|
|
const results = []
|
|
|
|
for (const event of events) {
|
2019-04-12 18:19:55 +02:00
|
|
|
const ddo = await ocean.assets.resolve(
|
2019-03-28 13:15:26 +01:00
|
|
|
`did:op:${event.returnValues._did.substring(2)}`
|
|
|
|
)
|
|
|
|
results.push(ddo)
|
2019-03-26 11:46:57 +01:00
|
|
|
}
|
2019-04-12 18:19:55 +02:00
|
|
|
this._isMounted &&
|
|
|
|
this.setState({ results, isLoading: false })
|
2019-03-20 15:27:00 +01:00
|
|
|
}
|
2019-02-15 15:23:13 +01:00
|
|
|
}
|
2019-03-26 11:46:57 +01:00
|
|
|
)
|
2019-04-02 14:55:15 +02:00
|
|
|
} else {
|
|
|
|
this.setState({ isLoading: false })
|
2019-03-26 11:46:57 +01:00
|
|
|
}
|
2019-02-15 15:23:13 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
public render() {
|
2019-07-11 15:45:49 +02:00
|
|
|
const { account } = this.context
|
2019-09-10 00:15:13 +02:00
|
|
|
const { recent, list } = this.props
|
|
|
|
const { isLoading, results } = this.state
|
|
|
|
|
|
|
|
if (!account) return null
|
2019-04-12 18:19:55 +02:00
|
|
|
|
2019-04-13 13:43:04 +02:00
|
|
|
return (
|
2019-09-10 00:15:13 +02:00
|
|
|
<div className={styles.assetsUser}>
|
|
|
|
{this.props.recent && (
|
|
|
|
<h2 className={styles.subTitle}>
|
|
|
|
Your Latest Published Data Sets
|
|
|
|
</h2>
|
|
|
|
)}
|
2019-02-15 15:23:13 +01:00
|
|
|
|
2019-09-10 00:15:13 +02:00
|
|
|
{isLoading ? (
|
|
|
|
<Spinner />
|
|
|
|
) : results.length ? (
|
|
|
|
<>
|
|
|
|
{results
|
2019-09-10 00:33:23 +02:00
|
|
|
.slice(0, recent || undefined)
|
2020-05-19 10:36:18 +02:00
|
|
|
.filter((asset) => !!asset)
|
2019-09-10 00:15:13 +02:00
|
|
|
.map((asset: any) => (
|
|
|
|
<AssetTeaser
|
|
|
|
list={list}
|
|
|
|
key={asset.id}
|
|
|
|
asset={asset}
|
|
|
|
/>
|
|
|
|
))}
|
|
|
|
{recent && (
|
|
|
|
<Link className={styles.link} to="/history">
|
|
|
|
All Data Sets
|
|
|
|
</Link>
|
|
|
|
)}
|
|
|
|
</>
|
|
|
|
) : (
|
|
|
|
<div className={styles.empty}>
|
|
|
|
<p>No Data Sets Yet.</p>
|
|
|
|
<Link to="/publish">+ Publish A Data Set</Link>
|
|
|
|
</div>
|
|
|
|
)}
|
|
|
|
</div>
|
2019-02-15 15:23:13 +01:00
|
|
|
)
|
|
|
|
}
|
|
|
|
}
|