minor updates to web3js v2 examples (#642)

* prettier fix

* send-sol

* load-keypair-from-file

* connect-wallet-react

content/cookbook/development/load-keypair-from-file.md

@@ -12,12 +12,13 @@ and use this one for your projects using the `loadKeypairFromFile` function.
 ```typescript filename="load-keypair-from-file.ts"
 import {
   airdropFactory,
-  createKeyPairFromBytes,
+  createKeyPairSignerFromBytes,
   createSolanaRpc,
   createSolanaRpcSubscriptions,
   devnet,
   generateKeyPair,
   getAddressFromPublicKey,
+  KeyPairSigner,
   lamports,
 } from "@solana/web3.js";
 import fs from "fs";
@@ -35,31 +36,29 @@ async function createKeypair() {
   console.log(`Public key: ${publicAddress}`);
 }
 
-export async function loadDefaultKeypair(): Promise<CryptoKeyPair> {
+export async function loadDefaultKeypair(): Promise<KeyPairSigner<string>> {
   return await loadKeypairFromFile("~/.config/solana/id.json");
 }
 
 export async function loadDefaultKeypairWithAirdrop(
   cluster: string,
-): Promise<CryptoKeyPair> {
+): Promise<KeyPairSigner<string>> {
   const keypair = await loadDefaultKeypair();
   const rpc = createSolanaRpc(devnet(`https://api.${cluster}.solana.com`));
   const rpcSubscriptions = createSolanaRpcSubscriptions(
     devnet(`wss://api.${cluster}.solana.com`),
   );
   try {
-    const result = await rpc
-      .getBalance(await getAddressFromPublicKey(keypair.publicKey))
-      .send();
+    const result = await rpc.getBalance(keypair.address).send();
 
     console.log(`Balance: ${result.value} lamports`);
     if (result.value < lamports(500_000n)) {
       console.log(`Balance low requesting airdrop`);
       const airdrop = airdropFactory({ rpc, rpcSubscriptions });
       await airdrop({
         commitment: "confirmed",
-        lamports: lamports(1000_000n),
-        recipientAddress: await getAddressFromPublicKey(keypair.publicKey),
+        lamports: lamports(1_000_000_000n),
+        recipientAddress: keypair.address,
       });
     }
   } catch (err) {
@@ -70,7 +69,7 @@ export async function loadDefaultKeypairWithAirdrop(
 
 export async function loadKeypairFromFile(
   filePath: string,
-): Promise<CryptoKeyPair> {
+): Promise<KeyPairSigner<string>> {
   // This is here so you can also load the default keypair from the file system.
   const resolvedPath = path.resolve(
     filePath.startsWith("~") ? filePath.replace("~", os.homedir()) : filePath,
@@ -79,8 +78,8 @@ export async function loadKeypairFromFile(
     JSON.parse(fs.readFileSync(resolvedPath, "utf8")),
   );
   // Here you can also set the second parameter to true in case you need to extract your private key.
-  const keypair = await createKeyPairFromBytes(loadedKeyBytes);
-  return keypair;
+  const keypairSigner = await createKeyPairSignerFromBytes(loadedKeyBytes);
+  return keypairSigner;
 }
 
 createKeypair();

content/cookbook/transactions/send-sol.md

@@ -66,7 +66,7 @@ async function transferSol() {
   console.log("Requesting airdrop");
   await airdrop({
     commitment: "confirmed",
-    lamports: lamports(1000_000n),
+    lamports: lamports(1_000_000_000n),
     recipientAddress: keypairSigner.address,
   });
   console.log("Airdrop confirmed");
@@ -85,7 +85,7 @@ async function transferSol() {
           getTransferSolInstruction({
             source: keypairSigner,
             destination: address("web3Qm5PuFapMJqe6PWRWfRBarkeqE2ZC8Eew3zwHH2"),
-            amount: lamports(1_000n),
+            amount: lamports(1_000_000n),
           }),
         ],
         m,

content/cookbook/wallets/connect-wallet-react.md

@@ -11,6 +11,11 @@ makes it easy to manage wallet connections client-side. For a full length guide,
 check out
 [Add Solana Wallet Adapter to a NextJS application](/content/guides/wallets/add-solana-wallet-adapter-to-nextjs.md).
 
+> For web3.js v2, please reference the
+> [react example](https://github.com/solana-labs/solana-web3.js/tree/master/examples/react-app)
+> from the
+> [Anza Web3js v2 Blog](https://www.anza.xyz/blog/solana-web3-js-2-release).
+
 ## How to Connect to a Wallet with React
 
 > Currently, `create-solana-dapp` only works with Solana Web3.js v1.

content/cookbook/wallets/restore-keypair.md

@@ -12,36 +12,34 @@ secret to test out your dApp.
 <Tabs groupId="language" items={['web3.js v2', 'web3.js v1']}>
 
 <Tab value="web3.js v2">
-
-```typescript
 
+```typescript
 import { createKeyPairFromBytes } from "@solana/web3.js";
 
-const keypairBytes = new Uint8Array([ 174, 47, 154, 16, 202, 193, 206, 113,
-199, 190, 53, 133, 169, 175, 31, 56, 222, 53, 138, 189, 224, 216, 117, 173,
-10, 149, 53, 45, 73, 251, 237, 246, 15, 185, 186, 82, 177, 240, 148, 69,
-241, 227, 167, 80, 141, 89, 240, 121, 121, 35, 172, 247, 68, 251, 226, 218,
-48, 63, 176, 109, 168, 89, 238, 135 ]);
+const keypairBytes = new Uint8Array([
+  174, 47, 154, 16, 202, 193, 206, 113, 199, 190, 53, 133, 169, 175, 31, 56,
+  222, 53, 138, 189, 224, 216, 117, 173, 10, 149, 53, 45, 73, 251, 237, 246, 15,
+  185, 186, 82, 177, 240, 148, 69, 241, 227, 167, 80, 141, 89, 240, 121, 121,
+  35, 172, 247, 68, 251, 226, 218, 48, 63, 176, 109, 168, 89, 238, 135,
+]);
 
 const keypair = await createKeyPairFromBytes(keypairBytes);
-
 ```
-</Tab>
 
+</Tab>
 <Tab value="web3.js v1">
-
-```typescript
 
+```typescript
 import { Keypair } from "@solana/web3.js";
 
-const keypairBytes = Uint8Array.from([ 174, 47, 154, 16,
-202, 193, 206, 113, 199, 190, 53, 133, 169, 175, 31, 56, 222, 53, 138, 189,
-224, 216, 117, 173, 10, 149, 53, 45, 73, 251, 237, 246, 15, 185, 186, 82,
-177, 240, 148, 69, 241, 227, 167, 80, 141, 89, 240, 121, 121, 35, 172, 247,
-68, 251, 226, 218, 48, 63, 176, 109, 168, 89, 238, 135 ]),
-
-const keypair = Keypair.fromSecretKey( keypairBytes );
+const keypairBytes = Uint8Array.from([
+  174, 47, 154, 16, 202, 193, 206, 113, 199, 190, 53, 133, 169, 175, 31, 56,
+  222, 53, 138, 189, 224, 216, 117, 173, 10, 149, 53, 45, 73, 251, 237, 246, 15,
+  185, 186, 82, 177, 240, 148, 69, 241, 227, 167, 80, 141, 89, 240, 121, 121,
+  35, 172, 247, 68, 251, 226, 218, 48, 63, 176, 109, 168, 89, 238, 135,
+]);
 
+const keypair = Keypair.fromSecretKey(keypairBytes);
 ```
 
 </Tab>
@@ -52,29 +50,27 @@ const keypair = Keypair.fromSecretKey( keypairBytes );
 <Tabs groupId="language" items={['web3.js v2', 'web3.js v1']}>
 
 <Tab value="web3.js v2">
-
-```typescript
 
+```typescript
 import { createKeyPairFromBytes, getBase58Codec } from "@solana/web3.js";
 
-const keypairBase58 = "5MaiiCavjCmn9Hs1o3eznqDEhRwxo7pXiAYez7keQUviUkauRiTMD8DrESdrNjN8zd9mTmVhRvBJeg5vhyvgrAhG";
-const keypairBytes = getBase58Codec().decode(keypairBase58); 
+const keypairBase58 =
+  "5MaiiCavjCmn9Hs1o3eznqDEhRwxo7pXiAYez7keQUviUkauRiTMD8DrESdrNjN8zd9mTmVhRvBJeg5vhyvgrAhG";
+const keypairBytes = getBase58Codec().decode(keypairBase58);
 const keypair = await createKeyPairFromBytes(keypairBytes);
-
 ```
-</Tab>
 
+</Tab>
 <Tab value="web3.js v1">
-
-```typescript
 
+```typescript
 import { Keypair } from "@solana/web3.js";
 import * as bs58 from "bs58";
 
-const keypairBase58 = "5MaiiCavjCmn9Hs1o3eznqDEhRwxo7pXiAYez7keQUviUkauRiTMD8DrESdrNjN8zd9mTmVhRvBJeg5vhyvgrAhG";
+const keypairBase58 =
+  "5MaiiCavjCmn9Hs1o3eznqDEhRwxo7pXiAYez7keQUviUkauRiTMD8DrESdrNjN8zd9mTmVhRvBJeg5vhyvgrAhG";
 const keypairBytes = bs58.decode(keypairBase58);
 const keypair = Keypair.fromSecretKey(keypairBytes);
-
 ```
 
 </Tab>