perf: Use chainid hook

Author: memoyil

apps/web/src/hooks/useAccountActiveChain.ts

@@ -1,15 +1,17 @@
-import { isEvm } from '@pancakeswap/chains'
 import { useAtomValue } from 'jotai'
 import { useEffect, useRef } from 'react'
 
 import { accountActiveChainAtom } from 'wallet/atoms/accountStateAtoms'
 
 export const useActiveChainId = (checkChainId?: number) => {
-  const { isNotMatched, isWrongNetwork, chainId } = useAccountActiveChain()
+  const result = useAtomValue(accountActiveChainAtom)
+
+  if (!checkChainId) return result
+
+  const { chainId, isWrongNetwork } = result
   return {
-    chainId,
-    isNotMatched,
-    isWrongNetwork: checkChainId ? isWrongNetwork && checkChainId !== chainId : isWrongNetwork,
+    ...result,
+    isWrongNetwork: isWrongNetwork && checkChainId !== chainId,
   }
 }
 
@@ -24,10 +26,7 @@ export const useActiveChainIdRef = () => {
 }
 
 export const useAccountActiveChain = () => {
-  const result = useAtomValue(accountActiveChainAtom)
-  const { chainId, account, solanaAccount } = result
-  const unifiedAccount = isEvm(chainId) ? account : solanaAccount
-  return { ...result, unifiedAccount }
+  return useAtomValue(accountActiveChainAtom)
 }
 
 export default useAccountActiveChain

apps/web/src/wallet/atoms/accountStateAtoms.ts

@@ -1,4 +1,4 @@
-import { ChainId } from '@pancakeswap/chains'
+import { ChainId, isEvm } from '@pancakeswap/chains'
 import { atom } from 'jotai'
 import { getHashKey } from 'utils/hash'
 import { Connector } from 'wagmi'
@@ -7,6 +7,7 @@ import { getQueryChainId } from 'wallet/util/getQueryChainId'
 export interface AccountChainState {
   account?: `0x${string}`
   solanaAccount?: string | null
+  unifiedAccount?: string | null
   chainId: number
   isWrongNetwork: boolean
   isNotMatched: boolean
@@ -20,14 +21,18 @@ const _accountActiveChainAtom = atom<AccountChainState>({
   isWrongNetwork: false,
   status: null,
   solanaAccount: null,
+  unifiedAccount: null,
   isNotMatched: false,
 })
 
 type Updater = AccountChainState | ((prev: AccountChainState) => AccountChainState)
 
 export const accountActiveChainAtom = atom(
   (get) => {
-    return get(_accountActiveChainAtom)
+    const state = get(_accountActiveChainAtom)
+    const { chainId, account, solanaAccount } = state
+    const unifiedAccount = isEvm(chainId) ? account : solanaAccount
+    return { ...state, unifiedAccount }
   },
   (_get, set, updater: Updater) => {
     const prev = _get(_accountActiveChainAtom)