From 795ba0c01b17a60ef5502feb875b47aa5f82afc9 Mon Sep 17 00:00:00 2001 From: Soon Huat Date: Wed, 30 Mar 2022 22:44:10 +0800 Subject: [PATCH 1/2] c2d show price with fee, exclude provider fee --- .../Compute/FormComputeDataset.tsx | 21 +++++++-- .../Asset/AssetActions/Compute/index.tsx | 46 +++++++++++++++++-- 2 files changed, 59 insertions(+), 8 deletions(-) diff --git a/src/components/Asset/AssetActions/Compute/FormComputeDataset.tsx b/src/components/Asset/AssetActions/Compute/FormComputeDataset.tsx index d11fd09de..4919e633f 100644 --- a/src/components/Asset/AssetActions/Compute/FormComputeDataset.tsx +++ b/src/components/Asset/AssetActions/Compute/FormComputeDataset.tsx @@ -10,7 +10,7 @@ import { useAsset } from '@context/Asset' import { useWeb3 } from '@context/Web3' import content from '../../../../../content/pages/startComputeDataset.json' import { Asset } from '@oceanprotocol/lib' -import { AccessDetails } from 'src/@types/Price' +import { AccessDetails, OrderPriceAndFees } from 'src/@types/Price' import { getAccessDetailsForAssets, getAccessDetails @@ -40,7 +40,9 @@ export default function FormStartCompute({ selectedComputeAssetTimeout, stepText, isConsumable, - consumableFeedback + consumableFeedback, + datasetOrderPriceAndFees, + algoOrderPriceAndFees }: { algorithms: AssetSelectionAsset[] ddoListAlgorithms: Asset[] @@ -65,6 +67,8 @@ export default function FormStartCompute({ stepText: string isConsumable: boolean consumableFeedback: string + datasetOrderPriceAndFees?: OrderPriceAndFees + algoOrderPriceAndFees?: OrderPriceAndFees }): ReactElement { const { isValid, values }: FormikContextType<{ algorithm: string }> = useFormikContext() @@ -107,11 +111,16 @@ export default function FormStartCompute({ if (!asset?.accessDetails || !selectedAlgorithmAsset?.accessDetails) return const priceDataset = - hasPreviousOrder || hasDatatoken ? 0 : Number(asset.accessDetails.price) + hasPreviousOrder || hasDatatoken + ? 0 + : Number(datasetOrderPriceAndFees?.price || asset.accessDetails.price) const priceAlgo = hasPreviousOrderSelectedComputeAsset || hasDatatokenSelectedComputeAsset ? 0 - : Number(selectedAlgorithmAsset?.accessDetails.price) + : Number( + algoOrderPriceAndFees?.price || + selectedAlgorithmAsset?.accessDetails.price + ) setTotalPrice((priceDataset + priceAlgo).toString()) }, [ @@ -120,7 +129,9 @@ export default function FormStartCompute({ hasPreviousOrder, hasDatatoken, hasPreviousOrderSelectedComputeAsset, - hasDatatokenSelectedComputeAsset + hasDatatokenSelectedComputeAsset, + datasetOrderPriceAndFees, + algoOrderPriceAndFees ]) useEffect(() => { diff --git a/src/components/Asset/AssetActions/Compute/index.tsx b/src/components/Asset/AssetActions/Compute/index.tsx index f8b0a77a8..210ec0df5 100644 --- a/src/components/Asset/AssetActions/Compute/index.tsx +++ b/src/components/Asset/AssetActions/Compute/index.tsx @@ -83,13 +83,17 @@ export default function Compute({ const [isConsumablePrice, setIsConsumablePrice] = useState(true) const [isAlgoConsumablePrice, setIsAlgoConsumablePrice] = useState(true) const [computeStatusText, setComputeStatusText] = useState('') + const [datasetOrderPriceAndFees, setDatasetOrderPriceAndFees] = + useState() + const [algoOrderPriceAndFees, setAlgoOrderPriceAndFees] = + useState() const isComputeButtonDisabled = isJobStarting === true || file === null || (!validOrderTx && !hasDatatoken && !isConsumablePrice) || (!validAlgorithmOrderTx && !hasAlgoAssetDatatoken && !isAlgoConsumablePrice) - async function checkAssetDTBalance(asset: DDO) { + async function checkAssetDTBalance(asset: DDO): Promise { if (!asset?.services[0].datatokenAddress) return const datatokenInstance = new Datatoken(web3) const dtBalance = await datatokenInstance.balance( @@ -97,7 +101,9 @@ export default function Compute({ accountId ) setAlgorithmDTBalance(new Decimal(dtBalance).toString()) - setHasAlgoAssetDatatoken(Number(dtBalance) >= 1) + const hasAlgoDt = Number(dtBalance) >= 1 + setHasAlgoAssetDatatoken(hasAlgoDt) + return hasAlgoDt } useEffect(() => { @@ -106,16 +112,48 @@ export default function Compute({ setIsConsumablePrice(asset?.accessDetails?.isPurchasable) setIsOwned(asset?.accessDetails?.isOwned) setValidOrderTx(asset?.accessDetails?.validOrderTx) + + async function initDatasetPriceAndFees() { + if ( + asset?.accessDetails?.addressOrId === ZERO_ADDRESS || + asset?.accessDetails?.type === 'free' + ) + return + const orderPriceAndFees = await getOrderPriceAndFees(asset, accountId) + setDatasetOrderPriceAndFees(orderPriceAndFees) + } + + initDatasetPriceAndFees() }, [asset?.accessDetails]) useEffect(() => { if (!selectedAlgorithmAsset?.accessDetails || !accountId) return - checkAssetDTBalance(selectedAlgorithmAsset) + setIsConsumablePrice(selectedAlgorithmAsset?.accessDetails?.isPurchasable) setIsAlgorithmOwned(selectedAlgorithmAsset?.accessDetails?.isOwned) setValidAlgorithmOrderTx( selectedAlgorithmAsset?.accessDetails?.validOrderTx ) + + async function initAlgoPriceAndFees() { + if ( + selectedAlgorithmAsset?.accessDetails?.addressOrId === ZERO_ADDRESS || + selectedAlgorithmAsset?.accessDetails?.type === 'free' + ) + return + const orderPriceAndFees = await getOrderPriceAndFees( + selectedAlgorithmAsset, + accountId + ) + setAlgoOrderPriceAndFees(orderPriceAndFees) + } + + async function initSelectedAlgo() { + const hasAlgoDt = await checkAssetDTBalance(selectedAlgorithmAsset) + !hasAlgoDt && (await initAlgoPriceAndFees()) + } + + initSelectedAlgo() }, [selectedAlgorithmAsset]) useEffect(() => { @@ -436,6 +474,8 @@ export default function Compute({ stepText={computeStatusText} isConsumable={isConsumable} consumableFeedback={consumableFeedback} + datasetOrderPriceAndFees={datasetOrderPriceAndFees} + algoOrderPriceAndFees={algoOrderPriceAndFees} /> )} From 31167856fc2b16caede4ca1ccf221d9babd3fb79 Mon Sep 17 00:00:00 2001 From: Soon Huat Date: Thu, 31 Mar 2022 23:55:22 +0800 Subject: [PATCH 2/2] include loading when calculating data + algo price, tooltip show order price --- .../Compute/FormComputeDataset.tsx | 15 +++++++++++++++ .../Asset/AssetActions/Compute/PriceOutput.tsx | 16 +++++++++++++--- .../Asset/AssetActions/Compute/index.tsx | 18 +++++++++++++++++- 3 files changed, 45 insertions(+), 4 deletions(-) diff --git a/src/components/Asset/AssetActions/Compute/FormComputeDataset.tsx b/src/components/Asset/AssetActions/Compute/FormComputeDataset.tsx index 4919e633f..e991f02bb 100644 --- a/src/components/Asset/AssetActions/Compute/FormComputeDataset.tsx +++ b/src/components/Asset/AssetActions/Compute/FormComputeDataset.tsx @@ -74,6 +74,12 @@ export default function FormStartCompute({ useFormikContext() const { asset, isAssetNetwork } = useAsset() const [totalPrice, setTotalPrice] = useState(asset?.accessDetails?.price) + const [datasetOrderPrice, setDatasetOrderPrice] = useState( + asset?.accessDetails?.price + ) + const [algoOrderPrice, setAlgoOrderPrice] = useState( + selectedAlgorithmAsset?.accessDetails?.price + ) const [isBalanceSufficient, setIsBalanceSufficient] = useState(false) const { accountId, balance } = useWeb3() @@ -110,6 +116,13 @@ export default function FormStartCompute({ useEffect(() => { if (!asset?.accessDetails || !selectedAlgorithmAsset?.accessDetails) return + setDatasetOrderPrice( + datasetOrderPriceAndFees?.price || asset.accessDetails.price + ) + setAlgoOrderPrice( + algoOrderPriceAndFees?.price || + selectedAlgorithmAsset?.accessDetails.price + ) const priceDataset = hasPreviousOrder || hasDatatoken ? 0 @@ -164,6 +177,8 @@ export default function FormStartCompute({ algorithmConsumeDetails={selectedAlgorithmAsset?.accessDetails} symbol={oceanSymbol} totalPrice={Number.parseFloat(totalPrice)} + datasetOrderPrice={datasetOrderPrice} + algoOrderPrice={algoOrderPrice} /> () + const [isRequestingDataseOrderPrice, setIsRequestingDataseOrderPrice] = + useState(false) const [algoOrderPriceAndFees, setAlgoOrderPriceAndFees] = useState() + const [isRequestingAlgoOrderPrice, setIsRequestingAlgoOrderPrice] = + useState(false) const isComputeButtonDisabled = isJobStarting === true || file === null || @@ -119,8 +123,12 @@ export default function Compute({ asset?.accessDetails?.type === 'free' ) return + + setIsRequestingDataseOrderPrice(true) + setComputeStatusText('Calculating price including fees.') const orderPriceAndFees = await getOrderPriceAndFees(asset, accountId) setDatasetOrderPriceAndFees(orderPriceAndFees) + setIsRequestingDataseOrderPrice(false) } initDatasetPriceAndFees() @@ -141,11 +149,15 @@ export default function Compute({ selectedAlgorithmAsset?.accessDetails?.type === 'free' ) return + + setIsRequestingAlgoOrderPrice(true) + setComputeStatusText('Calculating price including fees.') const orderPriceAndFees = await getOrderPriceAndFees( selectedAlgorithmAsset, accountId ) setAlgoOrderPriceAndFees(orderPriceAndFees) + setIsRequestingAlgoOrderPrice(false) } async function initSelectedAlgo() { @@ -444,7 +456,11 @@ export default function Compute({ ddoListAlgorithms={ddoAlgorithmList} selectedAlgorithmAsset={selectedAlgorithmAsset} setSelectedAlgorithm={setSelectedAlgorithmAsset} - isLoading={isJobStarting} + isLoading={ + isJobStarting || + isRequestingDataseOrderPrice || + isRequestingAlgoOrderPrice + } isComputeButtonDisabled={isComputeButtonDisabled} hasPreviousOrder={validOrderTx !== undefined} hasDatatoken={hasDatatoken}