diff --git a/src/components/organisms/AssetActions/Compute.module.css b/src/components/organisms/AssetActions/Compute.module.css index 47987d596..9aa24ed30 100644 --- a/src/components/organisms/AssetActions/Compute.module.css +++ b/src/components/organisms/AssetActions/Compute.module.css @@ -24,7 +24,5 @@ } .hasTokens { - font-size: var(--font-size-small); - color: var(--color-secondary); - margin-top: calc(var(--spacer) / 4); + composes: hasTokens from './index.module.css'; } diff --git a/src/components/organisms/AssetActions/Compute.tsx b/src/components/organisms/AssetActions/Compute.tsx index 85045d6d6..3e3ffcea6 100644 --- a/src/components/organisms/AssetActions/Compute.tsx +++ b/src/components/organisms/AssetActions/Compute.tsx @@ -110,8 +110,8 @@ export default function Compute({ {hasDatatoken && (
- You own {dtBalance} {dtSymbol} so you can use this asset without - paying again. + You own {dtBalance} {dtSymbol} allowing you to use this data set + without paying again.
)} @@ -135,7 +135,7 @@ export default function Compute({ onClick={() => startJob()} disabled={isComputeButtonDisabled} > - Start job + {hasDatatoken ? 'Start job' : 'Buy'} diff --git a/src/components/organisms/AssetActions/Consume.module.css b/src/components/organisms/AssetActions/Consume.module.css index bf99d0d80..98bb43b6f 100644 --- a/src/components/organisms/AssetActions/Consume.module.css +++ b/src/components/organisms/AssetActions/Consume.module.css @@ -18,7 +18,5 @@ } .hasTokens { - font-size: var(--font-size-small); - color: var(--color-secondary); - margin-top: calc(var(--spacer) / 4); + composes: hasTokens from './index.module.css'; } diff --git a/src/components/organisms/AssetActions/Consume.tsx b/src/components/organisms/AssetActions/Consume.tsx index 6119e2cfb..9947d0b9c 100644 --- a/src/components/organisms/AssetActions/Consume.tsx +++ b/src/components/organisms/AssetActions/Consume.tsx @@ -33,7 +33,10 @@ export default function Consume({ const { consumeStepText, consume, consumeError } = useConsume() const isDisabled = - !ocean || !isBalanceSufficient || consumeStepText || pricingIsLoading + !ocean || + !isBalanceSufficient || + typeof consumeStepText !== 'undefined' || + pricingIsLoading const hasDatatoken = Number(dtBalance) >= 1 async function handleConsume() { @@ -69,8 +72,8 @@ export default function Consume({ {hasDatatoken && (
- You own {dtBalance} {dtSymbol} so you can use this asset without - paying again. + You own {dtBalance} {dtSymbol} allowing you to use this data set + without paying again.
)} diff --git a/src/components/organisms/AssetActions/index.module.css b/src/components/organisms/AssetActions/index.module.css index 343af92ec..b841e2570 100644 --- a/src/components/organisms/AssetActions/index.module.css +++ b/src/components/organisms/AssetActions/index.module.css @@ -4,3 +4,9 @@ margin: auto; padding: 0; } + +.hasTokens { + font-size: var(--font-size-mini); + color: var(--color-secondary); + margin-top: calc(var(--spacer) / 12); +}