@unisat/wallet-state 1.0.5 → 1.2.0

package/src/ui-hooks/useTxCreateScreenLogic.ts

@@ -0,0 +1,177 @@
+import { useEffect, useMemo, useState } from 'react'
+
+import { numUtils } from '@unisat/base-utils'
+import { COIN_DUST } from '@unisat/wallet-shared'
+import {
+  useAccountBalance,
+  useBTCUnit,
+  useChain,
+  useFeeRateBar,
+  useFetchUtxosCallback,
+  useI18n,
+  useNavigation,
+  usePrepareSendBTCCallback,
+  useTools,
+  useWallet,
+  useUiTxCreateScreen,
+  useUpdateUiTxCreateScreen,
+  useWalletConfig,
+} from '..'
+import { isValidAddress } from '../utils/bitcoin-utils'
+
+export function useTxCreateScreenLogic() {
+  const { t, isSpecialLocale } = useI18n()
+  const accountBalance = useAccountBalance()
+  const nav = useNavigation()
+  const btcUnit = useBTCUnit()
+
+  const [disabled, setDisabled] = useState(true)
+
+  const setUiState = useUpdateUiTxCreateScreen()
+  const uiState = useUiTxCreateScreen()
+  const feeRateBarState = useFeeRateBar()
+
+  const toInfo = uiState.toInfo
+  const inputAmount = uiState.inputAmount
+  const enableRBF = uiState.enableRBF
+  const feeRate = feeRateBarState.feeRate
+
+  const [error, setError] = useState('')
+
+  const [autoAdjust, setAutoAdjust] = useState(false)
+  const fetchUtxos = useFetchUtxosCallback()
+  const wallet = useWallet()
+
+  const tools = useTools()
+  useEffect(() => {
+    tools.showLoading(true)
+    fetchUtxos().finally(() => {
+      tools.showLoading(false)
+    })
+  }, [])
+
+  useEffect(() => {
+    wallet.getEnableRBF().then(enableRBF => {
+      setUiState({ enableRBF })
+    })
+  }, [wallet, setUiState])
+
+  const prepareSendBTC = usePrepareSendBTCCallback()
+
+  const toSatoshis = useMemo(() => {
+    if (!inputAmount) return 0
+    return numUtils.amountToSatoshis(inputAmount)
+  }, [inputAmount])
+
+  const dustAmount = useMemo(() => numUtils.satoshisToAmount(COIN_DUST), [COIN_DUST])
+
+  const availableAmount = numUtils.satoshisToAmount(accountBalance.availableBalance)
+  const unavailableAmount = numUtils.satoshisToAmount(accountBalance.unavailableBalance)
+
+  const showUnavailable = accountBalance.unavailableBalance > 0
+
+  const chain = useChain()
+  useEffect(() => {
+    setError('')
+    setDisabled(true)
+    if (!isValidAddress(toInfo.address)) {
+      return
+    }
+    if (!toSatoshis) {
+      return
+    }
+    if (toSatoshis < COIN_DUST) {
+      setError(`${t('amount_must_be_at_least')} ${dustAmount} ${btcUnit}`)
+      return
+    }
+
+    if (toSatoshis > accountBalance.availableBalance) {
+      setError(t('amount_exceeds_your_available_balance'))
+      return
+    }
+
+    if (feeRate <= 0) {
+      return
+    }
+
+    setDisabled(false)
+  }, [toInfo, inputAmount, feeRate])
+
+  const walletConfig = useWalletConfig()
+
+  const unavailableTipText = useMemo(() => {
+    let tipText = ''
+    tipText += t('unavailable_tooltip')
+
+    if (walletConfig.disableUtxoTools) {
+      tipText += t('future_versions_will_support_spending_these_assets')
+    } else {
+      tipText += t('you_can_unlock_these_assets_by_using_the_utxos_tools')
+    }
+    return tipText
+  }, [chain.enum])
+
+  const headerTitle = `${t('send')} ${btcUnit}`
+
+  const onAddressInputChange = val => setUiState({ toInfo: val })
+
+  const onAmountInputChange = amount => {
+    if (autoAdjust == true) {
+      setAutoAdjust(false)
+    }
+    setUiState({ inputAmount: amount })
+  }
+
+  const onAmountMaxClick = () => {
+    setAutoAdjust(true)
+    setUiState({ inputAmount: availableAmount.toString() })
+  }
+
+  const onRBFChange = (value: boolean) => {
+    setUiState({ enableRBF: value })
+    wallet.setEnableRBF(value)
+  }
+
+  const onClickNext = () => {
+    prepareSendBTC({ toAddressInfo: toInfo, toAmount: toSatoshis, feeRate, enableRBF })
+      .then(toSignData => {
+        nav.navigate('TxConfirmScreen', {
+          toSignData,
+        })
+      })
+      .catch(e => {
+        console.log(e)
+        setError(e.message)
+      })
+  }
+
+  return {
+    headerTitle,
+    chain,
+
+    toInfo,
+    onAddressInputChange,
+
+    toSatoshis,
+    inputAmount,
+    onAmountInputChange,
+    onAmountMaxClick,
+    enableRBF,
+    onRBFChange,
+
+    showUnavailable,
+    availableAmount,
+    unavailableAmount,
+    unavailableTipText,
+    btcUnit,
+    t,
+
+    walletConfig,
+    isSpecialLocale,
+
+    error,
+    disabled,
+
+    onClickNext,
+  }
+}

