React / Next.js

1"use client"
2import { createContext, useContext, useState, useEffect } from "react"
3import { useWallet } from "@solana/wallet-adapter-react"
4import { Buff } from "buff-protocol-sdk"
5
6const BuffContext = createContext<Buff | null>(null)
7
8export function BuffProvider({ children, apiKey }: {
9  children: React.ReactNode
10  apiKey: string
11}) {
12  const { signMessage, publicKey } = useWallet()
13  const [buff, setBuff] = useState<Buff | null>(null)
14
15  useEffect(() => {
16    if (!signMessage || !publicKey) return
17
18    const b = new Buff({
19      apiKey,
20      plan: "sprout",
21      investInto: "BTC",
22    })
23
24    // Authenticate with wallet signature
25    const msg = new TextEncoder().encode("Sign in to Buff")
26    signMessage(msg).then((sig) => {
27      b.setWalletAuth(publicKey.toBase58(), Buffer.from(sig).toString("base64"))
28      setBuff(b)
29    })
30  }, [signMessage, publicKey, apiKey])
31
32  return (
33    <BuffContext.Provider value={buff}>
34      {children}
35    </BuffContext.Provider>
36  )
37}
38
39export const useBuff = () => useContext(BuffContext)

1import { useBuff } from "./BuffProvider"
2import { useWallet } from "@solana/wallet-adapter-react"
3
4function SwapButton({ tx, valueUsd, buffWalletPubkey }) {
5  const buff = useBuff()
6  const { publicKey, sendTransaction } = useWallet()
7
8  const handleSwap = async () => {
9    if (!buff || !publicKey) return
10
11    // Get round-up instructions from the API
12    const { instructions, breakdown } = await buff.getWrapInstructions(
13      valueUsd, publicKey.toBase58(), buffWalletPubkey
14    )
15
16    if (!breakdown.skipped) {
17      toast("Investing $" + breakdown.roundUpUsd.toFixed(2))
18    }
19
20    // Add Buff instructions to your transaction, then send
21    for (const ix of instructions) tx.add(ix)
22    await sendTransaction(tx, connection)
23
24    // Build and execute the swap when threshold is reached
25    const { ready, transactions } = await buff.buildSwap(buffWalletPubkey)
26    if (ready) {
27      for (const swapTx of transactions) {
28        const signed = await signTransaction(swapTx)
29        await buff.executeSwap(Buffer.from(signed.serialize()).toString("base64"))
30      }
31      toast("Swap executed!")
32    }
33  }
34
35  return <button onClick={handleSwap}>Swap</button>
36}