Verify transaction after payment

packages/backend/src/schema.gql

@@ -265,7 +265,7 @@ type Query {
   domains(projectId: String!, filter: FilterDomainsInput): [Domain]
   deployers: [Deployer]
   address: String!
-  verifyTx(txhash: String!, amount: String!, senderAddress: String!): Boolean!
+  verifyTx(txHash: String!, amount: String!, senderAddress: String!): Boolean!
 }
 
 type Mutation {

packages/backend/src/service.ts

@@ -1406,8 +1406,8 @@ export class Service {
     return this.laconicRegistry.getAddress();
   }
 
-  async verifyTx(txhash: string, amountSent: string, senderAddress: string): Promise<boolean> {
-    const txResponse = await this.laconicRegistry.getTxResponse(txhash);
+  async verifyTx(txHash: string, amountSent: string, senderAddress: string): Promise<boolean> {
+    const txResponse = await this.laconicRegistry.getTxResponse(txHash);
     if (!txResponse) {
       log('Transaction response not found');
       return false;

packages/frontend/src/components/projects/create/Configure.tsx

@@ -56,7 +56,12 @@ const Configure = () => {
   const client = useGQLClient();
 
   const methods = useForm<ConfigureFormValues>({
-    defaultValues: { option: 'Auction' },
+    defaultValues: {
+      option: 'Auction',
+      maxPrice: '0',
+      lrn: '',
+      numProviders: 0,
+    },
   });
 
   const selectedOption = methods.watch('option');
@@ -68,7 +73,7 @@ const Configure = () => {
     data: FieldValues,
     envVariables: AddEnvironmentVariableInput[],
     senderAddress: string,
-    txHash: string
+    txHash: string,
   ): Promise<string> => {
     setIsLoading(true);
     let projectId: string | null = null;
@@ -94,7 +99,7 @@ const Configure = () => {
           name,
           isPrivate,
           paymentAddress: senderAddress,
-          txHash
+          txHash,
         };
 
         const { addProjectFromTemplate } = await client.addProjectFromTemplate(
@@ -115,7 +120,7 @@ const Configure = () => {
             repository: fullName!,
             template: 'webapp',
             paymentAddress: senderAddress,
-            txHash
+            txHash,
           },
           lrn,
           auctionParams,
@@ -166,7 +171,7 @@ const Configure = () => {
         createFormData,
         environmentVariables,
         senderAddress,
-        txHash
+        txHash,
       );
 
       await client.getEnvironmentVariables(projectId);
@@ -305,7 +310,11 @@ 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={(e) => onChange(e)}
+                      />
                     )}
                   />
                 </div>
@@ -350,7 +359,7 @@ const Configure = () => {
             </div>
           </form>
         </FormProvider>
-      <ConnectWallet/>
+        <ConnectWallet numProviders={methods.watch('numProviders') || 0} />
       </div>
     </div>
   );

packages/frontend/src/components/projects/create/ConnectWallet.tsx

@@ -1,39 +1,46 @@
+import { useMemo, useState, useCallback } from 'react';
+import { Select, Option } from '@snowballtools/material-tailwind-react-fork';
 import { Button } from '../../shared/Button';
 import { useWalletConnectClient } from 'context/WalletConnectContext';
-import { Select, Option } from '@snowballtools/material-tailwind-react-fork';
 import { useGQLClient } from 'context/GQLClientContext';
-import { useCallback, useEffect, useState } from 'react';
 
-const TEST_AMOUNT = "10000"
-
-const ConnectWallet = () => {
+const ConnectWallet = ({ numProviders }: { numProviders: number }) => {
   const { onConnect, accounts, signClient, session } = useWalletConnectClient();
   const client = useGQLClient();
 
-  const [selectedAccount, setSelectedAccount] = useState<{
-    address: string;
-    balance?: string;
-  }>();
-  const [txHash, setTxHash] = useState<string>();
-  const [snowballAddress, setSnowballAddress] = useState<string>();
+  const [selectedAccount, setSelectedAccount] = useState<string>();
+  const [isTxValid, setIsTxValid] = useState<boolean>(false);
+
+  const amount = useMemo(() => numProviders * 10000, [numProviders]);
 
   const handleConnect = async () => {
     await onConnect();
   };
 
+  const verifyTx = async (
+    senderAddress: string,
+    txHash: string,
+  ): Promise<boolean> => {
+    const isValid = await client.verifyTx(
+      txHash,
+      `${amount.toString()}alnt`,
+      senderAddress,
+    );
+    return isValid;
+  };
+
   const cosmosSendTokensHandler = useCallback(
-    async (senderAddress: string, amount: string) => {
-      if (!signClient || !session || !selectedAccount || !snowballAddress) {
-        console.log({signClient, session, selectedAccount})
+    async (selectedAccount: string) => {
+      if (!signClient || !session || !selectedAccount) {
         return;
       }
 
-      const chainId = selectedAccount.address.split(':')[1];
+      const chainId = selectedAccount.split(':')[1];
+      const senderAddress = selectedAccount.split(':')[2];
+      const snowballAddress = await client.getAddress();
 
       try {
-        const result: {
-          signature: string;
-        } = await signClient.request({
+        const result: { signature: string } = await signClient.request({
           topic: session.topic,
           chainId: `cosmos:${chainId}`,
           request: {
@@ -47,47 +54,33 @@ const ConnectWallet = () => {
             ],
           },
         });
+
         if (!result) {
           throw new Error('Error completing transaction');
         }
 
-        setTxHash(result.signature);
+        const isValid = await verifyTx(senderAddress, result.signature);
+        setIsTxValid(isValid);
       } catch (error: any) {
         throw error;
       }
     },
-    [session, signClient, selectedAccount, snowballAddress],
+    [session, signClient, selectedAccount, amount],
   );
 
-  useEffect(() => {
-    console.log(txHash)
-  }, [txHash])
-
-  const fetchSnowballAddress = useCallback(async() => {
-
-    const address = await client.getAddress();
-    setSnowballAddress(address);
-
-    console.log(address)
-  }, [client])
-
-  useEffect(() => {
-    fetchSnowballAddress()
-  }, [])
-
   return (
-    <>
+    <div className="p-4 bg-slate-100 rounded-lg mb-6">
       {!accounts ? (
         <Button onClick={handleConnect}>Connect Wallet</Button>
+      ) : isTxValid ? (
+        <div className="mt-4 text-green-600">Tx successful!</div>
       ) : (
         <div>
           <Select
             label="Select Account"
             defaultValue={accounts[0].address}
             onChange={(value) => {
-              setSelectedAccount({
-                address: value!,
-              });
+              setSelectedAccount(value);
             }}
           >
             {accounts.map((account, index) => (
@@ -96,10 +89,14 @@ const ConnectWallet = () => {
               </Option>
             ))}
           </Select>
-          <Button onClick={() => cosmosSendTokensHandler(selectedAccount!.address.split(":")[2], TEST_AMOUNT)}>Pay</Button>
+          <Button
+            onClick={() => cosmosSendTokensHandler(selectedAccount || '')}
+          >
+            Pay
+          </Button>
         </div>
       )}
-    </>
+    </div>
   );
 };
 

packages/frontend/src/context/WalletConnectContext.tsx

@@ -25,7 +25,7 @@ interface ClientInterface {
   onConnect: () => Promise<void>;
   onDisconnect: () => Promise<void>;
   onSessionDelete: () => void;
-  accounts: { address: string; balance?: string }[] | undefined;
+  accounts: { address: string }[] | undefined;
 }
 
 const ClientContext = createContext({} as ClientInterface);

packages/gql-client/src/client.ts

@@ -441,21 +441,21 @@ export class GQLClient {
     return data.address;
   }
 
-  async verifyTx(txhash: string, amount: string, senderAddress: string): Promise<boolean> {
+  async verifyTx(txHash: string, amount: string, senderAddress: string): Promise<boolean> {
     console.log('Verifying Transaction with parameters:', {
-      txhash,
+      txHash,
       amount,
       senderAddress
   });
-    const { data } = await this.client.query({
+    const { data: verifyTx } = await this.client.query({
       query: queries.verifyTx,
       variables: {
-        txhash,
+        txHash,
         amount,
         senderAddress
       }
     });
 
-    return data;
+    return verifyTx;
   }
 }

packages/gql-client/src/queries.ts

@@ -331,7 +331,7 @@ query {
 `;
 
 export const verifyTx = gql`
-query ($txhash: String!, $amount: String!, $senderAddress: String!) {
-  verifyTx(txhash: $txhash, amount: $amount, senderAddress: $senderAddress)
+query ($txHash: String!, $amount: String!, $senderAddress: String!) {
+  verifyTx(txHash: $txHash, amount: $amount, senderAddress: $senderAddress)
 }
 `;