diff --git a/content/courses/mobile/intro-to-solana-mobile.md b/content/courses/mobile/intro-to-solana-mobile.md index 0f8b33b21..50d8c4cee 100644 --- a/content/courses/mobile/intro-to-solana-mobile.md +++ b/content/courses/mobile/intro-to-solana-mobile.md @@ -1008,11 +1008,28 @@ export function CounterView() { const { program, counterAddress } = useProgram(); const [counter, setCounter] = useState(); - // Fetch Counter Info useEffect(() => { - if (!program || !counterAddress) return; + if (!program || !counterAddress) { + console.log("Missing dependencies:", { + program: Boolean(program) ? "Program Loaded" : "Program Not loaded", + counterAddress: Boolean(counterAddress) + ? "Counter Address Loaded" + : "Counter Address Not loaded", + }); + return; + } + }); - program.account.counter.fetch(counterAddress).then(setCounter); + const fetchCounter = async () => { + try { + const counterData = await program.account.counter.fetch(counterAddress); + setCounter(counterData); + } catch (error) { + console.error("Failed to fetch counter:", error); + } + }; + + fetchCounter(); const subscriptionId = connection.onAccountChange( counterAddress, @@ -1023,8 +1040,8 @@ export function CounterView() { accountInfo.data, ); setCounter(data); - } catch (e) { - console.log("account decoding error: " + e); + } catch (error) { + console.error("Account decoding error:", error); } }, ); @@ -1109,7 +1126,7 @@ export function CounterButton() { const { connection } = useConnection(); const [isTransactionInProgress, setIsTransactionInProgress] = useState(false); - const showToastOrAlert = (message: string) => { + const showMessage = (message: string) => { if (Platform.OS === "android") { ToastAndroid.show(message, ToastAndroid.SHORT); } else { @@ -1118,53 +1135,56 @@ export function CounterButton() { }; const incrementCounter = () => { - if (!program || !counterAddress) return; + if (!program || !counterAddress) { + console.log("Missing program or counterAddress."); + return; + } - if (!isTransactionInProgress) { + if (isTransactionInProgress) return; + + try { setIsTransactionInProgress(true); - transact(async (wallet: Web3MobileWallet) => { + await transact(async (wallet: Web3MobileWallet) => { const authResult = await authorizeSession(wallet); - const latestBlockhashResult = await connection.getLatestBlockhash(); + const { blockhash, lastValidBlockHeight } = + await connection.getLatestBlockhash(); - const ix = await program.methods + const incrementInstruction = await program.methods .increment() .accounts({ counter: counterAddress, user: authResult.publicKey }) .instruction(); const balance = await connection.getBalance(authResult.publicKey); - console.log( `Wallet ${authResult.publicKey} has a balance of ${balance}`, ); - // When on Devnet you may want to transfer SOL manually per session, due to Devnet's airdrop rate limit const minBalance = LAMPORTS_PER_SOL / 1000; - if (balance < minBalance) { console.log( - `requesting airdrop for ${authResult.publicKey} on ${connection.rpcEndpoint}`, + `Requesting airdrop for ${authResult.publicKey} on ${connection.rpcEndpoint}`, ); await connection.requestAirdrop(authResult.publicKey, minBalance * 2); } const transaction = new Transaction({ - ...latestBlockhashResult, feePayer: authResult.publicKey, - }).add(ix); + blockhash, + lastValidBlockHeight, + }).add(incrementInstruction); + const signature = await wallet.signAndSendTransactions({ transactions: [transaction], }); - showToastOrAlert(`Transaction successful! ${signature}`); - }) - .catch(e => { - console.log(e); - showToastOrAlert(`Error: ${JSON.stringify(e)}`); - }) - .finally(() => { - setIsTransactionInProgress(false); - }); + showMessage(`Transaction successful! ${signature}`); + }); + } catch (error) { + console.error("Transaction failed:", error); + showMessage(`Error: ${JSON.stringify(error)}`); + } finally { + setIsTransactionInProgress(false); } };