load safe text replacements

.eslintrc

@@ -1,7 +1,7 @@
 {
-  "extends": ["airbnb", "plugin:flowtype/recommended"],
+  "extends": ["airbnb", "plugin:flowtype/recommended", "plugin:jsx-a11y/recommended"],
   "parser": "babel-eslint",
-  "plugins": ["jest", "flowtype"],
+  "plugins": ["jsx-a11y", "jest", "flowtype"],
   "rules": {
     "react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx"] }],
     "react/forbid-prop-types": [1, { "forbid": ["object", "any"] }],

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

@@ -16,6 +16,7 @@ import OpenPaper from '~/components/Stepper/OpenPaper'
 import { FIELD_LOAD_NAME, FIELD_LOAD_ADDRESS } from '~/routes/load/components/fields'
 import { getWeb3 } from '~/logic/wallets/getWeb3'
 import { getSafeMasterContract } from '~/logic/contracts/safeContracts'
+import { secondary } from '~/theme/variables'
 
 type Props = {
   classes: Object,
@@ -33,6 +34,11 @@ const styles = () => ({
     color: '#03AE60',
     height: '20px',
   },
+  links: {
+    '&>a': {
+      color: secondary,
+    },
+  },
 })
 
 export const SAFE_INSTANCE_ERROR = 'Address given is not a safe instance'
@@ -86,8 +92,8 @@ const Details = ({ classes, errors, form }: Props) => (
   <>
     <Block margin="sm">
       <Paragraph noMargin size="lg" color="primary">
-        Adding an existing Safe only requires the Safe address. Optionally you can give it a name. In case your
-        connected client is not the owner of the Safe, the interface will essentially provide you a read-only view.
+        Adding an existing Safe only requires the Safe address. Your connected wallet does not have to be the owner of
+        this Safe. In this case, the interface will provide you a read-only view.
       </Paragraph>
     </Block>
     <Block className={classes.root}>
@@ -122,6 +128,23 @@ const Details = ({ classes, errors, form }: Props) => (
         text="Safe Address"
       />
     </Block>
+    <Block margin="sm">
+      <Paragraph noMargin size="md" color="primary" className={classes.links}>
+        By continuing you consent with the
+        {' '}
+        <a rel="noopener noreferrer" href="https://safe.gnosis.io/terms" target="_blank">
+          terms of use
+        </a>
+        {' '}
+        and
+        {' '}
+        <a rel="noopener noreferrer" href="https://safe.gnosis.io/privacy" target="_blank">
+          privacy policy
+        </a>
+        . Most importantly, you confirm that your funds are held securely in the Gnosis Safe, a smart contract on the
+        Ethereum blockchain. These funds cannot be accessed by Gnosis at any point.
+      </Paragraph>
+    </Block>
   </>
 )
 

src/routes/load/components/Layout.jsx

@@ -13,7 +13,7 @@ import { history } from '~/store'
 import { secondary } from '~/theme/variables'
 import { type SelectorProps } from '~/routes/load/container/selector'
 
-const getSteps = () => ['Details', 'Owners', 'Review']
+const getSteps = () => ['Name and address', 'Owners', 'Review']
 
 type Props = SelectorProps & {
   onLoadSafeSubmit: (values: Object) => Promise<void>,

src/routes/open/components/SafeNameForm/index.jsx

@@ -33,7 +33,7 @@ const styles = () => ({
 })
 
 const SafeName = ({ classes }: Props) => (
-  <React.Fragment>
+  <>
     <Block margin="lg">
       <Paragraph noMargin size="md" color="primary">
         You are about to create a new Gnosis Safe wallet with one or more owners. First, let&apos;s give your new wallet
@@ -67,7 +67,7 @@ const SafeName = ({ classes }: Props) => (
         Ethereum blockchain. These funds cannot be accessed by Gnosis at any point.
       </Paragraph>
     </Block>
-  </React.Fragment>
+  </>
 )
 
 const SafeNameForm = withStyles(styles)(SafeName)