mirror of
https://github.com/oceanprotocol/commons.git
synced 2023-03-15 18:03:00 +01:00
fix error output on asset details loading
This commit is contained in:
parent
c4029b147c
commit
c4e71173ba
|
@ -21,103 +21,87 @@ export function datafilesLine(files: File[]) {
|
||||||
return <span>{files.length} data files</span>
|
return <span>{files.length} data files</span>
|
||||||
}
|
}
|
||||||
|
|
||||||
export default class AssetDetails extends PureComponent<AssetDetailsProps> {
|
const Pricing = ({ price }: { price: string }) => (
|
||||||
public render() {
|
<li>
|
||||||
const { metadata, ddo } = this.props
|
<span className={styles.metaLabel}>
|
||||||
const { base } = metadata
|
<strong>Price</strong>
|
||||||
|
</span>
|
||||||
|
<span className={styles.metaValue}>
|
||||||
|
{price === '0' ? 0 : Web3.utils.fromWei(price.toString())} OCEAN
|
||||||
|
</span>
|
||||||
|
</li>
|
||||||
|
)
|
||||||
|
|
||||||
return (
|
export default function AssetDetails({ metadata, ddo }: AssetDetailsProps) {
|
||||||
<>
|
const { base } = metadata
|
||||||
<aside className={styles.metaPrimary}>
|
|
||||||
<h2
|
return (
|
||||||
className={styles.copyrightHolder}
|
<>
|
||||||
title="Copyright Holder"
|
<aside className={styles.metaPrimary}>
|
||||||
|
<h2 className={styles.copyrightHolder} title="Copyright Holder">
|
||||||
|
{base.copyrightHolder}
|
||||||
|
</h2>
|
||||||
|
<div className={styles.metaPrimaryData}>
|
||||||
|
<span
|
||||||
|
title={`Date created, published on ${base.datePublished}`}
|
||||||
>
|
>
|
||||||
{base.copyrightHolder}
|
<Moment
|
||||||
</h2>
|
date={base.dateCreated}
|
||||||
<div className={styles.metaPrimaryData}>
|
format="L"
|
||||||
<span
|
interval={0}
|
||||||
title={`Date created, published on ${base.datePublished}`}
|
/>
|
||||||
>
|
</span>
|
||||||
<Moment
|
|
||||||
date={base.dateCreated}
|
|
||||||
format="L"
|
|
||||||
interval={0}
|
|
||||||
/>
|
|
||||||
</span>
|
|
||||||
|
|
||||||
{base.categories && (
|
{base.categories && (
|
||||||
<CategoryLink category={base.categories[0]} />
|
<CategoryLink category={base.categories[0]} />
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{base.files && datafilesLine(base.files)}
|
{base.files && datafilesLine(base.files)}
|
||||||
</div>
|
|
||||||
</aside>
|
|
||||||
|
|
||||||
{base.description && (
|
|
||||||
<Markdown
|
|
||||||
text={base.description}
|
|
||||||
className={styles.description}
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
|
|
||||||
<Report did={ddo.id} title={metadata.base.name} />
|
|
||||||
|
|
||||||
<div className={styles.metaFixed}>
|
|
||||||
<h2
|
|
||||||
className={styles.metaFixedTitle}
|
|
||||||
title="This metadata can not be changed because it is used to generate the checksums for the DDO, and to encrypt the file urls."
|
|
||||||
>
|
|
||||||
Fixed Metadata
|
|
||||||
</h2>
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
<span className={styles.metaLabel}>
|
|
||||||
<strong>Author</strong>
|
|
||||||
</span>
|
|
||||||
<span className={styles.metaValue}>
|
|
||||||
{base.author}
|
|
||||||
</span>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<span className={styles.metaLabel}>
|
|
||||||
<strong>License</strong>
|
|
||||||
</span>
|
|
||||||
<span className={styles.metaValue}>
|
|
||||||
{base.license}
|
|
||||||
</span>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<span className={styles.metaLabel}>
|
|
||||||
<strong>DID</strong>
|
|
||||||
</span>
|
|
||||||
<span className={styles.metaValue}>
|
|
||||||
<code>{ddo.id}</code>
|
|
||||||
</span>
|
|
||||||
</li>
|
|
||||||
{allowPricing ? (
|
|
||||||
<li>
|
|
||||||
<span className={styles.metaLabel}>
|
|
||||||
<strong>Price</strong>
|
|
||||||
</span>
|
|
||||||
<span className={styles.metaValue}>
|
|
||||||
{base.price === '0'
|
|
||||||
? 0
|
|
||||||
: Web3.utils.fromWei(
|
|
||||||
base.price.toString()
|
|
||||||
)}{' '}
|
|
||||||
OCEAN
|
|
||||||
</span>
|
|
||||||
</li>
|
|
||||||
) : null}
|
|
||||||
</ul>
|
|
||||||
</div>
|
</div>
|
||||||
|
</aside>
|
||||||
|
|
||||||
<AssetFilesDetails
|
{base.description && (
|
||||||
files={base.files ? base.files : []}
|
<Markdown
|
||||||
ddo={ddo}
|
text={base.description}
|
||||||
|
className={styles.description}
|
||||||
/>
|
/>
|
||||||
</>
|
)}
|
||||||
)
|
|
||||||
}
|
<Report did={ddo.id} title={metadata.base.name} />
|
||||||
|
|
||||||
|
<div className={styles.metaFixed}>
|
||||||
|
<h2
|
||||||
|
className={styles.metaFixedTitle}
|
||||||
|
title="This metadata can not be changed because it is used to generate the checksums for the DDO, and to encrypt the file urls."
|
||||||
|
>
|
||||||
|
Fixed Metadata
|
||||||
|
</h2>
|
||||||
|
<ul>
|
||||||
|
<li>
|
||||||
|
<span className={styles.metaLabel}>
|
||||||
|
<strong>Author</strong>
|
||||||
|
</span>
|
||||||
|
<span className={styles.metaValue}>{base.author}</span>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<span className={styles.metaLabel}>
|
||||||
|
<strong>License</strong>
|
||||||
|
</span>
|
||||||
|
<span className={styles.metaValue}>{base.license}</span>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<span className={styles.metaLabel}>
|
||||||
|
<strong>DID</strong>
|
||||||
|
</span>
|
||||||
|
<span className={styles.metaValue}>
|
||||||
|
<code>{ddo.id}</code>
|
||||||
|
</span>
|
||||||
|
</li>
|
||||||
|
{allowPricing ? <Pricing price={base.price} /> : null}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<AssetFilesDetails files={base.files ? base.files : []} ddo={ddo} />
|
||||||
|
</>
|
||||||
|
)
|
||||||
}
|
}
|
||||||
|
|
|
@ -54,12 +54,13 @@ class Asset extends Component<AssetProps, AssetState> {
|
||||||
public render() {
|
public render() {
|
||||||
const { metadata, ddo, error } = this.state
|
const { metadata, ddo, error } = this.state
|
||||||
const isLoading = metadata.base.name === ''
|
const isLoading = metadata.base.name === ''
|
||||||
|
const hasError = error !== ''
|
||||||
|
|
||||||
return isLoading ? (
|
return isLoading && !hasError ? (
|
||||||
<div className={stylesApp.loader}>
|
<div className={stylesApp.loader}>
|
||||||
<Spinner message="Loading asset..." />
|
<Spinner message="Loading asset..." />
|
||||||
</div>
|
</div>
|
||||||
) : error !== '' ? (
|
) : hasError ? (
|
||||||
<div className={styles.error}>{error}</div>
|
<div className={styles.error}>{error}</div>
|
||||||
) : (
|
) : (
|
||||||
<Route
|
<Route
|
||||||
|
|
Loading…
Reference in New Issue
Block a user