@sundaeswap/wallet-lite 0.0.16 → 0.0.18

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

@@ -3,6 +3,8 @@ import { useCallback, useEffect, useMemo, useState } from "react";
 import { IHandle } from "@koralabs/adahandle-sdk";
 import { IAssetAmountMetadata } from "@sundaeswap/asset";
 import { TAssetAmountMap } from "../../@types/observer.js";
+import { WalletAssetMap } from "../../classes/WalletAssetMap.class.js";
+import { normalizeAssetIdWithDot } from "../../utils/assets.js";
 import { THandleMetadata } from "../contexts/observer/types.js";
 import { useWalletObserver } from "./useWalletObserver.js";
 
@@ -13,7 +15,7 @@ export const useWalletHandles = <
   const [loadingHandles, setLoadingHandles] = useState(true);
   const [handles, setHandles] = useState<
     TAssetAmountMap<THandleMetadata<AssetMetadata>>
-  >(new Map());
+  >(new WalletAssetMap());
   const memoizedHandleDep = useMemo(
     () => [...state.balance.getHandles().keys()],
     [state.balance]
@@ -24,10 +26,9 @@ export const useWalletHandles = <
   >(async () => {
     // Make a copy of our wallet map.
     const walletHandles: TAssetAmountMap<THandleMetadata<AssetMetadata>> =
-      new Map([...state.balance.getHandles()]);
+      new WalletAssetMap([...state.balance.getHandles()]);
 
     if (walletHandles.size === 0) {
-      setLoadingHandles(false);
       return walletHandles;
     }
 
@@ -53,30 +54,31 @@ export const useWalletHandles = <
       const walletHandleDataArray: IHandle[] = await sdk
         .provider()
         .getAllDataBatch(
-          walletHandlesWithDataArray.map(([key]) => ({ value: key.slice(56) }))
+          walletHandlesWithDataArray.map(([key]) => ({
+            value: key.split(".")[1],
+          }))
         );
 
       walletHandlesWithDataArray.forEach(([key, asset]) => {
         const matchingData = walletHandleDataArray.find(
-          ({ hex }) => hex === key.slice(56)
+          ({ hex }) => hex === key.split(".")[1]
         ) as IHandle;
 
         walletHandles.set(
-          key,
+          normalizeAssetIdWithDot(key),
           asset
             .withMetadata({
               ...matchingData,
               ...asset.metadata,
+              assetId: normalizeAssetIdWithDot(asset.metadata.assetId),
               decimals: 0,
             })
             .withAmount(1n)
         );
       });
 
-      setLoadingHandles(false);
       return walletHandles;
     } catch (e) {
-      setLoadingHandles(false);
       console.log(e);
       return walletHandles;
     }
@@ -84,31 +86,33 @@ export const useWalletHandles = <
   }, [state.balance, setLoadingHandles]);
 
   useEffect(() => {
-    syncHandles().then((newHandles) => {
-      setHandles((prevHandles) => {
-        let handleMetadataChanged = false;
-
-        if (newHandles.size !== prevHandles?.size) {
-          handleMetadataChanged = true;
-        } else {
-          for (const [key, val] of newHandles) {
-            if (
-              !prevHandles.has(key) ||
-              prevHandles.get(key)?.amount !== val?.amount
-            ) {
-              handleMetadataChanged = true;
+    syncHandles()
+      .then((newHandles) => {
+        setHandles((prevHandles) => {
+          let handleMetadataChanged = false;
+
+          if (newHandles.size !== prevHandles?.size) {
+            handleMetadataChanged = true;
+          } else {
+            for (const [key, val] of newHandles) {
+              if (
+                !prevHandles.has(key) ||
+                prevHandles.get(key)?.amount !== val?.amount
+              ) {
+                handleMetadataChanged = true;
+              }
             }
           }
-        }
 
-        if (!handleMetadataChanged) {
-          return prevHandles;
-        }
+          if (!handleMetadataChanged) {
+            return prevHandles;
+          }
 
-        return newHandles;
-      });
-    });
-  }, [memoizedHandleDep, syncHandles, setHandles]);
+          return newHandles;
+        });
+      })
+      .then(() => setLoadingHandles((prevValue) => !prevValue));
+  }, [memoizedHandleDep, syncHandles, setHandles, setLoadingHandles]);
 
   const data = useMemo(
     () => ({
@@ -118,5 +122,7 @@ export const useWalletHandles = <
     [handles, loadingHandles]
   );
 
+  console.log(handles, loadingHandles);
+
   return data;
 };

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

@@ -27,6 +27,7 @@ export const useWalletObserver = <
       stakeAddress: state.stakeAddress,
       network: state.network,
       utxos: state.utxos,
+      collateral: state.collateral,
       observer: state.observer,
       syncWallet: state.syncWallet,
       unusedAddresses: state.unusedAddresses,
@@ -46,6 +47,7 @@ export const useWalletObserver = <
     state.unusedAddresses,
     state.usedAddresses,
     state.utxos,
+    state.collateral,
     state.ready,
     state.isCip45,
   ]);

package/src/utils/assets.ts

@@ -0,0 +1,31 @@
+import { WalletObserver } from "../classes/WalletObserver.class.js";
+
+/**
+ * Helper function to normalize asset ID notation.
+ *
+ * @param {string} assetId The asset ID as a HEX string (either with dot or without).
+ * @returns {string}
+ */
+export const normalizeAssetIdWithDot = (assetId: string): string => {
+  if (assetId.includes(".") || assetId === WalletObserver.ADA_ASSET_ID) {
+    return assetId;
+  }
+
+  const policyId = assetId.slice(0, 56);
+  const assetName = assetId.slice(56);
+
+  if (assetName) {
+    return `${policyId}.${assetName}`;
+  }
+
+  return policyId;
+};
+
+/**
+ * Helper function to internally check if an asset is ADA.
+ *
+ * @param {string} id The asset id.
+ * @returns {boolean}
+ */
+export const isAdaAsset = (id: string): boolean =>
+  id === WalletObserver.ADA_ASSET_ID;