diff --git a/src/components/molecules/FormFields/Datatoken/index.module.css b/src/components/molecules/FormFields/Datatoken/index.module.css index e69de29bb..c7a28ce38 100644 --- a/src/components/molecules/FormFields/Datatoken/index.module.css +++ b/src/components/molecules/FormFields/Datatoken/index.module.css @@ -0,0 +1,5 @@ +.datatoken { + border: 1px solid var(--brand-grey-lighter); + padding: calc(var(--spacer) / 3); + border-radius: var(--border-radius); +} diff --git a/src/components/pages/Publish/Feedback.tsx b/src/components/pages/Publish/Feedback.tsx index 99537a276..84e68bc2b 100644 --- a/src/components/pages/Publish/Feedback.tsx +++ b/src/components/pages/Publish/Feedback.tsx @@ -5,18 +5,21 @@ import React, { ReactElement } from 'react' import styles from './Feedback.module.css' import SuccessConfetti from '../../atoms/SuccessConfetti' import { DDO } from '@oceanprotocol/lib' +import Pricing from './Pricing' export default function Feedback({ error, success, ddo, publishStepText, + isPricing, setError }: { error: string success: string ddo: DDO publishStepText: string + isPricing: boolean setError: (error: string) => void }): ReactElement { const SuccessAction = () => ( @@ -46,6 +49,8 @@ export default function Feedback({ Try Again + ) : isPricing ? ( + ) : success ? ( } /> ) : ( diff --git a/src/components/pages/Publish/Pricing.tsx b/src/components/pages/Publish/Pricing.tsx index de4509e99..087c0c20a 100644 --- a/src/components/pages/Publish/Pricing.tsx +++ b/src/components/pages/Publish/Pricing.tsx @@ -1,21 +1,20 @@ import React, { ReactElement } from 'react' import { Field, FieldInputProps, Formik } from 'formik' import Input from '../../atoms/Input' -import { initialValues, validationSchema } from 'models/FormPricing' +import { initialValues, validationSchema } from '../../../models/FormPricing' import { DDO } from '@oceanprotocol/lib' import { usePricing } from '@oceanprotocol/react' import { PriceOptionsMarket } from '../../../@types/MetaData' +import ddoFixture from '../../../../tests/unit/__fixtures__/ddo' export default function Pricing({ ddo }: { ddo: DDO }): ReactElement { - const { createPricing } = usePricing(ddo) + const { createPricing } = usePricing(ddoFixture) async function handleCreatePricing(values: Partial) { const priceOptions = { - price: values.price, - tokensToMint: values.tokensToMint, - type: values.type, - weightOnDataToken: values.weightOnDataToken, - swapFee: values.swapFee + ...values, + // swapFee is tricky: to get 0.1% you need to send 0.001 as value + swapFee: `${values.swapFee / 100}` } const tx = await createPricing(priceOptions) } diff --git a/src/components/pages/Publish/index.tsx b/src/components/pages/Publish/index.tsx index 13edeb945..d744ce0c1 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, usePricing } from '@oceanprotocol/react' import styles from './index.module.css' import PublishForm from './PublishForm' import Web3Feedback from '../../molecules/Wallet/Feedback' @@ -27,6 +27,7 @@ export default function PublishPage({ const [success, setSuccess] = useState() const [error, setError] = useState() + const [isPricing, setIsPricing] = useState() const [ddo, setDdo] = useState() const hasFeedback = isLoading || error || success @@ -59,12 +60,16 @@ export default function PublishPage({ return } + if (!ddo) return + // Publish succeeded - if (ddo) { - setDdo(ddo) - setSuccess('🎉 Successfully published your data set. 🎉') - resetForm() - } + setDdo(ddo) + resetForm() + + // Create pricing + setIsPricing(true) + + // setSuccess('🎉 Successfully published your data set. 🎉') } catch (error) { setError(error.message) Logger.error(error.message) @@ -94,6 +99,7 @@ export default function PublishPage({ success={success} publishStepText={publishStepText} ddo={ddo} + isPricing={isPricing} setError={setError} /> ) : (