@openocean.finance/widget 1.0.41 → 1.0.44

package/src/hooks/useAvailableChains.ts

@@ -1,10 +1,10 @@
 import type { ExtendedChain } from '@openocean.finance/widget-sdk'
-import { ChainType, config, getChains } from '@openocean.finance/widget-sdk'
+import { ChainType, CoinKey, ChainKey, config, getChains } from '@openocean.finance/widget-sdk'
+// import type { ChainKey, CoinKey } from '@openocean.finance/widget-types'
 import { useQuery } from '@tanstack/react-query'
 import { useCallback } from 'react'
 import { useWidgetConfig } from '../providers/WidgetProvider/WidgetProvider.js'
 import { isItemAllowed } from '../utils/item.js'
-import { CoinKey } from '../index.js'
 import { DEFAULT_CHAIN_IDS } from '../config/defaultChainIds.js';
 
 export type GetChainById = (
@@ -39,6 +39,53 @@ export const useAvailableChains = (chainTypes?: ChainType[]) => {
         solanaChain.chainType = ChainType.SVM;
         solanaChain.id = 1151111081099710;
       }
+      const nearChain = availableChains.find((chain) => chain.key === 'near')
+      if (nearChain) {
+        nearChain.chainType = ChainType.NVM;
+        nearChain.id = 20000000000006;
+      }
+      availableChains.push({
+        key: 'btc' as ChainKey.BTC,
+        chainType: 'UTXO' as ChainType,
+        name: 'Bitcoin',
+        coin: 'BTC' as CoinKey.BTC as CoinKey,
+        id: 20000000000001,
+        mainnet: true,
+        logoURI: 'https://raw.githubusercontent.com/lifinance/types/main/src/assets/icons/chains/bitcoin.svg',
+        tokenlistUrl: '',
+        multicallAddress: '',
+        relayerSupported: false,
+        metamask: {
+          "chainId": "20000000000001",
+          "blockExplorerUrls": [
+            "https://mempool.space/",
+            "https://blockchair.com/bitcoin/"
+          ],
+          "chainName": "Bitcoin",
+          "nativeCurrency": {
+            "name": "BTC",
+            "symbol": "BTC",
+            "decimals": 8
+          },
+          "rpcUrls": [
+            "https://node-router.thorswap.net/bitcoin",
+            "https://rpc.ankr.com/btc",
+            "https://bitcoin-rpc.publicnode.com"
+          ]
+        },
+        nativeToken: {
+          address: "bitcoin",
+          chainId: 20000000000001,
+          symbol: "BTC",
+          decimals: 8,
+          name: "Bitcoin",
+          logoURI: "https://assets.coingecko.com/coins/images/1/standard/bitcoin.png",
+          priceUSD: "88366"
+        },
+        permit2: '',
+        permit2Proxy: '',
+      })
+
       // allow chains "starknet","aptos","near","ont","sui",
       const allowedChainsIds = chains?.allow?.length ? chains.allow : DEFAULT_CHAIN_IDS;
       const allowedChains = availableChains.filter((chain) => {
@@ -47,46 +94,7 @@ export const useAvailableChains = (chainTypes?: ChainType[]) => {
         }
         return false
       })
-      /*
-      allowedChains.push({
-        "key":"eth",
-        "chainType":ChainType.EVM,
-        "name":"Ethereum",
-        "coin":CoinKey.WETH,
-        "id":1,
-        "mainnet":true,
-        "logoURI":"https://raw.githubusercontent.com/lifinance/types/main/src/assets/icons/chains/ethereum.svg",
-        "tokenlistUrl":"https://gateway.ipfs.io/ipns/tokens.uniswap.org",
-        "multicallAddress":"0xcA11bde05977b3631167028862bE2a173976CA11",
-        "relayerSupported":false,
-        "metamask":{
-          "chainId":"0x1",
-          "blockExplorerUrls":["https://etherscan.io/"],
-          "chainName":"Ethereum Mainnet",
-          "nativeCurrency":{
-            "name":"ETH",
-            "symbol":"ETH",
-            "decimals":18
-          },
-          "rpcUrls":[
-            "https://ethereum-rpc.publicnode.com",
-            "https://eth.drpc.org"
-          ]
-        },
-        "nativeToken":{
-          "address":"0x0000000000000000000000000000000000000000",
-          "chainId":1,"symbol":
-          "ETH","decimals":18,
-          "name":"ETH",
-          "coinKey":"ETH",
-          "logoURI":"https://raw.githubusercontent.com/trustwallet/assets/master/blockchains/ethereum/assets/0xC02aaA39b223FE8D0A0e5C4F27eAD9083C756Cc2/logo.png",
-          "priceUSD":"3804.11"
-        },
-        "diamondAddress":"0x1231DEB6f5749EF6cE6943a275A1D3E7486F4EaE",
-        "permit2":"0x000000000022D473030F116dDEE9F6B43aC78BA3",
-        "permit2Proxy":"0x89c6340B1a1f4b25D36cd8B063D49045caF3f818"
-      })
-      */
+
       config.setChains(allowedChains)
       return allowedChains
     },
