Add okx wallet (#171)

graz-sh · Sep 28, 2024 · b7cbb96 · b7cbb96
2 parents de1ab01 + 3edbbc4
commit b7cbb96
Show file tree

Hide file tree

Showing 6 changed files with 20 additions and 6 deletions.
diff --git a/docs/docs/guides/integrate-capsule.md b/docs/docs/guides/integrate-capsule.md
@@ -1,12 +1,12 @@
 # Integrate Capsule
 
-## Install Leap Login Capsule UI
+### Install Leap Login Capsule UI
 
 ```bash
 yarn add @leapwallet/cosmos-social-login-capsule-provider-ui
 ```
 
-## Fill your Capsule Config in `GrazProvider`
+### Fill your Capsule Config in `GrazProvider`
 
 ```javascript
 <GrazProvider
@@ -20,7 +20,7 @@ yarn add @leapwallet/cosmos-social-login-capsule-provider-ui
 />
 ```
 
-## Add the stylesheets from `@leapwallet/cosmos-social-login-capsule-provider-ui` and add `leap-ui` class to parent container of imported Modals.
+### Add the stylesheets from `@leapwallet/cosmos-social-login-capsule-provider-ui` and add `leap-ui` class to parent container of imported Modals.
 
 This will ensure proper styling and you will be able to customize the modals using css-variables as shown in [this doc](https://docs.leapwallet.io/cosmos/elements/theming/using-css-variables#customisation).
 

diff --git a/docs/docs/types/walletType.md b/docs/docs/types/walletType.md
@@ -52,5 +52,6 @@ enum WalletType {
   CAPSULE = "capsule",
   COSMIFRAME = "cosmiframe",
   COMPASS = "compass",
+  OKX = "okx",
 }
 ```
diff --git a/packages/graz/package.json b/packages/graz/package.json
@@ -1,7 +1,7 @@
 {
   "name": "graz",
   "description": "React hooks for Cosmos",
-  "version": "0.1.23",
+  "version": "0.1.24",
   "author": "Griko Nibras <[email protected]>",
   "repository": "https://github.com/graz-sh/graz.git",
   "homepage": "https://github.com/graz-sh/graz",

diff --git a/packages/graz/src/actions/wallet/index.ts b/packages/graz/src/actions/wallet/index.ts
@@ -11,6 +11,7 @@ import { getInitia } from "./initia";
 import { getKeplr } from "./keplr";
 import { getLeap } from "./leap";
 import { getMetamaskSnapLeap } from "./leap-metamask-snap/leap";
+import { getOkx } from "./okx";
 import { getStation } from "./station";
 import { getVectis } from "./vectis";
 import { getWalletConnect } from "./wallet-connect";
@@ -109,6 +110,10 @@ export const getWallet = (type: WalletType = useGrazInternalStore.getState().wal
       case WalletType.INITIA: {
         return getInitia();
       }
+      case WalletType.OKX: {
+        return getOkx();
+      }
+
       default: {
         throw new Error("Unknown wallet type");
       }

diff --git a/packages/graz/src/provider/events.tsx b/packages/graz/src/provider/events.tsx
@@ -4,18 +4,19 @@ import { useEffect } from "react";
 
 import { connect, reconnect } from "../actions/account";
 import { checkWallet } from "../actions/wallet";
+import { getCompass } from "../actions/wallet/compass";
 import { getCosmiframe } from "../actions/wallet/cosmiframe";
 import { getCosmostation } from "../actions/wallet/cosmostation";
 import { getKeplr } from "../actions/wallet/keplr";
 import { getLeap } from "../actions/wallet/leap";
+import { getOkx } from "../actions/wallet/okx";
 import { getStation } from "../actions/wallet/station";
 import { getVectis } from "../actions/wallet/vectis";
 import { getWalletConnect } from "../actions/wallet/wallet-connect";
 import { getXDefi } from "../actions/wallet/xdefi";
 import { RECONNECT_SESSION_KEY } from "../constant";
 import { useGrazInternalStore, useGrazSessionStore } from "../store";
 import { WalletType } from "../types/wallet";
-import { getCompass } from "../actions/wallet/compass";
 
 /**
  * Graz custom hook to track `keplr_keystorechange`, `leap_keystorechange`, `accountChanged` event and reconnect state
@@ -92,7 +93,7 @@ export const useGrazEvents = () => {
           void reconnect({ onError: _onReconnectFailed });
         });
       }
-       if (_reconnectConnector === WalletType.COMPASS) {
+      if (_reconnectConnector === WalletType.COMPASS) {
         getCompass().subscription?.(() => {
           void reconnect({ onError: _onReconnectFailed });
         });
@@ -124,6 +125,11 @@ export const useGrazEvents = () => {
           void reconnect({ onError: _onReconnectFailed });
         });
       }
+      if (_reconnectConnector === WalletType.OKX) {
+        getOkx().subscription?.(() => {
+          void reconnect({ onError: _onReconnectFailed });
+        });
+      }
     }
 
     // eslint-disable-next-line react-hooks/exhaustive-deps

diff --git a/packages/graz/src/types/wallet.ts b/packages/graz/src/types/wallet.ts
@@ -24,6 +24,7 @@ export enum WalletType {
   COSMIFRAME = "cosmiframe",
   COMPASS = "compass",
   INITIA = "initia",
+  OKX = "okx",
 }
 
 export const WALLET_TYPES = [
@@ -44,6 +45,7 @@ export const WALLET_TYPES = [
   WalletType.COSMIFRAME,
   WalletType.COMPASS,
   WalletType.INITIA,
+  WalletType.OKX,
 ];
 
 export type Wallet = Pick<