Skip to content

Commit

Permalink
update guides to include Bloom in dApps
Browse files Browse the repository at this point in the history
  • Loading branch information
MarkNerdi committed Jan 12, 2024
1 parent 0a1cb72 commit 6b694be
Showing 1 changed file with 73 additions and 3 deletions.
76 changes: 73 additions & 3 deletions developer-guide/wallet-connect/guide.md
Original file line number Diff line number Diff line change
Expand Up @@ -13,9 +13,9 @@ To include `Bloom Wallet` in the list of recommended wallets, please add the fol
createWeb3Modal({
//...
featuredWalletIds: [
"652df0cee82d5cd3cadfd57829c5578a", // Bloom wallet
],
});
'XXXXXYYYYZZZZZ11111222223333', // Bloom wallet, this ID will be fixed once we're approved
]
})
```

---
Expand Down Expand Up @@ -56,6 +56,76 @@ import {
...


const connectors = connectorsForWallets([
{
groupName: 'Recommended',
wallets: [
...,
bloomWallet({ projectId, chains }),
...
],
},
]);
```

**NOTE**

As we're waiting for RainbowKit to merge our PR in, you can add Bloom manually to the list of wallets as follows:

Create a `bloomWallet.ts(|js)` file:

```javascript
import {
Chain,
Wallet,
getWalletConnectConnector,
} from '@rainbow-me/rainbowkit';

export interface MyWalletOptions {
projectId: string;
chains: Chain[];
}

export const bloomWallet = ({
chains,
projectId,
}: MyWalletOptions): Wallet => ({
id: 'bloomWallet',
name: 'Bloom Wallet',
iconUrl: 'https://bloomwallet.io/assets/logos/bloom.png',
iconBackground: '#000',
downloadUrls: {
windows: 'https://bloomwallet.io/',
macos: 'https://bloomwallet.io/',
linux: 'https://bloomwallet.io/',
desktop: 'https://bloomwallet.io/',
},
createConnector: () => {
const connector = getWalletConnectConnector({ projectId, chains });
return {
connector,
desktop: {
getUri: async () => {
const provider = await connector.getProvider();
const uri = await new Promise<string>(resolve =>
provider.once('display_uri', resolve)
);
return `bloom://wallet-connect/connect?uri=${encodeURIComponent(uri)}`;
}
},
};
},
});
```

In the file where you setup your connectors, add the following:


```javascript
import { bloomWallet } from 'path/to/bloomWallet.ts';
...


const connectors = connectorsForWallets([
{
groupName: 'Recommended',
Expand Down

0 comments on commit 6b694be

Please sign in to comment.