added filter transactions by chain

apps/laboratory/package.json

@@ -19,7 +19,7 @@
     "@emotion/styled": "11.11.0",
     "@sentry/browser": "7.92.0",
     "@sentry/react": "7.92.0",
-    "@tanstack/react-query": "5.17.19",
+    "@tanstack/react-query": "5.18.1",
     "@web3modal/ethers": "4.0.0-648b6755",
     "@web3modal/ethers5": "4.0.0-648b6755",
     "@web3modal/wagmi": "4.0.0-648b6755",
@@ -29,8 +29,8 @@
     "react-icons": "4.12.0",
     "siwe": "2.1.4",
     "valtio": "1.11.2",
-    "viem": "2.5.0",
-    "wagmi": "2.5.0"
+    "viem": "2.7.1",
+    "wagmi": "2.5.5"
   },
   "devDependencies": {
     "@mailsac/api": "1.0.5",

packages/common/src/utils/TypeUtil.ts

@@ -16,6 +16,7 @@ export interface Transaction {
 export interface TransactionMetadata {
   operationType: string
   hash: string
+  chain: `${string}:${string}`
   minedAt: string
   sentFrom: string
   sentTo: string

packages/core/src/controllers/NetworkController.ts

@@ -1,5 +1,5 @@
 import { subscribeKey as subKey } from 'valtio/utils'
-import { proxy, ref } from 'valtio/vanilla'
+import { proxy, ref, subscribe as sub } from 'valtio/vanilla'
 import type { CaipNetwork, CaipNetworkId } from '../utils/TypeUtil.js'
 import { PublicStateController } from './PublicStateController.js'
 import { EventsController } from './EventsController.js'
@@ -36,6 +36,10 @@ const state = proxy<NetworkControllerState>({
 export const NetworkController = {
   state,
 
+  subscribe(callback: (newState: NetworkControllerState) => void) {
+    return sub(state, () => callback(state))
+  },
+
   subscribeKey<K extends StateKey>(key: K, callback: (value: NetworkControllerState[K]) => void) {
     return subKey(state, key, callback)
   },

packages/core/src/controllers/TransactionsController.ts

@@ -4,6 +4,7 @@ import { BlockchainApiController } from './BlockchainApiController.js'
 import { OptionsController } from './OptionsController.js'
 import { EventsController } from './EventsController.js'
 import { SnackController } from './SnackController.js'
+import { NetworkController } from './NetworkController.js'
 
 // -- Types --------------------------------------------- //
 type TransactionByMonthMap = Record<number, Transaction[]>
@@ -12,6 +13,7 @@ type TransactionByYearMap = Record<number, TransactionByMonthMap>
 export interface TransactionsControllerState {
   transactions: Transaction[]
   transactionsByYear: TransactionByYearMap
+  lastNetworkInView: string | undefined
   loading: boolean
   empty: boolean
   next: string | undefined
@@ -21,6 +23,7 @@ export interface TransactionsControllerState {
 const state = proxy<TransactionsControllerState>({
   transactions: [],
   transactionsByYear: {},
+  lastNetworkInView: undefined,
   loading: false,
   empty: false,
   next: undefined
@@ -34,6 +37,10 @@ export const TransactionsController = {
     return sub(state, () => callback(state))
   },
 
+  setLastNetworkInView(lastNetworkInView: TransactionsControllerState['lastNetworkInView']) {
+    state.lastNetworkInView = lastNetworkInView
+  },
+
   async fetchTransactions(accountAddress?: string) {
     const { projectId } = OptionsController.state
 
@@ -51,13 +58,14 @@ export const TransactionsController = {
       })
 
       const nonSpamTransactions = this.filterSpamTransactions(response.data)
-      const filteredTransactions = [...state.transactions, ...nonSpamTransactions]
+      const sameChainTransactions = this.filterByConnectedChain(nonSpamTransactions)
+      const filteredTransactions = [...state.transactions, ...sameChainTransactions]
 
       state.loading = false
       state.transactions = filteredTransactions
       state.transactionsByYear = this.groupTransactionsByYearAndMonth(
         state.transactionsByYear,
-        nonSpamTransactions
+        sameChainTransactions
       )
       state.empty = filteredTransactions.length === 0
       state.next = response.next ? response.next : undefined
@@ -108,9 +116,19 @@ export const TransactionsController = {
     })
   },
 
+  filterByConnectedChain(transactions: Transaction[]) {
+    const chainId = NetworkController.state.caipNetwork?.id
+    const filteredTransactions = transactions.filter(
+      transaction => transaction.metadata.chain === chainId
+    )
+
+    return filteredTransactions
+  },
+
   resetTransactions() {
     state.transactions = []
     state.transactionsByYear = {}
+    state.lastNetworkInView = undefined
     state.loading = false
     state.empty = false
     state.next = undefined