From 421d5981e69a8fe46ae7f2fb5102dd507d8738ca Mon Sep 17 00:00:00 2001 From: Norbi <37236152+KatunaNorbert@users.noreply.github.com> Date: Mon, 13 Sep 2021 17:14:43 +0300 Subject: [PATCH] Fix issues consuming free assets (#834) * get order history based on ddo chainId * disabled consume when not connected to wallet, refetch orders on connect * disable create price button if not assetNetwork * get previous orders on order action --- src/components/atoms/Alert.tsx | 2 ++ .../organisms/AssetActions/Consume.tsx | 26 ++++++++++++------- .../organisms/AssetContent/Pricing/index.tsx | 3 +++ 3 files changed, 22 insertions(+), 9 deletions(-) diff --git a/src/components/atoms/Alert.tsx b/src/components/atoms/Alert.tsx index 471a60381..85ded0081 100644 --- a/src/components/atoms/Alert.tsx +++ b/src/components/atoms/Alert.tsx @@ -23,6 +23,7 @@ export default function Alert({ action?: { name: string style?: 'text' | 'primary' | 'ghost' + disabled?: boolean handleAction: (e: FormEvent) => void } onDismiss?: () => void @@ -48,6 +49,7 @@ export default function Alert({ size="small" style={action.style || 'primary'} onClick={action.handleAction} + disabled={action.disabled} > {action.name} diff --git a/src/components/organisms/AssetActions/Consume.tsx b/src/components/organisms/AssetActions/Consume.tsx index d83498cc8..473572112 100644 --- a/src/components/organisms/AssetActions/Consume.tsx +++ b/src/components/organisms/AssetActions/Consume.tsx @@ -5,7 +5,8 @@ import File from '../../atoms/File' import Price from '../../atoms/Price' import { useSiteMetadata } from '../../../hooks/useSiteMetadata' import { useAsset } from '../../../providers/Asset' -import { gql, useQuery } from 'urql' +import { gql } from 'urql' +import { fetchData, getQueryContext } from '../../../utils/subgraph' import { OrdersData } from '../../../@types/apollo/OrdersData' import BigNumber from 'bignumber.js' import { useOcean } from '../../../providers/Ocean' @@ -63,15 +64,19 @@ export default function Consume({ const [maxDt, setMaxDT] = useState(1) const [isConsumablePrice, setIsConsumablePrice] = useState(true) const [assetTimeout, setAssetTimeout] = useState('') - const [result] = useQuery({ - query: previousOrderQuery, - variables: { + const [data, setData] = useState() + + useEffect(() => { + if (!ddo || !accountId) return + const context = getQueryContext(ddo.chainId) + const variables = { id: ddo.dataToken?.toLowerCase(), account: accountId?.toLowerCase() } - // pollInterval: 5000 - }) - const { data } = result + fetchData(previousOrderQuery, variables, context).then((result: any) => { + setData(result.data) + }) + }, [ddo, accountId, hasPreviousOrder]) async function checkMaxAvaialableTokens(price: BestPrice) { if (!ocean || !price) return @@ -83,7 +88,8 @@ export default function Consume({ } useEffect(() => { - if (!data || !assetTimeout || data.tokenOrders.length === 0) return + if (!data || !assetTimeout || data.tokenOrders.length === 0 || !accountId) + return const lastOrder = data.tokenOrders[0] if (assetTimeout === '0') { @@ -99,7 +105,7 @@ export default function Consume({ setHasPreviousOrder(false) } } - }, [data, assetTimeout]) + }, [data, assetTimeout, accountId]) useEffect(() => { const { timeout } = ddo.findServiceByType('access').attributes.main @@ -120,6 +126,7 @@ export default function Consume({ }, [dtBalance]) useEffect(() => { + if (!accountId) return setIsDisabled( !isConsumable || ((!ocean || @@ -141,6 +148,7 @@ export default function Consume({ pricingIsLoading, isConsumablePrice, hasDatatoken, + accountId, isConsumable ]) diff --git a/src/components/organisms/AssetContent/Pricing/index.tsx b/src/components/organisms/AssetContent/Pricing/index.tsx index ee828d336..88363821d 100644 --- a/src/components/organisms/AssetContent/Pricing/index.tsx +++ b/src/components/organisms/AssetContent/Pricing/index.tsx @@ -10,6 +10,7 @@ import Feedback from './Feedback' import { graphql, useStaticQuery } from 'gatsby' import { usePricing } from '../../../../hooks/usePricing' import styles from './index.module.css' +import { useAsset } from '../../../../providers/Asset' const query = graphql` query PricingQuery { @@ -67,6 +68,7 @@ export default function Pricing({ ddo }: { ddo: DDO }): ReactElement { const { createPricing, pricingIsLoading, pricingError, pricingStepText } = usePricing() + const { isAssetNetwork } = useAsset() const hasFeedback = pricingIsLoading || typeof success !== 'undefined' @@ -133,6 +135,7 @@ export default function Pricing({ ddo }: { ddo: DDO }): ReactElement { text={content.empty.info} action={{ name: content.empty.action.name, + disabled: !isAssetNetwork, handleAction: handleShowPricingForm }} />