Merge branch 'main' of github.com:solana-foundation/developer-content…

… into fix-deserialize-instruction-data-native-onchain

content/courses/intro-to-solana/interact-with-wallets.md

@@ -118,10 +118,10 @@ import {
   ConnectionProvider,
   WalletProvider,
 } from "@solana/wallet-adapter-react";
-import * as web3 from "@solana/web3.js";
+import { clusterApiUrl } from "@solana/web3.js";
 
 export const Home: NextPage = props => {
-  const endpoint = web3.clusterApiUrl("devnet");
+  const endpoint = clusterApiUrl("devnet");
   const wallets = useMemo(() => [], []);
 
   return (
@@ -167,10 +167,15 @@ import {
   WalletModalProvider,
   WalletMultiButton,
 } from "@solana/wallet-adapter-react-ui";
-import * as web3 from "@solana/web3.js";
+import {
+  clusterApiUrl,
+  Transaction,
+  PublicKey,
+  SystemProgram,
+} from "@solana/web3.js";
 
 const Home: NextPage = props => {
-  const endpoint = web3.clusterApiUrl("devnet");
+  const endpoint = clusterApiUrl("devnet");
   const wallets = useMemo(() => [], []);
 
   return (
@@ -229,21 +234,33 @@ export const BalanceDisplay: FC = () => {
   const { publicKey } = useWallet();
 
   useEffect(() => {
-    if (!connection || !publicKey) {
-      return;
-    }
-
-    connection.onAccountChange(
-      publicKey,
-      updatedAccountInfo => {
-        setBalance(updatedAccountInfo.lamports / LAMPORTS_PER_SOL);
-      },
-      "confirmed",
-    );
-
-    connection.getAccountInfo(publicKey).then(info => {
-      setBalance(info.lamports);
-    });
+    const updateBalance = async () => {
+      if (!connection || !publicKey) {
+        console.error("Wallet not connected or connection unavailable");
+      }
+
+      try {
+        connection.onAccountChange(
+          publicKey,
+          updatedAccountInfo => {
+            setBalance(updatedAccountInfo.lamports / LAMPORTS_PER_SOL);
+          },
+          "confirmed",
+        );
+
+        const accountInfo = await connection.getAccountInfo(publicKey);
+
+        if (accountInfo) {
+          setBalance(accountInfo.lamports / LAMPORTS_PER_SOL);
+        } else {
+          throw new Error("Account info not found");
+        }
+      } catch (error) {
+        console.error("Failed to retrieve account info:", error);
+      }
+    };
+
+    updateBalance();
   }, [connection, publicKey]);
 
   return (
@@ -269,18 +286,28 @@ const { connection } = useConnection();
 const sendSol = async event => {
   event.preventDefault();
 
-  const transaction = new web3.Transaction();
-  const recipientPubKey = new web3.PublicKey(event.target.recipient.value);
+  if (!publicKey) {
+    console.error("Wallet not connected");
+    return;
+  }
+
+  try {
+    const recipientPubKey = new PublicKey(event.currentTarget.recipient.value);
+
+    const transaction = new Transaction();
+    const sendSolInstruction = SystemProgram.transfer({
+      fromPubkey: publicKey,
+      toPubkey: recipientPubKey,
+      lamports: 0.1 * LAMPORTS_PER_SOL,
+    });
 
-  const sendSolInstruction = web3.SystemProgram.transfer({
-    fromPubkey: publicKey,
-    toPubkey: recipientPubKey,
-    lamports: 0.1 * LAMPORTS_PER_SOL,
-  });
+    transaction.add(sendSolInstruction);
 
-  transaction.add(sendSolInstruction);
-  const signature = sendTransaction(transaction, connection);
-  console.log(signature);
+    const signature = await sendTransaction(transaction, connection);
+    console.log(`Transaction signature: ${signature}`);
+  } catch (error) {
+    console.error("Transaction failed", error);
+  }
 };
 ```
 
@@ -401,12 +428,12 @@ import {
   WalletProvider,
 } from "@solana/wallet-adapter-react";
 import { WalletModalProvider } from "@solana/wallet-adapter-react-ui";
-import * as web3 from "@solana/web3.js";
+import { clusterApiUrl } from "@solana/web3.js";
 import * as walletAdapterWallets from "@solana/wallet-adapter-wallets";
 require("@solana/wallet-adapter-react-ui/styles.css");
 
 const WalletContextProvider: FC<{ children: ReactNode }> = ({ children }) => {
-  const endpoint = web3.clusterApiUrl("devnet");
+  const endpoint = clusterApiUrl("devnet");
   const wallets = useMemo(() => [], []);
 
   return (
@@ -506,7 +533,12 @@ import `@solana/web3.js` since we’ll need it to create our transaction.
 
 ```tsx
 import { useConnection, useWallet } from "@solana/wallet-adapter-react";
-import * as web3 from "@solana/web3.js";
+import {
+  PublicKey,
+  Transaction,
+  TransactionInstruction,
+  sendTransaction,
+} from "@solana/web3.js";
 import { FC, useState } from "react";
 import styles from "../styles/PingButton.module.css";
 
@@ -528,7 +560,12 @@ Now use the `useConnection` hook to create a `connection` constant and the
 
 ```tsx
 import { useConnection, useWallet } from "@solana/wallet-adapter-react";
-import * as web3 from "@solana/web3.js";
+import {
+  PublicKey,
+  Transaction,
+  TransactionInstruction,
+  sendTransaction,
+} from "@solana/web3.js";
 import { FC, useState } from "react";
 import styles from "../styles/PingButton.module.css";
 
@@ -567,27 +604,32 @@ Finally, call `sendTransaction`.
 ```tsx
 const onClick = async () => {
   if (!connection || !publicKey) {
-    return;
+    console.error("Wallet not connected or connection unavailable");
   }
 
-  const programId = new web3.PublicKey(PROGRAM_ID);
-  const programDataAccount = new web3.PublicKey(DATA_ACCOUNT_PUBKEY);
-  const transaction = new web3.Transaction();
-
-  const instruction = new web3.TransactionInstruction({
-    keys: [
-      {
-        pubkey: programDataAccount,
-        isSigner: false,
-        isWritable: true,
-      },
-    ],
-    programId,
-  });
-
-  transaction.add(instruction);
-  const signature = await sendTransaction(transaction, connection);
-  console.log(sig);
+  try {
+    const programId = new PublicKey(PROGRAM_ID);
+    const programDataAccount = new PublicKey(DATA_ACCOUNT_PUBKEY);
+    const transaction = new Transaction();
+
+    const instruction = new TransactionInstruction({
+      keys: [
+        {
+          pubkey: programDataAccount,
+          isSigner: false,
+          isWritable: true,
+        },
+      ],
+      programId,
+    });
+
+    transaction.add(instruction);
+
+    const signature = await sendTransaction(transaction, connection);
+    console.log("Transaction Signature:", signature);
+  } catch (error) {
+    console.error("Transaction failed:", error);
+  }
 };
 ```
 

content/courses/onchain-development/anchor-cpi.md

@@ -352,7 +352,7 @@ We'll be using the `solution-pdas` branch as our starting point.
 Before we get started we need enable the `init-if-needed` feature and add the
 `anchor-spl` crate to the dependencies in `Cargo.toml`. If you need to brush up
 on the `init-if-needed` feature take a look at the
-[Anchor PDAs and Accounts lesson](anchor-pdas).
+[Anchor PDAs and Accounts lesson](/content/courses/onchain-development/anchor-pdas.md)).
 
 ```rust
 [dependencies]

content/courses/onchain-development/anchor-pdas.md

@@ -471,7 +471,7 @@ impl Space for MovieAccountState {
 
 The `Space` trait will force us to define the space of our account for
 initialization, by defining the `INIT_SPACE` constant. This constant can then be
-used during the account initalization.
+used during the account initialization.
 
 Note that, in this case, since the account state is dynamic (`title` and
 `description` are strings without a fixed size), we will add
@@ -486,7 +486,7 @@ length storage + 4 bytes for the description length storage.
 ### Custom error codes
 
 During our implementation, we will be doing some checks and throwing some custom
-errors in case those checks are bot successful.
+errors in case those checks are not successful.
 
 For, that let's go ahead and create an enum that will contain the different type
 of errors as well as the error messages associated: