Fix isCancellationTx formatting, add AddressLink component

package.json

@@ -40,7 +40,7 @@
     "bignumber.js": "9.0.0",
     "connected-react-router": "6.5.2",
     "date-fns": "1.30.1",
-    "final-form": "4.17.0",
+    "final-form": "4.18.2",
     "history": "^4.7.2",
     "immortal-db": "^1.0.2",
     "immutable": "^4.0.0-rc.9",
@@ -51,7 +51,7 @@
     "react-dom": "^16.8.6",
     "react-final-form": "6.3.0",
     "react-final-form-listeners": "^1.0.2",
-    "react-hot-loader": "4.12.6",
+    "react-hot-loader": "4.12.7",
     "react-infinite-scroll-component": "^4.5.2",
     "react-redux": "7.1.0",
     "react-router-dom": "^4.3.1",
@@ -104,11 +104,11 @@
     "classnames": "^2.2.5",
     "css-loader": "3.0.0",
     "detect-port": "^1.2.2",
-    "eslint": "^5.16.0",
+    "eslint": "6.0.1",
     "eslint-config-airbnb": "17.1.1",
     "eslint-plugin-flowtype": "3.11.1",
     "eslint-plugin-import": "2.18.0",
-    "eslint-plugin-jest": "22.7.2",
+    "eslint-plugin-jest": "22.9.0",
     "eslint-plugin-jsx-a11y": "6.2.3",
     "eslint-plugin-react": "7.14.2",
     "ethereumjs-abi": "^0.6.7",
@@ -121,7 +121,7 @@
     "jest": "24.8.0",
     "jest-dom": "4.0.0",
     "json-loader": "^0.5.7",
-    "mini-css-extract-plugin": "0.7.0",
+    "mini-css-extract-plugin": "0.8.0",
     "postcss-loader": "^3.0.0",
     "postcss-mixins": "^6.2.0",
     "postcss-simple-vars": "^5.0.2",

src/components/AddressLink/index.jsx

@@ -0,0 +1,30 @@
+// @flow
+import React from 'react'
+import { connect } from 'react-redux'
+import OpenInNew from '@material-ui/icons/OpenInNew'
+import { getEtherScanLink } from '~/logic/wallets/getWeb3'
+import { shortVersionOf } from '~/logic/wallets/ethAddresses'
+import { secondary } from '~/theme/variables'
+import { networkSelector } from '~/logic/wallets/store/selectors'
+
+const openIconStyle = {
+  height: '13px',
+  color: secondary,
+}
+
+type AddressLinkProps = {
+  address: string,
+  currentNetwork: string,
+}
+
+const AddressLink = ({ address, currentNetwork }: AddressLinkProps) => (
+  <a href={getEtherScanLink(address, currentNetwork)} target="_blank" rel="noopener noreferrer">
+    {shortVersionOf(address, 4)}
+    <OpenInNew style={openIconStyle} />
+  </a>
+)
+
+export default connect<Object, Object, ?Function, ?Object>(
+  state => ({ currentNetwork: networkSelector(state) }),
+  null,
+)(AddressLink)

src/logic/wallets/getWeb3.js

@@ -32,9 +32,9 @@ export const ETHEREUM_NETWORK_IDS = {
   42: ETHEREUM_NETWORK.KOVAN,
 }
 
-export const openTxInEtherScan = (txHash: string, network: string) => `https://${network}.etherscan.io/tx/${txHash}`
+export const openTxInEtherScan = (txHash: string, network: string) => `https://${network === 'mainnet' ? '' : `${network}.`}etherscan.io/tx/${txHash}`
 
-export const getEtherScanLink = (address: string, network: string) => `https://${network}.etherscan.io/address/${address}`
+export const getEtherScanLink = (address: string, network: string) => `https://${network === 'mainnet' ? '' : `${network}.`}etherscan.io/address/${address}`
 
 let web3
 export const getWeb3 = () => web3 || (window.web3 && new Web3(window.web3.currentProvider)) || (window.ethereum && new Web3(window.ethereum))

