Fixes

src/components/layout/Hairline/index.js

@@ -14,7 +14,7 @@ const calculateStyleFrom = (color?: string, margin?: Size) => ({
 type Props = {
   margin?: Size,
   color?: string,
-  style?: Object
+  style?: Object,
 }
 
 const Hairline = ({ margin, color, style }: Props) => {

src/logic/contracts/safeContracts.js

@@ -10,7 +10,7 @@ import { ZERO_ADDRESS } from '~/logic/wallets/ethAddresses'
 let proxyFactoryMaster
 let safeMaster
 
-const createGnosisSafeContract = async (web3: any) => {
+const createGnosisSafeContract = (web3: any) => {
   const gnosisSafe = contract(GnosisSafeSol)
   gnosisSafe.setProvider(web3.currentProvider)
 

src/logic/wallets/getWeb3.js

@@ -37,7 +37,7 @@ export const openTxInEtherScan = (tx: string, network: string) => `https://${net
 export const getEtherScanLink = (address: string, network: string) => `https://${network}.etherscan.io/address/${address}`
 
 let web3
-export const getWeb3 = () => web3
+export const getWeb3 = () => web3 || (window.web3 && new Web3(window.web3.currentProvider)) || (window.ethereum && new Web3(window.ethereum))
 
 const getProviderName: Function = (web3Provider): boolean => {
   let name

src/routes/load/components/OwnerList/index.jsx

@@ -1,177 +0,0 @@
-// @flow
-import * as React from 'react'
-import Block from '~/components/layout/Block'
-import { withStyles } from '@material-ui/core/styles'
-import Field from '~/components/forms/Field'
-import { required } from '~/components/forms/validator'
-import TextField from '~/components/forms/TextField'
-import OpenInNew from '@material-ui/icons/OpenInNew'
-import Identicon from '~/components/Identicon'
-import OpenPaper from '~/components/Stepper/OpenPaper'
-import Col from '~/components/layout/Col'
-import Row from '~/components/layout/Row'
-import Link from '~/components/layout/Link'
-import Paragraph from '~/components/layout/Paragraph'
-import Hairline from '~/components/layout/Hairline'
-import {
-  xs, sm, md, lg, border, secondary,
-} from '~/theme/variables'
-import { getOwnerNameBy } from '~/routes/open/components/fields'
-import { getEtherScanLink, getWeb3 } from '~/logic/wallets/getWeb3'
-import { FIELD_LOAD_ADDRESS } from '~/routes/load/components/fields'
-import { getGnosisSafeContract } from '~/logic/contracts/safeContracts'
-
-
-const openIconStyle = {
-  height: '16px',
-  color: secondary,
-}
-
-const styles = () => ({
-  details: {
-    padding: lg,
-    borderRight: `solid 1px ${border}`,
-    height: '100%',
-  },
-  owners: {
-    display: 'flex',
-    justifyContent: 'flex-start',
-  },
-  ownerNames: {
-    maxWidth: '400px',
-  },
-  ownerAddresses: {
-    alignItems: 'center',
-    marginLeft: `${sm}`,
-  },
-  address: {
-    paddingLeft: '6px',
-  },
-  open: {
-    paddingLeft: sm,
-    width: 'auto',
-    '&:hover': {
-      cursor: 'pointer',
-    },
-  },
-  title: {
-    padding: `${md} ${lg}`,
-  },
-  owner: {
-    padding: `0 ${lg}`,
-    marginBottom: '12px',
-  },
-  header: {
-    padding: `${sm} ${lg}`,
-  },
-  name: {
-    marginRight: `${sm}`,
-  },
-})
-
-type LayoutProps = {
-  network: string,
-}
-
-type Props = LayoutProps & {
-  values: Object,
-  classes: Object,
-}
-
-type State = {
-  owners: Array,
-}
-
-class OwnerListComponent extends React.PureComponent<Props, State> {
-  state = {
-    owners: [],
-  }
-
-  mounted = false
-
-  componentDidMount = async () => {
-    this.mounted = true
-
-    const { values } = this.props
-    const safeAddress = values[FIELD_LOAD_ADDRESS]
-    const web3 = getWeb3()
-
-    const GnosisSafe = getGnosisSafeContract(web3)
-    const gnosisSafe = await GnosisSafe.at(safeAddress)
-    const owners = await gnosisSafe.getOwners()
-
-    if (!owners) {
-      return
-    }
-
-    if (this.mounted) {
-      this.setState(() => ({ owners: owners.sort() }))
-    }
-  }
-
-  componentWillUnmount() {
-    this.mounted = false
-  }
-
-  render() {
-    const { network, classes } = this.props
-    const { owners } = this.state
-
-    return (
-      <React.Fragment>
-        <Block className={classes.title}>
-          <Paragraph noMargin size="md" color="primary">
-            {`This Safe has ${owners.length} owners. Optional: Provide a name for each owner.`}
-          </Paragraph>
-        </Block>
-        <Hairline />
-        <Row className={classes.header}>
-          <Col xs={4}>NAME</Col>
-          <Col xs={8}>ADDRESS</Col>
-        </Row>
-        <Hairline />
-        <Block margin="md" padding="md">
-          { owners.map((x, index) => (
-            <Row key={`owner${(index)}`} className={classes.owner}>
-              <Col xs={4}>
-                <Field
-                  className={classes.name}
-                  name={getOwnerNameBy(index)}
-                  component={TextField}
-                  type="text"
-                  validate={required}
-                  defaultValue={`Owner #${index + 1}`}
-                  placeholder="Owner Name*"
-                  text="Owner Name"
-                />
-              </Col>
-              <Col xs={7}>
-                <Row className={classes.ownerAddresses}>
-                  <Identicon address={owners[index]} diameter={32} />
-                  <Paragraph size="md" color="disabled" noMargin className={classes.address}>
-                    {owners[index]}
-                  </Paragraph>
-                  <Link className={classes.open} to={getEtherScanLink(owners[index], network)} target="_blank">
-                    <OpenInNew style={openIconStyle} />
-                  </Link>
-                </Row>
-              </Col>
-            </Row>
-          )) }
-        </Block>
-      </React.Fragment>
-    )
-  }
-}
-
-const OwnerListPage = withStyles(styles)(OwnerListComponent)
-
-const OwnerList = ({ network }: LayoutProps) => (controls: React$Node, { values }: Object) => (
-  <React.Fragment>
-    <OpenPaper controls={controls} padding={false}>
-      <OwnerListPage network={network} values={values} />
-    </OpenPaper>
-  </React.Fragment>
-)
-
-export default OwnerList