Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/tenderly/tenderly-rabby-transaction-preview
Integrate the Tenderly Simulation API into Rabby Wallet to enable a transaction preview option for wallet users.
https://github.com/tenderly/tenderly-rabby-transaction-preview
chrome-extension ethereum rabby-wallet tenderly transaction-simulator
Last synced: about 1 hour ago
JSON representation
Integrate the Tenderly Simulation API into Rabby Wallet to enable a transaction preview option for wallet users.
- Host: GitHub
- URL: https://github.com/tenderly/tenderly-rabby-transaction-preview
- Owner: Tenderly
- License: other
- Created: 2023-08-17T11:22:38.000Z (over 1 year ago)
- Default Branch: develop
- Last Pushed: 2023-08-17T17:52:14.000Z (over 1 year ago)
- Last Synced: 2024-11-09T05:12:48.668Z (about 2 months ago)
- Topics: chrome-extension, ethereum, rabby-wallet, tenderly, transaction-simulator
- Language: TypeScript
- Homepage: https://docs.tenderly.co/simulations-and-forks/integration-guides/how-to-add-transaction-preview-to-a-rabby-wallet-using-tenderly-simulation-api
- Size: 80.4 MB
- Stars: 5
- Watchers: 2
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: changeLogs/0170.md
- License: LICENSE
Awesome Lists containing this project
README
Integrate Tenderly Transaction Simulations Into Rabby Wallet
Integrate the Tenderly Simulation API into Rabby Wallet to simulate ERC-20 and ERC-721 transactions and display human-readable information.
Introduction ·
Setup ·
Examples ·
Contributing
# Introduction
> This repo is forked from [Rabby Wallet](https://github.com/RabbyHub/Rabby) repository.
Rabby Wallet with a transaction preview option can allow users to simulate transactions and get in-depth insights before
sending them on-chain. By using the Tenderly Simulation API, Rabby Wallet, and other wallets, DEXs, and DeFi platforms,
can create a better experience for users, protect their funds, and provide the information they need to sign and send
transactions with confidence.
# Setup
Welcome to the setup guide for integrating the Tenderly Simulation API into Rabby Wallet. In this tutorial, we will guide
you through each step to ensure that you are set up correctly. Follow the instructions below to get started.
For the full setup and understanding how Rabby works, follow the guide on [Rabby Wallet's GitHub repo](https://github.com/RabbyHub/Rabby/blob/develop/README.md).
## 1. Rabby Wallet Installation
### Install Rabby Wallet Chrome Extension
The first step is to install the Rabby Wallet Chrome extension. You can install it from the [Chrome Web Store](https://chrome.google.com/webstore/detail/rabby-wallet/acmacodkjbdgmoleebolmdjonilkdbch). Simply click the link and follow the instructions to add the extension to your browser.
### Disable the Production Version of Rabby Wallet
If you have the production version of Rabby Wallet installed, you'll need to disable it. Navigate to `chrome://extensions` in your browser. Locate Rabby Wallet from the list of your installed extensions, and toggle it off. Alternatively, you can start a new profile in Chrome or Brave, which will allow you to use different extensions for different purposes.
### Load an Unpacked Version
Follow the [Google Chrome instructions](https://developer.chrome.com/docs/extensions/mv3/getstarted/development-basics/#load-unpacked) to load an unpacked extension in developer mode.
## 2. Tenderly Access
### Open a Tenderly Account
To utilize the features provided by the Tenderly Simulation API, you'll need a Tenderly account. If you don't have one already, visit the [Tenderly website](https://dashboard.tenderly.co/register) and create a new account.
### Create an Access Token
Once you've logged into your Tenderly account, you will need to create an `access token`. This is a unique identifier that allows the Rabby Wallet integration to interact with your Tenderly account. Generate it on the following link https://dashboard.tenderly.co/account/authorization.
Create a file `/_raw/tenderly.json` and update the Tenderly credentials:
```json
{
"tenderlyAccount": "YOUR_ACCOUNT_NAME",
"tenderlyProject": "YOUR_PROJECT_NAME",
"tenderlyAccessToken": "YOUR_ACCESS_TOKEN"
}
```
## 3. App Setup
### Clone the Repository
Now, you'll need to get the code for the app onto your local machine. You can do this by cloning this repository. If you're not sure how to do this, you can find detailed instructions in the GitHub documentation.
### Start the App
To clone the repository, use the following command:
```
git clone https://github.com/Tenderly/tenderly-rabby-transaction-preview.git
```
Then navigate to the root directory of the project:
```
cd tenderly-rabby-transaction-preview
```
Start the app with:
```
yarn build:dev
```
# Examples
In this section, we show how to simulate ERC20 and NFT transfers in Rabby Wallet using the Tenderly Simulation API.
## ERC20 Token Swap on Uniswap
The image below shows a successful ERC20 token swap of ETH to 1INCH with asset changes and a detailed breakdown of the transaction.
You can see the whole simulated transaction on the Tenderly Dashboard here:
https://dashboard.tenderly.co/shared/simulation/a2690d05-6136-47b8-af83-b264e3defc1a
### Transaction Preview in Rabby Wallet Powered by Tenderly Simulations - Video Tutorial
## NFT Purchase on Joepegs
The image below shows a successful purchase of several NFTs with asset changes and a detailed breakdown of the transaction.
You can see the whole simulated transaction on the Tenderly Dashboard here:
https://dashboard.tenderly.co/shared/simulation/f72eca66-57a9-4411-9398-0a9d5f14f560
### Simulate NFT Transfer in Rabby Wallet With Tenderly Simulations - Video Tutorial
# Contributing
We love our contributors! Here's how you can contribute:
- [Open an issue](https://github.com/Tenderly/tenderly-rabby-transaction-preview/issues) if you believe you've encountered a bug.
- Make a [pull request](https://github.com/Tenderly/tenderly-rabby-transaction-preview/pull) to add new features/make quality-of-life improvements/fix bugs.
# Author
- Vanja Paunović ([@dzimiks](https://twitter.com/dzimiks))