Remove transaction service usage

package.json

@@ -170,7 +170,7 @@
     "@gnosis.pm/safe-core-sdk": "^1.1.1",
     "@gnosis.pm/safe-deployments": "^1.5.0",
     "@gnosis.pm/safe-react-components": "^0.9.0",
-    "@gnosis.pm/safe-react-gateway-sdk": "^2.5.8",
+    "@gnosis.pm/safe-react-gateway-sdk": "2.7.4",
     "@ledgerhq/hw-transport-node-hid-singleton": "6.3.0",
     "@material-ui/core": "^4.12.3",
     "@material-ui/icons": "^4.11.0",

src/components/DecodeTxs/index.tsx

@@ -1,12 +1,16 @@
 import { ReactElement } from 'react'
 import styled from 'styled-components'
 import { Transaction } from '@gnosis.pm/safe-apps-sdk-v1'
+import {
+  DecodedDataResponse,
+  DecodedDataBasicParameter,
+  DecodedDataParameterValue,
+} from '@gnosis.pm/safe-react-gateway-sdk'
 import get from 'lodash/get'
 import { Text, CopyToClipboardBtn, IconText, FixedIcon } from '@gnosis.pm/safe-react-components'
 import { hexToBytes } from 'web3-utils'
 
 import { getExplorerInfo, getNativeCurrency } from 'src/config'
-import { DecodedData, DecodedDataBasicParameter, DecodedDataParameterValue } from 'src/types/transactions/decode.d'
 import { DecodedTxDetail } from 'src/routes/safe/components/Apps/components/ConfirmTxModal'
 import PrefixedEthHashInfo from '../PrefixedEthHashInfo'
 
