@unisat/wallet-state 1.0.5 → 1.2.0

package/src/ui-hooks/useAddressTypeScreenLogic.ts

@@ -0,0 +1,160 @@
+import { useEffect, useMemo, useRef, useState } from 'react'
+
+import { numUtils } from '@unisat/base-utils'
+import { ADDRESS_TYPES, KeyringType } from '@unisat/keyring-service/types'
+import { getAccountDerivationPath } from '@unisat/wallet-shared'
+import { AddressType } from '@unisat/wallet-types'
+import {
+  useAppDispatch,
+  useCurrentAccount,
+  useCurrentKeyring,
+  useI18n,
+  useNavigation,
+  useReloadAccounts,
+  useTools,
+  useWallet,
+} from '..'
+
+interface AddressTypeItem {
+  address: string
+  assets: { total_btc: string; satoshis: number; total_inscription: number }
+  name: string
+  value: AddressType
+}
+
+export function useAddressTypeScreenLogic() {
+  //   const isInTab = useExtensionIsInTab()
+  const { t } = useI18n()
+
+  const wallet = useWallet()
+  const currentKeyring = useCurrentKeyring()
+  const account = useCurrentAccount()
+
+  const nav = useNavigation()
+  const dispatch = useAppDispatch()
+  const reloadAccounts = useReloadAccounts()
+  const [addresses, setAddresses] = useState<string[]>([])
+  const [addressAssets, setAddressAssets] = useState<{
+    [key: string]: { total_btc: string; satoshis: number; total_inscription: number }
+  }>({})
+
+  const selfRef = useRef<{
+    addressAssets: {
+      [key: string]: { total_btc: string; satoshis: number; total_inscription: number }
+    }
+  }>({
+    addressAssets: {},
+  })
+  const self = selfRef.current
+
+  const tools = useTools()
+  const loadAddresses = async () => {
+    try {
+      tools.showLoading(true)
+      const _res = await wallet.getAllAddresses(currentKeyring, account.index || 0)
+      setAddresses(_res)
+      const balances = await wallet.getMultiAddressAssets(_res.join(','))
+      for (let i = 0; i < _res.length; i++) {
+        const address = _res[i]
+        const balance = balances[i]
+        const satoshis = balance.totalSatoshis
+        self.addressAssets[address] = {
+          total_btc: numUtils.satoshisToAmount(balance.totalSatoshis),
+          satoshis,
+          total_inscription: balance.inscriptionCount,
+        }
+      }
+      setAddressAssets(self.addressAssets)
+    } catch (e) {
+      console.error(e)
+    } finally {
+      tools.showLoading(false)
+    }
+  }
+
+  useEffect(() => {
+    loadAddresses()
+  }, [])
+
+  const addressTypes = useMemo(() => {
+    // Cold wallets do not allow switching address types, only show the current type
+    if (currentKeyring.type === KeyringType.ColdWalletKeyring) {
+      return ADDRESS_TYPES.filter(v => v.value === currentKeyring.addressType)
+    }
+
+    if (currentKeyring.type === KeyringType.HdKeyring) {
+      return ADDRESS_TYPES.filter(v => {
+        if (v.displayIndex < 0) {
+          return false
+        }
+        // MagicEden only supports P2WPKH and P2TR
+        if (currentKeyring.accountIndexDerivation) {
+          return v.value === AddressType.P2WPKH || v.value === AddressType.P2TR
+        }
+        const address = addresses[v.value]
+        const balance = addressAssets[address]
+        if (v.isUnisatLegacy) {
+          if (!balance || balance.satoshis == 0) {
+            return false
+          }
+        }
+        return true
+      }).sort((a, b) => a.displayIndex - b.displayIndex)
+    } else {
+      return ADDRESS_TYPES.filter(v => v.displayIndex >= 0 && v.isUnisatLegacy != true).sort(
+        (a, b) => a.displayIndex - b.displayIndex
+      )
+    }
+  }, [currentKeyring.type, currentKeyring.addressType, addressAssets, addresses])
+
+  const items: AddressTypeItem[] = useMemo(() => {
+    return addressTypes.map(v => {
+      const address = addresses[v.value]
+      const assets = addressAssets[address] || {
+        total_btc: '--',
+        satoshis: 0,
+        total_inscription: 0,
+      }
+      const derivedPath = getAccountDerivationPath(v.hdPath, account.index || 0, currentKeyring.accountIndexDerivation)
+      let name = `${v.name} (${derivedPath})`
+      if (currentKeyring.type === KeyringType.SimpleKeyring) {
+        name = `${v.name}`
+      } else if (currentKeyring.type === KeyringType.ColdWalletKeyring) {
+        name = `❄️ ${v.name} (${derivedPath}) - ${t('Fixed by cold wallet')}`
+      }
+
+      return {
+        address,
+        assets,
+        name,
+        value: v.value,
+      }
+    })
+  }, [addressTypes])
+
+  const onClickItem = async (item: AddressTypeItem) => {
+    if (item.value == currentKeyring.addressType) {
+      return
+    }
+
+    // Cold wallets do not allow switching address types
+    if (currentKeyring.type === KeyringType.ColdWalletKeyring) {
+      tools.toastError(t('Cold wallet address type cannot be changed'))
+      return
+    }
+
+    await wallet.changeAddressType(item.value)
+    reloadAccounts()
+    // navigate('MainScreen')
+    tools.toastSuccess(t('address_type_changed'))
+
+    nav.navToTab()
+  }
+
+  return {
+    currentKeyring,
+    items,
+    wallet,
+    onClickItem,
+  }
+}

package/src/ui-hooks/useAlkanesBalanceCardLogic.ts

@@ -0,0 +1,41 @@
+import { bnUtils, numUtils } from '@unisat/base-utils'
+import { AlkanesBalance, TickPriceItem } from '@unisat/wallet-shared'
+import { useAlkanesIconInfo, useChain } from 'src/hooks'
+
+export interface AlkanesBalanceCardProps {
+  tokenBalance: AlkanesBalance
+  onClick?: () => void
+  price?: TickPriceItem
+}
+export function useAlkanesBalanceCardLogic(props: AlkanesBalanceCardProps) {
+  const { tokenBalance, onClick, price } = props
+
+  const chain = useChain()
+  const showPrice = chain.showPrice && price !== undefined
+
+  const balance = bnUtils.toDecimalNumber(tokenBalance.amount, tokenBalance.divisibility)
+  let balanceStr = balance.toString()
+  if (balance.lt(0.0001)) {
+    balanceStr = '<0.0001'
+  } else {
+    balanceStr = numUtils.showLongNumber(balance.toString())
+  }
+
+  const iconInfo = useAlkanesIconInfo(tokenBalance.name, tokenBalance.alkaneid)
+
+  return {
+    // balance
+    tokenBalance,
+    balance,
+    balanceStr,
+
+    // price
+    showPrice,
+    price,
+
+    // icon
+    iconInfo,
+
+    onClick,
+  }
+}

package/src/ui-hooks/useAlkanesCollectionListLogic.ts

@@ -0,0 +1,68 @@
+import { AlkanesCollection } from '@unisat/wallet-shared'
+
+import { useEffect, useRef } from 'react'
+import {
+  AlkanesAssetTabKey,
+  getSupportedAssets,
+  useAlkanesAssetTabKey,
+  useChainType,
+  useCurrentAccount,
+  useNavigation,
+  useWallet,
+  useWallTabFocusRefresh,
+} from '..'
+import { useInfiniteList } from './useInfiniteList'
+
+export function useAlkanesCollectionListLogic() {
+  const nav = useNavigation()
+  const wallet = useWallet()
+  const currentAccount = useCurrentAccount()
+  const chainType = useChainType()
+
+  const {
+    data: items,
+    total,
+    loading,
+    hasMore,
+    onRefresh,
+    onLoadMore,
+  } = useInfiniteList<AlkanesCollection>({
+    fetcher: async (page, pageSize) => {
+      const supportedAssets = getSupportedAssets(chainType, currentAccount.address)
+      if (!supportedAssets.assets.alkanes || currentAccount.address === '') {
+        return { list: [], total: 0 }
+      }
+      const { list, total } = await wallet.getAlkanesCollectionList(
+        currentAccount.address,
+        page,
+        pageSize
+      )
+
+      return { list, total }
+    },
+    dependencies: [currentAccount.address, chainType],
+  })
+
+  const tabKey = useAlkanesAssetTabKey()
+  const isFocus = tabKey === AlkanesAssetTabKey.COLLECTION
+  const lastRefreshTimeRef = useRef<number>(0)
+  const walletTabFocusRefresh = useWallTabFocusRefresh()
+  useEffect(() => {
+    if (!isFocus) return
+
+    // already refreshed → do nothing
+    const alreadyRefreshed = lastRefreshTimeRef.current === walletTabFocusRefresh
+    if (alreadyRefreshed) return
+
+    onRefresh()
+
+    // mark refreshed
+    lastRefreshTimeRef.current = walletTabFocusRefresh
+  }, [walletTabFocusRefresh, isFocus])
+
+  const onClickItem = (item: AlkanesCollection) => {
+    nav.navigate('AlkanesCollectionScreen', { collectionId: item.alkaneid })
+  }
+
+  return { items, total, loading, hasMore, onRefresh, onLoadMore, onClickItem }
+}

package/src/ui-hooks/useAlkanesListLogic.ts

@@ -0,0 +1,69 @@
+import { useEffect, useRef, useState } from 'react'
+
+import { AlkanesBalance, TickPriceItem } from '@unisat/wallet-shared'
+
+import {
+  AlkanesAssetTabKey,
+  getSupportedAssets,
+  useAlkanesAssetTabKey,
+  useChainType,
+  useCurrentAccount,
+  useNavigation,
+  useWallet,
+  useWallTabFocusRefresh,
+} from '..'
+import { useInfiniteList } from './useInfiniteList'
+
+export function useAlkanesListLogic() {
+  const nav = useNavigation()
+  const wallet = useWallet()
+  const currentAccount = useCurrentAccount()
+  const chainType = useChainType()
+  const [priceMap, setPriceMap] = useState<{ [key: string]: TickPriceItem }>({})
+
+  const {
+    data: items,
+    total,
+    loading,
+    hasMore,
+    onRefresh,
+    onLoadMore,
+  } = useInfiniteList<AlkanesBalance>({
+    fetcher: async (page, pageSize) => {
+      const supportedAssets = getSupportedAssets(chainType, currentAccount.address)
+      if (!supportedAssets.assets.alkanes || currentAccount.address === '') {
+        return { list: [], total: 0 }
+      }
+
+      const { list, total } = await wallet.getAlkanesList(currentAccount.address, page, pageSize)
+      if (list.length > 0) {
+        wallet.getAlkanesPrice(list.map(item => item.alkaneid)).then(setPriceMap)
+      }
+      return { list, total }
+    },
+    dependencies: [currentAccount.address, chainType],
+  })
+
+  const tabKey = useAlkanesAssetTabKey()
+  const isFocus = tabKey === AlkanesAssetTabKey.TOKEN
+  const lastRefreshTimeRef = useRef<number>(0)
+  const walletTabFocusRefresh = useWallTabFocusRefresh()
+  useEffect(() => {
+    if (!isFocus) return
+
+    // already refreshed → do nothing
+    const alreadyRefreshed = lastRefreshTimeRef.current === walletTabFocusRefresh
+    if (alreadyRefreshed) return
+
+    onRefresh()
+
+    // mark refreshed
+    lastRefreshTimeRef.current = walletTabFocusRefresh
+  }, [walletTabFocusRefresh, isFocus])
+
+  const onClickItem = (item: AlkanesBalance) => {
+    nav.navigate('AlkanesTokenScreen', { alkaneid: item.alkaneid })
+  }
+
+  return { items, total, loading, hasMore, onRefresh, onLoadMore, onClickItem, priceMap }
+}

package/src/ui-hooks/useAlkanesNFTListLogic.ts

@@ -0,0 +1,42 @@
+import { AlkanesInfo } from '@unisat/wallet-shared'
+
+import { getSupportedAssets, useChainType, useCurrentAccount, useNavigation, useWallet } from '..'
+import { useInfiniteList } from './useInfiniteList'
+
+export function useAlkanesNFTListLogic(collectionId: string) {
+  const nav = useNavigation()
+  const wallet = useWallet()
+  const currentAccount = useCurrentAccount()
+  const chainType = useChainType()
+
+  const {
+    data: items,
+    total,
+    loading,
+    hasMore,
+    onRefresh,
+    onLoadMore,
+  } = useInfiniteList<AlkanesInfo>({
+    fetcher: async (page, pageSize) => {
+      const supportedAssets = getSupportedAssets(chainType, currentAccount.address)
+      if (!supportedAssets.assets.alkanes || currentAccount.address === '') {
+        return { list: [], total: 0 }
+      }
+      const { list, total } = await wallet.getAlkanesCollectionItems(
+        currentAccount.address,
+        collectionId,
+        page,
+        pageSize
+      )
+
+      return { list, total }
+    },
+    dependencies: [currentAccount.address, collectionId, chainType],
+  })
+
+  const onClickItem = (item: AlkanesInfo) => {
+    nav.navigate('AlkanesNFTScreen', { alkanesInfo: item })
+  }
+
+  return { items, total, loading, hasMore, onRefresh, onLoadMore, onClickItem }
+}

package/src/ui-hooks/useAlkanesNFTScreenLogic.ts

@@ -0,0 +1,45 @@
+import { useEffect, useState } from 'react'
+import { useI18n, useNavigation, useWallet } from 'src/context'
+import { useResetTxState } from 'src/hooks'
+
+export function useAlkanesNFTScreenLogic() {
+  const nav = useNavigation()
+  const { alkanesInfo } = nav.getRouteState<'AlkanesNFTScreen'>()
+
+  const { t } = useI18n()
+
+  const resetTxState = useResetTxState()
+
+  const [availableUtxo, setAvailableUtxo] = useState(0)
+  const wallet = useWallet()
+
+  useEffect(() => {
+    const fetchData = async () => {
+      const utxos = await wallet.getAssetUtxosAlkanes(alkanesInfo.alkaneid)
+      setAvailableUtxo(utxos.length)
+    }
+    fetchData()
+  }, [wallet])
+
+  const onClickBack = () => {
+    nav.goBack()
+  }
+
+  const onClickSend = () => {
+    resetTxState()
+    nav.navigate('SendAlkanesNFTScreen', {
+      alkanesInfo,
+    })
+  }
+
+  const disabledSend = availableUtxo <= 0
+
+  return {
+    alkanesInfo,
+    t,
+    availableUtxo,
+    onClickBack,
+    onClickSend,
+    disabledSend,
+  }
+}

package/src/ui-hooks/useAlkanesTokenScreenLogic.ts

@@ -0,0 +1,138 @@
+import { useEffect, useMemo, useState } from 'react'
+
+import { AddressAlkanesTokenSummary } from '@unisat/wallet-shared'
+import {
+  useAlkanesIconInfo,
+  useAlkanesTokenInfoExplorerUrl,
+  useCurrentAccount,
+  useI18n,
+  useNavigation,
+  useResetTxState,
+  useTools,
+  useWallet,
+} from '..'
+
+export function useAlkanesTokenScreenLogic() {
+  const nav = useNavigation()
+  const { alkaneid } = nav.getRouteState<'AlkanesTokenScreen'>()
+  const [tokenSummary, setTokenSummary] = useState<AddressAlkanesTokenSummary>({
+    tokenBalance: {
+      alkaneid: '',
+      name: '',
+      amount: '',
+      symbol: '',
+      divisibility: 0,
+      available: '',
+    },
+    tokenInfo: {
+      alkaneid: '',
+      name: '',
+      symbol: '',
+      totalSupply: '10000000000000',
+      maxSupply: '10000000000000',
+      cap: 0,
+      mintable: false,
+      perMint: '0',
+      minted: 0,
+      holders: 0,
+      aligned: true,
+      nftData: {
+        collectionId: '',
+      },
+      logo: '',
+    },
+    tradeUrl: '',
+    mintUrl: '',
+  })
+
+  const wallet = useWallet()
+
+  const account = useCurrentAccount()
+
+  const [loading, setLoading] = useState(true)
+
+  const [warning, setWarning] = useState(false)
+
+  const { t } = useI18n()
+
+  useEffect(() => {
+    wallet.getAddressAlkanesTokenSummary(account.address, alkaneid, false).then(tokenSummary => {
+      setTokenSummary(tokenSummary)
+      setLoading(false)
+    })
+  }, [])
+
+  const resetTxState = useResetTxState()
+
+  const enableMint = useMemo(() => {
+    return tokenSummary.mintUrl && tokenSummary.mintUrl.trim() !== ''
+  }, [tokenSummary.mintUrl])
+
+  const enableTransfer = useMemo(() => {
+    let enable = false
+    if (tokenSummary.tokenBalance.amount !== '0') {
+      enable = true
+    }
+    return enable
+  }, [tokenSummary])
+
+  const tools = useTools()
+
+  const enableTrade = useMemo(() => {
+    return tokenSummary.tradeUrl && tokenSummary.tradeUrl.trim() !== ''
+  }, [tokenSummary.tradeUrl])
+
+  const onClickMint = () => {
+    if (tokenSummary.mintUrl) {
+      nav.navToUrl(tokenSummary.mintUrl)
+    }
+  }
+
+  const onClickSend = () => {
+    if (tokenSummary.tokenInfo?.aligned === false) {
+      // tools.toastError(t('important_to_not_transfer_this_token'));
+      setWarning(true)
+      return
+    }
+
+    resetTxState()
+    nav.navigate('SendAlkanesScreen', {
+      tokenBalance: tokenSummary.tokenBalance,
+      tokenInfo: tokenSummary.tokenInfo,
+    })
+  }
+
+  const onClickTrade = () => {
+    if (tokenSummary.tradeUrl) {
+      nav.navToUrl(tokenSummary.tradeUrl)
+    }
+  }
+
+  const iconInfo = useAlkanesIconInfo(
+    tokenSummary.tokenBalance.name,
+    tokenSummary.tokenBalance.alkaneid
+  )
+
+  const alkanesExplorerUrl = useAlkanesTokenInfoExplorerUrl(tokenSummary.tokenInfo.alkaneid)
+
+  const onClickViewOnExplorer = () => {
+    nav.navToUrl(alkanesExplorerUrl)
+  }
+
+  return {
+    tokenSummary,
+    loading,
+    enableMint,
+    enableTransfer,
+    enableTrade,
+    warning,
+    setWarning,
+    t,
+    tools,
+    onClickMint,
+    onClickSend,
+    onClickTrade,
+    onClickViewOnExplorer,
+    iconInfo,
+  }
+}

