Transaksi Terbaru

Transaksi Terbaru

Tampilkan transaksi terakhir Anda

Anda dapat memilih untuk menampilkan transaksi terbaru di dalam modal akun RainbowKit. Perlu diingat bahwa semua transaksi disimpan di penyimpanan lokal dan harus didaftarkan secara manual dengan RainbowKit agar dapat ditampilkan.

Implementasi TombolHubung bawaan juga akan menampilkan indikator pemuatan di sekitar avatar pengguna jika ada transaksi yang tertunda. Implementasi TombolHubung kustom dapat mengulang perilaku ini melalui properti account.hasPendingTransactions yang dilewatkan ke fungsi render Anda.

Untuk menggunakan fitur ini, aktifkan opsi showRecentTransactions di RainbowKitProvider terlebih dahulu.

import { RainbowKitProvider } from '@rainbow-me/rainbowkit';

const App = () => {
  return (
    <RainbowKitProvider showRecentTransactions={true} {...etc}>
      {/* ... */}
    </RainbowKitProvider>
  );
};

Transaksi kemudian dapat didaftarkan dengan RainbowKit menggunakan hook useAddRecentTransaction.

import { useAddRecentTransaction } from '@rainbow-me/rainbowkit';

export default () => {
  const addRecentTransaction = useAddRecentTransaction();

  return (
    <button
      onClick={() => {
        addRecentTransaction({
          hash: '0x...',
          description: '...',
        });
      }}
    >
      Add recent transaction
    </button>
  );
};

Setelah transaksi didaftarkan dengan RainbowKit, statusnya akan diperbarui setelah selesai.

Secara default, transaksi akan dianggap selesai setelah satu blok telah ditambang di atas blok di mana transaksi tersebut ditambang, tetapi ini dapat dikonfigurasi dengan menentukan nilai confirmations kustom.

import { useAddRecentTransaction } from '@rainbow-me/rainbowkit';

export default () => {
  const addRecentTransaction = useAddRecentTransaction();

  return (
    <button
      onClick={() => {
        addRecentTransaction({
          hash: '0x...',
          description: '...',
          confirmations: 100,
        });
      }}
    >
      Add recent transaction
    </button>
  );
};