Fix form input for creating project in auction flow (#53)

Part of https://www.notion.so/Simplify-login-flow-in-deploy-laconic-com-190a6b22d47280a9924cc38f8cf4c891

Co-authored-by: IshaVenikar <ishavenikar7@gmail.com>
Reviewed-on: cerc-io/snowballtools-base#53
This commit is contained in:
nabarun 2025-02-12 11:17:08 +00:00
parent 6c79ed37fa
commit c33a4e5574

View File

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