diff --git a/package-lock.json b/package-lock.json index 8426fd06a..93d4d3029 100644 --- a/package-lock.json +++ b/package-lock.json @@ -3550,9 +3550,9 @@ "integrity": "sha512-p0oOHXr60hXZuLNsQ/PsOQtCfia79thm7MjPxTrnnBvD+csJoHzARYMB0IFj/KTw6U5vLXODgjJAn8x6QksLwg==" }, "@oceanprotocol/lib": { - "version": "0.9.10", - "resolved": "https://registry.npmjs.org/@oceanprotocol/lib/-/lib-0.9.10.tgz", - "integrity": "sha512-IUL3K0RYisW5iodncf7pJJMnR9k/89TKfenI5TsMALTX71Vuf6NyX+lW0+rui0b0ZiKn5v0xHIlgJy8JEvo8+g==", + "version": "0.9.12", + "resolved": "https://registry.npmjs.org/@oceanprotocol/lib/-/lib-0.9.12.tgz", + "integrity": "sha512-R52kWSwwpKNzNHfnNbF6seFPvXEtExK3bWIi4V4eIkgmAf272sa6PVza4mJrtEpTAS1WcJv5ihF7cczIDecxbg==", "requires": { "@ethereum-navigator/navigator": "^0.5.0", "@oceanprotocol/contracts": "^0.5.7", @@ -3567,16 +3567,16 @@ } }, "@oceanprotocol/list-datapartners": { - "version": "1.0.2", - "resolved": "https://registry.npmjs.org/@oceanprotocol/list-datapartners/-/list-datapartners-1.0.2.tgz", - "integrity": "sha512-7WCQyiaNuUMhXh0x3cS/l4Fv34mjZTrXueOzVTfirE+2DD/8Y/BrtBbFV6tYZ0ALjUEulExEAW6ELqn4qSDQHg==" + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/@oceanprotocol/list-datapartners/-/list-datapartners-1.0.3.tgz", + "integrity": "sha512-MMyy81FvnRGwl2cQ4+cucq/YWjUTGzStHyAUVM6P2pFA8zMc3jouuWN2WSAjmvhxeKZU7jvJRwZCoi+miEYKjw==" }, "@oceanprotocol/react": { - "version": "0.3.16", - "resolved": "https://registry.npmjs.org/@oceanprotocol/react/-/react-0.3.16.tgz", - "integrity": "sha512-HzOlsI/LKxl01KkjNFEem7gwHWPquWcJ4o7cy8iBOIypTMOHt4bTtepobY5jP0RT04inHFuQDQYsYTDRdg8A1w==", + "version": "0.3.19", + "resolved": "https://registry.npmjs.org/@oceanprotocol/react/-/react-0.3.19.tgz", + "integrity": "sha512-9esHRLJlfCtGRA8PRuohiYoCitos2DgZjGxY+og5k4udwiqSHKzHV1fJexu9rGknKQls7o+QIt4I/79jpnqETw==", "requires": { - "@oceanprotocol/lib": "^0.9.9", + "@oceanprotocol/lib": "^0.9.12", "axios": "^0.21.0", "decimal.js": "^10.2.1", "web3": "^1.3.0", @@ -31796,9 +31796,9 @@ } }, "styled-components": { - "version": "5.2.0", - "resolved": "https://registry.npmjs.org/styled-components/-/styled-components-5.2.0.tgz", - "integrity": "sha512-9qE8Vgp8C5cpGAIdFaQVAl89Zgx1TDM4Yf4tlHbO9cPijtpSXTMLHy9lmP0lb+yImhgPFb1AmZ1qMUubmg3HLg==", + "version": "5.2.1", + "resolved": "https://registry.npmjs.org/styled-components/-/styled-components-5.2.1.tgz", + "integrity": "sha512-sBdgLWrCFTKtmZm/9x7jkIabjFNVzCUeKfoQsM6R3saImkUnjx0QYdLwJHBjY9ifEcmjDamJDVfknWm1yxZPxQ==", "requires": { "@babel/helper-module-imports": "^7.0.0", "@babel/traverse": "^7.4.5", diff --git a/package.json b/package.json index e33a262a2..80a253bfe 100644 --- a/package.json +++ b/package.json @@ -24,9 +24,9 @@ "@coingecko/cryptoformat": "^0.4.2", "@loadable/component": "^5.14.1", "@oceanprotocol/art": "^3.0.0", - "@oceanprotocol/lib": "^0.9.10", + "@oceanprotocol/lib": "^0.9.12", "@oceanprotocol/list-datapartners": "^1.0.3", - "@oceanprotocol/react": "^0.3.16", + "@oceanprotocol/react": "^0.3.19", "@oceanprotocol/typographies": "^0.1.0", "@sindresorhus/slugify": "^1.0.0", "@tippyjs/react": "^4.2.0", diff --git a/src/components/Layout.module.css b/src/components/Layout.module.css index aa335bda4..1e640ee14 100644 --- a/src/components/Layout.module.css +++ b/src/components/Layout.module.css @@ -25,7 +25,3 @@ /* sticky footer technique */ flex: 1; } - -.banner { - margin-bottom: -2rem !important; -} diff --git a/src/components/Layout.tsx b/src/components/Layout.tsx index 809d77c5e..7f2b4dbd8 100644 --- a/src/components/Layout.tsx +++ b/src/components/Layout.tsx @@ -1,4 +1,4 @@ -import React, { ReactNode, ReactElement } from 'react' +import React, { ReactNode, ReactElement, useEffect } from 'react' import Header from './organisms/Header' import Footer from './organisms/Footer' import PageHeader from './molecules/PageHeader' @@ -7,6 +7,8 @@ import Seo from './atoms/Seo' import Container from './atoms/Container' import Alert from './atoms/Alert' import { useSiteMetadata } from '../hooks/useSiteMetadata' +import { useAsset, useOcean } from '@oceanprotocol/react' +import { Logger } from '@oceanprotocol/lib' export interface LayoutProps { children: ReactNode @@ -26,6 +28,15 @@ export default function Layout({ headerCenter }: LayoutProps): ReactElement { const { warning } = useSiteMetadata() + const { isInPurgatory, purgatoryData } = useAsset() + const { + isInPurgatory: isAccountInPurgatory, + purgatoryData: accountPurgatory + } = useOcean() + + useEffect(() => { + Logger.log('isInPurgatory', isInPurgatory, purgatoryData) + }, [isInPurgatory, purgatoryData]) return (
@@ -37,6 +48,24 @@ export default function Layout({ )} + {isAccountInPurgatory && accountPurgatory && ( + + )} + + {isInPurgatory && purgatoryData && ( + + )} +
{title && !noPageHeader && ( diff --git a/src/components/atoms/Alert.module.css b/src/components/atoms/Alert.module.css index e5bf6a611..1a42a711e 100644 --- a/src/components/atoms/Alert.module.css +++ b/src/components/atoms/Alert.module.css @@ -26,10 +26,21 @@ color: inherit; } +.badge { + vertical-align: middle; + margin-left: calc(var(--spacer) / 8); + margin-top: -0.3rem; +} + .text { font-size: var(--font-size-small); } +.text a { + color: inherit; + text-decoration: underline; +} + .text p:last-child { margin-bottom: 0; } @@ -58,7 +69,7 @@ /* States */ .error { - border-color: var(--rbrand-alert-ed); + border-color: var(--brand-alert-red); color: var(--brand-alert-red); } diff --git a/src/components/atoms/Alert.tsx b/src/components/atoms/Alert.tsx index 5a91bb2b2..471a60381 100644 --- a/src/components/atoms/Alert.tsx +++ b/src/components/atoms/Alert.tsx @@ -3,11 +3,13 @@ import classNames from 'classnames/bind' import styles from './Alert.module.css' import Button from './Button' import Markdown from './Markdown' +import Badge from './Badge' const cx = classNames.bind(styles) export default function Alert({ title, + badge, text, state, action, @@ -15,6 +17,7 @@ export default function Alert({ className }: { title?: string + badge?: string text: string state: 'error' | 'warning' | 'info' | 'success' action?: { @@ -33,7 +36,11 @@ export default function Alert({ return (
- {title &&

{title}

} + {title && ( +

+ {title} {badge && } +

+ )} {action && (
)} - + {!isInPurgatory && }
diff --git a/src/components/organisms/AssetActions/Pool/index.tsx b/src/components/organisms/AssetActions/Pool/index.tsx index 376498bbd..9850949f4 100644 --- a/src/components/organisms/AssetActions/Pool/index.tsx +++ b/src/components/organisms/AssetActions/Pool/index.tsx @@ -1,5 +1,10 @@ import React, { ReactElement, useEffect, useState } from 'react' -import { useOcean, useMetadata, usePricing } from '@oceanprotocol/react' +import { + useOcean, + useMetadata, + usePricing, + useAsset +} from '@oceanprotocol/react' import { DDO, Logger } from '@oceanprotocol/lib' import styles from './index.module.css' import stylesActions from './Actions.module.css' @@ -47,6 +52,7 @@ export default function Pool({ ddo }: { ddo: DDO }): ReactElement { const { ocean, accountId, networkId } = useOcean() const { price, refreshPrice, owner } = useMetadata(ddo) const { dtSymbol } = usePricing(ddo) + const { isInPurgatory } = useAsset() const [poolTokens, setPoolTokens] = useState() const [totalPoolTokens, setTotalPoolTokens] = useState() @@ -57,6 +63,7 @@ export default function Pool({ ddo }: { ddo: DDO }): ReactElement { const [showAdd, setShowAdd] = useState(false) const [showRemove, setShowRemove] = useState(false) + const [isRemoveDisabled, setIsRemoveDisabled] = useState(false) const [hasAddedLiquidity, setHasAddedLiquidity] = useState(false) const [poolShare, setPoolShare] = useState() @@ -73,6 +80,10 @@ export default function Pool({ ddo }: { ddo: DDO }): ReactElement { // the purpose of the value is just to trigger the effect const [refreshPool, setRefreshPool] = useState(false) + useEffect(() => { + setIsRemoveDisabled(isInPurgatory && owner === accountId) + }, [isInPurgatory, owner, accountId]) + useEffect(() => { const poolShare = price?.ocean && @@ -291,15 +302,18 @@ export default function Pool({ ddo }: { ddo: DDO }): ReactElement { )}
- + {!isInPurgatory && ( + + )} - {hasAddedLiquidity && ( + {hasAddedLiquidity && !isRemoveDisabled && ( diff --git a/src/components/organisms/AssetContent/index.tsx b/src/components/organisms/AssetContent/index.tsx index 945017bcc..cd5ca4f8c 100644 --- a/src/components/organisms/AssetContent/index.tsx +++ b/src/components/organisms/AssetContent/index.tsx @@ -13,6 +13,7 @@ import { useMetadata, useOcean, usePricing } from '@oceanprotocol/react' import EtherscanLink from '../../atoms/EtherscanLink' import Bookmark from './Bookmark' import Byline from './Byline' +import Alert from '../../atoms/Alert' export interface AssetContentProps { metadata: MetadataMarket @@ -28,7 +29,6 @@ export default function AssetContent({ const { accountId, networkId } = useOcean() const { owner } = useMetadata(ddo) const { dtSymbol, dtName } = usePricing(ddo) - const isOwner = accountId === owner const hasNoPrice = ddo.price.datatoken === 0 && ddo.price.value === 0 const showPricing = isOwner && hasNoPrice @@ -37,7 +37,6 @@ export default function AssetContent({
{showPricing && } -

{metadata?.main.author} diff --git a/src/components/organisms/Footer.module.css b/src/components/organisms/Footer.module.css index f78180ac7..003519f30 100644 --- a/src/components/organisms/Footer.module.css +++ b/src/components/organisms/Footer.module.css @@ -5,7 +5,7 @@ } .content { - padding: calc(var(--spacer) / 2); + padding: var(--spacer) calc(var(--spacer) / 2); margin-left: auto; margin-right: auto; max-width: var(--layout-max-width); @@ -23,3 +23,7 @@ .content a:focus { color: var(--color-primary); } + +.copyright div { + display: inline-block; +} diff --git a/src/components/organisms/Footer.tsx b/src/components/organisms/Footer.tsx index 2ca574a3b..a98f5d7b4 100644 --- a/src/components/organisms/Footer.tsx +++ b/src/components/organisms/Footer.tsx @@ -14,10 +14,14 @@ export default function Footer(): ReactElement {

- © {year} —{' '} - Terms - {' — '} - Privacy + + +
+ © {year} —{' '} + Terms + {' — '} + Privacy +
) diff --git a/src/components/pages/Home.tsx b/src/components/pages/Home.tsx index 624cca720..a20fa6db0 100644 --- a/src/components/pages/Home.tsx +++ b/src/components/pages/Home.tsx @@ -16,28 +16,48 @@ import listPartners from '@oceanprotocol/list-datapartners' import Tooltip from '../atoms/Tooltip' import AssetQueryCarousel from '../organisms/AssetQueryCarousel' -const partnerAccounts = listPartners.map((partner) => - partner.accounts.join(',') -) +const partnerAccounts = listPartners + .map((partner) => partner.accounts.join(',')) + .filter((account) => account !== '') -const queryHighest = { - page: 1, - offset: 9, - query: { 'price.type': ['pool'] }, - sort: { 'price.ocean': -1 } -} +const searchAccounts = JSON.stringify(partnerAccounts) + .replace(/"/g, '') + .replace(/,/g, ' OR ') + .replace(/(\[|\])/g, '') const queryPartners = { page: 1, offset: 100, - query: { 'publicKey.owner': partnerAccounts }, + query: { + nativeSearch: 1, + query_string: { + query: `(publicKey.owner:${searchAccounts}) -isInPurgatory:true` + } + }, sort: { created: -1 } } +const queryHighest = { + page: 1, + offset: 9, + query: { + nativeSearch: 1, + query_string: { + query: `(price.type:pool) -isInPurgatory:true` + } + }, + sort: { 'price.ocean': -1 } +} + const queryLatest = { page: 1, offset: 9, - query: {}, + query: { + nativeSearch: 1, + query_string: { + query: `-isInPurgatory:true` + } + }, sort: { created: -1 } } @@ -92,21 +112,22 @@ export default function HomePage(): ReactElement { const [loading, setLoading] = useState(true) useEffect(() => { + // TODO: remove any once ocean.js has nativeSearch typings async function init() { const queryResultHighest = await getAssets( - queryHighest, + queryHighest as any, config.metadataCacheUri ) setQueryResultHighest(queryResultHighest) const queryResultPartners = await getAssets( - queryPartners, + queryPartners as any, config.metadataCacheUri ) setQueryResultPartners(queryResultPartners) const queryResultLatest = await getAssets( - queryLatest, + queryLatest as any, config.metadataCacheUri ) setQueryResultLatest(queryResultLatest) diff --git a/src/components/pages/Publish/index.tsx b/src/components/pages/Publish/index.tsx index 08c241302..9335ad7c2 100644 --- a/src/components/pages/Publish/index.tsx +++ b/src/components/pages/Publish/index.tsx @@ -1,6 +1,6 @@ import React, { ReactElement, useState } from 'react' import { Formik } from 'formik' -import { usePublish } from '@oceanprotocol/react' +import { usePublish, useOcean } from '@oceanprotocol/react' import styles from './index.module.css' import FormPublish from './FormPublish' import Web3Feedback from '../../molecules/Wallet/Feedback' @@ -25,7 +25,7 @@ export default function PublishPage({ }): ReactElement { const { debug } = useUserPreferences() const { publish, publishError, isLoading, publishStepText } = usePublish() - + const { isInPurgatory, purgatoryData } = useOcean() const [success, setSuccess] = useState() const [error, setError] = useState() const [ddo, setDdo] = useState() @@ -72,7 +72,7 @@ export default function PublishPage({ } } - return ( + return isInPurgatory && purgatoryData ? null : ( + return ( + + + + ) }