diff --git a/centrifuge-app/src/pages/Loan/ExternalFinanceForm.tsx b/centrifuge-app/src/pages/Loan/ExternalFinanceForm.tsx index 6602c362db..a32b57f781 100644 --- a/centrifuge-app/src/pages/Loan/ExternalFinanceForm.tsx +++ b/centrifuge-app/src/pages/Loan/ExternalFinanceForm.tsx @@ -1,6 +1,6 @@ import { CurrencyBalance, ExternalLoan, Pool, Price, WithdrawAddress } from '@centrifuge/centrifuge-js' import { useCentrifugeTransaction } from '@centrifuge/centrifuge-react' -import { Box, Button, Card, CurrencyInput_DEPRECATED, Shelf, Stack, Text } from '@centrifuge/fabric' +import { Box, Button, Card, CurrencyInput, Shelf, Stack, Text } from '@centrifuge/fabric' import Decimal from 'decimal.js-light' import { Field, FieldProps, Form, FormikProvider, useFormik, useFormikContext } from 'formik' import * as React from 'react' @@ -128,13 +128,11 @@ export function ExternalFinanceFields({ {({ field, meta, form }: FieldProps) => { return ( - form.setFieldValue('faceValue', value)} currency={pool.currency.symbol} /> @@ -160,15 +158,13 @@ export function ExternalFinanceFields({ > {({ field, meta, form }: FieldProps) => { return ( - form.setFieldValue('price', value)} - placeholder="0.0" - precision={6} + decimals={8} /> ) }} diff --git a/centrifuge-app/src/pages/Loan/ExternalRepayForm.tsx b/centrifuge-app/src/pages/Loan/ExternalRepayForm.tsx index 46aaa103ab..c9482a3e5e 100644 --- a/centrifuge-app/src/pages/Loan/ExternalRepayForm.tsx +++ b/centrifuge-app/src/pages/Loan/ExternalRepayForm.tsx @@ -1,6 +1,6 @@ import { CurrencyBalance, ExternalLoan, findBalance, Price } from '@centrifuge/centrifuge-js' import { roundDown, useBalances, useCentrifugeTransaction } from '@centrifuge/centrifuge-react' -import { Box, Button, Card, CurrencyInput_DEPRECATED, Shelf, Stack, Text } from '@centrifuge/fabric' +import { Box, Button, Card, CurrencyInput, Shelf, Stack, Text } from '@centrifuge/fabric' import BN from 'bn.js' import Decimal from 'decimal.js-light' import { Field, FieldProps, Form, FormikProvider, useFormik } from 'formik' @@ -92,14 +92,12 @@ export function ExternalRepayForm({ loan }: { loan: ExternalLoan }) { {({ field, meta, form }: FieldProps) => { return ( - form.setFieldValue('faceValue', value)} currency={pool.currency.symbol} /> @@ -130,16 +128,14 @@ export function ExternalRepayForm({ loan }: { loan: ExternalLoan }) { > {({ field, meta, form }: FieldProps) => { return ( - form.setFieldValue('price', value)} - placeholder="0.0" - precision={6} + decimals={8} /> ) }} diff --git a/centrifuge-app/src/pages/Loan/FinanceForm.tsx b/centrifuge-app/src/pages/Loan/FinanceForm.tsx index 8209f0efd7..663983bfec 100644 --- a/centrifuge-app/src/pages/Loan/FinanceForm.tsx +++ b/centrifuge-app/src/pages/Loan/FinanceForm.tsx @@ -6,16 +6,7 @@ import { useCentrifugeUtils, useGetNetworkName, } from '@centrifuge/centrifuge-react' -import { - Button, - Card, - CurrencyInput_DEPRECATED, - InlineFeedback, - Select_DEPRECATED, - Shelf, - Stack, - Text, -} from '@centrifuge/fabric' +import { Button, Card, CurrencyInput, InlineFeedback, Select, Shelf, Stack, Text } from '@centrifuge/fabric' import Decimal from 'decimal.js-light' import { Field, FieldProps, Form, FormikProvider, useField, useFormik, useFormikContext } from 'formik' import * as React from 'react' @@ -122,7 +113,7 @@ function InternalFinanceForm({ loan }: { loan: LoanType }) { > {({ field, meta, form }: FieldProps) => { return ( - helpers.setValue(JSON.parse(event.target.value))} diff --git a/centrifuge-app/src/pages/Loan/OraclePriceForm.tsx b/centrifuge-app/src/pages/Loan/OraclePriceForm.tsx index 542215aa18..f250d0245f 100644 --- a/centrifuge-app/src/pages/Loan/OraclePriceForm.tsx +++ b/centrifuge-app/src/pages/Loan/OraclePriceForm.tsx @@ -1,6 +1,6 @@ import { CurrencyBalance, Loan as LoanType, Price } from '@centrifuge/centrifuge-js' import { useAddress, useCentrifugeTransaction } from '@centrifuge/centrifuge-react' -import { Box, Button, Card, CurrencyInput_DEPRECATED, Flex, IconArrowDown, Stack, Text } from '@centrifuge/fabric' +import { Box, Button, Card, CurrencyInput, Flex, IconArrowDown, Stack, Text } from '@centrifuge/fabric' import Decimal from 'decimal.js-light' import { Field, FieldProps, Form, FormikProvider, useFormik } from 'formik' import * as React from 'react' @@ -86,12 +86,11 @@ export function OraclePriceForm({ {({ field }: FieldProps) => { return ( - ) @@ -103,15 +102,14 @@ export function OraclePriceForm({ {({ field, meta, form }: FieldProps) => { return ( - form.setFieldValue('newPrice', value)} - precision={6} + decimals={8} /> ) }} diff --git a/centrifuge-app/src/pages/Loan/RepayForm.tsx b/centrifuge-app/src/pages/Loan/RepayForm.tsx index 1abdb610bb..d67d860390 100644 --- a/centrifuge-app/src/pages/Loan/RepayForm.tsx +++ b/centrifuge-app/src/pages/Loan/RepayForm.tsx @@ -1,6 +1,6 @@ import { ActiveLoan, CurrencyBalance, findBalance } from '@centrifuge/centrifuge-js' import { useBalances, useCentrifugeTransaction } from '@centrifuge/centrifuge-react' -import { Button, Card, CurrencyInput_DEPRECATED, InlineFeedback, Shelf, Stack, Text } from '@centrifuge/fabric' +import { Button, Card, CurrencyInput, InlineFeedback, Shelf, Stack, Text } from '@centrifuge/fabric' import BN from 'bn.js' import Decimal from 'decimal.js-light' import { Field, FieldProps, Form, FormikProvider, useFormik } from 'formik' @@ -110,7 +110,7 @@ function InternalRepayForm({ loan }: { loan: ActiveLoan }) { > {({ field, meta, form }: FieldProps) => { return ( - {({ field, meta, form }: FieldProps) => ( - { @@ -171,10 +171,10 @@ export function TransferDebtForm({ loan }: { loan: LoanType }) { ) : ( - validate(Dec(val))}> + validate(Dec(val || 0))}> {({ field, meta, form }: FieldProps) => { return ( - (val?: any) => { return getError('Value must be equal to or larger than 1', err, val) } - const regex = new RegExp(/^\d{1,3}(?:\.\d{1,6})?$/) - return regex.test(val) ? '' : getError('Value must be in the format of (1-3).(0-6) digits', err, val) + const regex = new RegExp(/^\d{1,3}(?:\.\d{1,8})?$/) + return regex.test(val) ? '' : getError('Value must be in the format of (1-3).(0-8) digits', err, val) } export const maxPriceVariance = (pricing: ExternalPricingInfo, err?: CustomError) => (val?: any) => { diff --git a/fabric/src/components/CurrencyInput/CurrencyInput.stories.tsx b/fabric/src/components/CurrencyInput/CurrencyInput.stories.tsx index 5e27c93b17..1ee7842ac5 100644 --- a/fabric/src/components/CurrencyInput/CurrencyInput.stories.tsx +++ b/fabric/src/components/CurrencyInput/CurrencyInput.stories.tsx @@ -21,7 +21,6 @@ Default.args = { errorMessage: '', disabled: false, currency: 'kUSD', - value: 123456.0, onChange: () => {}, onSetMax: () => {}, } diff --git a/fabric/src/components/CurrencyInput/index.tsx b/fabric/src/components/CurrencyInput/index.tsx index 9d19d69e69..2d1b01b995 100644 --- a/fabric/src/components/CurrencyInput/index.tsx +++ b/fabric/src/components/CurrencyInput/index.tsx @@ -152,7 +152,7 @@ export function CurrencyInput({ currency, onSetMax, placeholder = '0.0', - decimals = 6, + decimals = 8, onChange, onBlur, ...inputProps