@sundaeswap/wallet-lite 0.0.27 → 0.0.29

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sundaeswap/wallet-lite",
-  "version": "0.0.27",
+  "version": "0.0.29",
   "license": "MIT",
   "type": "module",
   "main": "./dist/cjs/index.js",

package/src/classes/WalletObserver.class.ts

@@ -1,7 +1,9 @@
 import type { TransactionUnspentOutput } from "@cardano-sdk/core/dist/cjs/Serialization/index.js";
-import type {
-  Cip30WalletApi,
-  GetCollateral,
+import {
+  APIErrorCode,
+  type ApiError,
+  type Cip30WalletApi,
+  type GetCollateral,
 } from "@cardano-sdk/dapp-connector";
 import { AssetAmount, type IAssetAmountMetadata } from "@sundaeswap/asset";
 import merge from "lodash/merge.js";
@@ -238,7 +240,8 @@ export class WalletObserver<
     const selectedWallet =
       activeWallet || (this._activeWallet as TSupportedWalletExtensions);
 
-    while (!this.api) {
+    let shouldContinue = true;
+    while (!this.api && shouldContinue) {
       if (attempts === 10) {
         throw new Error(
           "Could not reconnect to the selected wallet. Please check your extension."
@@ -255,6 +258,14 @@ export class WalletObserver<
         this.api = api;
         this.network = await api.getNetworkId();
       } catch (e) {
+        if (
+          (e as Error)?.message === "user canceled connection" ||
+          (e as ApiError)?.code === APIErrorCode.Refused
+        ) {
+          shouldContinue = false;
+          return undefined;
+        }
+
         await new Promise((res) => setTimeout(res, 200));
         attempts++;
       }

package/src/react-components/RenderWalletHandles.tsx

@@ -1,21 +1,13 @@
 import { IAssetAmountMetadata } from "@sundaeswap/asset";
 import { FC, ReactNode } from "react";
 
-import { TAssetAmountMap } from "../@types/observer.js";
-import { THandleMetadata } from "./contexts/observer/index.js";
 import { useWalletHandles } from "./hooks/useWalletHandles.js";
 import { useWalletObserver } from "./hooks/useWalletObserver.js";
 
-export type IWalletHandles<
-  AssetMetadata extends IAssetAmountMetadata = IAssetAmountMetadata
-> = {
-  handles: TAssetAmountMap<THandleMetadata<AssetMetadata>>;
-  loadingHandles: boolean;
-};
-
 export type TRenderWalletHandlesFunctionState<
   T extends IAssetAmountMetadata = IAssetAmountMetadata
-> = ReturnType<typeof useWalletObserver<T>> & IWalletHandles;
+> = ReturnType<typeof useWalletObserver<T>> &
+  ReturnType<typeof useWalletHandles<T>>;
 
 export type TRenderWalletHandlesFunction = (
   state: TRenderWalletHandlesFunctionState

package/src/react-components/RenderWalletPeerConnect.tsx

@@ -2,16 +2,13 @@ import { IAssetAmountMetadata } from "@sundaeswap/asset";
 import { FC, ReactNode } from "react";
 import { ErrorBoundary } from "react-error-boundary";
 
-import { TGetPeerConnectInstance } from "../@types/observer.js";
 import { useWalletObserver } from "./hooks/useWalletObserver.js";
 import { useWalletPeerConnect } from "./hooks/useWalletPeerConnect.js";
 
 export type TRenderWalletPeerConnectFunctionState<
   T extends IAssetAmountMetadata = IAssetAmountMetadata
-> = ReturnType<typeof useWalletObserver<T>> & {
-  peerConnect?: ReturnType<TGetPeerConnectInstance>;
-  QRCodeElement: ReactNode;
-};
+> = ReturnType<typeof useWalletObserver<T>> &
+  ReturnType<typeof useWalletPeerConnect<T>>;
 
 export type TRenderWalletPeerConnectFunction = (
   state: TRenderWalletPeerConnectFunctionState

package/src/react-components/RenderWalletState.tsx

@@ -6,10 +6,8 @@ import { useWalletObserver } from "./hooks/useWalletObserver.js";
 
 export type TRenderWalletStateFunctionState<
   T extends IAssetAmountMetadata = IAssetAmountMetadata
-> = ReturnType<typeof useWalletObserver<T>> & {
-  connectingWallet: boolean;
-  syncingWallet: boolean;
-};
+> = ReturnType<typeof useWalletObserver<T>> &
+  ReturnType<typeof useWalletLoadingState<T>>;
 
 export type TRenderWalletStateFunction = (
   state: TRenderWalletStateFunctionState

package/src/react-components/WalletObserverProvider/hooks/useWalletObserverState.ts

@@ -35,7 +35,6 @@ export const useWalletObserverState = (observer: WalletObserver) => {
   const [unusedAddresses, setUnusedAddresses] = useState<string[]>([]);
   const [utxos, setUtxos] = useState<TransactionUnspentOutput[]>();
   const [collateral, setCollateral] = useState<TransactionUnspentOutput[]>();
-  const [ready, setReady] = useState(false);
   const [isCip45, setIsCip45] = useState(false);
   const [switching, setSwitching] = useState(false);
 
@@ -53,7 +52,6 @@ export const useWalletObserverState = (observer: WalletObserver) => {
     setNetwork(undefined);
     setUtxos(undefined);
     setCollateral(undefined);
-    setReady(false);
     setIsCip45(false);
   }, [observer]);
 
@@ -125,7 +123,6 @@ export const useWalletObserverState = (observer: WalletObserver) => {
       return prevValue;
     });
 
-    setReady(true);
     setIsCip45(newWallet.includes("p2p"));
   }, [observer, disconnect]);
 
@@ -170,7 +167,5 @@ export const useWalletObserverState = (observer: WalletObserver) => {
     connectWallet,
     switching,
     setSwitching,
-    ready,
-    setReady,
   };
 };

package/src/react-components/contexts/observer/types.ts

@@ -49,10 +49,8 @@ export interface IWalletObserverState<
   observerRef: MutableRefObject<WalletObserver<AssetMetadata>>;
   refreshInterval: number | false;
   state: {
-    ready: boolean;
     isCip45: boolean;
     setIsCip45: Dispatch<SetStateAction<boolean>>;
-    setReady: Dispatch<SetStateAction<boolean>>;
     activeWallet?: TSupportedWalletExtensions;
     setActiveWallet: Dispatch<
       SetStateAction<TSupportedWalletExtensions | undefined>

package/src/react-components/hooks/useWalletLoadingState.ts

@@ -10,6 +10,7 @@ export const useWalletLoadingState = <
   const state = useWalletObserver<AssetMetadata>();
   const [connecting, setConnecting] = useState(false);
   const [syncing, setSyncing] = useState(false);
+  const [ready, setReady] = useState(false);
 
   useEffect(() => {
     if (!state.observer) {
@@ -21,6 +22,7 @@ export const useWalletLoadingState = <
     };
     const setConnectingEnd = () => {
       setConnecting(false);
+      setReady(true);
     };
     const setSyncingStart = () => {
       setSyncing(true);
@@ -28,6 +30,7 @@ export const useWalletLoadingState = <
     const setSyncingEnd = () => {
       setSyncing(false);
     };
+    const onDisconnect = () => setReady(false);
 
     state.observer.addEventListener(
       EWalletObserverEvents.CONNECT_WALLET_START,
@@ -45,6 +48,10 @@ export const useWalletLoadingState = <
       EWalletObserverEvents.SYNCING_WALLET_END,
       setSyncingEnd
     );
+    state.observer.addEventListener(
+      EWalletObserverEvents.DISCONNECT,
+      onDisconnect
+    );
 
     return () => {
       state.observer.removeEventListener(
@@ -63,15 +70,20 @@ export const useWalletLoadingState = <
         EWalletObserverEvents.SYNCING_WALLET_END,
         setSyncingEnd
       );
+      state.observer.removeEventListener(
+        EWalletObserverEvents.DISCONNECT,
+        onDisconnect
+      );
     };
-  }, [state.observer, setConnecting, setSyncing]);
+  }, [state.observer, setConnecting, setSyncing, setReady]);
 
   const memoizedState = useMemo(
     () => ({
       connectingWallet: connecting,
       syncingWallet: syncing,
+      ready,
     }),
-    []
+    [connecting, syncing, ready]
   );
 
   return memoizedState;

package/src/react-components/hooks/useWalletObserver.ts

@@ -18,7 +18,6 @@ export const useWalletObserver = <
 
   const memoizedState = useMemo(() => {
     const result: TUseWalletObserverState<AssetMetadata> = {
-      ready: Boolean(state.activeWallet && state.observer.api),
       isCip45: state.isCip45,
       activeWallet: state.activeWallet,
       adaBalance: state.adaBalance,
@@ -53,7 +52,6 @@ export const useWalletObserver = <
     state.usedAddresses,
     state.utxos,
     state.collateral,
-    state.ready,
     state.isCip45,
     state.switching,
   ]);

package/src/react-components/hooks/useWalletPeerConnect.tsx

@@ -1,6 +1,6 @@
 import { IAssetAmountMetadata } from "@sundaeswap/asset";
-
 import { MutableRefObject, useEffect, useMemo, useRef, useState } from "react";
+
 import { TGetPeerConnectInstance } from "../../@types/observer.js";
 import { useWalletObserver } from "./useWalletObserver.js";
 
@@ -22,7 +22,7 @@ export const useWalletPeerConnect = <
       .getCip45Instance()
       .then((res) => setPeerConnect(res))
       .catch((e) => setError((e as Error).message));
-  }, [state.observer, state.ready, setPeerConnect, setError]);
+  }, [state.observer, setPeerConnect, setError]);
 
   useEffect(() => {
     if (peerConnect && qrCode.current) {