feat: desigWallet support (#1565)

* feat: add Desig Wallet

* feat: add Desig Wallet

* feat: add Desig Wallet

* feat: add Desig Wallet

* minify logo 28x28

* Alphabetize and check whether the window exists

* fix: i18n

* chore: changeset

* fix: merge conflict

---------

Co-authored-by: thiennv-qng <81727176+thiennv-qng@users.noreply.github.com>

.changeset/wild-cameras-kick.md

@@ -0,0 +1,23 @@
+---
+"@rainbow-me/rainbowkit": patch
+---
+
+Desig Wallet support
+
+**Example usage**
+
+```ts
+import {
+  getDefaultWallets,
+  connectorsForWallets,
+} from '@rainbow-me/rainbowkit';
+import { desigWallet } from '@rainbow-me/rainbowkit/wallets';
+const { wallets } = getDefaultWallets({ appName, chains, projectId });
+const connectors = connectorsForWallets([
+  ...wallets,
+  {
+    groupName: 'Other',
+    wallets: [desigWallet({ chains })],
+  },
+]);
+```

packages/example/pages/_app.tsx

@@ -24,6 +24,7 @@ import {
   coin98Wallet,
   coreWallet,
   dawnWallet,
+  desigWallet,
   enkryptWallet,
   foxWallet,
   frameWallet,
@@ -119,6 +120,7 @@ const connectors = connectorsForWallets([
       coin98Wallet({ chains, projectId }),
       coreWallet({ chains, projectId }),
       dawnWallet({ chains }),
+      desigWallet({ chains }),
       enkryptWallet({ chains }),
       foxWallet({ chains, projectId }),
       frameWallet({ chains }),

packages/rainbowkit/src/locales/en_US.json

@@ -838,6 +838,23 @@
           "description": "Choose New Connection, then scan the QR code and confirm the prompt to connect."
         }
       }
+    },
+
+    "desig": {
+      "extension": {
+        "step1": {
+          "title": "Install the Desig extension",
+          "description": "We recommend pinning Desig to your taskbar for easier access to your wallet."
+        },
+        "step2": {
+          "title": "Create a Wallet",
+          "description": "Be sure to back up your wallet using a secure method. Never share your secret phrase with anyone."
+        },
+        "step3": {
+          "title": "Refresh your browser",
+          "description": "Once you set up your wallet, click below to refresh the browser and load up the extension."
+        }
+      }
     }
   }
 }

packages/rainbowkit/src/wallets/walletConnectors/desigWallet/desigWallet.ts

@@ -0,0 +1,72 @@
+import type { InjectedConnectorOptions } from '@wagmi/core/connectors/injected';
+import { InjectedConnector } from 'wagmi/connectors/injected';
+import { Chain } from '../../../components/RainbowKitProvider/RainbowKitChainContext';
+import { Wallet } from '../../Wallet';
+
+export interface DesigWalletOptions {
+  chains: Chain[];
+}
+
+export const desigWallet = ({
+  chains,
+  ...options
+}: DesigWalletOptions & InjectedConnectorOptions): Wallet => {
+  return {
+    id: 'desig',
+    name: 'Desig Wallet',
+    iconUrl: async () => (await import('./desigWallet.svg')).default,
+    iconBackground: '#ffffff',
+    installed:
+      (typeof window !== 'undefined' && !!(window as any)?.desig?.ethereum) ||
+      undefined,
+    downloadUrls: {
+      android: 'https://play.google.com/store/apps/details?id=io.desig.app',
+      ios: 'https://apps.apple.com/app/desig-wallet/id6450106028',
+      qrCode: 'https://desig.io',
+      mobile: 'https://desig.io',
+      browserExtension:
+        'https://chrome.google.com/webstore/detail/desig-wallet/panpgppehdchfphcigocleabcmcgfoca',
+    },
+
+    createConnector: () => {
+      const getProvider = () =>
+        typeof window !== 'undefined'
+          ? (window as any).desig?.ethereum
+          : undefined;
+
+      const connector = new InjectedConnector({
+        chains,
+        options: { getProvider, ...options },
+      });
+
+      return {
+        connector,
+        extension: {
+          instructions: {
+            steps: [
+              {
+                description:
+                  'wallet_connectors.desig.extension.step1.description',
+                step: 'install',
+                title: 'wallet_connectors.desig.extension.step1.title',
+              },
+              {
+                description:
+                  'wallet_connectors.desig.extension.step2.description',
+                step: 'create',
+                title: 'wallet_connectors.desig.extension.step2.title',
+              },
+              {
+                description:
+                  'wallet_connectors.desig.extension.step3.description',
+                step: 'refresh',
+                title: 'wallet_connectors.desig.extension.step3.title',
+              },
+            ],
+            learnMoreUrl: 'https://desig.io',
+          },
+        },
+      };
+    },
+  };
+};

packages/rainbowkit/src/wallets/walletConnectors/index.ts

@@ -7,6 +7,7 @@ import { coin98Wallet } from './coin98Wallet/coin98Wallet';
 import { coinbaseWallet } from './coinbaseWallet/coinbaseWallet';
 import { coreWallet } from './coreWallet/coreWallet';
 import { dawnWallet } from './dawnWallet/dawnWallet';
+import { desigWallet } from './desigWallet/desigWallet';
 import { enkryptWallet } from './enkryptWallet/enkryptWallet';
 import { foxWallet } from './foxWallet/foxWallet';
 import { frameWallet } from './frameWallet/frameWallet';
@@ -46,6 +47,7 @@ export {
   coinbaseWallet,
   coreWallet,
   dawnWallet,
+  desigWallet,
   enkryptWallet,
   foxWallet,
   frameWallet,

site/data/docs/custom-wallet-list.mdx

@@ -209,6 +209,16 @@ dawnWallet(options: {
 });
 ```
 
+#### Desig Wallet
+
+```tsx
+import { desigWallet } from '@rainbow-me/rainbowkit/wallets';
+
+desigWallet(options: {
+  chains: Chain[];
+});
+```
+
 #### Enkrypt Wallet
 
 ```tsx