mirror of
https://github.com/oceanprotocol/market.git
synced 2024-06-29 00:57:50 +02:00
35 lines
1.0 KiB
TypeScript
35 lines
1.0 KiB
TypeScript
import React, { useState, useEffect, ReactElement } from 'react'
|
|
import Page from '@shared/Page'
|
|
import Alert from '@shared/atoms/Alert'
|
|
import Loader from '@shared/atoms/Loader'
|
|
import { useAsset } from '@context/Asset'
|
|
import AssetContent from './AssetContent'
|
|
|
|
export default function AssetDetails({ uri }: { uri: string }): ReactElement {
|
|
const { ddo, title, error, isInPurgatory, loading } = useAsset()
|
|
const [pageTitle, setPageTitle] = useState<string>()
|
|
|
|
useEffect(() => {
|
|
if (!ddo || error) {
|
|
setPageTitle('Could not retrieve asset')
|
|
return
|
|
}
|
|
|
|
setPageTitle(isInPurgatory ? '' : title)
|
|
}, [ddo, error, isInPurgatory, title])
|
|
|
|
return ddo && pageTitle !== undefined && !loading ? (
|
|
<Page title={pageTitle} uri={uri}>
|
|
<AssetContent ddo={ddo} />
|
|
</Page>
|
|
) : error ? (
|
|
<Page title={pageTitle} noPageHeader uri={uri}>
|
|
<Alert title={pageTitle} text={error} state="error" />
|
|
</Page>
|
|
) : (
|
|
<Page title={undefined} uri={uri}>
|
|
<Loader />
|
|
</Page>
|
|
)
|
|
}
|