package/src/ui-hooks/useTxFailScreenLogic.ts

@@ -0,0 +1,26 @@
+import { useI18n, useNavigation } from 'src/context'
+
+export function useTxFailScreenLogic() {
+  const nav = useNavigation()
+  const { error } = nav.getRouteState<'TxFailScreen'>()
+  const { t } = useI18n()
+
+  const onClickBack = () => {
+    nav.goBack()
+  }
+
+  const onClickDone = () => {
+    nav.navigate('TabMainScreen')
+  }
+  return {
+    // info
+    error,
+
+    // actions
+    onClickBack,
+    onClickDone,
+
+    // tools
+    t,
+  }
+}

package/src/ui-hooks/useTxSuccessScreenLogic.ts

@@ -0,0 +1,33 @@
+import { useI18n, useNavigation, useTools } from 'src/context'
+
+export function useTxSuccessScreenLogic() {
+  const nav = useNavigation()
+  const { txid } = nav.getRouteState<'TxSuccessScreen'>()
+  const { t } = useI18n()
+  const tools = useTools()
+
+  const onClickExploreTx = () => {
+    nav.navToExplorerTx(txid)
+  }
+
+  const onClickDone = () => {
+    nav.navigate('MainScreen')
+  }
+
+  const onClickCopy = () => {
+    tools.copyToClipboard(txid)
+  }
+
+  return {
+    // data
+    txid,
+
+    // actions
+    onClickExploreTx,
+    onClickDone,
+    onClickCopy,
+
+    // tools
+    t,
+  }
+}

package/src/updater/accounts.ts

@@ -1,7 +1,7 @@
 import { useCallback, useEffect, useRef } from 'react'
 
-import { Account } from '@unisat/wallet-shared'
-import eventBus from '../utils/eventBus'
+import { Account, BUS_METHODS } from '@unisat/wallet-shared'
+import { uiEventBus } from '../utils/eventBus'
 
 import { useIsUnlocked } from '../hooks/global'
 import { globalActions } from '../reducers/global'
@@ -18,7 +18,7 @@ export function AccountUpdater() {
   const currentAccount = useCurrentAccount()
   const isUnlocked = useIsUnlocked()
   const selfRef = useRef({
-    preAccountKey: '',
+    preAccountKey: '_',
     loadingBalance: false,
     loadingHistory: false,
   })
@@ -61,9 +61,9 @@ export function AccountUpdater() {
         dispatch((accountActions as any).setCurrent(account))
       }
     }
-    eventBus.addEventListener('accountsChanged', accountChangeHandler)
+    uiEventBus.addEventListener(BUS_METHODS.ACCOUNTS_CHANGED, accountChangeHandler)
     return () => {
-      eventBus.removeEventListener('accountsChanged', accountChangeHandler)
+      uiEventBus.removeEventListener(BUS_METHODS.ACCOUNTS_CHANGED, accountChangeHandler)
     }
   }, [dispatch])
 
@@ -77,9 +77,9 @@ export function AccountUpdater() {
 
       reloadAccounts()
     }
-    eventBus.addEventListener('chainChanged', chaintChangeHandler)
+    uiEventBus.addEventListener(BUS_METHODS.CHAIN_CHANGED, chaintChangeHandler)
     return () => {
-      eventBus.removeEventListener('chainChanged', chaintChangeHandler)
+      uiEventBus.removeEventListener(BUS_METHODS.CHAIN_CHANGED, chaintChangeHandler)
     }
   }, [dispatch])
 
@@ -87,9 +87,9 @@ export function AccountUpdater() {
     const lockHandler = () => {
       dispatch(globalActions.update({ isUnlocked: false }))
     }
-    eventBus.addEventListener('lock', lockHandler)
+    uiEventBus.addEventListener(BUS_METHODS.LOCKED, lockHandler)
     return () => {
-      eventBus.removeEventListener('lock', lockHandler)
+      uiEventBus.removeEventListener(BUS_METHODS.LOCKED, lockHandler)
     }
   }, [dispatch])
 
@@ -97,9 +97,9 @@ export function AccountUpdater() {
     const unlockHandler = () => {
       dispatch(globalActions.update({ isUnlocked: true }))
     }
-    eventBus.addEventListener('unlock', unlockHandler)
+    uiEventBus.addEventListener(BUS_METHODS.UNLOCKED, unlockHandler)
     return () => {
-      eventBus.removeEventListener('unlock', unlockHandler)
+      uiEventBus.removeEventListener(BUS_METHODS.UNLOCKED, unlockHandler)
     }
   }, [dispatch])
 

package/src/utils/bitcoin-utils.ts

@@ -1,5 +1,6 @@
+import { addressUtils } from '@unisat/base-utils'
 import { AddressType, NetworkType } from '@unisat/wallet-types'
