GithubHelp home page GithubHelp logo

rainbow-me / browser-extension Goto Github PK

View Code? Open in Web Editor NEW
159.0 159.0 29.0 120.68 MB

An Ethereum wallet built for speed 🌈

Home Page: https://rainbow.me/

License: GNU General Public License v3.0

JavaScript 0.48% Shell 0.06% HTML 0.02% TypeScript 99.45%

browser-extension's People

Contributors

brodyhughes avatar brunobar79 avatar christianbaroni avatar danielsinclair avatar dependabot[bot] avatar derhowie avatar estebanmino avatar fringlesinthestreet avatar greg-schrammel avatar jxom avatar kryptopaul avatar magiziz avatar markdalgleish avatar mikearndt avatar nickbytes avatar nicoglennon avatar sammdec avatar schrammel avatar welps avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

browser-extension's Issues

Renaming wallets needs a redesign

In general I find that Rainbow has way better UX than notable competitors. However I've noticed a few areas where it has significant room for improvement. One is renaming wallets, which I find incredibly painful. Currently the process is:

  1. Click the current wallet's dropdown or press w to get a list of all wallets
  2. Scroll down to find the wallet you want to rename
  3. Click the icon to the right of the wallet (with three dots in a circle)
  4. Click "Rename wallet"
  5. Click to focus the text field where the name goes
  6. Put the new name in
  7. Click done

This requires far too many clicks. Imagine you want to rename 5 wallets. This would require 25 clicks plus 5 scrollings on top of typing the 5 names!

This process is even worse when importing a new wallet by specifying a private key, because you can't specify a name during the import, requiring 3 mouse clicks to initiate the import, plus the 5 extra for the rename. Worse, the new wallet gets buried at the end of the list of wallets in step 2 above, and you can't search for it unless you already know the address, because it doesn't have a name yet. So you have to scroll all the way down the list to find it. That means that on top of the unavoidable pasting of the private key and typing of the wallet names, importing and naming 5 new wallets would require something like 40 clicks plus a lot of scrolling!

