Merge pull request #17 from Brillionfi/bugfix/sdk-management

Bugfix/sdk management

README.md

@@ -107,7 +107,7 @@ We provide several hooks for you to easily interact with Brillion (more coming..
 ```tsx
 import { useBalance, useTransaction, useUser, useWallet } from "@brillionfi/waas-react-sdk";
 
-const { balances, getPortfolio } = useBalance("wallet address", "chainId");
+const { balances, getBalances, getPortfolio } = useBalance("wallet address", "chainId");
 
 const { 
   createTransaction,

eslint.config.mjs

@@ -12,7 +12,12 @@ export default [
     },
     rules: {
       'no-unused-vars': 'error',
-      'no-console': 'error',
+      'no-console': [
+        "error",
+        {
+          "allow": ["error"]
+        }
+      ],
       ...prettierConfig.rules,
     },
   },

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@brillionfi/waas-react-sdk",
-  "version": "1.0.16",
+  "version": "1.0.17",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "files": [

src/components/BrillionContext.ts

@@ -4,11 +4,13 @@ import { WalletInfra } from "@brillionfi/wallet-infra-sdk";
 export type BrillionContextType = {
   sdk: WalletInfra | null;
   walletConnectProjectId: string;
+  isReady: boolean;
 };
 
 export const BrillionContext = createContext<BrillionContextType>({
   sdk: null,
   walletConnectProjectId: "",
+  isReady: false,
 });
 
 export const useBrillionContext = () => {

src/components/BrillionProvider.tsx

@@ -1,6 +1,9 @@
 import { ReactNode, useState, useEffect } from "react";
 import { BrillionContext } from "./BrillionContext";
 import { WalletInfra } from "@brillionfi/wallet-infra-sdk";
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+
+const queryClient = new QueryClient();
 
 type BrillionProviderProps = {
   appId: string;
@@ -15,24 +18,29 @@ export const BrillionProvider: React.FC<BrillionProviderProps> = ({
   WCProjectId,
   children,
 }) => {
+  const [isReady, setIsReady] = useState<boolean>(false);
   const [sdk, setSdk] = useState<WalletInfra | null>(null);
   const [walletConnectProjectId, setWalletConnectProjectId] = useState<string>("");
 
   useEffect(() => {
-    const sdk = new WalletInfra(appId, baseUrl);
-    setSdk(sdk);
+    if(!appId || !baseUrl) return;
+    setSdk(new WalletInfra(appId, baseUrl));
+    setIsReady(true);
   }, [appId, baseUrl]);
 
   useEffect(() => {
     if(WCProjectId) setWalletConnectProjectId(WCProjectId);
   }, [WCProjectId]);
 
   return (
-    <BrillionContext.Provider value={{
-      sdk, 
-      walletConnectProjectId
-    }}>
-      {children}
-    </BrillionContext.Provider>
+    <QueryClientProvider client={queryClient}>
+      <BrillionContext.Provider value={{
+        sdk, 
+        walletConnectProjectId,
+        isReady
+      }}>
+        {children}
+      </BrillionContext.Provider>
+    </QueryClientProvider>
   );
 };

src/hooks/useBalance.ts

@@ -3,29 +3,47 @@ import { IWalletPortfolio } from "@brillionfi/wallet-infra-sdk/dist/models";
 import { useQuery } from "@tanstack/react-query";
 import { useBrillionContext } from "components/BrillionContext";
 
-export const useBalance = (address: Address, chainId: ChainId) => {
+export const useBalance = (address?: Address, chainId?: ChainId) => {
   const { sdk } = useBrillionContext();
 
   const balances = useQuery({
     queryKey: ["balances", chainId, address],
     queryFn: async () => {
       if (!chainId || !address) throw new Error("Missing chainId or address");
+      if (!sdk) {
+        console.error("Brillion context not ready");
+        return;
+      }
 
-      const response = await sdk?.Wallet.getPortfolio(address, chainId);
+      const response = await sdk.Wallet.getPortfolio(address, chainId);
       return response?.portfolio || [];
     },
     enabled: !!chainId && !!address,
   });
 
+  const getBalances = async (address: Address, chainId: ChainId) => {
+    if (!sdk) {
+      console.error("Brillion context not ready");
+      return;
+    }
+    const response = await sdk.Wallet.getPortfolio(address, chainId);
+    return response?.portfolio || [];
+  };
+
   const getPortfolio = async (
     address: Address,
     chainId: ChainId,
   ): Promise<IWalletPortfolio | undefined> => {
-    return await sdk?.Wallet.getPortfolio(address, chainId);
+    if (!sdk) {
+      console.error("Brillion context not ready");
+      return;
+    }
+    return await sdk.Wallet.getPortfolio(address, chainId);
   };
 
   return {
     balances,
+    getBalances,
     getPortfolio,
   };
 };

src/hooks/useTransaction.ts

@@ -12,40 +12,60 @@ export const useTransaction = () => {
   const createTransaction = async (
     transaction: ITransactionSigned | ITransactionUnsigned,
   ): Promise<ITransaction | undefined> => {
-    return await sdk?.Transaction.createTransaction(transaction);
+    if (!sdk) {
+      console.error("Brillion context not ready");
+      return;
+    }
+    return await sdk.Transaction.createTransaction(transaction);
   };
 
   const getTransactionById = async (
     id: string,
   ): Promise<ITransaction | undefined> => {
-    return await sdk?.Transaction.getTransactionById(id);
+    if (!sdk) {
+      console.error("Brillion context not ready");
+      return;
+    }
+    return await sdk.Transaction.getTransactionById(id);
   };
 
   const cancelTransaction = async (id: string): Promise<void | undefined> => {
-    return await sdk?.Transaction.cancelTransaction(id);
+    if (!sdk) {
+      console.error("Brillion context not ready");
+      return;
+    }
+    return await sdk.Transaction.cancelTransaction(id);
   };
 
-  const approveSignTransaction = async (
+  const approveTransaction = async (
     id: string,
     organizationId: string,
     fingerprint: string,
     fromOrigin: string,
   ): Promise<ISignTransactionResponse | undefined> => {
-    return await sdk?.Transaction.approveSignTransaction(
+    if (!sdk) {
+      console.error("Brillion context not ready");
+      return;
+    }
+    return await sdk.Transaction.approveSignTransaction(
       id,
       organizationId,
       fingerprint,
       fromOrigin,
     );
   };
 
-  const rejectSignTransaction = async (
+  const rejectTransaction = async (
     id: string,
     organizationId: string,
     fingerprint: string,
     fromOrigin: string,
   ): Promise<ISignTransactionResponse | undefined> => {
-    return await sdk?.Transaction.rejectSignTransaction(
+    if (!sdk) {
+      console.error("Brillion context not ready");
+      return;
+    }
+    return await sdk.Transaction.rejectSignTransaction(
       id,
       organizationId,
       fingerprint,
@@ -57,7 +77,7 @@ export const useTransaction = () => {
     createTransaction,
     getTransactionById,
     cancelTransaction,
-    approveSignTransaction,
-    rejectSignTransaction,
+    approveTransaction,
+    rejectTransaction,
   };
 };

src/hooks/useUser.ts

@@ -7,19 +7,29 @@ export const useUser = () => {
   const { sdk, walletConnectProjectId } = useBrillionContext();
 
   const authenticateUser = (jwt: string) => {
-    return sdk?.authenticateUser(jwt);
+    if (!sdk) {
+      console.error("Brillion context not ready");
+      return;
+    }
+
+    sdk.authenticateUser(jwt);
   };
 
   const login = async (
     provider: AuthProvider,
     redirectUrl: string,
     email?: string,
   ) => {
+    if (!sdk) {
+      console.error("Brillion context not ready");
+      return;
+    }
+
     let uri;
 
     if (provider === AuthProvider.WALLET_CONNECT) {
-      uri = sdk?.generateWalletConnectUri(walletConnectProjectId, redirectUrl);
-      sdk?.onConnectWallet((authUrl: unknown) => {
+      uri = sdk.generateWalletConnectUri(walletConnectProjectId, redirectUrl);
+      sdk.onConnectWallet((authUrl: unknown) => {
         window.location.href = authUrl as string;
       });
     } else {
@@ -28,7 +38,7 @@ export const useUser = () => {
         redirectUrl,
       };
       if (email) params.email = email;
-      uri = await sdk?.generateAuthUrl(params);
+      uri = await sdk.generateAuthUrl(params);
     }
 
     return uri;