diff --git a/packages/frontend/src/components/projects/create/Configure.tsx b/packages/frontend/src/components/projects/create/Configure.tsx index 635798c1..4c421efb 100644 --- a/packages/frontend/src/components/projects/create/Configure.tsx +++ b/packages/frontend/src/components/projects/create/Configure.tsx @@ -33,7 +33,7 @@ import CheckBalanceIframe from './CheckBalanceIframe'; type ConfigureDeploymentFormValues = { option: string; lrn?: string; - numProviders?: number; + numProviders?: string; maxPrice?: string; }; @@ -77,13 +77,13 @@ const Configure = () => { option: 'Auction', maxPrice: DEFAULT_MAX_PRICE, lrn: '', - numProviders: 1, + numProviders: '1', variables: [], }, }); const selectedOption = methods.watch('option'); - const selectedNumProviders = methods.watch('numProviders') ?? 1; + const selectedNumProviders = methods.watch('numProviders') ?? '1'; const selectedMaxPrice = methods.watch('maxPrice') ?? DEFAULT_MAX_PRICE; const isTabletView = useMediaQuery('(min-width: 720px)'); // md: @@ -93,16 +93,17 @@ const Configure = () => { let amount: string; if (selectedOption === 'LRN') { - amount = selectedDeployer?.minimumPayment?.toString() ?? '0'; + amount = selectedDeployer?.minimumPayment?.replace(/\D/g, '') ?? '0'; } else { - if (!selectedNumProviders) { + if (!selectedNumProviders || !selectedMaxPrice) { return ''; } + const bigMaxPrice = BigNumber.from(selectedMaxPrice); amount = bigMaxPrice.mul(selectedNumProviders).toString(); } - return amount.replace(/\D/g, ''); + return amount; }, [ selectedOption, selectedDeployer?.minimumPayment, @@ -557,6 +558,7 @@ const Configure = () => { type="number" value={value} onChange={(e) => onChange(e)} + min={1} /> )} /> @@ -570,7 +572,7 @@ const Configure = () => { control={methods.control} rules={{ required: true }} render={({ field: { value, onChange } }) => ( - + )} /> @@ -611,7 +613,9 @@ const Configure = () => { isLoading || isPaymentLoading || !selectedAccount || - !isBalanceSufficient + !isBalanceSufficient || + amountToBePaid === '' || + selectedNumProviders === '' } rightIcon={ isLoading || isPaymentLoading ? (