@@ -156,8 +160,8 @@ const SingleTx = ({
   decodedData,
   onTxItemClick,
 }: {
-  decodedData: DecodedData | null
-  onTxItemClick: (decodedTxDetails: DecodedData) => void
+  decodedData: DecodedDataResponse | null
+  onTxItemClick: (decodedTxDetails: DecodedDataResponse) => void
 }): ReactElement | null => {
   if (!decodedData) {
     return null
@@ -181,7 +185,7 @@ const MultiSendTx = ({
   decodedData,
   onTxItemClick,
 }: {
-  decodedData: DecodedData | null
+  decodedData: DecodedDataResponse | null
   onTxItemClick: (decodedTxDetails: DecodedDataParameterValue) => void
 }): ReactElement | null => {
   const txs: DecodedDataParameterValue[] | undefined = get(decodedData, 'parameters[0].valueDecoded')
@@ -208,7 +212,7 @@ const MultiSendTx = ({
 
 type Props = {
   txs: Transaction[]
-  decodedData: DecodedData | null
+  decodedData: DecodedDataResponse | null
   onTxItemClick: (decodedTxDetails: DecodedTxDetail) => void
 }
 

src/config/index.ts

@@ -8,6 +8,7 @@ import {
 } from '@gnosis.pm/safe-react-gateway-sdk'
 
 import {
+  GATEWAY_URL,
   DEFAULT_CHAIN_ID,
   ETHERSCAN_API_KEY,
   INFURA_TOKEN,
@@ -89,7 +90,6 @@ export const getGasPriceOracles = (): Extract<ChainInfo['gasPrice'][number], Gas
   const isOracleType = (gasPrice: ChainInfo['gasPrice'][number]): gasPrice is GasPriceOracle => {
     return gasPrice.type === GAS_PRICE_TYPE.ORACLE
   }
-
   return getChainInfo().gasPrice.filter(isOracleType)
 }
 
@@ -100,24 +100,13 @@ export const getFixedGasPrice = (): Extract<ChainInfo['gasPrice'][number], GasPr
   return getChainInfo().gasPrice.filter(isFixed)[0]
 }
 
+// @TODO: Remove after Safe Apps reliance
 export const getTxServiceUrl = (): ChainInfo['transactionService'] => {
   const { transactionService } = getChainInfo()
   // To avoid breaking changes, we define the version the web uses manually
   return `${transactionService}/api/v${TX_SERVICE_VERSION}`
 }
 
-export const getTokensServiceUrl = (): string => {
-  return `${getTxServiceUrl()}/tokens`
-}
-
-export const getMasterCopiesUrl = (): string => {
-  return `${getTxServiceUrl()}/about/master-copies/`
-}
-
-export const getDataDecoderUrl = (): string => {
-  return `${getTxServiceUrl()}/data-decoder/`
-}
-
 export const getDisabledWallets = (): ChainInfo['disabledWallets'] => {
   return getChainInfo().disabledWallets
 }

src/logic/collectibles/sources/Gnosis.ts

@@ -3,10 +3,18 @@ import { SafeCollectibleResponse, TokenType } from '@gnosis.pm/safe-react-gatewa
 import { Collectibles, NFTAsset, NFTAssets, NFTTokens } from 'src/logic/collectibles/sources/collectibles.d'
 import { sameAddress } from 'src/logic/wallets/ethAddresses'
 import NFTIcon from 'src/routes/safe/components/Balances/assets/nft_icon.png'
-import { fetchSafeCollectibles } from 'src/logic/tokens/api'
-import { TokenResult } from 'src/logic/tokens/api/fetchErc20AndErc721AssetsList'
+import { fetchSafeCollectibles } from 'src/logic/tokens/api/fetchSafeCollectibles'
 import { Errors, logError } from 'src/logic/exceptions/CodedException'
 
+type TokenResult = {
+  address: string
+  decimals?: number
+  logoUri: string
+  name: string
+  symbol: string
+  type: TokenType
+}
+
 type FetchResult = {
   erc721Assets: TokenResult[]
   erc721Tokens: SafeCollectibleResponse[]

src/logic/contracts/api/masterCopies.ts

@@ -1,24 +1,19 @@
-import axios from 'axios'
-import { getMasterCopiesUrl } from 'src/config'
+import { MasterCopyReponse, getMasterCopies } from '@gnosis.pm/safe-react-gateway-sdk'
+
+import { _getChainId } from 'src/config'
+import { GATEWAY_URL } from 'src/utils/constants'
 
 export enum MasterCopyDeployer {
   GNOSIS = 'Gnosis',
   CIRCLES = 'Circles',
 }
 
-type MasterCopyFetch = {
-  address: string
-  version: string
-}
-
-export type MasterCopy = {
-  address: string
-  version: string
+export type MasterCopy = MasterCopyReponse[number] & {
   deployer: MasterCopyDeployer
   deployerRepoUrl: string
 }
 
-const extractMasterCopyInfo = (mc: MasterCopyFetch): MasterCopy => {
+const extractMasterCopyInfo = (mc: MasterCopyReponse[number]): MasterCopy => {
   const isCircles = mc.version.toLowerCase().includes(MasterCopyDeployer.CIRCLES.toLowerCase())
   const dashIndex = mc.version.indexOf('-')
 
@@ -35,8 +30,8 @@ const extractMasterCopyInfo = (mc: MasterCopyFetch): MasterCopy => {
 
 export const fetchMasterCopies = async (): Promise<MasterCopy[] | undefined> => {
   try {
-    const res = await axios.get<{ address: string; version: string }[]>(getMasterCopiesUrl())
-    return res.data.map(extractMasterCopyInfo)
+    const res = await getMasterCopies(GATEWAY_URL, _getChainId())
+    return res.map(extractMasterCopyInfo)
   } catch (error) {
     console.error('Fetching data from master-copies errored', error)
   }

src/logic/tokens/store/actions/fetchTokens.ts

@@ -1,20 +1,10 @@
 import ERC20Contract from '@openzeppelin/contracts/build/contracts/ERC20.json'
 import ERC721Contract from '@openzeppelin/contracts/build/contracts/ERC721.json'
-import { List } from 'immutable'
-import { AnyAction } from 'redux'
-import { ThunkDispatch } from 'redux-thunk'
 import { AbiItem } from 'web3-utils'
 
 import { ERC20 } from 'src/types/contracts/ERC20.d'
 import { ERC721 } from 'src/types/contracts/ERC721.d'
-import { addTokens } from 'src/logic/tokens/store/actions/addTokens'
-import { fetchErc20AndErc721AssetsList } from 'src/logic/tokens/api'
-import { makeToken } from 'src/logic/tokens/store/model/token'
-import { tokensSelector } from 'src/logic/tokens/store/selectors'
 import { getWeb3 } from 'src/logic/wallets/getWeb3'
-import { AppReduxState } from 'src/store'
-import { Errors, logError } from 'src/logic/exceptions/CodedException'
-import { TokenResult } from '../../api/fetchErc20AndErc721AssetsList'
 
 const createERC20TokenContract = (tokenAddress: string): ERC20 => {
   const web3 = getWeb3()
@@ -29,38 +19,3 @@ const createERC721TokenContract = (tokenAddress: string): ERC721 => {
 export const getERC20TokenContract = createERC20TokenContract
 
 export const getERC721TokenContract = createERC721TokenContract
-
-export const containsMethodByHash = async (contractAddress: string, methodHash: string): Promise<boolean> => {
-  const web3 = getWeb3()
-  const byteCode = await web3.eth.getCode(contractAddress)
-
-  return byteCode.indexOf(methodHash.replace('0x', '')) !== -1
-}
-
-export const fetchTokens =
-  () =>
-  async (
-    dispatch: ThunkDispatch<AppReduxState, undefined, AnyAction>,
-    getState: () => AppReduxState,
-  ): Promise<void> => {
-    const currentSavedTokens = tokensSelector(getState())
-
-    let tokenList: TokenResult[]
-    try {
-      const resp = await fetchErc20AndErc721AssetsList()
-      tokenList = resp.data.results
-    } catch (e) {
-      logError(Errors._600, e.message)
-      return
-    }
-
-    const erc20Tokens = tokenList.filter((token) => token.type.toLowerCase() === 'erc20')
-
-    if (currentSavedTokens?.size === erc20Tokens.length) {
-      return
-    }
-
-    const tokens = List(erc20Tokens.map((token) => makeToken(token)))
-
-    dispatch(addTokens(tokens))
-  }

src/logic/tokens/store/reducer/tokens.ts

@@ -1,9 +1,8 @@
 import { List, Map } from 'immutable'
 import { Action, handleActions } from 'redux-actions'
 
-import { ADD_TOKEN } from 'src/logic/tokens/store/actions/addToken'
 import { ADD_TOKENS } from 'src/logic/tokens/store/actions/addTokens'
-import { makeToken, Token } from 'src/logic/tokens/store/model/token'
+import { Token } from 'src/logic/tokens/store/model/token'
 
 export const TOKEN_REDUCER_ID = 'tokens'
 
@@ -24,12 +23,6 @@ const tokensReducer = handleActions<TokenState, Payloads>(
         })
       })
     },
-    [ADD_TOKEN]: (state, action: Action<TokenPayload>) => {
-      const { token } = action.payload
-      const { address: tokenAddress } = token
-
-      return state.set(tokenAddress, makeToken(token))
-    },
   },
   Map(),
 )

src/routes/safe/components/Apps/components/ConfirmTxModal/DecodedTxDetail.tsx

@@ -1,12 +1,12 @@
 import { ReactElement } from 'react'
 import styled from 'styled-components'
+import { DecodedDataParameterValue, DecodedDataResponse } from '@gnosis.pm/safe-react-gateway-sdk'
 
 import { getNativeCurrency } from 'src/config'
 import { fromTokenUnit } from 'src/logic/tokens/utils/humanReadableValue'
 import { md, lg } from 'src/theme/variables'
 import ModalTitle from 'src/components/ModalTitle'
 import Hairline from 'src/components/layout/Hairline'
-import { DecodedDataParameterValue, DecodedData } from 'src/types/transactions/decode.d'
 import { BasicTxInfo, getParameterElement } from 'src/components/DecodeTxs'
 
 const Container = styled.div`
@@ -22,7 +22,7 @@ function isDataDecodedParameterValue(arg: any): arg is DecodedDataParameterValue
 type Props = {
   hideDecodedTxData: () => void
   onClose: () => void
-  decodedTxData: DecodedDataParameterValue | DecodedData
+  decodedTxData: DecodedDataParameterValue | DecodedDataResponse
 }
 
 export const DecodedTxDetail = ({ hideDecodedTxData, onClose, decodedTxData: tx }: Props): ReactElement => {
@@ -48,7 +48,7 @@ export const DecodedTxDetail = ({ hideDecodedTxData, onClose, decodedTxData: tx
   return (
     <>
       <ModalTitle
-        title={(tx as DecodedDataParameterValue).dataDecoded?.method || (tx as DecodedData).method}
+        title={(tx as DecodedDataParameterValue).dataDecoded?.method || (tx as DecodedDataResponse).method}
         onClose={onClose}
         goBack={hideDecodedTxData}
       />

src/routes/safe/components/Apps/components/ConfirmTxModal/ReviewConfirm.tsx

@@ -4,6 +4,7 @@ import { ReactElement, useEffect, useMemo, useState } from 'react'
 import { useDispatch, useSelector } from 'react-redux'
 import styled from 'styled-components'
 import { toBN } from 'web3-utils'
+import { DecodedDataResponse } from '@gnosis.pm/safe-react-gateway-sdk'
 
 import { createTransaction } from 'src/logic/safe/store/actions/createTransaction'
 import { getMultisendContractAddress } from 'src/logic/contracts/safeContracts'
@@ -19,7 +20,6 @@ import { useEstimationStatus } from 'src/logic/hooks/useEstimationStatus'
 import { TxParameters } from 'src/routes/safe/container/hooks/useTransactionParameters'
 import { BasicTxInfo, DecodeTxs } from 'src/components/DecodeTxs'
 import { fetchTxDecoder } from 'src/utils/decodeTx'
-import { DecodedData } from 'src/types/transactions/decode.d'
 import { fromTokenUnit } from 'src/logic/tokens/utils/humanReadableValue'
 import Block from 'src/components/layout/Block'
 import Hairline from 'src/components/layout/Hairline'
@@ -80,7 +80,7 @@ export const ReviewConfirm = ({
   showDecodedTxData,
 }: Props): ReactElement => {
   const isMultiSend = txs.length > 1
-  const [decodedData, setDecodedData] = useState<DecodedData | null>(null)
+  const [decodedData, setDecodedData] = useState<DecodedDataResponse | null>(null)
   const dispatch = useDispatch()
   const nativeCurrency = getNativeCurrency()
   const explorerUrl = getExplorerInfo(safeAddress)

src/routes/safe/components/Apps/components/ConfirmTxModal/index.tsx

@@ -1,14 +1,14 @@
 import { ReactElement, useState } from 'react'
 import { Transaction } from '@gnosis.pm/safe-apps-sdk-v1'
 import { RequestId } from '@gnosis.pm/safe-apps-sdk'
+import { DecodedDataParameterValue, DecodedDataResponse } from '@gnosis.pm/safe-react-gateway-sdk'
 
 import Modal from 'src/components/Modal'
 import { SafeApp } from 'src/routes/safe/components/Apps/types'
 import { TransactionParams } from 'src/routes/safe/components/Apps/components/AppFrame'
 import { mustBeEthereumAddress } from 'src/components/forms/validator'
 import { SafeAppLoadError } from './SafeAppLoadError'
 import { ReviewConfirm } from './ReviewConfirm'
-import { DecodedDataParameterValue, DecodedData } from 'src/types/transactions/decode'
 import { DecodedTxDetail } from './DecodedTxDetail'
 
 export type ConfirmTxModalProps = {
@@ -38,7 +38,7 @@ const isTxValid = (t: Transaction): boolean => {
   return isAddressValid && !!t.data && typeof t.data === 'string'
 }
 
-export type DecodedTxDetail = DecodedDataParameterValue | DecodedData | undefined
+export type DecodedTxDetail = DecodedDataParameterValue | DecodedDataResponse | undefined
 
 export const ConfirmTxModal = (props: ConfirmTxModalProps): ReactElement => {
   const [decodedTxDetails, setDecodedTxDetails] = useState<DecodedTxDetail>()