From c33a4e55745bac6dc98cfc7c2b99cf27bb334bf3 Mon Sep 17 00:00:00 2001
From: nabarun <nabarun@noreply.git.vdb.to>
Date: Wed, 12 Feb 2025 11:17:08 +0000
Subject: [PATCH] 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: https://git.vdb.to/cerc-io/snowballtools-base/pulls/53
---
 .../components/projects/create/Configure.tsx  | 20 +++++++++++--------
 1 file changed, 12 insertions(+), 8 deletions(-)

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 } }) => (
-                      <Input type="number" value={value} onChange={onChange} />
+                      <Input type="number" value={value} onChange={onChange} min={1} />
                     )}
                   />
                 </div>
@@ -611,7 +613,9 @@ const Configure = () => {
                     isLoading ||
                     isPaymentLoading ||
                     !selectedAccount ||
-                    !isBalanceSufficient
+                    !isBalanceSufficient ||
+                    amountToBePaid === '' ||
+                    selectedNumProviders === ''
                   }
                   rightIcon={
                     isLoading || isPaymentLoading ? (