src/routes/safe/components/TransactionsNew/TxsTable/ExpandedTx/OwnersColumn/index.jsx

@@ -29,7 +29,8 @@ type Props = {
   onTxExecute: Function,
 }
 
-const isCancellationTransaction = (tx: Transaction, safeAddress: string) => !tx.value && tx.data === EMPTY_DATA && tx.recipient === safeAddress
+const isCancellationTransaction = (tx: Transaction, safeAddress: string) =>
+  !tx.value && tx.data === EMPTY_DATA && tx.recipient === safeAddress
 
 const OwnersColumn = ({
   tx,

src/routes/safe/components/TransactionsNew/TxsTable/ExpandedTx/TxDescription/index.jsx

@@ -4,6 +4,7 @@ import { withStyles } from '@material-ui/core/styles'
 import OpenInNew from '@material-ui/icons/OpenInNew'
 import { type Transaction } from '~/routes/safe/store/models/transaction'
 import Bold from '~/components/layout/Bold'
+import AddressLink from '~/components/AddressLink'
 import Paragraph from '~/components/layout/Paragraph'
 import Block from '~/components/layout/Block'
 import { getEtherScanLink } from '~/logic/wallets/getWeb3'
@@ -39,17 +40,6 @@ type DescriptionDescProps = {
   newThreshold?: string,
 }
 
-type AddressLinkProps = {
-  address: string,
-}
-
-const RinkebyAddressLink = ({ address }: AddressLinkProps) => (
-  <a href={getEtherScanLink(address, 'rinkeby')} target="_blank" rel="noopener noreferrer">
-    {shortVersionOf(address, 4)}
-    <OpenInNew style={openIconStyle} />
-  </a>
-)
-
 const TransferDescription = ({ value = '', symbol, recipient }: TransferDescProps) => (
   <Paragraph noMargin>
     <Bold>
@@ -62,7 +52,7 @@ const TransferDescription = ({ value = '', symbol, recipient }: TransferDescProp
 to:
     </Bold>
     <br />
-    <RinkebyAddressLink address={recipient} />
+    <AddressLink address={recipient} />
   </Paragraph>
 )
 
@@ -72,14 +62,14 @@ const SettingsDescription = ({ removedOwner, addedOwner, newThreshold }: Descrip
       <Paragraph>
         <Bold>Remove owner:</Bold>
         <br />
-        <RinkebyAddressLink address={removedOwner} />
+        <AddressLink address={removedOwner} />
       </Paragraph>
     )}
     {addedOwner && (
       <Paragraph>
         <Bold>Add owner:</Bold>
         <br />
-        <RinkebyAddressLink address={addedOwner} />
+        <AddressLink address={addedOwner} />
       </Paragraph>
     )}
     {newThreshold && (

yarn.lock

@@ -6862,10 +6862,10 @@ eslint-plugin-import@2.18.0:
     read-pkg-up "^2.0.0"
     resolve "^1.11.0"
 
-eslint-plugin-jest@22.7.2:
+eslint-plugin-jest@22.9.0:
-  version "22.7.2"
+  version "22.9.0"
-  resolved "https://registry.yarnpkg.com/eslint-plugin-jest/-/eslint-plugin-jest-22.7.2.tgz#7ab118a66a34e46ae5e16a128b5d24fd28b43dca"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-jest/-/eslint-plugin-jest-22.9.0.tgz#2573dbcb4f1066b96a6e6d3b9aa439c80b28975a"
-  integrity sha512-Aecqe3ulBVI7amgOycVI8ZPL8o0SnGHOf3zn2/Ciu8TXyXDHcjtwD3hOs3ss/Qh/VAwlW/DMcuiXg5btgF+XMA==
+  integrity sha512-V89BUiwf76FHlhj1mlNhNyvpzTy8VbWCh2RZpKYz/XDSl/pcuwFiE/LMt7r3q1sRKygzEMjbYeDob8MMuvakXg==
 
 eslint-plugin-jsx-a11y@6.2.3:
   version "6.2.3"
@@ -6933,7 +6933,49 @@ eslint-visitor-keys@^1.0.0:
   resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-1.0.0.tgz#3f3180fb2e291017716acb4c9d6d5b5c34a6a81d"
   integrity sha512-qzm/XxIbxm/FHyH341ZrbnMUpe+5Bocte9xkmFMzPMjRaZMcXww+MpBptFvtU+79L362nqiLhekCxCxDPaUMBQ==
 
-eslint@^5.0.0, eslint@^5.16.0, eslint@^5.5.0:
+eslint@6.0.1:
+  version "6.0.1"
+  resolved "https://registry.yarnpkg.com/eslint/-/eslint-6.0.1.tgz#4a32181d72cb999d6f54151df7d337131f81cda7"
+  integrity sha512-DyQRaMmORQ+JsWShYsSg4OPTjY56u1nCjAmICrE8vLWqyLKxhFXOthwMj1SA8xwfrv0CofLNVnqbfyhwCkaO0w==
+  dependencies:
+    "@babel/code-frame" "^7.0.0"
+    ajv "^6.10.0"
+    chalk "^2.1.0"
+    cross-spawn "^6.0.5"
+    debug "^4.0.1"
+    doctrine "^3.0.0"
+    eslint-scope "^4.0.3"
+    eslint-utils "^1.3.1"
+    eslint-visitor-keys "^1.0.0"
+    espree "^6.0.0"
+    esquery "^1.0.1"
+    esutils "^2.0.2"
+    file-entry-cache "^5.0.1"
+    functional-red-black-tree "^1.0.1"
+    glob-parent "^3.1.0"
+    globals "^11.7.0"
+    ignore "^4.0.6"
+    import-fresh "^3.0.0"
+    imurmurhash "^0.1.4"
+    inquirer "^6.2.2"
+    is-glob "^4.0.0"
+    js-yaml "^3.13.1"
+    json-stable-stringify-without-jsonify "^1.0.1"
+    levn "^0.3.0"
+    lodash "^4.17.11"
+    minimatch "^3.0.4"
+    mkdirp "^0.5.1"
+    natural-compare "^1.4.0"
+    optionator "^0.8.2"
+    progress "^2.0.0"
+    regexpp "^2.0.1"
+    semver "^5.5.1"
+    strip-ansi "^4.0.0"
+    strip-json-comments "^2.0.1"
+    table "^5.2.3"
+    text-table "^0.2.0"
+
+eslint@^5.0.0, eslint@^5.5.0:
   version "5.16.0"
   resolved "https://registry.yarnpkg.com/eslint/-/eslint-5.16.0.tgz#a1e3ac1aae4a3fbd8296fcf8f7ab7314cbb6abea"
   integrity sha512-S3Rz11i7c8AA5JPv7xAH+dOyq/Cu/VXHiHXBPOU1k/JAM5dXqQPt3qcrhpHSorXmrpu2g0gkIBVXAqCpzfoZIg==
@@ -6992,6 +7034,15 @@ espree@^5.0.1:
     acorn-jsx "^5.0.0"
     eslint-visitor-keys "^1.0.0"
 
+espree@^6.0.0:
+  version "6.0.0"
+  resolved "https://registry.yarnpkg.com/espree/-/espree-6.0.0.tgz#716fc1f5a245ef5b9a7fdb1d7b0d3f02322e75f6"
+  integrity sha512-lJvCS6YbCn3ImT3yKkPe0+tJ+mH6ljhGNjHQH9mRtiO6gjhVAOhVXW1yjnwqGwTkK3bGbye+hb00nFNmu0l/1Q==
+  dependencies:
+    acorn "^6.0.7"
+    acorn-jsx "^5.0.0"
+    eslint-visitor-keys "^1.0.0"
+
 esprima@^3.1.3, esprima@~3.1.0:
   version "3.1.3"
   resolved "https://registry.yarnpkg.com/esprima/-/esprima-3.1.3.tgz#fdca51cee6133895e3c88d535ce49dbff62a4633"
@@ -7854,10 +7905,10 @@ fill-range@^4.0.0:
     repeat-string "^1.6.1"
     to-regex-range "^2.1.0"
 
-final-form@4.17.0:
+final-form@4.18.2:
-  version "4.17.0"
+  version "4.18.2"
-  resolved "https://registry.yarnpkg.com/final-form/-/final-form-4.17.0.tgz#7ffd4d56967b4ff25f7b6a03ed00484c2c35fcc2"
+  resolved "https://registry.yarnpkg.com/final-form/-/final-form-4.18.2.tgz#3e7447ba36049a747d4becc61eb35e65a90f22a1"
-  integrity sha512-/vFaHCybK89qR4E6ytKRKiDCqMNtW+H9FtEGcJQEKyLJU2znPRMmKXSEGnDHnTCkuud5fGhegLepW3+h/RvblQ==
+  integrity sha512-VQx/5x9M4CiC8fG678Dm1IS3mXvBl7ZNIUx5tUZCk00lFImJzQix4KO0+eGtl49sha2bYOxuYn8jRJiq6sazXA==
   dependencies:
     "@babel/runtime" "^7.3.1"
 
@@ -11650,7 +11701,17 @@ min-indent@^1.0.0:
   resolved "https://registry.yarnpkg.com/min-indent/-/min-indent-1.0.0.tgz#cfc45c37e9ec0d8f0a0ec3dd4ef7f7c3abe39256"
   integrity sha1-z8RcN+nsDY8KDsPdTvf3w6vjklY=
 
-mini-css-extract-plugin@0.7.0, mini-css-extract-plugin@^0.7.0:
+mini-css-extract-plugin@0.8.0:
+  version "0.8.0"
+  resolved "https://registry.yarnpkg.com/mini-css-extract-plugin/-/mini-css-extract-plugin-0.8.0.tgz#81d41ec4fe58c713a96ad7c723cdb2d0bd4d70e1"
+  integrity sha512-MNpRGbNA52q6U92i0qbVpQNsgk7LExy41MdAlG84FeytfDOtRIf/mCHdEgG8rpTKOaNKiqUnZdlptF469hxqOw==
+  dependencies:
+    loader-utils "^1.1.0"
+    normalize-url "1.9.1"
+    schema-utils "^1.0.0"
+    webpack-sources "^1.1.0"
+
+mini-css-extract-plugin@^0.7.0:
   version "0.7.0"
   resolved "https://registry.yarnpkg.com/mini-css-extract-plugin/-/mini-css-extract-plugin-0.7.0.tgz#5ba8290fbb4179a43dd27cca444ba150bee743a0"
   integrity sha512-RQIw6+7utTYn8DBGsf/LpRgZCJMpZt+kuawJ/fju0KiOL6nAaTBNmCJwS7HtwSCXfS47gCkmtBFS7HdsquhdxQ==
@@ -13953,10 +14014,10 @@ react-helmet-async@^1.0.2:
     react-fast-compare "2.0.4"
     shallowequal "1.1.0"
 
-react-hot-loader@4.12.6:
+react-hot-loader@4.12.7:
-  version "4.12.6"
+  version "4.12.7"
-  resolved "https://registry.yarnpkg.com/react-hot-loader/-/react-hot-loader-4.12.6.tgz#bd7a41501b02576638031482474a72bac453587d"
+  resolved "https://registry.yarnpkg.com/react-hot-loader/-/react-hot-loader-4.12.7.tgz#51ed57ee46c5d4d3906e58e8cdcd3f6ceeb1c0ec"
-  integrity sha512-tRXWgF5MhQSEXX3EHIplCOWCzSg+ye7ddHeQLt7Z+CaZMeEfeCL2/uSGITIzWXOQYhefnLX8IZtr2cff4xIrww==
+  integrity sha512-ejnGcNttqIsgaLEpCl3KHLzFfKiEKHz/VTLYv57/xKQoryDMXQ/w31+jicrOAiCStYsY+KvrulVqkOqqkRaifg==
   dependencies:
     fast-levenshtein "^2.0.6"
     global "^4.3.0"