-
+import * as bip39 from 'bip39'
 export function getAddressType(address: string, networkType?: NetworkType) {
   if (address.startsWith('bc1q') || address.startsWith('tb1q')) {
     return AddressType.P2WPKH
@@ -15,18 +16,17 @@ export function getAddressType(address: string, networkType?: NetworkType) {
 }
 
 export function isValidAddress(address: string, networkType?: NetworkType) {
-  const addressType = getAddressType(address, networkType)
-  if (addressType === AddressType.UNKNOWN) {
-    return false
-  }
-
-  return true
+  return addressUtils.isAddressLikelyValid(address)
 }
 
 export function getAddressUtxoDust(address: string) {
   const addressType = getAddressType(address)
   if (addressType === AddressType.P2WPKH) {
-    return 294
+    if (address.length === 42) {
+      return 294
+    } else {
+      return 330
+    }
   } else if (addressType === AddressType.P2TR) {
     return 330
   } else {
@@ -79,3 +79,12 @@ export function isValidHdPath(path: string): boolean {
 
   return true
 }
+
+export function validateMnemonic(mnemonic: string): boolean {
+  // do not use bip39.validateMnemonic here to reduce bundle size
+  // const words = mnemonic.trim().split(/\s+/);
+  // const wordCount = words.length;
+  // return [12, 15, 18, 21, 24].includes(wordCount);
+
+  return bip39.validateMnemonic(mnemonic)
+}

package/src/utils/eventBus.ts

@@ -46,4 +46,5 @@ class EventBus {
   }
 }
 
-export default new EventBus()
+const uiEventBus = new EventBus()
+export { uiEventBus }

package/src/utils/password-utils.ts

@@ -0,0 +1,78 @@
+export const MIN_PASSWORD_LENGTH = 8
+export const UNRECOGNIZED_PASSWORD_STRENGTH = 'Unrecognized password strength.'
+
+const calculatePasswordStrength = (password: string): number => {
+  let score = 0
+
+  // Length check
+  if (password.length >= 8) score += 1
+  if (password.length >= 12) score += 1
+  if (password.length >= 16) score += 1
+
+  // Character variety checks
+  if (/[a-z]/.test(password)) score += 1 // lowercase
+  if (/[A-Z]/.test(password)) score += 1 // uppercase
+  if (/[0-9]/.test(password)) score += 1 // numbers
+  if (/[^A-Za-z0-9]/.test(password)) score += 1 // special characters
+
+  // Bonus for good mix
+  if (
+    password.length >= 10 &&
+    /[a-z]/.test(password) &&
+    /[A-Z]/.test(password) &&
+    /[0-9]/.test(password) &&
+    /[^A-Za-z0-9]/.test(password)
+  ) {
+    score += 1
+  }
+
+  // Penalty for common patterns
+  if (/(.)\1{2,}/.test(password)) score -= 1 // repeated characters (aaa, 111)
+  if (/123|abc|qwe|asd|zxc/i.test(password)) score -= 1 // common sequences
+  if (/password|123456|qwerty/i.test(password)) score -= 2 // common passwords
+
+  return Math.max(0, Math.min(4, score))
+}
+
+const colors = {
+  red: '#ED334B',
+  green: '#41B530',
+  orange: '#FF7B21',
+}
+
+export const getPasswordStrengthWord = (password: string, t) => {
+  if (password.length < MIN_PASSWORD_LENGTH) {
+    return {
+      text: t('not_long_enough'),
+      color: colors.red,
+      tip: t('password_must_be_at_least_8_characters'),
+    }
+  }
+
+  const strength = calculatePasswordStrength(password)
+
+  if (strength <= 1) {
+    return {
+      text: t('weak'),
+      color: colors.red,
+      tip: t('strong_password_tip'),
+    }
+  } else if (strength === 2) {
+    return {
+      text: t('weak'),
+      color: colors.red,
+      tip: t('strong_password_tip'),
+    }
+  } else if (strength === 3) {
+    return {
+      text: t('average'),
+      color: colors.orange,
+      tip: t('strong_password_tip'),
+    }
+  } else {
+    return {
+      text: t('strong'),
+      color: colors.green,
+    }
+  }
+}

package/src/utils/ui-utils.ts

@@ -0,0 +1,28 @@
+import { useEffect } from 'react'
+
+export function shortAddress(address?: string, len = 8) {
+  if (!address) return ''
+  if (address.length <= len * 2) return address
+  return address.slice(0, len) + '...' + address.slice(address.length - len)
+}
+
+export function useAsyncEffect(
+  effect: () => Promise<void | (() => void)>,
+  deps: React.DependencyList = []
+) {
+  useEffect(() => {
+    let isMounted = true
+    let cleanup: void | (() => void)
+    ;(async () => {
+      cleanup = await effect()
+    })()
+
+    return () => {
+      isMounted = false
+      if (cleanup) {
+        cleanup()
+      }
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, deps)
+}

package/src/hooks/approval.ts

@@ -1,72 +0,0 @@
-import { useEffect, useRef, useState } from 'react'
-import { useNavigate } from 'react-router-dom'
-
-import { useWallet } from '../context/WalletContext'
-
-const UI_TYPE = {
-  Tab: 'index',
-  Pop: 'popup',
-  Notification: 'notification',
-  SidePanel: 'sidepanel',
-}
-
-type UiTypeCheck = {
-  isTab: boolean
-  isNotification: boolean
-  isPop: boolean
-  isSidePanel: boolean
-}
-
-export const getUiType = (): UiTypeCheck => {
-  // @ts-ignore
-  const { pathname } = window.location
-  return Object.entries(UI_TYPE).reduce((m, [key, value]) => {
-    // @ts-ignore
-    m[`is${key}`] = pathname === `/${value}.html`
-
-    return m
-  }, {} as UiTypeCheck)
-}
-
-export const useApproval = () => {
-  const wallet = useWallet()
-  const navigate = useNavigate()
-  const getApproval = wallet.getApproval
-
-  const resolveApproval = async (data?: any, stay = false, forceReject = false) => {
-    const approval = await getApproval()
-
-    if (approval) {
-      wallet.resolveApproval(data, forceReject)
-    }
-    if (stay) {
-      return
-    }
-    setTimeout(() => {
-      navigate('/')
-    })
-  }
-
-  const rejectApproval = async (err: any, stay = false, isInternal = false) => {
-    const approval = await getApproval()
-    if (approval) {
-      await wallet.rejectApproval(err, stay, isInternal)
-    }
-    if (!stay) {
-      navigate('/')
-    }
-  }
-
-  useEffect(() => {
-    if (!getUiType().isNotification) {
-      return () => {}
-    }
-    // @ts-ignore
-    window.addEventListener('beforeunload', rejectApproval)
-
-    // @ts-ignore
-    return () => window.removeEventListener('beforeunload', rejectApproval)
-  }, [])
-
-  return [getApproval, resolveApproval, rejectApproval] as const
-}

package/src/hooks/i18n.ts

@@ -1,53 +0,0 @@
-import { useContext } from 'react'
-
-import { I18nContext } from '../context/I18nContext'
-import { FALLBACK_LOCALE, getCurrentLocaleAsync, LOCALE_NAMES } from '@unisat/i18n'
-
-const defaultI18nContext = {
-  t: (key: string) => key,
-  locale: FALLBACK_LOCALE,
-  supportedLocales: [FALLBACK_LOCALE],
-  localeNames: LOCALE_NAMES,
-  changeLocale: async () => {
-    /* empty implementation */
-  },
-}
-
-/**
- * Use i18n Hook
- * @returns i18n context
- */
-export const useI18n = () => {
-  try {
-    const context = useContext(I18nContext)
-
-    if (!context) {
-      console.warn('useI18n must be used within an I18nProvider, using default context instead')
-      return defaultI18nContext
-    }
-
-    return context as any
-  } catch (error) {
-    console.error('Error in useI18n:', error)
-    return defaultI18nContext
-  }
-}
-
-/**
- * Get current language
- * @returns current language code
- */
-export const getCurrentLocale = async (): Promise<string> => {
-  return await getCurrentLocaleAsync()
-}
-
-/**
- * Select special languages for style adaptation
- * @returns { currentLocale: string, isSpecialLocale: boolean }
- */
-export const getSpecialLocale = async () => {
-  const currentLocale = await getCurrentLocale()
-  const specialLocales = ['es', 'ru', 'fr', 'ja']
-  const isSpecialLocale = specialLocales.includes(currentLocale)
-  return { currentLocale, isSpecialLocale }
-}

package/src/utils/i18n.ts

@@ -1,41 +0,0 @@
-import i18n from 'i18next'
-import { initReactI18next } from 'react-i18next'
-
-export const fetchLocale = async locale => {
-  // @ts-ignore
-  const res = await fetch(`./_locales/${locale}/messages.json`)
-  const data: Record<string, { message: string; description: string }> = await res.json()
-  return Object.keys(data).reduce((res, key) => {
-    return {
-      ...res,
-      [key.replace(/__/g, ' ')]: data[key].message,
-    }
-  }, {})
-}
-
-i18n
-  .use(initReactI18next) // passes i18n down to react-i18next
-  .init({
-    fallbackLng: 'en',
-    defaultNS: 'translations',
-    interpolation: {
-      escapeValue: false, // react already safes from xss
-    },
-  })
-
-export const I18N_NS = 'translations'
-
-export const addResourceBundle = async (locale: string) => {
-  if (i18n.hasResourceBundle(locale, I18N_NS)) return
-  const bundle = await fetchLocale(locale)
-
-  i18n.addResourceBundle(locale, 'translations', bundle)
-}
-
-addResourceBundle('en')
-
-i18n.on('languageChanged', function (lng: string) {
-  addResourceBundle(lng)
-})
-
-export default i18n