feat(TransactionFeedV2): Add RTK-Query, add api slice for Transaction Feed V2

knip.ts

@@ -33,7 +33,11 @@ const config: KnipConfig = {
     '@types/jest',
     'husky',
   ],
-  ignore: ['src/utils/inputValidation.ts', 'src/utils/country.json'],
+  ignore: [
+    'src/utils/inputValidation.ts',
+    'src/utils/country.json',
+    'src/redux/reducersForSchemaGeneration.ts',
+  ],
 }
 
 export default config

scripts/update_root_state_schema.sh

@@ -7,7 +7,7 @@ set -euo pipefail
 
 root_state_schema="test/RootStateSchema.json"
 
-typescript-json-schema ./tsconfig.json RootState --include src/redux/reducers.ts --ignoreErrors --required --noExtraProps > "$root_state_schema"
+typescript-json-schema ./tsconfig.json RootStateForSchemaGeneration --include src/redux/reducersForSchemaGeneration.ts --ignoreErrors --required --noExtraProps > "$root_state_schema"
 
 if git diff --exit-code "$root_state_schema"; then
   echo "$root_state_schema is up to date"

src/redux/api.ts

@@ -0,0 +1,20 @@
+import { fetchBaseQuery } from '@reduxjs/toolkit/query/react'
+import { REHYDRATE } from 'redux-persist'
+import type { Action } from 'redux-saga'
+import type { RootState } from 'src/redux/reducers'
+import networkConfig from 'src/web3/networkConfig'
+
+export const baseQuery = fetchBaseQuery({
+  baseUrl: networkConfig.blockchainApiUrl,
+  headers: {
+    Accept: 'application/json',
+  },
+})
+
+export function isRehydrateAction(action: Action): action is Action<typeof REHYDRATE> & {
+  key: string
+  payload: RootState
+  err: unknown
+} {
+  return action.type === REHYDRATE
+}

src/redux/apiReducersList.ts

@@ -0,0 +1,9 @@
+import { transactionFeedV2Api } from 'src/transactions/api'
+
+export type ApiReducersKeys = keyof typeof apiReducersList
+
+export const apiReducersList = {
+  [transactionFeedV2Api.reducerPath]: transactionFeedV2Api.reducer,
+} as const
+
+export const apiMiddlewares = [transactionFeedV2Api.middleware]

src/redux/migrations.ts

@@ -1916,4 +1916,5 @@ export const migrations = {
     ...state,
     app: _.omit(state.app, 'numberVerified'),
   }),
+  233: (state: any) => state,
 }

src/redux/reducers.ts

@@ -1,61 +1,11 @@
-import { Action, combineReducers } from '@reduxjs/toolkit'
-import { PersistState } from 'redux-persist'
-import { Actions, ClearStoredAccountAction } from 'src/account/actions'
-import { reducer as account } from 'src/account/reducer'
-import { reducer as alert } from 'src/alert/reducer'
-import { appReducer as app } from 'src/app/reducers'
-import dappsReducer from 'src/dapps/slice'
-import earnReducer from 'src/earn/slice'
-import { reducer as fiatExchanges } from 'src/fiatExchanges/reducer'
-import fiatConnectReducer from 'src/fiatconnect/slice'
-import { homeReducer as home } from 'src/home/reducers'
-import i18nReducer from 'src/i18n/slice'
+import { type Action, combineReducers } from '@reduxjs/toolkit'
+import { type PersistState } from 'redux-persist'
+import { Actions, type ClearStoredAccountAction } from 'src/account/actions'
 import { reducer as identity } from 'src/identity/reducer'
-import { reducer as imports } from 'src/import/reducer'
-import jumpstartReducer from 'src/jumpstart/slice'
-import keylessBackupReducer from 'src/keylessBackup/slice'
-import { reducer as localCurrency } from 'src/localCurrency/reducer'
-import { reducer as networkInfo } from 'src/networkInfo/reducer'
-import nftsReducer from 'src/nfts/slice'
-import pointsReducer from 'src/points/slice'
-import positionsReducer from 'src/positions/slice'
-import priceHistoryReducer from 'src/priceHistory/slice'
-import { recipientsReducer as recipients } from 'src/recipients/reducer'
-import { sendReducer as send } from 'src/send/reducers'
-import swapReducer from 'src/swap/slice'
-import tokenReducer from 'src/tokens/slice'
-import { reducer as transactions } from 'src/transactions/reducer'
-import { reducer as walletConnect } from 'src/walletConnect/reducer'
-import { reducer as web3 } from 'src/web3/reducer'
+import { apiReducersList } from 'src/redux/apiReducersList'
+import { reducersList } from 'src/redux/reducersList'
 