@@ -104,7 +112,6 @@ export const useAvailableChains = (chainTypes?: ChainType[]) => {
     },
     [data]
   )
-
   return {
     chains: data,
     getChainById,

package/src/hooks/useChains.ts

@@ -25,7 +25,6 @@ export const useChains = (type?: FormType, chainTypes?: ChainType[]) => {
       : availableChains?.filter((chain) => isItemAllowed(chain.id, chains))
     return filteredChains
   }, [availableChains, chainTypes, chains, type])
-
   return {
     chains: filteredChains,
     getChainById,

package/src/hooks/useExplorer.ts

@@ -6,13 +6,13 @@ const sanitiseBaseUrl = (baseUrl: string) => baseUrl.trim().replace(/\/+$/, '')
 
 export type TransactionLinkProps = { chain?: Chain | number } & (
   | {
-      txHash: string
-      txLink?: never
-    }
+    txHash: string
+    txLink?: never
+  }
   | {
-      txHash?: never
-      txLink: string
-    }
+    txHash?: never
+    txLink: string
+  }
 )
 
 export const useExplorer = () => {

package/src/hooks/useRoutes.ts

@@ -94,7 +94,7 @@ export const useRoutes = ({ observableRoute }: RoutesProps = {}) => {
 
   const toAddress =
     fromChainId === toChainId ||
-    (fromChain?.chainType === 'EVM' && toChain?.chainType === 'EVM')
+      (fromChain?.chainType === 'EVM' && toChain?.chainType === 'EVM')
       ? account.address
       : _toAddress
   // When bridging between ecosystems, we need to ensure toAddress is set and has the same chainType as toChain
@@ -197,6 +197,7 @@ export const useRoutes = ({ observableRoute }: RoutesProps = {}) => {
                 name: fromToken.name,
                 icon: fromToken.logoURI,
                 chainId: fromChainId,
+                isNative: fromToken.isNative,
               }
               const toMsg = {
                 address: toTokenAddress,
@@ -205,6 +206,7 @@ export const useRoutes = ({ observableRoute }: RoutesProps = {}) => {
                 name: toToken.name,
                 icon: toToken.logoURI,
                 chainId: toChainId,
+                isNative: toToken.isNative,
               }
 
               // Get appropriate wallet client based on chain type
@@ -244,7 +246,12 @@ export const useRoutes = ({ observableRoute }: RoutesProps = {}) => {
               // })
               // Add a flag or modify structure to indicate it's a Debridge route
               if (quoteResult) {
-                quoteResult.isBridge = true
+                if (quoteResult.error) {
+                  throw new Error(quoteResult.error)
+                }
+                if (quoteResult.data) {
+                  quoteResult.isBridge = true
+                }
               }
             } else {
               console.warn(
@@ -394,7 +401,8 @@ export const useRoutes = ({ observableRoute }: RoutesProps = {}) => {
           return routes
         } catch (error) {
           console.error('Failed to fetch OpenOcean routes:', error)
-          return []
+          useServerErrorStore.getState().setError((error as Error).message)
+          // throw new Error((error as Error).message)
         }
       },
       enabled: isEnabled,
@@ -415,7 +423,7 @@ export const useRoutes = ({ observableRoute }: RoutesProps = {}) => {
         if (error?.code === OpenOceanErrorCode.NotFound) {
           return false
         }
-        return true
+        return false
       },
     })
 

package/src/hooks/useTokenAddressBalance.ts

@@ -12,7 +12,7 @@ export const useTokenAddressBalance = (
   const token = useMemo(() => {
     if (tokenAddress && chainId) {
       const token = (tokensWithBalance ?? tokens)?.find(
-        (token) => token.address === tokenAddress && token.chainId === chainId
+        (token: any) => token.address === tokenAddress && token.chainId === chainId
       )
       return token as TokenAmount
     }

package/src/hooks/useTokens.ts

@@ -5,6 +5,16 @@ import { OpenOceanService } from '../services/OpenOceanService.js'
 import type { TokenAmount } from '../types/token.js'
 import { useChains } from './useChains.js'
 
+export const isNativeToken = (token: string) => {
+  return [
+    '0xeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee',
+    '0x0000000000000000000000000000000000001010',
+    '0x0000000000000000000000000000000000000000',
+    '0x1',
+    "bitcoin",
+  ].indexOf(token.toLowerCase()) >= 0;
+};
+
 export const useTokens = (selectedChainId?: number) => {
   const { tokens: configTokens } = useWidgetConfig()
   const { data, isLoading } = useQuery({
@@ -16,6 +26,11 @@ export const useTokens = (selectedChainId?: number) => {
       const tokens = await OpenOceanService.getTokenList(
         selectedChainId.toString()
       )
+      tokens.forEach((token: any) => {
+        if (!(token as any).isNative) {
+          (token as any).isNative = isNativeToken(token.address)
+        }
+      })
       return {
         tokens: {
           [selectedChainId]: tokens,
@@ -64,14 +79,14 @@ export const useTokens = (selectedChainId?: number) => {
 
       if (allowedTokensSet.size || deniedTokenAddressesSet.size) {
         filteredTokens = filteredTokens.filter(
-          (token) =>
+          (token: any) =>
             (!allowedTokensSet.size || allowedTokensSet.has(token.address)) &&
             !deniedTokenAddressesSet.has(token.address)
         )
       }
     }
     const filteredTokensMap = new Map(
-      filteredTokens.map((token) => [token.address, token])
+      filteredTokens.map((token: any) => [token.address, token])
     )
 
     const [popularTokens, featuredTokens] = (
@@ -83,7 +98,7 @@ export const useTokens = (selectedChainId?: number) => {
 
       const populatedConfigTokens = typedConfigTokens?.map((token) => {
         // Mark token as popular
-        token[tokenType] = true
+        (token as any)[tokenType] = true
         // Check if this token exists in the filteredTokensMap and add priceUSD if it does
         const matchingFilteredToken = filteredTokensMap.get(token.address)
         if ((matchingFilteredToken as any)?.priceUSD) {
@@ -97,10 +112,10 @@ export const useTokens = (selectedChainId?: number) => {
 
       if (populatedConfigTokens?.length) {
         const configTokenAddresses = new Set(
-          populatedConfigTokens?.map((token) => token.address)
+          populatedConfigTokens?.map((token: any) => token.address)
         )
         filteredTokens = filteredTokens.filter(
-          (token) => !configTokenAddresses.has(token.address)
+          (token: any) => !configTokenAddresses.has(token.address)
         )
         populatedConfigTokens.push(...filteredTokens)
         filteredTokens = populatedConfigTokens

package/src/index.ts

@@ -1,4 +1,3 @@
-
 export type * from '@openocean.finance/widget-sdk'
 export { ChainType, ChainId, CoinKey } from '@openocean.finance/widget-sdk'
 export { App as OpenOceanWidget } from './App.js'

package/src/pages/MainPage/MainPage.tsx

@@ -54,7 +54,7 @@ export const MainPage: React.FC = () => {
       ) : null} */}
       {/* {!wideVariant ? <Routes sx={marginSx} /> : null} */}
       {subvariantState === 'bridge' && <SendToWalletButton sx={marginSx} />}
-      <GasRefuelMessage mb={2} />
+      {/* <GasRefuelMessage mb={2} /> */}
       <MainWarningMessages route={routes?.[0]} mb={2} />
       {/*<Box
         sx={{

package/src/pages/MainPage/MainWarningMessages.tsx

@@ -10,6 +10,5 @@ export const MainWarningMessages: React.FC<MainWarningMessagesProps> = (
   props
 ) => {
   const currentRoute = props.route
-
   return <WarningMessages route={currentRoute} {...props} />
 }

package/src/pages/SendToWallet/BookmarksPage.tsx

@@ -123,7 +123,7 @@ export const BookmarksPage = () => {
             >
               <ListItemAvatar>
                 <AccountAvatar
-                  chainId={defaultChainIdsByType[bookmark.chainType]}
+                  chainId={defaultChainIdsByType[bookmark.chainType || '']}
                 />
               </ListItemAvatar>
               <ListItemText

package/src/pages/SendToWallet/RecentWalletsPage.tsx

@@ -99,7 +99,7 @@ export const RecentWalletsPage = () => {
       window.open(
         getAddressLink(
           selectedRecent.address,
-          defaultChainIdsByType[selectedRecent.chainType]
+          defaultChainIdsByType[selectedRecent.chainType || '']
         ),
         '_blank'
       )
@@ -136,7 +136,7 @@ export const RecentWalletsPage = () => {
             >
               <ListItemAvatar>
                 <AccountAvatar
-                  chainId={defaultChainIdsByType[recentWallet.chainType]}
+                  chainId={defaultChainIdsByType[recentWallet.chainType || '']}
                 />
               </ListItemAvatar>
               <ListItemText

package/src/pages/SendToWallet/SendToConfiguredWalletPage.tsx

@@ -71,7 +71,7 @@ export const SendToConfiguredWalletPage = () => {
       window.open(
         getAddressLink(
           selectedToAddress.address,
-          defaultChainIdsByType[selectedToAddress.chainType]
+          defaultChainIdsByType[selectedToAddress.chainType || '']
         ),
         '_blank'
       )
@@ -93,7 +93,7 @@ export const SendToConfiguredWalletPage = () => {
             >
               <ListItemAvatar>
                 <AccountAvatar
-                  chainId={defaultChainIdsByType[toAddress.chainType]}
+                  chainId={defaultChainIdsByType[toAddress.chainType || '']}
                   toAddress={toAddress}
                 />
               </ListItemAvatar>

package/src/providers/WidgetProvider/WidgetProvider.tsx

@@ -61,7 +61,6 @@ export const WidgetProvider: React.FC<
       } else {
         config.set(_config)
       }
-
       return value
     } catch (e) {
       console.warn(e)