This repository has been archived by the owner on Sep 30, 2024. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 11
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
update main readme fix missing yarn changes, and lint issues
- Loading branch information
Showing
3 changed files
with
15 additions
and
118 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,103 +1,26 @@ | ||
| # Rainbowkit-celo | ||
|
|
||
| This is a plugin to help [rainbowkit](https://www.rainbowkit.com/docs) developers support the CELO protocol faster. | ||
| It includes the chain information as well as the main CELO wallets (Valora, Celo Wallet, Celo Terminal...). | ||
| # Migrating away from rainbowkit-celo | ||
|
|
||
| ## Installation | ||
| ## sunset | ||
|
|
||
| ```sh | ||
| npm install @celo/rainbowkit-celo | ||
| ``` | ||
| This Project is sunset. | ||
|
|
||
| This package has a few peer dependencies and expect them to be installed too. Follow [their instructions](https://www.rainbowkit.com/docs/installation) if that's not done yet. | ||
| Since viem + wagmi + rainbowkit now have first class support for celo we recommend just importing directly from rainbowkit and wagmi. | ||
|
|
||
| Here's the exhaustive list: | ||
| ## chains | ||
|
|
||
| ```sh | ||
| npm install @rainbow-me/rainbowkit @wagmi/chains wagmi viem | ||
| ``` | ||
| - import { Alfajores, Celo } from "@celo/rainbowkit-celo/chains" | ||
| + import {celo, celoAlfajores} from "wagmi/chains" | ||
| ### A note on version compatibility | ||
|
|
||
| After version 0.8.0 inclusive, this package has the most significant digit match the version of @rainbow-me/rainbowkit it is compatible with. | ||
|
|
||
| IE for `@rainbow-me/[email protected]` use `@celo/[email protected]` | ||
|
|
||
| ## Usage | ||
|
|
||
| ```ts | ||
| import { | ||
| connectorsForWallets, | ||
| RainbowKitProvider, | ||
| } from "@rainbow-me/rainbowkit"; | ||
| import { | ||
| metaMaskWallet, | ||
| omniWallet, | ||
| walletConnectWallet, | ||
| } from "@rainbow-me/rainbowkit/wallets"; | ||
| import { configureChains, createClient, WagmiConfig } from "wagmi"; | ||
| import { jsonRpcProvider } from "wagmi/providers/jsonRpc"; | ||
|
|
||
| // Import known recommended wallets | ||
| import { Valora, CeloWallet, CeloDance } from "@celo/rainbowkit-celo/wallets"; | ||
|
|
||
| // Import CELO chain information | ||
| import { Alfajores, Celo } from "@celo/rainbowkit-celo/chains"; | ||
|
|
||
| const { chains, provider } = configureChains( | ||
| [Alfajores, Celo], | ||
| [ | ||
| jsonRpcProvider({ | ||
| rpc: (chain) => ({ http: chain.rpcUrls.default.http[0] }), | ||
| }), | ||
| ] | ||
| ); | ||
|
|
||
| // Note for older use with wagmi before 0.9 / rainbowkit before 0.8.1 configure | ||
| // const { chains, provider } = configureChains( | ||
| // [Alfajores, Celo], | ||
| // [jsonRpcProvider({ rpc: (chain) => ({ http: chain.rpcUrls.default }) })] | ||
| // ); | ||
|
|
||
| const connectors = connectorsForWallets([ | ||
| { | ||
| groupName: "Recommended with CELO", | ||
| wallets: [ | ||
| Valora({ chains }), | ||
| CeloWallet({ chains }), | ||
| CeloDance({ chains }), | ||
| metaMaskWallet({ chains }), | ||
| omniWallet({ chains }), | ||
| walletConnectWallet({ chains }), | ||
| ], | ||
| }, | ||
| ]); | ||
|
|
||
| const wagmiClient = createClient({ | ||
| autoConnect: true, | ||
| connectors, | ||
| provider, | ||
| }); | ||
|
|
||
| // ... Your exisiting app. | ||
| ``` | ||
|
|
||
| ## Adding wallets to the config | ||
|
|
||
| If the wallet exists in the normal rainbow kit package you can add it to the Supports Celo list at [lists/index.ts](https://github.com/celo-org/rainbowkit-celo/blob/main/packages/rainbowkit-celo/lists/index.ts) | ||
|
|
||
| If the wallet needs a new config add a new file in [wallets folder](https://github.com/celo-org/rainbowkit-celo/tree/main/packages/rainbowkit-celo/wallets) with the config needed for you wallet. Then import this to the lists/index.ts file | ||
| ## wallets | ||
|
|
||
| ## Example app | ||
| * Othello (formerly celo wallet) has dropped support for wallet connect | ||
| * Celo Terminal --> use the default Wallet Connect Connector | ||
| * Valora --> `import { valoraWallet } from '@rainbow-me/rainbowkit/wallets';` | ||
|
|
||
| In `apps/example` there's an example app that showcases the usage of the package. | ||
|
|
||
| In order to run it, execute following commands: | ||
|
|
||
| ```bash | ||
| $ yarn build | ||
|
|
||
| $ yarn dev | ||
| ``` | ||
| ## further reading | ||
|
|
||
| Then you can access the app by opening your browser and visiting http://localhost:3001/ | ||
| see celo docs for a pretty decent [rainbkowkit setup](https://docs.celo.org/developer/rainbowkit-celo) |
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters