@unisat/wallet-state 1.0.5 → 1.2.0

package/src/ui-hooks/useCAT20ListLogic.ts

@@ -0,0 +1,83 @@
+import { useEffect, useRef, useState } from 'react'
+
+import { CAT20Balance, CAT_VERSION, TickPriceItem } from '@unisat/wallet-shared'
+
+import {
+  CATAssetTabKey,
+  getSupportedAssets,
+  useCATAssetTabKey,
+  useChainType,
+  useCurrentAccount,
+  useNavigation,
+  useWallet,
+  useWallTabFocusRefresh,
+} from '..'
+import { useInfiniteList } from './useInfiniteList'
+
+export function useCAT20ListLogic(version: CAT_VERSION) {
+  const nav = useNavigation()
+  const wallet = useWallet()
+  const currentAccount = useCurrentAccount()
+  const chainType = useChainType()
+  const [priceMap, setPriceMap] = useState<{ [key: string]: TickPriceItem }>({})
+
+  const priceMapRef = useRef(priceMap)
+  const updatePrices = (res: { [tick: string]: TickPriceItem }) => {
+    const newPriceMap = { ...priceMapRef.current }
+    Object.keys(res).forEach(tick => {
+      newPriceMap[tick] = res[tick]
+    })
+    priceMapRef.current = newPriceMap
+    setPriceMap(newPriceMap)
+  }
+
+  const {
+    data: tokens,
+    total,
+    loading,
+    hasMore,
+    onRefresh,
+    onLoadMore,
+  } = useInfiniteList<CAT20Balance>({
+    fetcher: async (page, pageSize) => {
+      const supportedAssets = getSupportedAssets(chainType, currentAccount.address)
+      if (!supportedAssets.assets.CAT20 || currentAccount.address === '') {
+        return { list: [], total: 0 }
+      }
+      const { list, total } = await wallet.getCAT20List(
+        version,
+        currentAccount.address,
+        page,
+        pageSize
+      )
+      if (list.length > 0) {
+        wallet.getCAT20sPrice(list.map(item => item.tokenId)).then(updatePrices)
+      }
+      return { list, total }
+    },
+    dependencies: [currentAccount.address, version, chainType],
+  })
+
+  const tabKey = useCATAssetTabKey()
+  const isFocus = tabKey === CATAssetTabKey.CAT20 || CATAssetTabKey.CAT20_V2
+  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: CAT20Balance) => {
+    nav.navigate('CAT20TokenScreen', { tokenId: item.tokenId, version })
+  }
+
+  return { tokens, total, loading, hasMore, onRefresh, onLoadMore, onClickItem, priceMap }
+}

package/src/ui-hooks/useCAT20TokenScreenLogic.ts

@@ -0,0 +1,127 @@
+import { KeyringType } from '@unisat/keyring-service/types'
+import { AddressCAT20TokenSummary, CAT_VERSION } from '@unisat/wallet-shared'
+import { ChainType } from '@unisat/wallet-types'
+import { useEffect, useMemo, useState } from 'react'
+import { useI18n, useNavigation, useTools, useWallet } from 'src/context'
+import {
+  useCAT20IconInfo,
+  useCAT20MarketPlaceWebsite,
+  useCAT20TokenInfoExplorerUrl,
+  useChainType,
+  useCurrentAccount,
+  useCurrentKeyring,
+  useResetTxState,
+} from 'src/hooks'
+
+export function useCAT20TokenScreenLogic() {
+  const nav = useNavigation()
+  const { tokenId, version } = nav.getRouteState<'CAT20TokenScreen'>()
+  const { t } = useI18n()
+  const [tokenSummary, setTokenSummary] = useState<AddressCAT20TokenSummary>({
+    cat20Balance: {
+      tokenId: '',
+      amount: '0',
+      decimals: 0,
+      symbol: '',
+      name: '',
+    },
+    cat20Info: {
+      tokenId: '',
+      name: '',
+      symbol: '',
+      max: '0',
+      premine: '0',
+      limit: 0,
+    },
+  })
+
+  const wallet = useWallet()
+
+  const account = useCurrentAccount()
+  const keyring = useCurrentKeyring()
+  const [loading, setLoading] = useState(true)
+  const tools = useTools()
+  useEffect(() => {
+    wallet.getAddressCAT20TokenSummary(version, account.address, tokenId).then(tokenSummary => {
+      setTokenSummary(tokenSummary)
+      setLoading(false)
+    })
+  }, [])
+
+  const tokenUrl = useCAT20TokenInfoExplorerUrl(version, tokenSummary.cat20Info.tokenId)
+
+  const enableTransfer = useMemo(() => {
+    let enable = false
+    if (tokenSummary.cat20Balance && tokenSummary.cat20Balance.amount !== '0') {
+      enable = true
+    }
+    return enable
+  }, [tokenSummary])
+
+  const chainType = useChainType()
+  const enableTrade = useMemo(() => {
+    if (chainType === ChainType.FRACTAL_BITCOIN_MAINNET && version === CAT_VERSION.V1) {
+      return true
+    } else {
+      return false
+    }
+  }, [chainType])
+  const marketPlaceUrl = useCAT20MarketPlaceWebsite(tokenId)
+
+  const resetTxState = useResetTxState()
+
+  const onClickBack = () => {
+    nav.goBack()
+  }
+
+  const onClickMerge = e => {
+    if (keyring.type === KeyringType.KeystoneKeyring) {
+      tools.toastError(t('merge_utxos_is_not_supported_for_keystone_yet'))
+      return
+    }
+    resetTxState()
+    nav.navigate('MergeCAT20Screen', {
+      version: version,
+      cat20Balance: tokenSummary.cat20Balance,
+      cat20Info: tokenSummary.cat20Info,
+    })
+  }
+
+  const onClickSend = e => {
+    if (keyring.type === KeyringType.KeystoneKeyring) {
+      tools.toastError(t('send_cat20_is_not_supported_for_keystone_yet'))
+      return
+    }
+    resetTxState()
+    nav.navigate('SendCAT20Screen', {
+      version: version,
+      cat20Balance: tokenSummary.cat20Balance,
+      cat20Info: tokenSummary.cat20Info,
+    })
+  }
+
+  const onClickTrade = e => {
+    nav.navToUrl(marketPlaceUrl)
+  }
+
+  const onClickViewOnExplorer = e => {
+    nav.navToUrl(tokenUrl)
+  }
+
+  const iconInfo = useCAT20IconInfo(tokenSummary.cat20Info.name, tokenSummary.cat20Info.tokenId)
+
+  return {
+    tokenSummary,
+    loading,
+    tokenUrl,
+    enableTransfer,
+    enableTrade,
+    iconInfo,
+    onClickMerge,
+    onClickSend,
+    onClickTrade,
+    onClickBack,
+    onClickViewOnExplorer,
+    t,
+  }
+}

package/src/ui-hooks/useCAT721ListLogic.ts

@@ -0,0 +1,68 @@
+import { useEffect, useRef } from 'react'
+
+import { CAT721Balance, CAT_VERSION } from '@unisat/wallet-shared'
+
+import {
+  CATAssetTabKey,
+  getSupportedAssets,
+  useCATAssetTabKey,
+  useChainType,
+  useCurrentAccount,
+  useNavigation,
+  useWallet,
+  useWallTabFocusRefresh,
+} from '..'
+import { useInfiniteList } from './useInfiniteList'
+
+export function useCAT721ListLogic(version: CAT_VERSION) {
+  const nav = useNavigation()
+  const wallet = useWallet()
+  const currentAccount = useCurrentAccount()
+  const chainType = useChainType()
+  const {
+    data: tokens,
+    total,
+    loading,
+    hasMore,
+    onRefresh,
+    onLoadMore,
+  } = useInfiniteList<CAT721Balance>({
+    fetcher: async (page, pageSize) => {
+      const supportedAssets = getSupportedAssets(chainType, currentAccount.address)
+      if (!supportedAssets.assets.CAT20 || currentAccount.address === '') {
+        return { list: [], total: 0 }
+      }
+      const { list, total } = await wallet.getCAT721List(
+        version,
+        currentAccount.address,
+        page,
+        pageSize
+      )
+      return { list, total }
+    },
+    dependencies: [currentAccount.address, version, chainType],
+  })
+
+  const tabKey = useCATAssetTabKey()
+  const isFocus = tabKey === CATAssetTabKey.CAT721 || CATAssetTabKey.CAT721_V2
+  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: CAT721Balance) => {
+    nav.navigate('CAT721CollectionScreen', { collectionId: item.collectionId, version })
+  }
+
+  return { tokens, total, loading, hasMore, onRefresh, onLoadMore, onClickItem }
+}

package/src/ui-hooks/useCAT721NFTScreenLogic.ts

@@ -0,0 +1,37 @@
+import { useI18n, useNavigation } from 'src/context'
+import { useResetTxState } from 'src/hooks'
+
+export function useCAT721NFTScreenLogic() {
+  const nav = useNavigation()
+  const { collectionInfo, localId, version } = nav.getRouteState<'CAT721NFTScreen'>()
+
+  const { t } = useI18n()
+
+  const resetTxState = useResetTxState()
+
+  const onClickBack = () => {
+    nav.goBack()
+  }
+
+  const onClickSend = () => {
+    resetTxState()
+    nav.navigate('SendCAT721Screen', {
+      version: version,
+      collectionInfo: collectionInfo,
+      localId: localId,
+    })
+  }
+
+  return {
+    // info
+    collectionInfo,
+    localId,
+    version,
+    // i18n
+    t,
+
+    // actions
+    onClickBack,
+    onClickSend,
+  }
+}

package/src/ui-hooks/useCreatePasswordScreenLogic.ts

@@ -0,0 +1,92 @@
+import { useEffect, useMemo, useState } from 'react'
+import { useI18n, useNavigation, useTools, useWallet } from 'src/context'
+import { getPasswordStrengthWord, MIN_PASSWORD_LENGTH } from 'src/utils/password-utils'
+
+export function useCreatePasswordScreenLogic() {
+  const nav = useNavigation()
+  const { isNewAccount, isKeystone, fromColdWallet } = nav.getRouteState<'CreatePasswordScreen'>()
+  const [newPassword, setNewPassword] = useState('')
+  const { t } = useI18n()
+
+  const [confirmPassword, setConfirmPassword] = useState('')
+
+  const [disabled, setDisabled] = useState(true)
+
+  const wallet = useWallet()
+
+  const tools = useTools()
+  const bootWithPassword = (password: string) => {
+    wallet
+      .boot(password)
+      .then(() => {
+        if (fromColdWallet) {
+          nav.navigate('CreateColdWalletScreen', { fromUnlock: true })
+        } else if (isKeystone) {
+          nav.navigate('CreateKeystoneWalletScreen', { fromUnlock: true })
+        } else if (isNewAccount) {
+          nav.navigate('CreateHDWalletScreen', { isImport: false, fromUnlock: true })
+        } else {
+          nav.navigate('CreateHDWalletScreen', { isImport: true, fromUnlock: true })
+        }
+      })
+      .catch(err => {
+        tools.toastError(err)
+      })
+  }
+
+  useEffect(() => {
+    setDisabled(true)
+
+    if (
+      newPassword &&
+      newPassword.length >= MIN_PASSWORD_LENGTH &&
+      newPassword === confirmPassword
+    ) {
+      setDisabled(false)
+      return
+    }
+  }, [newPassword, confirmPassword])
+
+  const strongTextRenderData = useMemo(() => {
+    if (!newPassword) {
+      return null
+    }
+    return getPasswordStrengthWord(newPassword, t)
+  }, [newPassword, t])
+
+  const matchTextRenderData = useMemo(() => {
+    if (!confirmPassword) {
+      return null
+    }
+
+    if (newPassword !== confirmPassword) {
+      return {
+        text: t('passwords_dont_match'),
+      }
+    }
+    return null
+  }, [newPassword, confirmPassword])
+
+  const onClickConfirm = () => {
+    bootWithPassword(newPassword)
+  }
+
+  const onPasswordChange = (e: string | { target: { value: string } }) => {
+    const val = typeof e === 'string' ? e : e.target.value
+    setNewPassword(val)
+  }
+
+  const onConfirmPasswordChange = (e: string | { target: { value: string } }) => {
+    const val = typeof e === 'string' ? e : e.target.value
+    setConfirmPassword(val)
+  }
+
+  return {
+    disabled,
+    strongTextRenderData,
+    matchTextRenderData,
+    onClickConfirm,
+    onPasswordChange,
+    onConfirmPasswordChange,
+  }
+}

package/src/ui-hooks/useCreateWalletLogicImportWordsStep.ts

