feat: add @web3-onboard/okx

Author: vanishcode

.circleci/config.yml

@@ -255,6 +255,12 @@ jobs:
     working_directory: ~/web3-onboard-monorepo/packages/trust
     steps:
       - node-build-steps
+  build-okx:
+    docker:
+      - image: cimg/node:16.13.1
+    working_directory: ~/web3-onboard-monorepo/packages/okx
+    steps:
+      - node-build-steps
   build-frontier:
     docker:
       - image: cimg/node:16.13.1
@@ -552,6 +558,12 @@ jobs:
     working_directory: ~/web3-onboard-monorepo/packages/trust
     steps:
       - node-staging-build-steps
+  build-staging-okx:
+    docker:
+      - image: cimg/node:16.13.1
+    working_directory: ~/web3-onboard-monorepo/packages/okx
+    steps:
+      - node-staging-build-steps
   build-staging-frontier:
     docker:
       - image: cimg/node:16.13.1
@@ -851,6 +863,12 @@ workflows:
           <<: *deploy_production_filters
       - build-staging-trust:
           <<: *deploy_staging_filters
+  okx:
+    jobs:
+      - build-okx:
+          <<: *deploy_production_filters
+      - build-staging-okx:
+          <<: *deploy_staging_filters
   frontier:
     jobs:
       - build-frontier:

README.md

