Use React.js to monitor transactions on an account via transaction stream

Just like in the last lesson, in the following code sandbox, we start with a simple UI by creating a source wallet component and a destination account component. The main difference in this demonstration is that we’ll use a transaction stream to monitor payments that transfer into our destination account and out of our source wallet. For this demonstration, let’s pretend that we don’t know the sender but we’re trying to use a transaction stream to see the payments that are leaving that account.

Get a transaction stream of an account with useTransactionLog()

We’ll use useTransactionLog() to create a transaction stream to monitor the balance of the destination wallet and any payments that go into that account. Start by sending XRP from the source wallet to the destination wallet. In the component below, you’ll see two checkboxes to monitor both the sender’s/source account and the destination account. Once you send XRP, you’ll see the payment show up in the list of activity.