@@ -0,0 +1,299 @@
+import { OW_HD_PATH, RESTORE_WALLETS, RestoreWalletType, WordsType } from '@unisat/wallet-shared'
+import { AddressType } from '@unisat/wallet-types'
+import { useEffect, useMemo, useState } from 'react'
+import { useI18n, useNavigation, useTools, useWallet } from 'src/context'
+import { useAppDispatch, useCreateAccountCallback } from 'src/hooks'
+import { accountActions, keyringsActions } from 'src/reducers'
+import { validateMnemonic } from 'src/utils/bitcoin-utils'
+
+export enum TabType {
+  STEP1 = 'STEP1',
+  STEP2 = 'STEP2',
+  CHOOSE_ADDRESS_TYPE = 'CHOOSE_ADDRESS_TYPE',
+}
+
+function normalizeWhitespace(str: string) {
+  str = str.replace(/[\n\r\t]+/g, ' ')
+  str = str.replace(/\s+/g, ' ')
+  str = str.trim()
+  return str
+}
+
+export interface ContextData {
+  mnemonics: string
+  hdPath: string
+  passphrase: string
+  addressType: AddressType
+  step1Completed: boolean
+  tabType: TabType
+  restoreWalletType: RestoreWalletType
+  isRestore: boolean
+  isCustom: boolean
+  customHdPath: string
+  addressTypeIndex: number
+  wordsType: WordsType
+  walletName?: string
+}
+
+export interface UpdateContextDataParams {
+  mnemonics?: string
+  hdPath?: string
+  passphrase?: string
+  addressType?: AddressType
+  step1Completed?: boolean
+  tabType?: TabType
+  restoreWalletType?: RestoreWalletType
+  isCustom?: boolean
+  customHdPath?: string
+  addressTypeIndex?: number
+  wordsType?: WordsType
+  walletName?: string
+}
+
+interface WordsItem {
+  key: WordsType
+  label: string
+  count: number
+}
+
+const getWords12Item = t => ({
+  key: WordsType.WORDS_12,
+  label: t('mnemonics_12_words'),
+  count: 12,
+})
+
+const getWords24Item = t => ({
+  key: WordsType.WORDS_24,
+  label: t('mnemonics_24_words'),
+  count: 24,
+})
+
+interface CreateWalletLogicParams {
+  contextData: ContextData
+  updateContextData: (params: UpdateContextDataParams) => void
+}
+
+function textToWordsArray(text: string) {
+  return text.split(' ').filter(v => v.trim() !== '')
+}
+
+export function useCreateWalletLogicImportWordsStep(params: CreateWalletLogicParams) {
+  const { contextData, updateContextData } = params
+  const { t } = useI18n()
+
+  const walletTypeConfig = RESTORE_WALLETS.find(
+    item => item.value === contextData.restoreWalletType
+  )
+  const wordsItems: Array<WordsItem> = useMemo(() => {
+    const supportedWordsItems: WordsItem[] = []
+    if (walletTypeConfig) {
+      if (walletTypeConfig.wordsTypes.includes(WordsType.WORDS_12)) {
+        supportedWordsItems.push(getWords12Item(t))
+      }
+      if (walletTypeConfig.wordsTypes.includes(WordsType.WORDS_24)) {
+        supportedWordsItems.push(getWords24Item(t))
+      }
+      return supportedWordsItems
+    } else {
+      return [getWords12Item(t), getWords24Item(t)]
+    }
+  }, [contextData.restoreWalletType, t])
+
+  const wallet = useWallet()
+
+  const [disabled, setDisabled] = useState(true)
+
+  const [inputWords, setInputWords] = useState<Array<string>>(
+    new Array(wordsItems[contextData.wordsType].count).fill('')
+  )
+  const [inputWordsText, setInputWordsText] = useState('')
+  const [inputWordsError, setInputWordsError] = useState(false)
+  const tools = useTools()
+
+  const createAccount = useCreateAccountCallback()
+  const nav = useNavigation()
+
+  const dispatch = useAppDispatch()
+  const [loading, setLoading] = useState(false)
+
+  const [enteredWordsCount, setEnteredWordsCount] = useState(0)
+
+  const enablePhrase = walletTypeConfig?.phraseSupport
+
+  const maxWordsCount = wordsItems[contextData.wordsType].count
+
+  const initKey = async () => {
+    let totalKeyringCount = 0
+    try {
+      totalKeyringCount = await wallet.getTotalKeyringCount()
+    } catch (e) {
+      const error = e as Error
+      tools.toastError(error.message)
+    }
+    updateContextData({ walletName: `HD Wallet #${totalKeyringCount + 1}` })
+  }
+
+  useEffect(() => {
+    initKey()
+  }, [])
+
+  useEffect(() => {
+    setDisabled(true)
+
+    const words = textToWordsArray(inputWordsText)
+    if (words.length !== maxWordsCount) {
+      return
+    }
+
+    const mnemonic = words.join(' ')
+    if (!validateMnemonic(mnemonic)) {
+      return
+    }
+
+    setDisabled(false)
+  }, [inputWordsText])
+
+  const updateWords = (words: Array<string>, isEndedWithSpace?: boolean) => {
+    setInputWords(words)
+    let text = words.join(' ')
+    setInputWordsText(isEndedWithSpace ? text + ' ' : text)
+
+    const enteredWordsCount = words.filter(key => {
+      return key.trim() != ''
+    }).length
+
+    setEnteredWordsCount(enteredWordsCount)
+
+    if (!validateMnemonic(text) && enteredWordsCount >= maxWordsCount) {
+      setInputWordsError(true)
+    } else {
+      setInputWordsError(false)
+    }
+  }
+
+  const onInputWordsTextChange = (e: { target: { value: string } } | string) => {
+    let value = typeof e === 'string' ? e : e.target.value
+    let isEndedWithSpace = /\s$/.test(value)
+    value = normalizeWhitespace(value)
+
+    const wordsArr = textToWordsArray(value)
+    updateWords(wordsArr, isEndedWithSpace)
+  }
+
+  const onInputWordsChange = (e: { target: { value: string } } | string, index: number) => {
+    let value = typeof e === 'string' ? e : e.target.value
+    value = normalizeWhitespace(value)
+
+    const newKeys = [...inputWords]
+    newKeys.splice(index, 1, value)
+    updateWords(newKeys)
+  }
+
+  // extension
+  const onHandleEventPaste = (event, index: number) => {
+    const copyText = event.clipboardData?.getData('text/plain')
+    const textArr = normalizeWhitespace(copyText).split(' ')
+    const newKeys = [...inputWords]
+    if (textArr) {
+      for (let i = 0; i < inputWords.length - index; i++) {
+        if (textArr.length == i) {
+          break
+        }
+        newKeys[index + i] = textArr[i]
+      }
+      updateWords(newKeys)
+    }
+
+    event.preventDefault()
+  }
+
+  const onInputWalletNameChange = (e: { target: { value: string } } | string) => {
+    const value = typeof e === 'string' ? e : e.target.value
+    updateContextData({ walletName: value })
+  }
+
+  const onClickNext = async () => {
+    try {
+      const mnemonics = inputWords.join(' ')
+
+      if (contextData.wordsType === WordsType.WORDS_12) {
+        if (inputWords.length !== 12) {
+          tools.toastError(t('ErrorPrompt_CreateHDwallet_StepImport_Not_12_words'))
+          return
+        }
+      }
+
+      if (contextData.wordsType === WordsType.WORDS_24) {
+        if (inputWords.length !== 24) {
+          tools.toastError(t('ErrorPrompt_CreateHDwallet_StepImport_Not_24_words'))
+          return
+        }
+      }
+
+      if (!validateMnemonic(mnemonics)) {
+        tools.toastError(t('ErrorPrompt_CreateHDwallet_StepImport_InvalidMnemonic'))
+        return
+      }
+
+      setLoading(true)
+
+      if (contextData.restoreWalletType === RestoreWalletType.OW) {
+        await createAccount(mnemonics, OW_HD_PATH, '', AddressType.P2TR, 1)
+        const keyrings = await wallet.getKeyrings()
+        const keyring = keyrings[keyrings.length - 1]
+        if (contextData.walletName) {
+          keyring.alianName = contextData.walletName
+          await wallet.setKeyringAlianName(keyring, contextData.walletName)
+        }
+        await wallet.changeKeyring(keyring)
+        const _keyrings = await wallet.getKeyrings()
+        // @ts-ignore SAFE
+        dispatch(keyringsActions.setKeyrings(_keyrings))
+        // @ts-ignore SAFE
+        dispatch(keyringsActions.setCurrent(keyring))
+        // @ts-ignore SAFE
+        dispatch(accountActions.setCurrent(keyring?.accounts[0]))
+
+        nav.navToTab()
+      } else {
+        updateContextData({
+          walletName: contextData.walletName,
+          mnemonics,
+          tabType: TabType.CHOOSE_ADDRESS_TYPE,
+        })
+      }
+    } catch (e) {
+      tools.toastError((e as any).message)
+    } finally {
+      setLoading(false)
+    }
+  }
+
+  const onClickWordsItem = (wordsItem: WordsItem) => {
+    updateContextData({ wordsType: wordsItem.key })
+    setInputWordsText('')
+    setInputWords(new Array(wordsItem.count).fill(''))
+  }
+
+  const shouldEnteredWordsCount = wordsItems[contextData.wordsType].count
+
+  return {
+    wordsItems,
+    t,
+    disabled,
+    inputWords,
+    inputWordsText,
+    onHandleEventPaste,
+    onClickNext,
+    onClickWordsItem,
+    inputWordsError,
+    onInputWordsTextChange,
+    onInputWordsChange,
+    loading,
+    enablePhrase,
+    walletName: contextData.walletName,
+    onInputWalletNameChange,
+    enteredWordsCount,
+    shouldEnteredWordsCount,
+  }
+}