Skip to content

<WalletProvider>

<WalletProvider> adalah React context provider untuk embedded wallet.

Contoh

tsx
// src/index.tsx
import { createWallet } from '@money-sdk/core'
import { WalletProvider } from '@money-sdk/react'

const wallet = createWallet(/* ... */)

function Root() {
  return (
    <WalletProvider wallet={wallet}>
      <App />
    </WalletProvider>
  )
}

Referensi

props.wallet

Wallet yang sudah diinisialisasi seperti yang dikembalikan oleh createWallet.

Hook

Hook berikut diekspor dari @money-sdk/react dan harus dipanggil di dalam <WalletProvider>:

useWallet()

Mengembalikan instance Wallet yang dioper ke provider. Gunakan ini ketika Anda perlu memanggil method seperti getProvider, disconnect, atau experimental_expand di luar widget.

tsx
import { useWallet } from '@money-sdk/react'

function ConnectButton() {
  const wallet = useWallet()

  const handleClick = async () => {
    const solana = await wallet.getProvider('solana')
    await solana?.connect()
  }

  return <button onClick={handleClick}>Connect</button>
}

useConnected()

Mengembalikan boolean yang menunjukkan apakah pengguna telah menghubungkan wallet ke dApp Anda. Berguna untuk mem-gate UI:

tsx
import { useConnected } from '@money-sdk/react'

function App() {
  const connected = useConnected()

  return connected ? <Dashboard /> : <Landing />
}

useObservable(observable)

Hook level rendah untuk berlangganan observable internal yang diekspos instance wallet. Biasanya Anda tidak akan membutuhkannya langsung — lebih baik pakai useConnected untuk state koneksi.