package/src/ui-hooks/useAmountInputLogic.ts

@@ -0,0 +1,80 @@
+import { useCallback, useEffect, useRef, useState } from 'react'
+
+export interface AmountInputProps {}
+
+export function useAmountInputLogic(props: {
+  value?: string
+  runesDecimal?: number
+  disableDecimal?: boolean
+  enableBrc20Decimal?: boolean
+  onAmountInputChange?: (amount: string) => void
+
+  min?: number
+  step?: number
+}) {
+  const { disableDecimal, enableBrc20Decimal, runesDecimal, onAmountInputChange, min, step } = props
+
+  const [inputValue, setInputValue] = useState(props.value || '')
+
+  useEffect(() => {
+    onAmountInputChange(inputValue)
+  }, [inputValue])
+
+  const propValueRef = useRef(props.value)
+  useEffect(() => {
+    if (props.value !== propValueRef.current) {
+      propValueRef.current = props.value
+      setInputValue(props.value || '')
+    }
+  }, [props.value])
+
+  const handleInputAmount = useCallback(
+    (e: { target: { value: string } } | string) => {
+      const raw = typeof e === 'string' ? e : e.target.value
+
+      let regex: RegExp
+      if (disableDecimal) {
+        regex = /^[1-9]\d*$/
+      } else if (enableBrc20Decimal) {
+        regex = /^(0(\.\d{0,18})?|[1-9]\d*\.?\d{0,18})$/
+      } else if (runesDecimal !== undefined) {
+        regex = new RegExp(`^(0(\\.\\d{0,${runesDecimal}})?|[1-9]\\d*\\.?\\d{0,${runesDecimal}})$`)
+      } else {
+        regex = /^(0(\.\d{0,8})?|[1-9]\d*\.?\d{0,8})$/
+      }
+
+      if (regex.test(raw) || raw === '') {
+        setInputValue(raw)
+      }
+    },
+    [disableDecimal, enableBrc20Decimal, runesDecimal]
+  )
+
+  const handleStepUp = useCallback(() => {
+    setInputValue(prev => {
+      const currentVal = parseFloat(prev) || 0
+      const decimal = runesDecimal ?? 2
+      return (currentVal + step).toFixed(decimal)
+    })
+  }, [step, runesDecimal])
+
+  const handleStepDown = useCallback(() => {
+    setInputValue(prev => {
+      const currentVal = parseFloat(prev) || 0
+      const decimal = runesDecimal ?? 2
+      return Math.max(min, currentVal - step).toFixed(decimal)
+    })
+  }, [step, min, runesDecimal])
+
+  const handleReset = useCallback(() => {
+    setInputValue('')
+  }, [])
+
+  return {
+    handleInputAmount,
+    handleStepUp,
+    handleStepDown,
+    handleReset,
+    inputValue,
+  }
+}