From 1e7d3f48585e84cb7f147c50d0eeae185d512b6c Mon Sep 17 00:00:00 2001 From: Mago Khamidov <53529533+KosmosKey@users.noreply.github.com> Date: Thu, 22 Feb 2024 04:19:06 +0000 Subject: [PATCH] feat: `roninWallet` (#1787) * feat: add roninWallet support * chore: lint * revert: add ronin chain * chore: change mobile getUri * chore: changeset * chore: change position for translation * chore: require projectId in docs * chore: tweak changset * fix: lint --------- Co-authored-by: Daniel Sinclair --- .changeset/heavy-waves-clean.md | 7 ++ packages/example/pages/_app.tsx | 2 + packages/rainbowkit/src/locales/en_US.json | 32 +++++++ .../src/wallets/walletConnectors/index.ts | 4 +- .../roninWallet/roninWallet.svg | 1 + .../roninWallet/roninWallet.ts | 93 +++++++++++++++++++ site/data/en-US/docs/custom-wallet-list.mdx | 16 +++- 7 files changed, 151 insertions(+), 4 deletions(-) create mode 100644 .changeset/heavy-waves-clean.md create mode 100644 packages/rainbowkit/src/wallets/walletConnectors/roninWallet/roninWallet.svg create mode 100644 packages/rainbowkit/src/wallets/walletConnectors/roninWallet/roninWallet.ts diff --git a/.changeset/heavy-waves-clean.md b/.changeset/heavy-waves-clean.md new file mode 100644 index 0000000000..5b6e4fc966 --- /dev/null +++ b/.changeset/heavy-waves-clean.md @@ -0,0 +1,7 @@ +--- +"@rainbow-me/rainbowkit": patch +"example": patch +"site": patch +--- + +Added Ronin Wallet support with `roninWallet` wallet connector diff --git a/packages/example/pages/_app.tsx b/packages/example/pages/_app.tsx index 8d910d469f..1d91a33e4e 100644 --- a/packages/example/pages/_app.tsx +++ b/packages/example/pages/_app.tsx @@ -43,6 +43,7 @@ import { phantomWallet, rabbyWallet, ramperWallet, + roninWallet, safeheronWallet, safepalWallet, subWallet, @@ -171,6 +172,7 @@ const config = getDefaultConfig({ phantomWallet, rabbyWallet, ramperWallet, + roninWallet, safeheronWallet, safepalWallet, subWallet, diff --git a/packages/rainbowkit/src/locales/en_US.json b/packages/rainbowkit/src/locales/en_US.json index 533d26b259..0f4c6e7777 100644 --- a/packages/rainbowkit/src/locales/en_US.json +++ b/packages/rainbowkit/src/locales/en_US.json @@ -815,6 +815,38 @@ } }, + "ronin": { + "qr_code": { + "step1": { + "description": "We recommend putting Ronin Wallet on your home screen for quicker access.", + "title": "Open the Ronin Wallet app" + }, + "step2": { + "description": "Be sure to back up your wallet using a secure method. Never share your secret phrase with anyone.", + "title": "Create or Import a Wallet" + }, + "step3": { + "description": "After you scan, a connection prompt will appear for you to connect your wallet.", + "title": "Tap the scan button" + } + }, + + "extension": { + "step1": { + "description": "We recommend pinning Ronin Wallet to your taskbar for quicker access to your wallet.", + "title": "Install the Ronin Wallet extension" + }, + "step2": { + "description": "Be sure to back up your wallet using a secure method. Never share your secret phrase with anyone.", + "title": "Create or Import a Wallet" + }, + "step3": { + "description": "Once you set up your wallet, click below to refresh the browser and load up the extension.", + "title": "Refresh your browser" + } + } + }, + "ramper": { "extension": { "step1": { diff --git a/packages/rainbowkit/src/wallets/walletConnectors/index.ts b/packages/rainbowkit/src/wallets/walletConnectors/index.ts index 1465e869e7..386f84f68c 100644 --- a/packages/rainbowkit/src/wallets/walletConnectors/index.ts +++ b/packages/rainbowkit/src/wallets/walletConnectors/index.ts @@ -28,6 +28,7 @@ import { phantomWallet } from './phantomWallet/phantomWallet'; import { rabbyWallet } from './rabbyWallet/rabbyWallet'; import { rainbowWallet } from './rainbowWallet/rainbowWallet'; import { ramperWallet } from './ramperWallet/ramperWallet'; +import { roninWallet } from './roninWallet/roninWallet'; import { safeWallet } from './safeWallet/safeWallet'; import { safeheronWallet } from './safeheronWallet/safeheronWallet'; import { safepalWallet } from './safepalWallet/safepalWallet'; @@ -72,8 +73,9 @@ export { oneKeyWallet, phantomWallet, rabbyWallet, - ramperWallet, rainbowWallet, + ramperWallet, + roninWallet, safeWallet, safeheronWallet, safepalWallet, diff --git a/packages/rainbowkit/src/wallets/walletConnectors/roninWallet/roninWallet.svg b/packages/rainbowkit/src/wallets/walletConnectors/roninWallet/roninWallet.svg new file mode 100644 index 0000000000..35adbf063e --- /dev/null +++ b/packages/rainbowkit/src/wallets/walletConnectors/roninWallet/roninWallet.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/rainbowkit/src/wallets/walletConnectors/roninWallet/roninWallet.ts b/packages/rainbowkit/src/wallets/walletConnectors/roninWallet/roninWallet.ts new file mode 100644 index 0000000000..b42cc9806a --- /dev/null +++ b/packages/rainbowkit/src/wallets/walletConnectors/roninWallet/roninWallet.ts @@ -0,0 +1,93 @@ +import { DefaultWalletOptions, Wallet } from '../../Wallet'; +import { + getInjectedConnector, + hasInjectedProvider, +} from '../../getInjectedConnector'; +import { getWalletConnectConnector } from '../../getWalletConnectConnector'; + +export type RoninWalletOptions = DefaultWalletOptions; + +export const roninWallet = ({ + projectId, + walletConnectParameters, +}: RoninWalletOptions): Wallet => { + const isRoninInjected = hasInjectedProvider({ + namespace: 'ronin.provider', + }); + + return { + id: 'ronin', + name: 'Ronin Wallet', + iconUrl: async () => (await import('./roninWallet.svg')).default, + iconBackground: '#ffffff', + rdns: 'com.roninchain.wallet', + installed: isRoninInjected || undefined, + downloadUrls: { + android: + 'https://play.google.com/store/apps/details?id=com.skymavis.genesis', + ios: 'https://apps.apple.com/us/app/ronin-wallet/id1592675001', + mobile: 'https://wallet.roninchain.com', + chrome: + 'https://chrome.google.com/webstore/detail/ronin-wallet/fnjhmkhhmkbjkkabndcnnogagogbneec', + edge: 'https://microsoftedge.microsoft.com/addons/detail/ronin-wallet/kjmoohlgokccodicjjfebfomlbljgfhk', + firefox: 'https://addons.mozilla.org/firefox/addon/ronin-wallet', + browserExtension: 'https://wallet.roninchain.com/', + qrCode: 'https://wallet.roninchain.com/', + }, + mobile: { + getUri: (uri: string) => + `roninwallet://wc?uri=${encodeURIComponent(uri)}`, + }, + qrCode: { + getUri: (uri: string) => uri, + instructions: { + learnMoreUrl: 'https://wallet.roninchain.com/', + steps: [ + { + description: 'wallet_connectors.ronin.qr_code.step1.description', + step: 'install', + title: 'wallet_connectors.ronin.qr_code.step1.title', + }, + { + description: 'wallet_connectors.ronin.qr_code.step2.description', + step: 'create', + title: 'wallet_connectors.ronin.qr_code.step2.title', + }, + { + description: 'wallet_connectors.ronin.qr_code.step3.description', + step: 'scan', + title: 'wallet_connectors.ronin.qr_code.step3.title', + }, + ], + }, + }, + extension: { + instructions: { + learnMoreUrl: 'https://wallet.roninchain.com/', + steps: [ + { + description: 'wallet_connectors.ronin.extension.step1.description', + step: 'install', + title: 'wallet_connectors.ronin.extension.step1.title', + }, + { + description: 'wallet_connectors.ronin.extension.step2.description', + step: 'create', + title: 'wallet_connectors.ronin.extension.step2.title', + }, + { + description: 'wallet_connectors.ronin.extension.step3.description', + step: 'refresh', + title: 'wallet_connectors.ronin.extension.step3.title', + }, + ], + }, + }, + createConnector: isRoninInjected + ? getInjectedConnector({ namespace: 'ronin.provider' }) + : getWalletConnectConnector({ + projectId, + walletConnectParameters, + }), + }; +}; diff --git a/site/data/en-US/docs/custom-wallet-list.mdx b/site/data/en-US/docs/custom-wallet-list.mdx index fdeeff1a3c..ed8582172a 100644 --- a/site/data/en-US/docs/custom-wallet-list.mdx +++ b/site/data/en-US/docs/custom-wallet-list.mdx @@ -326,6 +326,16 @@ import { rabbyWallet } from '@rainbow-me/rainbowkit/wallets'; rabbyWallet(); ``` +#### Rainbow + +```tsx +import { rainbowWallet } from '@rainbow-me/rainbowkit/wallets'; + +rainbowWallet(options: { + projectId: string; +}); +``` + #### Ramper Wallet ```tsx @@ -334,12 +344,12 @@ import { ramperWallet } from '@rainbow-me/rainbowkit/wallets'; ramperWallet(); ``` -#### Rainbow +#### Ronin Wallet ```tsx -import { rainbowWallet } from '@rainbow-me/rainbowkit/wallets'; +import { roninWallet } from '@rainbow-me/rainbowkit/wallets'; -rainbowWallet(options: { +roninWallet(options: { projectId: string; }); ```