Merge branch '189-cookie-banner' of https://github.com/gnosis/safe-react into 189-cookie-banner

package.json

@@ -52,6 +52,7 @@
     "material-ui-search-bar": "^1.0.0-beta.13",
     "notistack": "https://github.com/gnosis/notistack.git#v0.9.4",
     "optimize-css-assets-webpack-plugin": "5.0.3",
+    "polish": "^0.2.3",
     "qrcode.react": "1.0.0",
     "react": "16.12.0",
     "react-dom": "16.12.0",

src/components/CookiesBanner/index.jsx

@@ -126,6 +126,7 @@ We use cookies to give you the best
           <div className={classes.formItem}>
             <FormControlLabel
               checked={localNecessary}
+              disabled
               label="Necessary"
               name="Necessary"
               onChange={() => setLocalNecessary((prev) => !prev)}

src/components/Root/index.js

@@ -11,7 +11,6 @@ import Loader from '../Loader'
 import { history, store } from '~/store'
 import theme from '~/theme/mui'
 import AppRoutes from '~/routes'
-
 import './index.scss'
 
 const Root = () => (

src/components/Root/index.scss

@@ -1,3 +1,7 @@
+* {
+  box-sizing: border-box;
+}
+
 html,
 body {
   height: 100%;
@@ -9,32 +13,34 @@ body {
   font-style: normal;
   font-weight: 400;
   font-display: swap;
-  src: local("Averta-Regular"), url(../../assets/fonts/Averta-normal.woff2) format('woff2');
+  src: local("Averta-Regular"),
+    url(../../assets/fonts/Averta-normal.woff2) format("woff2");
 }
 
 @font-face {
-  font-family: 'Averta';
+  font-family: "Averta";
   font-style: normal;
   font-weight: 800;
   font-display: swap;
-  src: local("Averta-Extrabold"), url(../../assets/fonts/Averta-ExtraBold.woff2) format('woff2');
+  src: local("Averta-Extrabold"),
+    url(../../assets/fonts/Averta-ExtraBold.woff2) format("woff2");
 }
 
 body {
-  position: absolute;
-  bottom: 0;
-  top: 0;
-  left: 0;
-  right: 0;
-  overflow-x: hidden;
-  color: $fontColor;
-  font-family: 'Averta', monospace;
-  font-size: $mediumFontSize;
-  margin: 0;
-  background-color: $background;
-  text-rendering: geometricPrecision;
-  -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  background-color: $background;
+  bottom: 0;
+  color: $fontColor;
+  font-family: "Averta", monospace;
+  font-size: $mediumFontSize;
+  left: 0;
+  margin: 0;
+  overflow-x: hidden;
+  position: absolute;
+  right: 0;
+  text-rendering: geometricPrecision;
+  top: 0;
 }
 
 body > div:first-child {

src/index.js

@@ -1,14 +1,13 @@
 // @flow
 import 'babel-polyfill'
-
 import React from 'react'
 import ReactDOM from 'react-dom'
 import Root from '~/components/Root'
-import { store } from '~/store'
-import loadSafesFromStorage from '~/routes/safe/store/actions/loadSafesFromStorage'
 import loadActiveTokens from '~/logic/tokens/store/actions/loadActiveTokens'
-import loadDefaultSafe from '~/routes/safe/store/actions/loadDefaultSafe'
 import loadCookiesFromStorage from '~/logic/cookies/store/actions/loadCookiesFromStorage'
+import loadDefaultSafe from '~/routes/safe/store/actions/loadDefaultSafe'
+import loadSafesFromStorage from '~/routes/safe/store/actions/loadSafesFromStorage'
+import { store } from '~/store'
 
 if (process.env.NODE_ENV !== 'production') {
   // eslint-disable-next-line

src/logic/safe/transactions/send.js

@@ -68,7 +68,18 @@ export const getExecutionTransaction = async (
     const web3 = getWeb3()
     const contract = new web3.eth.Contract(GnosisSafeSol.abi, safeInstance.address)
 
-    return contract.methods.execTransaction(to, valueInWei, data, operation, safeTxGas, baseGas, gasPrice, gasToken, refundReceiver, sigs)
+    return contract.methods.execTransaction(
+      to,
+      valueInWei,
+      data,
+      operation,
+      safeTxGas,
+      baseGas,
+      gasPrice,
+      gasToken,
+      refundReceiver,
+      sigs,
+    )
   } catch (err) {
     console.error(`Error while creating transaction: ${err}`)
 

src/routes/safe/store/actions/createTransaction.js

@@ -55,13 +55,35 @@ const createTransaction = (
   try {
     if (isExecution) {
       tx = await getExecutionTransaction(
-        safeInstance, to, valueInWei, txData, CALL, nonce, 
+        safeInstance,
-        0, 0, 0, ZERO_ADDRESS, ZERO_ADDRESS, from, sigs
+        to,
+        valueInWei,
+        txData,
+        CALL,
+        nonce,
+        0,
+        0,
+        0,
+        ZERO_ADDRESS,
+        ZERO_ADDRESS,
+        from,
+        sigs,
       )
     } else {
       tx = await getApprovalTransaction(
-        safeInstance, to, valueInWei, txData, CALL, nonce, 
+        safeInstance,
-        0, 0, 0, ZERO_ADDRESS, ZERO_ADDRESS, from, sigs
+        to,
+        valueInWei,
+        txData,
+        CALL,
+        nonce,
+        0,
+        0,
+        0,
+        ZERO_ADDRESS,
+        ZERO_ADDRESS,
+        from,
+        sigs,
       )
     }
 

src/routes/safe/store/actions/fetchSafe.js

@@ -43,9 +43,7 @@ const getLocalSafe = async (safeAddress: string) => {
   return storedSafes[safeAddress]
 }
 
-export const checkAndUpdateSafeOwners = (safeAddress: string) => async (
+export const checkAndUpdateSafeOwners = (safeAddress: string) => async (dispatch: ReduxDispatch<GlobalState>) => {
-  dispatch: ReduxDispatch<GlobalState>,
-) => {
   // Check if the owner's safe did change and update them
   const [gnosisSafe, localSafe] = await Promise.all([getGnosisSafeInstanceAt(safeAddress), getLocalSafe(safeAddress)])
   const remoteOwners = await gnosisSafe.getOwners()

src/routes/safe/store/actions/processTransaction.js

@@ -36,18 +36,20 @@ export const generateSignaturesFromTxConfirmations = (
   }
 
   let sigs = '0x'
-  Object.keys(confirmationsMap).sort().forEach((addr) => {
+  Object.keys(confirmationsMap)
-    const conf = confirmationsMap[addr]
+    .sort()
-    if (conf.signature) {
+    .forEach((addr) => {
-      sigs += conf.signature.slice(2)
+      const conf = confirmationsMap[addr]
-    } else {
+      if (conf.signature) {
-      // https://gnosis-safe.readthedocs.io/en/latest/contracts/signatures.html#pre-validated-signatures
+        sigs += conf.signature.slice(2)
-      sigs += `000000000000000000000000${addr.replace(
+      } else {
-        '0x',
+        // https://gnosis-safe.readthedocs.io/en/latest/contracts/signatures.html#pre-validated-signatures
-        '',
+        sigs += `000000000000000000000000${addr.replace(
-      )}000000000000000000000000000000000000000000000000000000000000000001`
+          '0x',
-    }
+          '',
-  })
+        )}000000000000000000000000000000000000000000000000000000000000000001`
+      }
+    })
   return sigs
 }
 

src/theme/mui.js

@@ -1,23 +1,26 @@
 // @flow
 import { createMuiTheme } from '@material-ui/core/styles'
+import { rgba } from 'polished'
 import {
-  extraSmallFontSize,
-  mediumFontSize,
-  smallFontSize,
-  disabled,
-  primary,
-  secondary,
-  error,
-  sm,
-  md,
-  lg,
-  bolderFont,
-  regularFont,
   boldFont,
+  bolderFont,
   buttonLargeFontSize,
+  disabled,
+  error,
+  extraSmallFontSize,
   largeFontSize,
-  xs,
+  lg,
+  mainFontFamily,
+  md,
+  mediumFontSize,
+  primary,
+  regularFont,
+  secondary,
+  secondaryFontFamily,
   secondaryText,
+  sm,
+  smallFontSize,
+  xs,
 } from './variables'
 
 export type WithStyles = {
@@ -42,7 +45,7 @@ const palette = {
 // see https://github.com/mui-org/material-ui/blob/v1-beta/src/styles/createMuiTheme.js
 export default createMuiTheme({
   typography: {
-    fontFamily: 'Averta,sans-serif',
+    fontFamily: mainFontFamily,
     useNextVariants: true,
   },
   overrides: {
@@ -53,7 +56,7 @@ export default createMuiTheme({
         fontWeight: regularFont,
       },
       root: {
-        fontFamily: 'Averta, monospace',
+        fontFamily: secondaryFontFamily,
         letterSpacing: '0.9px',
         '&$disabled': {
           color: disabled,
@@ -109,7 +112,7 @@ export default createMuiTheme({
     },
     MuiChip: {
       root: {
-        fontFamily: 'Averta, monospace',
+        fontFamily: secondaryFontFamily,
       },
     },
     MuiStepIcon: {
@@ -132,30 +135,30 @@ export default createMuiTheme({
     },
     MuiTypography: {
       body1: {
-        fontFamily: 'Averta, monospace',
+        fontFamily: secondaryFontFamily,
         letterSpacing: '-0.5px',
         fontSize: mediumFontSize,
       },
       body2: {
-        fontFamily: 'Averta, monospace',
+        fontFamily: secondaryFontFamily,
       },
     },
     MuiFormHelperText: {
       root: {
-        fontFamily: 'Averta, monospace',
+        color: secondary,
+        fontFamily: secondaryFontFamily,
         fontSize: '12px',
+        marginTop: '0px',
+        order: 0,
         padding: `0 0 0 ${md}`,
         position: 'absolute',
         top: '5px',
-        color: secondary,
-        order: 0,
-        marginTop: '0px',
         zIndex: 1, // for firefox
       },
     },
     MuiInput: {
       root: {
-        fontFamily: 'Averta, monospace',
+        fontFamily: secondaryFontFamily,
         color: primary,
         fontSize: mediumFontSize,
         lineHeight: '56px',
@@ -222,7 +225,7 @@ export default createMuiTheme({
     },
     MuiTab: {
       root: {
-        fontFamily: 'Averta, monospace',
+        fontFamily: secondaryFontFamily,
         fontWeight: 'normal',
         fontSize: extraSmallFontSize,
         '&$selected': {
@@ -244,7 +247,7 @@ export default createMuiTheme({
         top: '0px',
       },
       caption: {
-        fontFamily: 'Averta, monospace',
+        fontFamily: secondaryFontFamily,
         fontSize: mediumFontSize,
         order: 2,
         color: disabled,
@@ -270,7 +273,7 @@ export default createMuiTheme({
     },
     MuiTableCell: {
       root: {
-        fontFamily: 'Averta, monospace',
+        fontFamily: secondaryFontFamily,
         fontSize: mediumFontSize,
         borderBottomWidth: '2px',
       },
@@ -298,7 +301,7 @@ export default createMuiTheme({
     },
     MuiMenuItem: {
       root: {
-        fontFamily: 'Averta, monospace',
+        fontFamily: secondaryFontFamily,
       },
     },
     MuiListItemIcon: {
@@ -308,17 +311,31 @@ export default createMuiTheme({
     },
     MuiListItemText: {
       primary: {
-        fontFamily: 'Averta, monospace',
+        fontFamily: secondaryFontFamily,
         fontSize: mediumFontSize,
         fontWeight: bolderFont,
         color: primary,
       },
       secondary: {
-        fontFamily: 'Averta, monospace',
+        fontFamily: secondaryFontFamily,
         fontSize: smallFontSize,
         color: disabled,
       },
     },
+    MuiCheckbox: {
+      colorSecondary: {
+        '&$disabled': {
+          color: rgba(secondary, 0.5),
+        },
+      },
+    },
+    MuiFormControlLabel: {
+      label: {
+        '&$disabled': {
+          color: primary,
+        },
+      },
+    },
   },
   palette,
 })

src/theme/variables.js

@@ -8,7 +8,6 @@ const fancyColor = '#f02525'
 const fontColor = '#001428'
 const headerHeight = '53px'
 const lg = '24px'
-const mainFontFamily = 'Averta, sans-serif'
 const marginButtonImg = '12px'
 const md = '16px'
 const primary = '#001428'
@@ -42,7 +41,7 @@ module.exports = {
   largeFontSize: '16px',
   lg,
   lightFont: 300,
-  mainFontFamily,
+  mainFontFamily: 'Averta, sans-serif',
   marginButtonImg,
   md,
   mediumFontSize: '14px',
@@ -56,6 +55,7 @@ module.exports = {
   screenXs: 480,
   screenXsMax: 767,
   secondary,
+  secondaryFontFamily: 'Averta, monospace',
   secondaryText: secondaryTextOrSvg,
   sm,
   smallFontSize: '12px',

yarn.lock

@@ -13881,6 +13881,11 @@ pocket-js-core@0.0.3:
   dependencies:
     axios "^0.18.0"
 
+polish@^0.2.3:
+  version "0.2.3"
+  resolved "https://registry.yarnpkg.com/polish/-/polish-0.2.3.tgz#4a95296b5501dd10d3b25b8e6ed8339ef4deb147"
+  integrity sha1-SpUpa1UB3RDTsluObtgznvTesUc=
+
 polished@^3.3.1:
   version "3.4.2"
   resolved "https://registry.yarnpkg.com/polished/-/polished-3.4.2.tgz#b4780dad81d64df55615fbfc77acb52fd17d88cd"
@@ -19731,7 +19736,6 @@ websocket@1.0.29, "websocket@github:web3-js/WebSocket-Node#polyfill/globalThis":
   dependencies:
     debug "^2.2.0"
     es5-ext "^0.10.50"
-    gulp "^4.0.2"
     nan "^2.14.0"
     typedarray-to-buffer "^3.1.5"
     yaeti "^0.0.6"