From 4f5b94546fb4f83471e9c67b78feaf84051f58e0 Mon Sep 17 00:00:00 2001 From: Juanma Hidalgo Date: Tue, 14 Nov 2023 20:35:36 +0100 Subject: [PATCH] feat: add a selector to know if the user is switching network --- src/modules/wallet/reducer.spec.ts | 33 ++++++++++++++++++++++++++-- src/modules/wallet/reducer.ts | 14 +++++++++++- src/modules/wallet/selectors.spec.ts | 33 ++++++++++++++++++++++++++-- src/modules/wallet/selectors.ts | 9 +++++++- 4 files changed, 83 insertions(+), 6 deletions(-) diff --git a/src/modules/wallet/reducer.spec.ts b/src/modules/wallet/reducer.spec.ts index d689b698..2a6fd6e9 100644 --- a/src/modules/wallet/reducer.spec.ts +++ b/src/modules/wallet/reducer.spec.ts @@ -8,6 +8,8 @@ import { EnableWalletSuccessAction, FetchWalletFailureAction, FetchWalletRequestAction, + SwitchNetworkFailureAction, + SwitchNetworkRequestAction, changeAccount, changeNetwork, connectWalletFailure, @@ -20,7 +22,9 @@ import { fetchWalletFailure, fetchWalletRequest, fetchWalletSuccess, - setAppChainId + setAppChainId, + switchNetworkFailure, + switchNetworkRequest } from './actions' import { INITIAL_STATE, WalletState, walletReducer } from './reducer' import { ProviderType, Wallet } from './types' @@ -33,7 +37,8 @@ const wallet = {} as Wallet const requestActions = [ fetchWalletRequest(), enableWalletRequest(providerType), - connectWalletRequest() + connectWalletRequest(), + switchNetworkRequest(chainId) ] beforeEach(() => {}) @@ -185,6 +190,30 @@ describe('when reducing the failure action of enabling the wallet', () => { } }) + describe('when reducing the failure action of switching the wallets network', () => { + let initialState: WalletState + + let requestAction: SwitchNetworkRequestAction + let failureAction: SwitchNetworkFailureAction + + beforeEach(() => { + requestAction = switchNetworkRequest(chainId) + failureAction = switchNetworkFailure(chainId, error) + + initialState = { + ...INITIAL_STATE, + loading: loadingReducer([], requestAction) + } + }) + + it('should return a state with loading state cleared', () => { + expect(walletReducer(initialState, failureAction)).toEqual({ + ...INITIAL_STATE, + loading: [] + }) + }) + }) + it('should return a state with the error set and the loading state and data cleared', () => { expect(walletReducer(initialState, failureAction)).toEqual({ ...INITIAL_STATE, diff --git a/src/modules/wallet/reducer.ts b/src/modules/wallet/reducer.ts index d267107f..29da821e 100644 --- a/src/modules/wallet/reducer.ts +++ b/src/modules/wallet/reducer.ts @@ -27,7 +27,13 @@ import { FETCH_WALLET_SUCCESS, FETCH_WALLET_FAILURE, SetAppChainIdAction, - SET_APP_CHAIN_ID + SET_APP_CHAIN_ID, + SWITCH_NETWORK_REQUEST, + SwitchNetworkRequestAction, + SwitchNetworkSuccessAction, + SwitchNetworkFailureAction, + SWITCH_NETWORK_SUCCESS, + SWITCH_NETWORK_FAILURE } from './actions' export type WalletState = { @@ -48,6 +54,9 @@ export type WalletReducerAction = | ConnectWalletRequestAction | ConnectWalletSuccessAction | ConnectWalletFailureAction + | SwitchNetworkRequestAction + | SwitchNetworkSuccessAction + | SwitchNetworkFailureAction | EnableWalletRequestAction | EnableWalletSuccessAction | EnableWalletFailureAction @@ -66,6 +75,7 @@ export function walletReducer( switch (action.type) { case FETCH_WALLET_REQUEST: case ENABLE_WALLET_REQUEST: + case SWITCH_NETWORK_REQUEST: case CONNECT_WALLET_REQUEST: { return { ...state, @@ -83,6 +93,7 @@ export function walletReducer( } } + case SWITCH_NETWORK_SUCCESS: case ENABLE_WALLET_SUCCESS: { return { ...state, @@ -91,6 +102,7 @@ export function walletReducer( } } + case SWITCH_NETWORK_FAILURE: case FETCH_WALLET_FAILURE: { return { ...state, diff --git a/src/modules/wallet/selectors.spec.ts b/src/modules/wallet/selectors.spec.ts index 67175207..cb805ece 100644 --- a/src/modules/wallet/selectors.spec.ts +++ b/src/modules/wallet/selectors.spec.ts @@ -1,6 +1,10 @@ import { ChainId } from '@dcl/schemas/dist/dapps/chain-id' import { Network } from '@dcl/schemas/dist/dapps/network' -import { connectWalletRequest, enableWalletRequest } from './actions' +import { + connectWalletRequest, + enableWalletRequest, + switchNetworkRequest +} from './actions' import { INITIAL_STATE, WalletState } from './reducer' import { getAddress, @@ -15,7 +19,8 @@ import { getState, isConnected, isConnecting, - isEnabling + isEnabling, + isSwitchingNetwork } from './selectors' import { NetworkData, ProviderType, Wallet } from './types' import { Networks } from './types' @@ -198,4 +203,28 @@ describe('Wallet selectors', () => { ) }) }) + + describe('when getting if the user is switching network', () => { + describe('and switch network request is loading', () => { + beforeEach(() => { + initialState.wallet.loading = [ + switchNetworkRequest(ChainId.ETHEREUM_MAINNET) + ] + }) + + it('should return true', () => { + expect(isSwitchingNetwork(initialState)).toBe(true) + }) + }) + + describe('and switch network request is not loading', () => { + beforeEach(() => { + initialState.wallet.loading = [] + }) + + it('should return false', () => { + expect(isSwitchingNetwork(initialState)).toBe(false) + }) + }) + }) }) diff --git a/src/modules/wallet/selectors.ts b/src/modules/wallet/selectors.ts index 0f0187d4..11bbc736 100644 --- a/src/modules/wallet/selectors.ts +++ b/src/modules/wallet/selectors.ts @@ -1,7 +1,11 @@ import { ChainId } from '@dcl/schemas/dist/dapps/chain-id' import { Network } from '@dcl/schemas/dist/dapps/network' import { isLoadingType } from '../loading/selectors' -import { CONNECT_WALLET_REQUEST, ENABLE_WALLET_REQUEST } from './actions' +import { + CONNECT_WALLET_REQUEST, + ENABLE_WALLET_REQUEST, + SWITCH_NETWORK_REQUEST +} from './actions' import { WalletState } from './reducer' export const getState: (state: any) => WalletState = state => state.wallet @@ -30,6 +34,9 @@ export const getNetwork = (state: any) => export const getNetworks = (state: any) => isConnected(state) ? getData(state)!.networks : undefined +export const isSwitchingNetwork = (state: any) => + isLoadingType(getLoading(state), SWITCH_NETWORK_REQUEST) + // Casting as ChainId since it will be initialized at the beginning export const getAppChainId = (state: any) => getState(state).appChainId as ChainId