chore: removing error state for rejecting chain switch (#6713)

* chore: removing error state for rejecting chain switch

* removing connection error state

src/components/Web3Status/index.tsx

@@ -12,8 +12,6 @@ import { Portal } from 'nft/components/common/Portal'
 import { useIsNftClaimAvailable } from 'nft/hooks/useIsNftClaimAvailable'
 import { darken } from 'polished'
 import { useCallback, useMemo } from 'react'
-import { AlertTriangle } from 'react-feather'
-import { useAppSelector } from 'state/hooks'
 import styled from 'styled-components/macro'
 import { colors } from 'theme/colors'
 import { flexRowNoWrap } from 'theme/styles'
@@ -43,16 +41,6 @@ const Web3StatusGeneric = styled(ButtonSecondary)`
     outline: none;
   }
 `
-const Web3StatusError = styled(Web3StatusGeneric)`
-  background-color: ${({ theme }) => theme.accentFailure};
-  border: 1px solid ${({ theme }) => theme.accentFailure};
-  color: ${({ theme }) => theme.white};
-  font-weight: 500;
-  :hover,
-  :focus {
-    background-color: ${({ theme }) => darken(0.1, theme.accentFailure)};
-  }
-`
 
 const Web3StatusConnectWrapper = styled.div<{ faded?: boolean }>`
   ${flexRowNoWrap};
@@ -124,13 +112,6 @@ const Text = styled.p`
   font-weight: 500;
 `
 
-const NetworkIcon = styled(AlertTriangle)`
-  margin-left: 0.25rem;
-  margin-right: 0.5rem;
-  width: 16px;
-  height: 16px;
-`
-
 // we want the latest one to come first, so return negative if a is after b
 function newTransactionsFirst(a: TransactionDetails, b: TransactionDetails) {
   return b.addedTime - a.addedTime
@@ -158,8 +139,6 @@ function Web3StatusInner() {
   }, [toggleAccountDrawer])
   const isClaimAvailable = useIsNftClaimAvailable((state) => state.isClaimAvailable)
 
-  const error = useAppSelector((state) => state.connection.errorByConnectionType[getConnection(connector).type])
-
   const allTransactions = useAllTransactions()
 
   const sortedRecentTransactions = useMemo(() => {
@@ -173,15 +152,6 @@ function Web3StatusInner() {
 
   if (!chainId) {
     return null
-  } else if (error) {
-    return (
-      <Web3StatusError onClick={handleWalletDropdownClick}>
-        <NetworkIcon />
-        <Text>
-          <Trans>Error</Trans>
-        </Text>
-      </Web3StatusError>
-    )
   } else if (account) {
     return (
       <TraceEvent

src/hooks/useSelectChain.ts

@@ -1,9 +1,9 @@
 import { useWeb3React } from '@web3-react/core'
 import { getConnection } from 'connection'
+import { didUserReject } from 'connection/utils'
 import { SupportedChainId } from 'constants/chains'
 import { useCallback } from 'react'
 import { addPopup } from 'state/application/reducer'
-import { updateConnectionError } from 'state/connection/reducer'
 import { useAppDispatch } from 'state/hooks'
 import { switchChain } from 'utils/switchChain'
 
@@ -15,15 +15,17 @@ export default function useSelectChain() {
     async (targetChain: SupportedChainId) => {
       if (!connector) return
 
-      const connectionType = getConnection(connector).type
+      const connection = getConnection(connector)
 
       try {
-        dispatch(updateConnectionError({ connectionType, error: undefined }))
         await switchChain(connector, targetChain)
       } catch (error) {
+        if (didUserReject(connection, error)) {
+          return
+        }
+
         console.error('Failed to switch networks', error)
 
-        dispatch(updateConnectionError({ connectionType, error: error.message }))
         dispatch(addPopup({ content: { failedSwitchNetwork: targetChain }, key: 'failed-network-switch' }))
       }
     },

src/state/connection/reducer.ts

@@ -1,34 +0,0 @@
-import { createSlice } from '@reduxjs/toolkit'
-import { ConnectionType } from 'connection/types'
-
-interface ConnectionState {
-  errorByConnectionType: Record<ConnectionType, string | undefined>
-}
-
-const initialState: ConnectionState = {
-  errorByConnectionType: {
-    [ConnectionType.UNISWAP_WALLET]: undefined,
-    [ConnectionType.INJECTED]: undefined,
-    [ConnectionType.WALLET_CONNECT]: undefined,
-    [ConnectionType.WALLET_CONNECT_V2]: undefined,
-    [ConnectionType.COINBASE_WALLET]: undefined,
-    [ConnectionType.NETWORK]: undefined,
-    [ConnectionType.GNOSIS_SAFE]: undefined,
-  },
-}
-
-const connectionSlice = createSlice({
-  name: 'connection',
-  initialState,
-  reducers: {
-    updateConnectionError(
-      state,
-      { payload: { connectionType, error } }: { payload: { connectionType: ConnectionType; error?: string } }
-    ) {
-      state.errorByConnectionType[connectionType] = error
-    },
-  },
-})
-
-export const { updateConnectionError } = connectionSlice.actions
-export default connectionSlice.reducer

src/state/logging.ts

@@ -25,7 +25,7 @@ export const sentryEnhancer = Sentry.createReduxEnhancer({
    * calls and deep object traversals.
    */
   stateTransformer: (state: AppState): DeepPartial<AppState> => {
-    const { application, user, connection, transactions } = state
+    const { application, user, transactions } = state
     return {
       application: {
         fiatOnramp: application.fiatOnramp,
@@ -46,9 +46,6 @@ export const sentryEnhancer = Sentry.createReduxEnhancer({
         URLWarningVisible: user.URLWarningVisible,
         showSurveyPopup: user.showSurveyPopup,
       },
-      connection: {
-        errorByConnectionType: connection.errorByConnectionType,
-      },
       transactions,
     }
   },

src/state/reducer.ts

@@ -3,7 +3,6 @@ import multicall from 'lib/state/multicall'
 import application from './application/reducer'
 import burn from './burn/reducer'
 import burnV3 from './burn/v3/reducer'
-import connection from './connection/reducer'
 import lists from './lists/reducer'
 import logs from './logs/slice'
 import mint from './mint/reducer'
@@ -17,7 +16,6 @@ import wallets from './wallets/reducer'
 export default {
   application,
   user,
-  connection,
   transactions,
   wallets,
   mint,