-const appReducer = combineReducers({
-  app,
-  i18n: i18nReducer,
-  networkInfo,
-  alert,
-  send,
-  home,
-  transactions,
-  web3,
-  identity,
-  account,
-  recipients,
-  localCurrency,
-  imports,
-  fiatExchanges,
-  walletConnect,
-  tokens: tokenReducer,
-  dapps: dappsReducer,
-  fiatConnect: fiatConnectReducer,
-  swap: swapReducer,
-  positions: positionsReducer,
-  keylessBackup: keylessBackupReducer,
-  nfts: nftsReducer,
-  priceHistory: priceHistoryReducer,
-  jumpstart: jumpstartReducer,
-  points: pointsReducer,
-  earn: earnReducer,
-})
+const appReducer = combineReducers({ ...reducersList, ...apiReducersList })
 
 const rootReducer = (state: RootState | undefined, action: Action): RootState => {
   if (action.type === Actions.CLEAR_STORED_ACCOUNT && state) {

src/redux/reducersForSchemaGeneration.ts

@@ -0,0 +1,8 @@
+import { combineReducers } from 'redux'
+import { PersistState } from 'redux-persist'
+import { reducersList } from 'src/redux/reducersList'
+
+const reducerForSchemaGeneration = combineReducers(reducersList)
+export type RootStateForSchemaGeneration = ReturnType<typeof reducerForSchemaGeneration> & {
+  _persist: PersistState
+}

src/redux/reducersList.ts

@@ -0,0 +1,55 @@
+import { reducer as account } from 'src/account/reducer'
+import { reducer as alert } from 'src/alert/reducer'
+import { appReducer as app } from 'src/app/reducers'
+import dappsReducer from 'src/dapps/slice'
+import earnReducer from 'src/earn/slice'
+import { reducer as fiatExchanges } from 'src/fiatExchanges/reducer'
+import fiatConnectReducer from 'src/fiatconnect/slice'
+import { homeReducer as home } from 'src/home/reducers'
+import i18nReducer from 'src/i18n/slice'
+import { reducer as identity } from 'src/identity/reducer'
+import { reducer as imports } from 'src/import/reducer'
+import jumpstartReducer from 'src/jumpstart/slice'
+import keylessBackupReducer from 'src/keylessBackup/slice'
+import { reducer as localCurrency } from 'src/localCurrency/reducer'
+import { reducer as networkInfo } from 'src/networkInfo/reducer'
+import nftsReducer from 'src/nfts/slice'
+import pointsReducer from 'src/points/slice'
+import positionsReducer from 'src/positions/slice'
+import priceHistoryReducer from 'src/priceHistory/slice'
+import { recipientsReducer as recipients } from 'src/recipients/reducer'
+import { sendReducer as send } from 'src/send/reducers'
+import swapReducer from 'src/swap/slice'
+import tokenReducer from 'src/tokens/slice'
+import { reducer as transactions } from 'src/transactions/reducer'
+import { reducer as walletConnect } from 'src/walletConnect/reducer'
+import { reducer as web3 } from 'src/web3/reducer'
+
+export const reducersList = {
+  app,
+  i18n: i18nReducer,
+  networkInfo,
+  alert,
+  send,
+  home,
+  transactions,
+  web3,
+  identity,
+  account,
+  recipients,
+  localCurrency,
+  imports,
+  fiatExchanges,
+  walletConnect,
+  tokens: tokenReducer,
+  dapps: dappsReducer,
+  fiatConnect: fiatConnectReducer,
+  swap: swapReducer,
+  positions: positionsReducer,
+  keylessBackup: keylessBackupReducer,
+  nfts: nftsReducer,
+  priceHistory: priceHistoryReducer,
+  jumpstart: jumpstartReducer,
+  points: pointsReducer,
+  earn: earnReducer,
+} as const

src/redux/store.test.ts

@@ -1,7 +1,9 @@
 import Ajv from 'ajv'
 import { spawn, takeEvery } from 'redux-saga/effects'
+import { ApiReducersKeys } from 'src/redux/apiReducersList'
 import * as createMigrateModule from 'src/redux/createMigrate'
 import { migrations } from 'src/redux/migrations'
+import { RootState } from 'src/redux/reducers'
 import { rootSaga } from 'src/redux/sagas'
 import { _persistConfig, setupStore } from 'src/redux/store'
 import * as accountCheckerModule from 'src/utils/accountChecker'
@@ -25,6 +27,16 @@ const resetStateOnInvalidStoredAccount = jest.spyOn(
 
 const loggerErrorSpy = jest.spyOn(Logger, 'error')
 
+const getNonApiReducers = <R = Omit<RootState, ApiReducersKeys>>(state: RootState): R => {
+  const apiReducersKeys: string[] = ['transactionFeedV2Api'] satisfies ApiReducersKeys[]
+  return Object.entries(state).reduce((acc, [reducerKey, value]) => {
+    const key = reducerKey as keyof R
+    if (apiReducersKeys.includes(reducerKey)) return acc
+    acc[key] = value as unknown as any
+    return acc
+  }, {} as R)
+}
+
 beforeEach(() => {
   jest.clearAllMocks()
   // For some reason createMigrate.mockRestore doesn't work, so instead we manually reset it to the original implementation
@@ -81,9 +93,9 @@ describe('store state', () => {
       })
     })
 
-    const data = store.getState()
+    const data = getNonApiReducers(store.getState())
 
-    const ajv = new Ajv({ allErrors: true })
+    const ajv = new Ajv({ allErrors: true, allowUnionTypes: true })
     const schema = require('test/RootStateSchema.json')
     const validate = ajv.compile(schema)
     const isValid = validate(data)
@@ -98,7 +110,7 @@ describe('store state', () => {
       {
         "_persist": {
           "rehydrated": true,
-          "version": 232,
+          "version": 233,
         },
         "account": {
           "acceptedTerms": false,

src/redux/store.ts

@@ -1,15 +1,18 @@
 import AsyncStorage from '@react-native-async-storage/async-storage'
 import { configureStore, Middleware } from '@reduxjs/toolkit'
+import { setupListeners } from '@reduxjs/toolkit/query'
 import { getStoredState, PersistConfig, persistReducer, persistStore } from 'redux-persist'
 import FSStorage from 'redux-persist-fs-storage'
 import autoMergeLevel2 from 'redux-persist/lib/stateReconciler/autoMergeLevel2'
 import createSagaMiddleware from 'redux-saga'
 import AppAnalytics from 'src/analytics/AppAnalytics'
 import { PerformanceEvents } from 'src/analytics/Events'
+import { apiMiddlewares } from 'src/redux/apiReducersList'
 import { createMigrate } from 'src/redux/createMigrate'
 import { migrations } from 'src/redux/migrations'
 import rootReducer, { RootState as ReducersRootState } from 'src/redux/reducers'
 import { rootSaga } from 'src/redux/sagas'
+import { transactionFeedV2Api } from 'src/transactions/api'
 import { resetStateOnInvalidStoredAccount } from 'src/utils/accountChecker'
 import Logger from 'src/utils/Logger'
 import { ONE_DAY_IN_MILLIS } from 'src/utils/time'
@@ -21,10 +24,17 @@ const persistConfig: PersistConfig<ReducersRootState> = {
   key: 'root',
   // default is -1, increment as we make migrations
   // See https://github.com/valora-inc/wallet/tree/main/WALLET.md#redux-state-migration
-  version: 232,
+  version: 233,
   keyPrefix: `reduxStore-`, // the redux-persist default is `persist:` which doesn't work with some file systems.
   storage: FSStorage(),
-  blacklist: ['networkInfo', 'alert', 'imports', 'keylessBackup', 'jumpstart'],
+  blacklist: [
+    'networkInfo',
+    'alert',
+    'imports',
+    'keylessBackup',
+    'jumpstart',
+    transactionFeedV2Api.reducerPath,
+  ],
   stateReconciler: autoMergeLevel2,
   migrate: async (...args) => {
     const migrate = createMigrate(migrations)
@@ -103,7 +113,8 @@ export const setupStore = (initialState?: ReducersRootState, config = persistCon
       )
     },
   })
-  const middlewares: Middleware[] = [sagaMiddleware]
+
+  const middlewares: Middleware[] = [sagaMiddleware, ...apiMiddlewares]
 
   if (__DEV__ && !process.env.JEST_WORKER_ID) {
     const createDebugger = require('redux-flipper').default
@@ -172,3 +183,5 @@ export { persistor, store }
 
 export type RootState = ReturnType<typeof store.getState>
 export type AppDispatch = typeof store.dispatch
+
+setupListeners(store.dispatch)

src/swap/SwapScreen.test.tsx

@@ -1328,6 +1328,9 @@ describe('SwapScreen', () => {
           status: 'started',
         },
       },
+
+      // as per test/utils.ts, line 105
+      transactionFeedV2Api: undefined,
     })
 
     update(
@@ -1373,6 +1376,9 @@ describe('SwapScreen', () => {
           status: 'error',
         },
       },
+
+      // as per test/utils.ts, line 105
+      transactionFeedV2Api: undefined,
     })
 
     update(