From 6a8884acd2d8d0b87da090cd5224ba6b1fbefc61 Mon Sep 17 00:00:00 2001 From: Myroslav Sviderok Date: Wed, 16 Oct 2024 17:21:42 +0300 Subject: [PATCH] chore(TransactionFeedV2): Add error handling to Transaction Feed V2 (#6151) ### Description 5th PR for RET-1207. Adds error handling middleware as per [the docs](https://redux-toolkit.js.org/rtk-query/usage/error-handling) and also copies the same logic of error handling from [queryHelper](https://github.com/valora-inc/wallet/blob/main/src/transactions/feed/queryHelper.ts). ### Test plan Eveything works as before. ### Related issues - Relates to RET-1207 ### Backwards compatibility Yes ### Network scalability If a new NetworkId and/or Network are added in the future, the changes in this PR will: - [x] Continue to work without code changes, OR trigger a compilation error (guaranteeing we find it when a new network is added) --- src/redux/apiReducersList.ts | 2 ++ src/redux/store.test.ts | 3 +-- src/transactions/feed/TransactionFeedV2.tsx | 14 ++++++++++++++ 3 files changed, 17 insertions(+), 2 deletions(-) diff --git a/src/redux/apiReducersList.ts b/src/redux/apiReducersList.ts index 8c5126c9be0..70ddb927228 100644 --- a/src/redux/apiReducersList.ts +++ b/src/redux/apiReducersList.ts @@ -7,3 +7,5 @@ export const apiReducersList = { } as const export const apiMiddlewares = [transactionFeedV2Api.middleware] + +export const apiReducersKeys = Object.keys(apiReducersList) diff --git a/src/redux/store.test.ts b/src/redux/store.test.ts index 716bc30634c..a4986fa21f7 100644 --- a/src/redux/store.test.ts +++ b/src/redux/store.test.ts @@ -1,6 +1,6 @@ import Ajv from 'ajv' import { spawn, takeEvery } from 'redux-saga/effects' -import { ApiReducersKeys, apiReducersList } from 'src/redux/apiReducersList' +import { apiReducersKeys, ApiReducersKeys } from 'src/redux/apiReducersList' import * as createMigrateModule from 'src/redux/createMigrate' import { migrations } from 'src/redux/migrations' import { RootState } from 'src/redux/reducers' @@ -28,7 +28,6 @@ const resetStateOnInvalidStoredAccount = jest.spyOn( const loggerErrorSpy = jest.spyOn(Logger, 'error') function getNonApiReducers>(state: RootState): R { - const apiReducersKeys = Object.keys(apiReducersList) const nonApiReducers = {} as R for (const [key, value] of Object.entries(state)) { diff --git a/src/transactions/feed/TransactionFeedV2.tsx b/src/transactions/feed/TransactionFeedV2.tsx index a790a1e91d3..d6dffe745ff 100644 --- a/src/transactions/feed/TransactionFeedV2.tsx +++ b/src/transactions/feed/TransactionFeedV2.tsx @@ -1,5 +1,7 @@ import React, { useEffect, useMemo, useState } from 'react' import { ActivityIndicator, SectionList, StyleSheet, View } from 'react-native' +import { showError } from 'src/alert/actions' +import { ErrorMessages } from 'src/app/ErrorMessages' import SectionHead from 'src/components/SectionHead' import GetStarted from 'src/home/GetStarted' import { useDispatch, useSelector } from 'src/redux/hooks' @@ -31,6 +33,7 @@ import { groupFeedItemsInSections, standByTransactionToTokenTransaction, } from 'src/transactions/utils' +import Logger from 'src/utils/Logger' import { walletAddressSelector } from 'src/web3/selectors' type PaginatedData = { @@ -40,6 +43,7 @@ type PaginatedData = { // Query poll interval const POLL_INTERVAL_MS = 10000 // 10 sec const FIRST_PAGE_TIMESTAMP = 0 +const TAG = 'transactions/feed/TransactionFeedV2' function getAllowedNetworksForTransfers() { return getMultichainFeatures().showTransfers @@ -279,6 +283,16 @@ export default function TransactionFeedV2() { [isFetching, data?.transactions, originalArgs?.endCursor, standByTransactions.confirmed] ) + useEffect( + function handleError() { + if (error === undefined) return + + Logger.error(TAG, 'Error while fetching transactions', error) + dispatch(showError(ErrorMessages.FETCH_FAILED)) + }, + [error] + ) + /** * In order to avoid bloating stand by transactions with confirmed transactions that are already * present in the feed via pagination – we need to cleanup them up. This must run for every page