Skip to content

Latest commit

 

History

History
101 lines (78 loc) · 3.17 KB

README.md

File metadata and controls

101 lines (78 loc) · 3.17 KB

Solana Transaction Tool

  • This React Application showcases the usage of Solana Wallet Adapter and Solana web3
    • Connect to Phantom Wallet
    • Show transactions of a connected account
    • Send lamports through the application using Phantom Wallet
Screen.Recording.2021-08-30.at.11.22.20.AM.mov

Prerequisite

  • Install Phantom Wallet and set your account

How to run

$ yarn install
$ yarn start

By default this app points to "devnet". If you want to point it to the different network, update clusterApiUrl

How does it work?

Connecting Wallet

    <WalletProvider wallets={[PhantomWallet]} onError={onError} autoConnect>
      <WalletDialogProvider>{children}</WalletDialogProvider>
    </WalletProvider>
  • Once that succeeds, you can access your wallet through useWallet hooks
  • useWallet provides wallet information(publicKey, icon) and functionality to sign your transaction

Viewing transactions

  • You need to fetch transaction signatures using web3.Connection
  • We can retrieve transactions using that signatures
  const transSignatures = await connection.getConfirmedSignaturesForAddress2(
    address
  );
  for (let i = 0; i < transSignatures.length; i++) {
    const signature = transSignatures[i].signature;
    const confirmedTransaction = await connection.getConfirmedTransaction(
      signature
    );
    if (confirmedTransaction) {
      const transWithSignature = {
        signature,
        confirmedTransaction,
      };
      transactions.push(transWithSignature);
    }
  }

Sending transactions

  • First create instruction.
    const instruction = SystemProgram.transfer({
      fromPubkey: address!,
      toPubkey: destPubkey,
      lamports,
    });
  • Create a transaction with feePayer(usually yourself), recentBlockHash(this ensures that this transaction is legit) and instruction
  const recentBlockhash = await connection.getRecentBlockhash();
  console.log({ recentBlockhash });
  const options: TransactionCtorFields = {
    feePayer,
    recentBlockhash: recentBlockhash.blockhash,
  };
  const transaction = new Transaction(options);
  transaction.add(instruction);
  • Sign your transaction and send it to the network
const { signTransaction } = useWallet();

const signedTrans = await signTransaction(transaction);
const signature = await connection.sendRawTransaction(
    signedTrans.serialize()
);
  • Finally confirm your transaction
await connection.confirmTransaction(signature, "confirmed");

P.S. If you think this code was useful, tip me some SOL! 6i6zaZdsV9R7JZKFAMNULCdMtzQCSK7ukUpdL4CdPy74