@@ -108,6 +108,7 @@ For full documentation, check out the README.md for each package or the [docs pa
 - [Arcana](packages/arcana-auth/README.md)
 - [Coinbase](packages/coinbase/README.md)
 - [Trust](packages/trust/README.md)
+- [OKX](packages/okx/README.md)
 - [WalletConnect](packages/walletconnect/README.md)
 - [Safe](packages/gnosis/README.md)
 - [Magic](packages/magic/README.md)

docs/package.json

@@ -74,6 +74,7 @@
     "@web3-onboard/magic": "^2.1.7",
     "@web3-onboard/metamask": "^2.0.7",
     "@web3-onboard/mew-wallet": "^2.0.4",
+    "@web3-onboard/okx": "^2.0.0-alpha.1",
     "@web3-onboard/phantom": "^2.0.3",
     "@web3-onboard/portis": "^2.1.7",
     "@web3-onboard/sequence": "^2.0.8",

docs/src/lib/services/onboard.js

@@ -51,6 +51,7 @@ const intiOnboard = async (theme) => {
   const { default: torusModule } = await import('@web3-onboard/torus')
   const { default: uauthModule } = await import('@web3-onboard/uauth')
   const { default: trustModule } = await import('@web3-onboard/trust')
+  const { default: okxModule } = await import('@web3-onboard/okx')
   const { default: xdefiModule } = await import('@web3-onboard/xdefi')
   const { default: cedeModule } = await import('@web3-onboard/cede-store')
   const { default: frameModule } = await import('@web3-onboard/frame')
@@ -93,6 +94,7 @@ const intiOnboard = async (theme) => {
   const taho = tahoModule()
   const torus = torusModule()
   const trust = trustModule()
+  const okx = okxModule()
   const xdefi = xdefiModule()
   const cede = cedeModule()
   const bitget = bitgetModule()
@@ -152,6 +154,7 @@ const intiOnboard = async (theme) => {
       ledger,
       trezor,
       trust,
+      okx,
       gnosis,
       taho,
       bitget,

docs/src/routes/docs/[...1]overview/[...1]introduction/+page.md

@@ -187,6 +187,7 @@ We recommend you add the [Core Repo](../../modules/core.md#install) and consider
 - [Blocto](../../wallets/blocto.md#install)
 - [Capsule](../../wallets/capsule.md#install)
 - [Coinbase](../../wallets/coinbase.md#install)
+- [OKX](../../wallets/okx.md#install)
 - [Fortmatic](../../wallets/fortmatic.md#install)
 - [Frame](../../wallets/frame.md#install)
 - [Safe](../../wallets/gnosis.md#install)

docs/src/routes/docs/[...4]wallets/[...14]injected/+page.md

@@ -336,7 +336,6 @@ const injected = injectedModule({
 - Trust - _Desktop & Mobile_
 - SafePal - _Desktop & Mobile_
 - Zerion - _Desktop & Mobile_
-- OKX Wallet - _Desktop & Mobile_
 - Taho (Previously named Tally Ho wallet) - _Desktop_
 - Opera - _Desktop & Mobile_
 - Status - _Mobile_

docs/src/routes/docs/[...4]wallets/[...37]okx/+page.md

@@ -0,0 +1,50 @@
+---
+title: OKX Wallet
+---
+
+# {$frontmatter.title}
+
+Wallet module for connecting OKX wallet through Web3 Onboard
+
+### Install
+
+<Tabs values={['yarn', 'npm']}>
+<TabPanel value="yarn">
+
+```sh copy
+yarn add @web3-onboard/okx
+```
+
+  </TabPanel>
+  <TabPanel value="npm">
+
+```sh copy
+npm install @web3-onboard/okx
+```
+
+  </TabPanel>
+</Tabs>
+
+## Usage
+
+```typescript
+import Onboard from '@web3-onboard/core'
+import okxWallet from '@web3-onboard/okx'
+
+const okx = okxWallet()
+
+const onboard = Onboard({
+  // ... other Onboard options
+  wallets: [
+    okx
+    //... other wallets
+  ]
+})
+
+const connectedWallets = await onboard.connectWallet()
+console.log(connectedWallets)
+```
+
+## Build Environments
+
+For build env configurations and setups please see the Build Env section [here](/docs/modules/core#build-environments)

docs/src/routes/examples/[...1]connect-wallet/+page.md

@@ -25,14 +25,14 @@ Remember- if you used create-react-app, please follow the [additional setup inst
 <TabPanel value="yarn">
 
 ```sh copy
-yarn add @web3-onboard/react @web3-onboard/injected-wallets @web3-onboard/infinity-wallet @web3-onboard/fortmatic @web3-onboard/gnosis @web3-onboard/keepkey @web3-onboard/keystone @web3-onboard/ledger @web3-onboard/portis @web3-onboard/trezor @web3-onboard/walletconnect @web3-onboard/coinbase @web3-onboard/magic @web3-onboard/dcent @web3-onboard/sequence @web3-onboard/taho @web3-onboard/trust @web3-onboard/frontier
+yarn add @web3-onboard/react @web3-onboard/injected-wallets @web3-onboard/infinity-wallet @web3-onboard/fortmatic @web3-onboard/gnosis @web3-onboard/keepkey @web3-onboard/keystone @web3-onboard/ledger @web3-onboard/portis @web3-onboard/trezor @web3-onboard/walletconnect @web3-onboard/coinbase @web3-onboard/magic @web3-onboard/dcent @web3-onboard/sequence @web3-onboard/taho @web3-onboard/trust @web3-onboard/okx @web3-onboard/frontier
 ```
 
   </TabPanel>
   <TabPanel value="npm">
 
 ```sh copy
-npm install @web3-onboard/react @web3-onboard/injected-wallets @web3-onboard/infinity-wallet @web3-onboard/fortmatic @web3-onboard/gnosis @web3-onboard/keepkey @web3-onboard/keystone @web3-onboard/ledger @web3-onboard/portis @web3-onboard/trezor @web3-onboard/walletconnect @web3-onboard/coinbase @web3-onboard/magic @web3-onboard/dcent @web3-onboard/sequence @web3-onboard/taho @web3-onboard/trust @web3-onboard/frontier
+npm install @web3-onboard/react @web3-onboard/injected-wallets @web3-onboard/infinity-wallet @web3-onboard/fortmatic @web3-onboard/gnosis @web3-onboard/keepkey @web3-onboard/keystone @web3-onboard/ledger @web3-onboard/portis @web3-onboard/trezor @web3-onboard/walletconnect @web3-onboard/coinbase @web3-onboard/magic @web3-onboard/dcent @web3-onboard/sequence @web3-onboard/taho @web3-onboard/trust @web3-onboard/okx @web3-onboard/frontier
 ```
 
   </TabPanel>
@@ -60,6 +60,7 @@ import dcentModule from '@web3-onboard/dcent'
 import sequenceModule from '@web3-onboard/sequence'
 import tahoModule from '@web3-onboard/taho'
 import trustModule from '@web3-onboard/trust'
+import okxModule from '@web3-onboard/okx'
 import frontierModule from '@web3-onboard/frontier'
 import ConnectWallet from './ConnectWallet'
 
@@ -86,6 +87,7 @@ const safe = safeModule()
 const sequence = sequenceModule()
 const taho = tahoModule() // Previously named Tally Ho wallet
 const trust = trustModule()
+const okx = okxModule()
 const frontier = frontierModule()
 
 const trezorOptions = {
@@ -105,6 +107,7 @@ const wallets = [
   sequence,
   injected,
   trust,
+  okx,
   frontier,
   taho,
   ledger,
@@ -324,6 +327,7 @@ import dcentModule from '@web3-onboard/dcent'
 import sequenceModule from '@web3-onboard/sequence'
 import tahoModule from '@web3-onboard/taho'
 import trustModule from '@web3-onboard/trust'
+import okxModule from '@web3-onboard/okx'
 import frontierModule from '@web3-onboard/frontier'
 
 const INFURA_KEY = ''
@@ -349,6 +353,7 @@ const safe = safeModule()
 const sequence = sequenceModule()
 const taho = tahoModule() // Previously named Tally Ho wallet
 const trust = trustModule()
+const okx = okxModule()
 const frontier = frontierModule()
 
 const trezorOptions = {
@@ -375,6 +380,7 @@ const wallets = [
   coinbase,
   dcent,
   trust,
+  okx,
   frontier,
   trezor,
   walletConnect,

packages/demo/package.json

@@ -50,6 +50,7 @@
     "@web3-onboard/magic": "^2.2.0-alpha.2",
     "@web3-onboard/metamask": "^2.1.0-alpha.2",
     "@web3-onboard/mew-wallet": "^2.1.0-alpha.2",
+    "@web3-onboard/okx": "^2.0.0-alpha.1",
     "@web3-onboard/particle-network": "^2.1.0-alpha.2",
     "@web3-onboard/phantom": "^2.1.0-alpha.2",
     "@web3-onboard/portis": "^2.2.0-alpha.2",

packages/demo/src/App.svelte

@@ -35,6 +35,7 @@
   import arcanaAuthModule from '@web3-onboard/arcana-auth'
   import venlyModule from '@web3-onboard/venly'
   import bitgetModule from '@web3-onboard/bitget'
+  import okxModule from '@web3-onboard/okx'
   import particleAuthModule from '@web3-onboard/particle-network'
   // import capsuleModule, {
   //   Environment,
@@ -232,6 +233,7 @@
 
   const dcent = dcentModule()
   const bitget = bitgetModule()
+  const okx = okxModule()
   const frameWallet = frameModule()
   const sequence = sequenceModule()
   const enkrypt = enkryptModule()
@@ -270,6 +272,7 @@
       trust,
       tallyho,
       bitget,
+      okx,
       enkrypt,
       infinityWallet,
       mewWallet,

packages/injected/README.md

@@ -61,7 +61,6 @@ const onboard = Onboard({
 - Phantom - _Desktop & Mobile_
 - SafePal - _Desktop & Mobile_
 - Zerion - _Desktop & Mobile_
-- OKX Wallet - _Desktop & Mobile_
 - Taho (Previously named Tally Ho wallet) - _Desktop_
 - Trust - _Mobile_
 - Opera - _Desktop & Mobile_

packages/injected/src/types.ts

@@ -54,7 +54,6 @@ export enum ProviderIdentityFlag {
   Bitski = 'isBitski',
   Enkrypt = 'isEnkrypt',
   Phantom = 'isPhantom',
-  OKXWallet = 'isOkxWallet',
   Zeal = 'isZeal',
   Zerion = 'isZerion',
   Rainbow = 'isRainbow',
@@ -87,7 +86,6 @@ export enum ProviderExternalUrl {
   Bitget = 'https://web3.bitget.com/en/wallet-download',
   Coinbase = 'https://www.coinbase.com/wallet/downloads',
   MetaMask = 'https://metamask.io/download/',
-  OKXWallet = 'https://okx.com/download',
   Phantom = 'https://phantom.app/ul/v1/connect',
   Talisman = 'https://www.talisman.xyz/',
   Trust = 'https://link.trustwallet.com',
@@ -147,7 +145,6 @@ export enum ProviderLabel {
   Enkrypt = 'Enkrypt',
   Zeal = 'Zeal',
   Phantom = 'Phantom',
-  OKXWallet = 'OKX Wallet',
   Zerion = 'Zerion',
   Rainbow = 'Rainbow',
   SafePal = 'SafePal',
@@ -190,7 +187,6 @@ export enum InjectedNameSpace {
   Enkrypt = 'enkrypt',
   Zeal = 'zeal',
   Phantom = 'phantom',
-  OKXWallet = 'okxwallet',
   Trust = 'trustwallet',
   Frontier = 'frontier',
   DeFiConnectProvider = 'deficonnectProvider',
@@ -233,7 +229,6 @@ export interface CustomWindow extends Window {
   phantom: {
     ethereum: InjectedProvider
   }
-  okxwallet: InjectedProvider
   trustwallet: InjectedProvider
   deficonnectProvider: InjectedProvider
   safeheron: InjectedProvider

packages/injected/src/wallets.ts

@@ -715,19 +715,6 @@ const rainbow: InjectedWalletModule = {
   platforms: ['all']
 }
 
-const okxwallet: InjectedWalletModule = {
-  label: ProviderLabel.OKXWallet,
-  injectedNamespace: InjectedNameSpace.OKXWallet,
-  checkProviderIdentity: ({ provider }) =>
-    !!provider && !!provider[ProviderIdentityFlag.OKXWallet],
-  getIcon: async () => (await import('./icons/okxwallet.js')).default,
-  getInterface: async () => ({
-    provider: createEIP1193Provider(window.okxwallet)
-  }),
-  platforms: ['all'],
-  externalUrl: ProviderExternalUrl.OKXWallet
-}
-
 const defiwallet: InjectedWalletModule = {
   label: ProviderLabel.DeFiWallet,
   injectedNamespace: InjectedNameSpace.DeFiConnectProvider,
@@ -960,7 +947,6 @@ const wallets = [
   bitski,
   enkrypt,
   phantom,
-  okxwallet,
   zerion,
   rainbow,
   safepal,

packages/okx/README.md

@@ -0,0 +1,33 @@
+# @web3-onboard/okx
+
+## Wallet module for connecting OKX Wallet through web3-onboard
+
+OKX Wallet SDK wallet module for connecting to Web3-Onboard. Web3-Onboard makes it simple to connect Ethereum hardware and software wallets to your dapp. Features standardized spec compliant web3 providers for all supported wallets, framework agnostic modern javascript UI with code splitting, CSS customization, multi-chain and multi-account support, reactive wallet state subscriptions and real-time transaction state change notifications.
+
+### Install
+
+**NPM**
+`npm i @web3-onboard/core @web3-onboard/okx`
+
+**Yarn**
+`yarn add @web3-onboard/core @web3-onboard/okx`
+
+## Usage
+
+```typescript
+import Onboard from '@web3-onboard/core'
+import okxModule from '@web3-onboard/okx'
+
+const okx = okxModule()
+
+const onboard = Onboard({
+  // ... other Onboard options
+  wallets: [
+    okx
+    //... other wallets
+  ]
+})
+
+const connectedWallets = await onboard.connectWallet()
+console.log(connectedWallets)
+```