diff --git a/.circleci/config.yml b/.circleci/config.yml index d63e1854b..d5547ee00 100644 --- a/.circleci/config.yml +++ b/.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: diff --git a/README.md b/README.md index 8707f0b18..8602ac61a 100644 --- a/README.md +++ b/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) diff --git a/docs/package.json b/docs/package.json index 49e5db854..d2c80913e 100644 --- a/docs/package.json +++ b/docs/package.json @@ -72,6 +72,7 @@ "@web3-onboard/magic": "^2.2.0", "@web3-onboard/metamask": "^2.1.0", "@web3-onboard/mew-wallet": "^2.1.0", + "@web3-onboard/okx": "^2.0.0-alpha.1", "@web3-onboard/particle-network": "^2.1.0", "@web3-onboard/phantom": "^2.1.0", "@web3-onboard/portis": "^2.2.0", diff --git a/docs/src/lib/services/onboard.js b/docs/src/lib/services/onboard.js index 0aba76b2f..44b850667 100644 --- a/docs/src/lib/services/onboard.js +++ b/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, diff --git a/docs/src/routes/docs/[...1]overview/[...1]introduction/+page.md b/docs/src/routes/docs/[...1]overview/[...1]introduction/+page.md index 3048f872c..727606c42 100644 --- a/docs/src/routes/docs/[...1]overview/[...1]introduction/+page.md +++ b/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) diff --git a/docs/src/routes/docs/[...4]wallets/[...14]injected/+page.md b/docs/src/routes/docs/[...4]wallets/[...14]injected/+page.md index 26a71605b..e95b3b339 100644 --- a/docs/src/routes/docs/[...4]wallets/[...14]injected/+page.md +++ b/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_ diff --git a/docs/src/routes/docs/[...4]wallets/[...37]okx/+page.md b/docs/src/routes/docs/[...4]wallets/[...37]okx/+page.md new file mode 100644 index 000000000..cdb9377a4 --- /dev/null +++ b/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 + + + + +```sh copy +yarn add @web3-onboard/okx +``` + + + + +```sh copy +npm install @web3-onboard/okx +``` + + + + +## 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) diff --git a/docs/src/routes/examples/[...1]connect-wallet/+page.md b/docs/src/routes/examples/[...1]connect-wallet/+page.md index f91790199..e901d51da 100644 --- a/docs/src/routes/examples/[...1]connect-wallet/+page.md +++ b/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 ```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 ``` ```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 ``` @@ -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, diff --git a/packages/demo/package.json b/packages/demo/package.json index d41f48879..0710e4406 100644 --- a/packages/demo/package.json +++ b/packages/demo/package.json @@ -50,6 +50,7 @@ "@web3-onboard/magic": "^2.2.0", "@web3-onboard/metamask": "^2.1.0", "@web3-onboard/mew-wallet": "^2.1.0", + "@web3-onboard/okx": "^2.0.0-alpha.1", "@web3-onboard/particle-network": "^2.1.0", "@web3-onboard/phantom": "^2.1.0", "@web3-onboard/portis": "^2.2.0", diff --git a/packages/demo/src/App.svelte b/packages/demo/src/App.svelte index 00409977a..2bdb48b8e 100644 --- a/packages/demo/src/App.svelte +++ b/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, @@ -233,6 +234,7 @@ const dcent = dcentModule() const bitget = bitgetModule() + const okx = okxModule() const frameWallet = frameModule() const sequence = sequenceModule() const enkrypt = enkryptModule() @@ -271,6 +273,7 @@ trust, tallyho, bitget, + okx, enkrypt, infinityWallet, mewWallet, diff --git a/packages/injected/README.md b/packages/injected/README.md index aa4545a27..7a548a364 100644 --- a/packages/injected/README.md +++ b/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_ diff --git a/packages/injected/src/types.ts b/packages/injected/src/types.ts index 42c750b2b..ebdd69736 100644 --- a/packages/injected/src/types.ts +++ b/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 diff --git a/packages/injected/src/wallets.ts b/packages/injected/src/wallets.ts index ee69450f3..d8f49ba61 100644 --- a/packages/injected/src/wallets.ts +++ b/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, diff --git a/packages/okx/README.md b/packages/okx/README.md new file mode 100644 index 000000000..48bfc9ab3 --- /dev/null +++ b/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) +``` diff --git a/packages/okx/package.json b/packages/okx/package.json new file mode 100644 index 000000000..d43a25f46 --- /dev/null +++ b/packages/okx/package.json @@ -0,0 +1,67 @@ +{ + "name": "@web3-onboard/okx", + "version": "2.0.0-alpha.1", + "description": "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.", + "keywords": [ + "Ethereum", + "Web3", + "EVM", + "dapp", + "Multichain", + "Wallet", + "Transaction", + "Provider", + "Hardware Wallet", + "Notifications", + "React", + "Svelte", + "Vue", + "Next", + "Nuxt", + "MetaMask", + "Coinbase", + "WalletConnect", + "Ledger", + "Trezor", + "Connect Wallet", + "Ethereum Hooks", + "Blocknative", + "Mempool", + "pending", + "confirmed", + "Injected Wallet", + "Crypto", + "Crypto Wallet", + "Enkrypt", + "OKX", + "OKX Wallet" + ], + "repository": { + "type": "git", + "url": "https://github.com/blocknative/web3-onboard.git", + "directory": "packages/okx" + }, + "homepage": "https://www.blocknative.com/onboard", + "bugs": "https://github.com/blocknative/web3-onboard/issues", + "module": "dist/index.js", + "browser": "dist/index.js", + "main": "dist/index.js", + "type": "module", + "typings": "dist/index.d.ts", + "files": [ + "dist" + ], + "scripts": { + "build": "tsc", + "dev": "tsc -w", + "type-check": "tsc --noEmit" + }, + "license": "MIT", + "devDependencies": { + "@types/node": "^17.0.21", + "typescript": "^4.5.5" + }, + "dependencies": { + "@web3-onboard/common": "^2.3.3" + } +} diff --git a/packages/injected/src/icons/okxwallet.ts b/packages/okx/src/icon.ts similarity index 99% rename from packages/injected/src/icons/okxwallet.ts rename to packages/okx/src/icon.ts index 2ab6d017e..075f39911 100644 --- a/packages/injected/src/icons/okxwallet.ts +++ b/packages/okx/src/icon.ts @@ -1,5 +1,4 @@ export default ` - -` +` diff --git a/packages/okx/src/index.ts b/packages/okx/src/index.ts new file mode 100644 index 000000000..94bec7f57 --- /dev/null +++ b/packages/okx/src/index.ts @@ -0,0 +1,44 @@ +import type { WalletInit, EIP1193Provider } from '@web3-onboard/common' +import { createEIP1193Provider } from '@web3-onboard/common' + +import { CustomWindow } from './types.js' + +declare const window: CustomWindow + +function okx(): WalletInit { + if (typeof window === 'undefined') return () => null + + return ({ device }) => { + return { + label: 'OKX Wallet', + getIcon: async () => (await import('./icon.js')).default, + getInterface: async () => { + const okxwalletInjectionExists = window.hasOwnProperty('okxwallet') + + let provider: EIP1193Provider + + if (okxwalletInjectionExists) { + provider = createEIP1193Provider(window['okxwallet']) + } else { + const downloadUrl = + device.type === 'mobile' + ? 'https://www.okx.com/download?deeplink=' + + encodeURIComponent( + 'okx://wallet/dapp/url?dappUrl=' + + encodeURIComponent(window.location.href) + ) + : 'https://okx.com/download' + window.open(downloadUrl, '_blank') + throw new Error('Please Install OKX Wallet before proceeding') + } + + return { + provider + } + }, + platforms: ['all'] + } + } +} + +export default okx diff --git a/packages/okx/src/types.ts b/packages/okx/src/types.ts new file mode 100644 index 000000000..e45a259a5 --- /dev/null +++ b/packages/okx/src/types.ts @@ -0,0 +1,4 @@ +import { EIP1193Provider } from '@web3-onboard/common' +export interface CustomWindow extends Window { + okxwallet?: EIP1193Provider +} diff --git a/packages/okx/tsconfig.json b/packages/okx/tsconfig.json new file mode 100644 index 000000000..09ae989f9 --- /dev/null +++ b/packages/okx/tsconfig.json @@ -0,0 +1,15 @@ +{ + "extends": "../../tsconfig.json", + "include": ["src/**/*"], + + "compilerOptions": { + "outDir": "dist", + "rootDir": "src", + "declaration": true, + "declarationDir": "dist", + "paths": { + "*": ["./src/*", "./node_modules/*"] + }, + "typeRoots": ["node_modules/@types"] + } +} \ No newline at end of file