diff --git a/client/src/components/molecules/Asset.module.scss b/client/src/components/molecules/Asset.module.scss
index 6bbcd08..5b9a2f1 100644
--- a/client/src/components/molecules/Asset.module.scss
+++ b/client/src/components/molecules/Asset.module.scss
@@ -31,11 +31,12 @@
.assetList {
> a {
- display: block;
color: $brand-grey-dark;
border-bottom: 1px solid $brand-grey-lighter;
padding-top: $spacer / 2;
padding-bottom: $spacer / 2;
+ display: flex;
+ justify-content: space-between;
&:hover,
&:focus {
@@ -51,6 +52,11 @@
}
}
+.date {
+ font-size: $font-size-small;
+ color: $brand-grey-light;
+}
+
.assetFooter {
border-top: 1px solid $brand-grey-lighter;
padding-top: $spacer / 2;
diff --git a/client/src/components/molecules/Asset.tsx b/client/src/components/molecules/Asset.tsx
index dec576a..d3a2922 100644
--- a/client/src/components/molecules/Asset.tsx
+++ b/client/src/components/molecules/Asset.tsx
@@ -1,5 +1,6 @@
import React from 'react'
import { Link } from 'react-router-dom'
+import moment from 'moment'
import styles from './Asset.module.scss'
const AssetLink = ({ asset, list }: { asset: any; list?: boolean }) => {
@@ -10,6 +11,9 @@ const AssetLink = ({ asset, list }: { asset: any; list?: boolean }) => {
{base.name}
+
+ {moment(base.dateCreated, 'YYYYMMDD').fromNow()}
+
) : (
diff --git a/client/src/components/molecules/AssetsUser.module.scss b/client/src/components/molecules/AssetsUser.module.scss
index 7456609..ec2d705 100644
--- a/client/src/components/molecules/AssetsUser.module.scss
+++ b/client/src/components/molecules/AssetsUser.module.scss
@@ -1,15 +1,8 @@
@import '../../styles/variables';
.assetsUser {
- margin-top: $spacer * 3;
+ margin-top: $spacer;
margin-bottom: $spacer;
-
- > div {
- margin-bottom: $spacer;
- }
-}
-
-.assets {
}
.subTitle {
@@ -19,3 +12,8 @@
padding-bottom: $spacer / 2;
margin-bottom: 0;
}
+
+.link {
+ display: block;
+ margin-top: $spacer / 2;
+}
diff --git a/client/src/components/molecules/AssetsUser.tsx b/client/src/components/molecules/AssetsUser.tsx
index 318b246..2b798e4 100644
--- a/client/src/components/molecules/AssetsUser.tsx
+++ b/client/src/components/molecules/AssetsUser.tsx
@@ -1,12 +1,15 @@
import React, { PureComponent } from 'react'
import { Link } from 'react-router-dom'
+import { Logger } from '@oceanprotocol/squid'
import { User } from '../../context/User'
import Spinner from '../atoms/Spinner'
-import Asset from '../molecules/Asset'
+import Asset from './Asset'
import styles from './AssetsUser.module.scss'
-import { Logger } from '@oceanprotocol/squid'
-export default class AssetsUser extends PureComponent {
+export default class AssetsUser extends PureComponent<
+ { list?: boolean; recent?: boolean },
+ { results: any[]; isLoading: boolean }
+> {
public state = { results: [], isLoading: true }
public componentDidMount() {
@@ -42,21 +45,33 @@ export default class AssetsUser extends PureComponent {
public render() {
return (
-
Your Data Sets
+ {this.props.recent && (
+
Your Latest Data Sets
+ )}
{this.state.isLoading ? (
) : this.state.results.length ? (
-
+ <>
{this.state.results
+ .slice(0, this.props.recent ? 5 : undefined)
.filter(asset => !!asset)
.map((asset: any) => (
-
- ))}
-
+
+ ))}
+ {this.props.recent && (
+
+ All Data Sets
+
+ )}
+ >
) : (
-
None yet.
+
No Data Sets Yet.
+ Publish A Data Set
)}
diff --git a/client/src/routes/History.tsx b/client/src/routes/History.tsx
index 66ac858..0dc0e97 100644
--- a/client/src/routes/History.tsx
+++ b/client/src/routes/History.tsx
@@ -1,56 +1,13 @@
import React, { Component } from 'react'
import Route from '../components/templates/Route'
-import { User } from '../context/User'
-import Asset from '../components/molecules/Asset'
-import { Logger } from '@oceanprotocol/squid'
-
-interface InvoicesState {
- results: any[]
-}
-
-export default class Invoices extends Component<{}, InvoicesState> {
- public state = { results: [] }
-
- public async componentDidMount() {
- // this is currently my published assets
- this.context.ocean.keeper.didRegistry.contract.getPastEvents(
- 'DIDAttributeRegistered',
- {
- filter: { _owner: this.context.account },
- fromBlock: 0,
- toBlock: 'latest'
- },
- async (error: any, events: any) => {
- if (error) {
- Logger.log('error retrieving', error)
- } else {
- const results = []
- for (const event of events) {
- const ddo = await this.context.ocean.assets.resolve(
- `did:op:${event.returnValues._did.substring(2)}`
- )
- results.push(ddo)
- }
- this.setState({ results })
- }
- }
- )
- }
-
- public renderResults = () =>
- this.state.results.length ? (
- this.state.results
- .filter(asset => !!asset)
- .map((asset, index) => (
-
- ))
- ) : (
-
No invoices yet
- )
+import AssetsUser from '../components/molecules/AssetsUser'
+export default class History extends Component {
public render() {
- return
{this.renderResults()}
+ return (
+
+
+
+ )
}
}
-
-Invoices.contextType = User
diff --git a/client/src/routes/Home.module.scss b/client/src/routes/Home.module.scss
index 472e6ca..2376841 100644
--- a/client/src/routes/Home.module.scss
+++ b/client/src/routes/Home.module.scss
@@ -3,6 +3,10 @@
.home {
display: block;
+ form {
+ margin-bottom: $spacer * 3;
+ }
+
label {
height: 0;
margin: 0;
diff --git a/client/src/routes/Home.tsx b/client/src/routes/Home.tsx
index 3f7885c..f62f0bf 100644
--- a/client/src/routes/Home.tsx
+++ b/client/src/routes/Home.tsx
@@ -41,7 +41,7 @@ class Home extends Component
{
}
/>
-
+
)
}