Fortunately, all of these problems can be fixed very easily. All of the following suggestions can be implemented independently from each other, and all of them would considerably improve the UX:

  • Autofocus the name text field to eliminate step 5 above.
  • Provide a keyboard shortcut to rename the currently selected wallet.
  • Allow clicking directly on the wallet name on the main wallet page in order to edit it.
  • When importing a new wallet, ask for the name on the same form where you ask for the private key (but also auto-generate a unique name like "Imported wallet 1" so you're not forcing the user to think of a name in that moment).
  • When importing a new wallet, automatically switch to the newly imported wallet.

`accountsChanged` event is not emitted on disconnect

Steps to reproduce the issue:

  1. Host this HTML file on a local web server and open it in a web browser:
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>accountsChanged Test</title>
</head>

<body>
  <script>
    const wallets = [];
    window.addEventListener('eip6963:announceProvider', e => wallets.push(e.detail));
    window.dispatchEvent(new Event('eip6963:requestProvider'));

    for (const wallet of wallets) {
      wallet.provider.addListener?.('accountsChanged', console.log) ?? wallet.provider.on('accountsChanged', console.log);
    }
  </script>
</body>

</html>
  1. Connect your wallet using the wallet UI.
  2. Disconnect your wallet using the wallet UI.

Expected result: two accountsChanged events are emitted. One upon connection and one upon disconnection. The DevTools console log should look like this:

> ['0xaaa..aaa']
> []

Actual result: only one accountsChanged event is emitted, upon connection. The DevTools console log looks like this:

> ['0xaaa..aaa']

Here's the relevant part of EIP-1193:

accountsChanged

If the accounts available to the Provider change, the Provider MUST emit the event named accountsChanged with value accounts: string[], containing the account addresses per the eth_accounts Ethereum RPC method.

The “accounts available to the Provider” change when the return value of eth_accounts changes.

Since the return value of eth_accounts changes when the wallet disconnects (from an array with 1 address to an empty array), the accountsChanged event must be emitted.

I performed the above steps with MetaMask and Brave Wallet, and they both emit 2 events as expected.

Browser Extension won't connect to any websites

Using fresh Brave browser profile with only rainbow wallet installed.
Have transferred all my wallets over from metamask.
Disabled brave wallets.

Rainbow will never connect to any website, including opensea, uniswap, etc.

When selecting what wallet to connect, on selecting "metamask" I will get redirected to download metamask rather than rainbow wallet opening. Likewise when I select "browser wallet".

Is there a way to force Rainbow wallet to open and connect?

Error on "Speed Up" Transaction on OP Mainnet

image
  1. Submitted a transaction (hanging on sending)
  2. Right-clicked to open in block explorer -> Etherscan returns 'can not find tx hash'
  3. Right click to speed up & submit
  4. Error pops up.

Both MM and Rainbow are installed on Brave desktop, but the tx was sent through the Rainbow extension.

wallet_watchAsset throws an error

Using wagmi 2.6.x

import { getConnectorClient } from '@wagmi/core'

const client = await getConnectorClient({ ... }, {
  account: '0x...',
  chainId: 314159,
  connector: ...,
})

await client.request({
  method: 'wallet_watchAsset',
  params: {
    type: 'ERC20',
    options: {
      address: '0xaC26a4Ab9cF2A8c5DBaB6fb4351ec0F4b07356c4',
      symbol: 'WFIL',
      decimals: 18,
    },
  },
})

When sending the wallet_watchAsset request, a window pops up to approve adding the token:

image

However, when clicking Approve, an error is thrown: User rejected the request.

Simulation token amount "unlimited"

There seems to be an overflow (maybe?) where simulations of token transfers, approvals, etc. show as "unlimited" when sufficiently large. I've only noticed this with tokens with 18 decimals as of now.

Examples:

Approving 1 WETH (18 decimals):

Withdrawing 10 DAI (18 decimals) from a contract:

Approving 100 USDC (6 decimals):

Can't add more addresses from Trezor T

When I try to add addresses from Trezor T it sees only one. I use different path it finds it seems to be ok, but when I'm adding the second address it is not there and still only the first address is visible in the wallet. Same problem is with signing transaction, it fails despite I confirm on wallet.

Also claiming points with Trezor T is not working at all, with the first address ofc, I can't add more than just the first address.

run rainbow locally

`
LavaMoat generating policy from entry "/Users/henry/Desktop/Backend/browser-extension/scripts/webpack.js"...
⚠️ Potentially Incompatible code detected in package "webpack" file "/Users/henry/Desktop/Backend/browser-extension/node_modules/webpack/lib/serialization/ObjectMiddleware.js":
645 | }
646 | if (!loaded) {

647 | require(request);
| ^^^^^^^^^^^^^^^^ dynamic require
648 | }
649 |
650 | loadedRequests.add(request);
lavamoat - unable to resolve "pnpapi" from "/Users/henry/Desktop/Backend/browser-extension/node_modules/webpack/node_modules/enhanced-resolve/lib/ResolverFactory.js"
⚠️ Potentially Incompatible code detected in package "webpack" file "/Users/henry/Desktop/Backend/browser-extension/node_modules/webpack/lib/ProgressPlugin.js":
410 | currentLoader = loader.loader;
411 | update();
412 | require(loader.loader);
| ^^^^^^^^^^^^^^^^^^^^^^ dynamic require
413 | }
414 | }
415 | if (currentLoader) {
⚠️ Potentially Incompatible code detected in package "webpack>loader-runner" file "/Users/henry/Desktop/Backend/browser-extension/node_modules/loader-runner/lib/loadLoader.js":
17 | } else {
18 | try {
19 | var module = require(loader.path);
| ^^^^^^^^^^^^^^^^^^^^ dynamic require
20 | } catch(e) {
21 | // it is possible for node to choke on a require if the FD descriptor
22 | // limit has been reached. give it a chance to recover.
⚠️ Potentially Incompatible code detected in package "webpack>browserslist" file "/Users/henry/Desktop/Backend/browser-extension/node_modules/browserslist/node.js":
174 | checkExtend(name)
175 | }
176 | var queries = require(require.resolve(name, { paths: ['.', ctx.path] }))
| ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ dynamic require
177 | if (queries) {
178 | if (Array.isArray(queries)) {
179 | return queries
195 | checkExtend(name)
196 | }
197 | var stats = require(require.resolve(
| ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
198 | path.join(name, 'browserslist-stats.json'),
| ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
199 | { paths: ['.'] }
| ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
200 | ))
| ^^^^^^ dynamic require
201 | return normalizeStats(data, stats)
202 | },
203 |
246 | var compressed
247 | try {
248 | compressed = require('caniuse-lite/data/regions/' + code + '.js')
| ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ dynamic require
249 | } catch (e) {
250 | throw new BrowserslistError("Unknown region name " + code + ".")
251 | }
266 | var compressed
267 | try {
268 | compressed = require('caniuse-lite/data/features/' + name + '.js')
| ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ dynamic require
269 | } catch (e) {
270 | throw new BrowserslistError("Unknown feature name " + name + ".")
271 | }
lavamoat - unable to resolve "uglify-js" from "/Users/henry/Desktop/Backend/browser-extension/node_modules/terser-webpack-plugin/dist/utils.js"
lavamoat - unable to resolve "uglify-js/package.json" from "/Users/henry/Desktop/Backend/browser-extension/node_modules/terser-webpack-plugin/dist/utils.js"
lavamoat - unable to resolve "@swc/core" from "/Users/henry/Desktop/Backend/browser-extension/node_modules/terser-webpack-plugin/dist/utils.js"
lavamoat - unable to resolve "@swc/core/package.json" from "/Users/henry/Desktop/Backend/browser-extension/node_modules/terser-webpack-plugin/dist/utils.js"
lavamoat - unable to resolve "pnpapi" from "/Users/henry/Desktop/Backend/browser-extension/node_modules/esbuild/lib/main.js"
⚠️ Potentially Incompatible code detected in package "webpack>terser-webpack-plugin>jest-worker" file "/Users/henry/Desktop/Backend/browser-extension/node_modules/terser-webpack-plugin/node_modules/jest-worker/build/index.js":
66 |
67 | if (!exposedMethods) {
68 | const module = require(workerPath);
| ^^^^^^^^^^^^^^^^^^^ dynamic require
69 |
70 | exposedMethods = Object.keys(module).filter(
71 | // @ts-expect-error: no index
⚠️ Potentially Incompatible code detected in package "@vanilla-extract/vite-plugin>@vanilla-extract/integration" file "/Users/henry/Desktop/Backend/browser-extension/node_modules/@vanilla-extract/integration/dist/vanilla-extract-integration.cjs.prod.js":
272 | const {
273 | name
274 | } = require(packageJsonPath);
| ^^^^^^^^^^^^^^^^^^^^^^^^ dynamic require
275 |
276 | return {
277 | name,
⚠️ Potentially Incompatible code detected in package "@vanilla-extract/vite-plugin>@vanilla-extract/integration" file "/Users/henry/Desktop/Backend/browser-extension/node_modules/@vanilla-extract/integration/dist/vanilla-extract-integration.cjs.dev.js":
272 | const {
273 | name
274 | } = require(packageJsonPath);
| ^^^^^^^^^^^^^^^^^^^^^^^^ dynamic require
275 |
276 | return {
277 | name,
lavamoat - unable to resolve "babel-register" from "/Users/henry/Desktop/Backend/browser-extension/node_modules/dotenv-webpack/index.js"
lavamoat - unable to resolve "./src" from "/Users/henry/Desktop/Backend/browser-extension/node_modules/dotenv-webpack/index.js"
⚠️ Potentially Incompatible code detected in package "ts-loader" file "/Users/henry/Desktop/Backend/browser-extension/node_modules/ts-loader/dist/instances.js":
225 | else if (typeof customerTransformers === 'string') {
226 | try {
227 | customerTransformers = require(customerTransformers);
| ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ dynamic require
228 | }
229 | catch (err) {
230 | throw new Error(Failed to load customTransformers from "${instance.loaderOptions.getCustomTransformers}": ${err instanceof Error ? err.message : 'unknown error'});
⚠️ Potentially Incompatible code detected in package "ts-loader" file "/Users/henry/Desktop/Backend/browser-extension/node_modules/ts-loader/dist/compilerSetup.js":
9 | let compilerCompatible = false;
10 | try {
11 | compiler = require(loaderOptions.compiler);
| ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ dynamic require
12 | }
13 | catch (e) {
14 | errorMessage =
⚠️ Potentially Incompatible code detected in package "typescript" file "/Users/henry/Desktop/Backend/browser-extension/node_modules/typescript/lib/typescript.js":
3096 | try {
3097 | const etwModulePath = process.env.TS_ETW_MODULE_PATH ?? "./node_modules/@microsoft/typescript-etw";
3098 | etwModule = require(etwModulePath);
| ^^^^^^^^^^^^^^^^^^^^^^ dynamic require
3099 | } catch (e) {
3100 | etwModule = void 0;
3101 | }
6267 | try {
6268 | const modulePath = resolveJSModule(moduleName, baseDir, nodeSystem);
6269 | return { module: require(modulePath), modulePath, error: void 0 };
| ^^^^^^^^^^^^^^^^^^^ dynamic require
6270 | } catch (error2) {
6271 | return { module: void 0, modulePath: void 0, error: error2 };
6272 | }
LavaMoat wrote policy to "/Users/henry/Desktop/Backend/browser-extension/lavamoat/build-webpack/policy.json"
`

I got this error when run "yarn setup"

Can't connect Rainbow browser-extension on DAPPs using rainbowkit

On most DAPPs, the rainbow browser-extension can connect using the metamask option (e.g.: https://app.aave.com/), however, it seems that on DAPPs that are using rainbowkit, unless they enable "rainbow" as a wallet, the browser extension cannot connect using the "metamask" option (it just shows a link to download the extension) (e.g: https://app.stcelo.xyz/stake).
Since you develop both softwares, is there a way to make one of the other allow the extension to connect as if it was metamask?
Thanks!

Missing TX View Features

I appreciate the minimalism in the transaction view (where a transaction is displayed to the user for them to sign), but the lack of features there does make some transactions difficult or outright impossible. These could be hidden away on a dropdown, hotkey or gear icon somewhere, but they should be there.

I'll list a few here but if others have more suggestions I'm happy to add them to the list:

Viewing Approval Amount

Currently I do not know if a dapp prompted me to approve an exact amount of tokens, infinite amount or a 0 amount (to revoke approval). The function name is displayed, but that's it. Some of the blame here should be shifted to bad dapp design, but still - we should be able to see that, with bonus points for being able to edit the amount :)

Current View:
image

It should also be possible to display what token is being approved, for what address, and if using something like Permit2 with an expiry, when it is valid until.

Editing Gas Limit

Estimating gas limits is hard. I know. In general I'd be OK with the wallet largely overestimating this to avoid running into "out of gas" reverts, but ultimately we need a way to set this ourselves. For example, this TX ran out of gas with ~170k estimated and I had to resubmit it with a higher gas limit to get it through (had to use another wallet in order to do this). Went through here with ~198k.

Similarly to the previous point, we should be able to see what the value is currently set at, and edit it if necessary. Most users should not care about this or need this, but the feature should be hidden away somewhere for those that do.

Missing extensionId in chrome.runtime.sendMessage()

I'm testing on a local Dapp on latest Chrome on MacOS. Metamask and Coinbase extensions work fine. Rainbow is also able to connect to the page and sign a message. But for every other action, like minting a token, it fails. I see this error spamming my console:

inpage.js:1 Uncaught (in promise) TypeError: Error in invocation of runtime.sendMessage(optional string extensionId, any message, optional object options, optional function callback): chrome.runtime.sendMessage() called from a webpage must specify an Extension ID (string) for its first argument.

And for an example mint function, I get this error:

Error: missing revert data in call exception; Transaction reverted without a reason string [ See: https://links.ethers.org/v5-errors-CALL_EXCEPTION ] (data="0x", transaction={"from":"REMOVED_FOR_GITHUB","to":"REMOVED_FOR_GITHUB","data":"REMOVED_FOR_GITHUB","accessList":null}, error={}, code=CALL_EXCEPTION, version=providers/5.7.2) at _Logger.makeError (index.ts:269:28) at _Logger.throwError (index.ts:281:20) at checkError (json-rpc-provider.ts:66:16) at Web3Provider.<anonymous> (json-rpc-provider.ts:642:20) at Generator.throw (<anonymous>) at rejected (json-rpc-provider.ts:20:1)

The exact same action and calldata works fine on metamask and coinbase.

Add in support for Ledger Stax

Hey there! I've been really enjoying the browser extension, but I wanted to highlight that it doesn't recognize the Ledger Stax in the WebHID connection dialog. I'm pretty sure it's simply a matter of adding the Stax's USB identifier to the code where you open up the WebHID connection, and it'll just work from there.

[bug] wallet_addEthereumChain or useSwitchChain on Rainbow Wallet not working

Is there an existing issue for this?

  • I have searched the existing issues

RainbowKit Version

2.0.0

wagmi Version

2.5.6

Current Behavior

I already add a custom chain to getDefaultConfig

  1. When I used switchChain from useSwitchChain wagmi for Rainbow wallet to switch to this chain, error occured like this:
image

When I used switchChain for other wallets like MetaMask, it worked, but rainbow didn't

  1. When I tried using wallet_addEthereumChain to add this chain to Rainbow wallet, though I approved the addition of this chain, the error occured. I checked Rainbow wallet networks, this custom chain is already added but error showed:
image image

Expected Behavior

When I used switchChain from useSwitchChain wagmi for Rainbow wallet to switch to a custom chain, it should add the custom chain to RainBow wallet and switch to it

If I use wallet_addEthereumChain, Rainbow wallet should add the chain and not show any error

Steps To Reproduce

No response

Link to Minimal Reproducible Example (CodeSandbox, StackBlitz, etc.)

No response

Anything else?

No response

Error: Spinning Circle of Death - Sending Funds

When using the send feature, the transaction appears to hang within the extension and never get submitted. Specifically in this case, I was sending ETH on mainnet.

See the below image:

image

I tried sending funds to both internal addresses within the app as well as external addresses. Regardless, the transaction hangs indefinitely.

I am using Ubuntu/Chrome. The rainbow plugin shows it is on v1.2.56

Note: This issue is present on Windows/Chrome as well.

Firefox extension utilizes lot of CPU

Every time I open up or try to do any action using the browser extension my CPUs go crazy.
I can actually hear them spin up. % usage jumps to ~!5%. The extension itself becomes really slow.
When I initially open it, it's basically unusable, so I wait 2-3 seconds to "cool down" to around 7-8% CPU usage, before clicking or performing any next action.

I've had this issue since the launch of the extension (Oct '23) and disabled it immediately again after installing.
There's some DM history on twitter (@wslyvh).

I recently formatted and did a clean install of OS + Browser + extensions, so wanted to give it another try but still experiencing the same issues.

Laptop: System76 Lemur Pro (11th gen, i7, 40GB ram)
OS: Pop_OS 22.04
Firefox version: 122.0
Rainbow extension version: 1.3.62

Only 1 wallet address is added: wslyvh.eth

[bug] Using Rainbow Chrome Extension and rainbow-kit in dev environment causes Error in invocation of runtime.sendMessage

Is there an existing issue for this?

  • I have searched the existing issues

RainbowKit Version

1.1.3

wagmi Version

1.4.5

Current Behavior

TypeError: Error in invocation of runtime.sendMessage(optional string extensionId, any message, optional object options, optional function callback): chrome.runtime.sendMessage() called from a webpage must specify an Extension ID (string) for its first argument.

Expected Behavior

No error lol

Steps To Reproduce

  "dependencies": {
    "@headlessui/react": "^1.7.17",
    "@heroicons/react": "^2.0.18",
    "@rainbow-me/rainbowkit": "^1.1.3",
    "@rainbow-me/rainbowkit-siwe-next-auth": "^0.3.2",
    "alchemy-sdk": "^2.10.1",
    "ethers": "^5.7.2",
    "mongoose": "^8.0.0",
    "next": "^14.0.1",
    "react": "^18",
    "react-dom": "^18",
    "react-hot-toast": "^2.4.1",
    "siwe": "^2.1.4",
    "swr": "^2.2.4",
    "viem": "^1.18.0",
    "wagmi": "^1.4.5"
  },

clicking connect just throws error

Link to Minimal Reproducible Example (CodeSandbox, StackBlitz, etc.)

No response

Anything else?

No response

Add ability to edit token approval amount

To ensure safety, it's best to set the token approve amount to match the transaction amount by default.

Alternatively, we could incorporate a feature allowing users to adjust the token approve amount as needed.

See the example below:

Screenshot 2024-03-21 at 14 57 59

Connection issues with Remix

Getting a few weird issues when using Rainbow + remix.ethereum.org + OP Sepolia

I can connect fine but for some reason Remix doesn't detect any accounts at first

Screenshot 2024-01-02 at 5 37 43 PM

I have to go to the extension, click "switch wallet", then click again on the wallet that is already connected.

Screenshot 2024-01-02 at 5 38 08 PM

I'm then able to see the wallet but Remix thinks the wallet has no balance (it does).

Screenshot 2024-01-02 at 5 38 56 PM

When deploying a contract I get a failed simulation that appears to be trying to simulate against Ethereum mainnet even though the transaction is against OP Sepolia.

Screenshot 2024-01-02 at 5 39 36 PM

Lastly when I deploy a contract remix either hangs or crashes.

Screenshot 2024-01-02 at 5 41 50 PM

Improve auditability by removing / replacing dependencies

Auditing rainbow is complicated, because it's too big. Size can easily be reduced by removing and replacing dependencies.

  1. ethers v5 could be replaced with v6 or viem. They both use better cryptography and native bigints instead of bn.js and bignumber.js. Viem is friendly to wagmi, which you are already using.
  2. bignumber.js direct dep can be removed in favor of native bigints
  3. buffer can be replaced with native uint8array

Probably a deep dive into all deps would reveal hundreds of kilobytes of unused code.

Current network isn't clearly visible on home page

Checking which network is currently connected is one of the most commonly needed actions in a wallet, so it should be possible to do this immediately and easily by looking at the main page of the extension popup. There is a miniscule network icon within the icon in the top left corner, but this is far too small for it to be easy to differentiate, so currently you have to press n or click that icon.

Ideally the network name would be visible on the main popup, as well as the icon.

wallet_switchEthereumChain Does not work with custom networks #5620

Apparently, wallet_switchEthereumChain doesn't work with networks added through wallet_addEthereumChain
is this intentional?

Steps

  1. Add a custom network
window.rainbow.request({
    "method": "wallet_addEthereumChain",
    "params": [
        {
            "chainId": "0x2329",
            "chainName": "Evmos",
            "nativeCurrency": {
                "decimals": 18,
                "name": "Evmos",
                "symbol": "EVMOS"
            },
            "rpcUrls": [
                "http://localhost:3000/api/eth-json-rpc/evmos"
            ],
            "blockExplorerUrls": [
                "https://escan.live"
            ]
        }
    ]
})

(this works, this adds the network to my wallet, it doesn't auto switch to it after that though as is the behavior in other wallets)
2. Try to switch to the network

window.rainbow.request({
    "method": "wallet_switchEthereumChain",
    "params": [
        {
            "chainId": "0x2329",
        }
    ]
})

I get the following error

{
    "name": "Invalid Request",
    "message": "Chain Id not supported",
    "code": -32600
}

digging the code a little bit it seems that only what's in this list here is supported, is that correct?

export const SUPPORTED_CHAINS: Chain[] = [

wallet_addEthereumChain seems to check for a featureFlags.custom_rpc flag, but wallet_switchEthereumChain right below it doesnt
https://github.com/rainbow-me/provider/blob/586aa46965b41173bd071d7ca2bdccf70ef10b0c/src/handleProviderRequest.ts#L239

Improvement Suggestions: Settings and Feature Additions

Hi! Loving the browser extension. I have used it to onboard several new users to crypto! While taking a fresh look at Rainbow, I put together several suggestions for improvements that I think could be beneficial:

Improvements:

  • Users should have the option to add/change RPC endpoints. This could be added under the ‘Transactions’ option within the wallet settings. With this addition, users could also have the ability to add new networks not currently supported by Rainbow.
  • Users should have the option to manually hide tokens. Currently, the only option for hiding tokens is a built-in ‘Hide tokens under $1 balance’ setting.
  • Currently, tokens are sorted by highest balance. In my opinion, users should have the option to sort by network as well.
  • The browser extension should have a discover page to mimic the mobile app. The discover page could direct users to the official websites of certain dApps.

[bug] Can't detect `favicon.ico` when connecting

Is there an existing issue for this?

  • I have searched the existing issues

RainbowKit Version

2.0.0

wagmi Version

2.5.6

Current Behavior

Resume Group 1

Expected Behavior

Normal icon of some site

Screenshot 2024-03-13 at 16 33 03

Steps To Reproduce

appIcon using getDefaultConfig

I use real domain, icon URL and project ID

export const config = getDefaultConfig({
  ...
  appUrl: 'https://real-domain.com,
  appIcon: 'https://real-domain.com/icon.png',
  projectId: '01001001110100100010010',
  ...
})

Link to Minimal Reproducible Example (CodeSandbox, StackBlitz, etc.)

No response

Anything else?

I did not find any information regarding the icon even in the open repository of rainbowkit.com

sendAsync method doesn't follow SafeEventEmitter

I'm using json rpc middlewares with https://github.com/MetaMask/eth-json-rpc-middleware and it seems working with the most of injectable wallets. And recently I've discovered it doesn't work with Rainbow's so I dived deeper and discovered that your sendAsync method doesn't accept second argument - callback and instead returns just promise.

Example of problem:

window.rainbow.sendAsync(jsonRpcRequest, (err, jsonRpcResponse) => {
 // it'll never happen, callback is never called
})

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.