diff --git a/apps/wallet-mobile/src/features/Transactions/useCases/TxList/TxList.tsx b/apps/wallet-mobile/src/features/Transactions/useCases/TxList/TxList.tsx index 4367224cec..ad4ce086ef 100644 --- a/apps/wallet-mobile/src/features/Transactions/useCases/TxList/TxList.tsx +++ b/apps/wallet-mobile/src/features/Transactions/useCases/TxList/TxList.tsx @@ -18,12 +18,20 @@ export const TxList = (props: Props) => { const {wallet} = useSelectedWallet() const filter = useTxFilter() - const transactions = useTransactionInfos({wallet}) - const filteredTransactions = React.useMemo(() => filterTransactions(transactions, filter), [transactions, filter]) + const transactionInfos = useTransactionInfos({wallet}) + const filteredTransactions = React.useMemo( + () => filterTransactions(transactionInfos, filter), + [transactionInfos, filter], + ) const [loadedTxs, setLoadedTxs] = React.useState(filteredTransactions.slice(0, batchSize)) const [currentIndex, setCurrentIndex] = React.useState(batchSize) + React.useEffect(() => { + setLoadedTxs(filteredTransactions.slice(0, batchSize)) + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [transactionInfos]) // must be transactionInfos + const handleOnEndReached = React.useCallback(() => { if (currentIndex >= filteredTransactions.length) return const nextBatch = filteredTransactions.slice(currentIndex, currentIndex + batchSize) diff --git a/apps/wallet-mobile/src/yoroi-wallets/hooks/index.ts b/apps/wallet-mobile/src/yoroi-wallets/hooks/index.ts index dd2c9a69b1..d86a2d0555 100644 --- a/apps/wallet-mobile/src/yoroi-wallets/hooks/index.ts +++ b/apps/wallet-mobile/src/yoroi-wallets/hooks/index.ts @@ -471,7 +471,7 @@ export const useTransactionInfos = ({wallet}: {wallet: YoroiWallet}) => { const unsubscribe = wallet.subscribe((event) => { if (event.type !== 'transactions') return - setTransactionInfos(wallet.transactions) + setTransactionInfos(() => wallet.transactions) }) return () => unsubscribe?.() }, [wallet])