Feature: #473 - Display notification for old contracts (#476)

* Development (#378)

* Adds cookie permissions to localStorage/redux state

* Adds action

* Adds files to git

* (fix) linting issues

* (update) flow-typed

* (update) .eslint and .flowconfig

* (add) cookie banner

* Finish cookie banner implementation

* (Add) checkbox's disabled style.

* Removes redux for cookiesStorage

* Fix cookieStore deletion

* Fixs cookies acceptance

* Fixs cookies banner verbiage
Fix "x" in wrong place for snackbar messages

* (remove) unused library

* Adds cookies utils
Replaces localStorage with cookies
Adds js-cookie

* (fix) added correct polished library and import, updated flow-typed

* (update) removed polish flow type, added js-cookie flow type

* Add link to cookie policy, use generic links for legal docs

* Remove link to cookie policy from sidebar, link cookie policy in the banner

* Let the user re-open the cookie banner

* remove withMutations from cookies reducer, move utils/cookies to logic/cookies

* Now the sidebar closes when the cookie banner is toggled

* Feature #169: Intercom (#301)

* Implements intercom
Adds REACT_APP_INTERCOM_ID_MAINNET and REACT_APP_INTERCOM_ID_RINKEBY env vars

* Adds .env.example

* Adds intercom env vars

* Updates env vars
Replaces "rinkeby" and "mainnet" with "non-production" and "production"

* Now loads intercom after the user accepted the analytics

* Add env variable for production intercom id

* Update .env.example

* Removes react-intercom
Fixs getIntercomId with default dev appID
Now loads intercom as script

* Renegerate flow-types

* Remove 'Hide zero balances' (#310)

* Use medium font size for 'select an asset' label (#312)

* Feature #272: Google Analytics (#299)

* Adds google analytics tracking for every route

* Adds cookies acceptance check before tracking

* Fix react-ga dependency

* Fix cookieStore deletion

* Merge with #189-cookie-banner

* Fixs react ga version
Refactored HOC with hooks

* Fix TYPO

* Fix path for cookies utils

* Fix imports

* remove flow type definition for polish

* Add GA ID log

* Fix load GA After cookies acceptance

* Feature #224: Activate tokens automatically (#300)

* Replace 'Manage Tokens' with 'Manage List'

* prevent 301 redirects

* Add `BLACKLISTED_TOKENS` key to persist through immortal

* Add store/action to extract _activate tokens by its balance_

- keeps already activated tokens
- discards blacklisted tokens
- adds tokens whose vales are bigger than zero and are not blacklisted

* Add `blacklistedTokens` list to safe's store

* Display activeTokensByBalance in 'Balances' screen

* Enable token's blacklisting functionality in Tokens List

* Retrieve balance from API

* Rename action to `activateTokensByBalance`

* Fix linting errors

- line too long
- required return

* Do not persist a separate list into `BLACKLISTED_TOKENS`

* Typo fix (#326)

* Fix security vulnerability: Remove uglifyjs, use terser plugin (#327)

* Remove uglifyjs, use terser plugin

* fix css-loader config

* Feature #256: Sticky header (#308)

* Add sticky header

* Remove react-headroom, set position to fixed for header

* Regenerate yarn lock

* Remove unused headroom style from root.scss

* Pull from dev, conflict fixes

* Update welcome text (#323)

* Feature #137: Tx list improvements (#222)

* Fix swapOwners threshold displayed as hex in tx list

* Refactor spinner in empty table

* Fix number of rows per page in table pagination

* Add use of EtherscanLink component

* Set short version of strings in tx list

* Adjust styles in tx list

* Add more styles to table

* WIP

* An attempt to fix #204 by showing UNKNOWN instead of failed to fetch token symbol

* Table pagination style fixes

* Show confirm transaction button in owner list

* Update dependencies

* Add confirmation icons to owner list in tx list

* exclude unneeded stuff from travis.yml

* Adds cookie permissions to localStorage/redux state

* Update dependencies

* Adds action

* Adds files to git

* (fix) linting issues

* (update) flow-typed

* (update) .eslint and .flowconfig

* (add) cookie banner

* Finish cookie banner implementation

* (Add) checkbox's disabled style.

* Removes redux for cookiesStorage

* Fix cookieStore deletion

* Increase TO_EXP for bignumber.js

* Fixs cookies acceptance

* Fixs cookies banner verbiage
Fix "x" in wrong place for snackbar messages

* (fix) added correct polished library and import, updated flow-typed

* (update) removed polish flow type, added js-cookie flow type

* Add link to cookie policy, use generic links for legal docs

* Remove link to cookie policy from sidebar, link cookie policy in the banner

* Mock Safe creation transaction

* Format code

* Fix break statement

* Remove deployment of storybook

* Let the user re-open the cookie banner

* Update tx status messages and visual confirmation progress

* Fix svg in tx confirmation progress

* Add styles to tx type in tx list

* Replace nonce in tx list with tx id

* Update opacity of cancelled tx

* Fix short version of address

* remove withMutations from cookies reducer, move utils/cookies to logic/cookies

* Now the sidebar closes when the cookie banner is toggled

* Fix styles in tx list

* Add Pending status in tx description

* (remove) unused library

* Adds cookies utils
Replaces localStorage with cookies
Adds js-cookie

* Set 25 rows per page in tx list by default

* Align tx table

* Adjust tx table and tx details borders

* Fix fetching transactions to show Safe creation tx alone

* Fix failed Safe creation transaction

* Add styles to tx data

* Refactor and fix owner list in transaction

* Refactor use of theme variables

* Remove storybook files

* Update dependencies

* Fix warnings

* Fix dependencies

* Update file-loader config

* Fix owner colors in the tx confirmation progress

* Fix transaction type icon height

* Tx list adjustments

* Update readme

* (Feature) Etherscan button icon (#331)

* (add) new open on etherscan button icon

* (remove) unused asset

* (fix) icon background

* Feature #239: Replace early access label with network label (#311)

* Remove early access label

* Revert "Remove early access label"

This reverts commit 34682f0f6d9c1974a6e45c2a31358864931d9c1e.

* Replace early access label with network label

* Capitalzie first letter of the network name

* Adds threshold update on checkAndUpdateSafe (#320)

* Feature #159: Pending transaction that requires user confirmation (#330)

* Creates a new notification: waitingConfirmation
Adds key as optional parameter for notification
Implemented getAwaitingTransactions to get the transactions that needs to be confirmed by the current user
Not fetchTransactions action also dispatch a notification for awaiting transactions
Improved performance of routes/safe/container/index to avoid re-rendering

* Removes notification logic on fetchTransactions
Adds notificationsMiddleware

* Moves fetchTransaction to container

* Removes unused param on fetchTransactions

* Fixs null safe check

* Fixs middleware declaration

* Removes lodash

* Changes cancelled transaction detection logic

* Feature #122: Multisig migration (#315)

* Adds query-string package.json
Parses query string on open layout

* Implements load all the values on openSafe view from param querys

* Adds query params validation

* Moves query parse logic to open.jsx

* Changes default no metamask component on open page

* Replaces global isNaN

* Fix threshold parsing validation

* Updates the welcome component with new verbiage for open

* Renames isOpenSafe to isOldMultisigMigration

* Merge branch 'development' of https://github.com/gnosis/safe-react into 122-multisig-migration

# Conflicts:
#	src/routes/open/components/Layout.jsx

* Merge branch 'development' of https://github.com/gnosis/safe-react into 159-pending-transactions

# Conflicts:
#	src/routes/safe/components/Transactions/index.jsx
#	yarn.lock

* set anonymizeIp to true (#335)

* Feature #180: Predict transaction nonce (#293)

* Dep bump

* Fetch transactions when safe view is mounted

* eslint fix

* Calculate new tx nonce from latest tx in service

* Fix tx cancellation, allow passing nonce to createTransaction

* dep bump

* Refactor createTransaction/processTransaction to use object as argument

* Adopting transactions table to new send tx flow with predicted nonces

* dep bump, disable esModule in file-loader options after new v5 release

* Don't show older tx annotation for already executed txs

* sort tx by nonce

* get new safe nonce after tx execution

* Bugfixes

* remove whitespace for showOlderTxAnnotation

* Feature #329: Rename to Multisig (#334)

* Rename to Multisig

* migration text fix

* replace safe for teams with multisig

* Fixs race condition (#341)

Fixs typo

* (Feature) Incoming transactions (#333)

* Add `blockNumber` to transactions model

* Create `incomingTransaction` node in store and load it along with `transactions`

* Add incoming transfers to the Transactions table

* Rename `transactionHash` to `executionTxHash` for better incoming/outgoing txs unification in Transactions table

* Add incoming transactions details

* Add transaction type icon in table row

* Add snackbar notification for incoming txs

* Make incoming transaction snackbar to show on any tab

* Use makeStyles hooks

* Fix incoming amounts conversion from wei

* Make concurrent promise calls

* Use date to calculate transactions ids

* Prevent repeating messages

- also move logic to display snack bar into the notifications middleware

* Merge transactions and incomingTxs to the transactions selector

* Show 'Multiple incoming transfers' if they are more than 3

* Prevent incoming transactions snack bar for first-timer users

* Set ID as the default order

* Use constant for _incoming_ type

* Feature #154: Fiat Balances (#290)

* Adds DropdownCurrency
Adds redux store for currencyValues
Adds Value column on the assets table
Adds mocked currency values

* (add) base currency dropdown

* (add) dropdown styles

* Refactors data fetching of the balances list
Now uses the endpoint

* Fix column value styling

* Adds support for ECB currency values

* Fixs list overflow

* Changes endpoint url
Adds decimals for balance values

* (fix) remove inline style

* (add) currencies dropdown search field

* (fix) list items' hover color

* Implements filter search

* Fix warning on dropdown template

* Saves selected currency in localStorage

* Remove spaces on curly braces
Add alt
Renames rowItem to cellItem
Improves fetchCurrenciesRates handling

* Removes withMutations

* Removes middleware
Export style to another file for dropdownCurrency

* Adds classNames

* Fix incomming transactions fetching (#346)

* Feature: Activate fortmatic (#339)

* Add fortmatic integration to web3connect

* add fortmatic

* Safe open form improvements: limit calling initContracts to 1 time

* update .env.example

* Feature #336: Confirmation required notification for non-owners fix (#338)

* Refactors grantedSelector with isUserOwner function
Checks if the user is owner of the safe before sending notification

* Adds safeParamAddressFromStateSelector
Refactors notificationsMiddleware with new selector

* Remove old size check

* safe notifications middleware fixes

* add apt-get update to travis yml

* (Fix) Incoming transactions inline-styles (#344)

* Remove inline styles

* Replace ternary with logical && operator

* use cn as shortcut for classnames

* Makes minMaxLength 2 to AddCustomToken (#363)

* Fixs ETH display on balances list (#360)

* Bug #348: Safelist entries get removed (#358)

* Fix balances saved to localStorage not in format [tokenAdd, balance] but [balance]

* Updates localStorage version value

* Use submission instead of execution date to sort outgoing txs (#364)

* Feature #190: Sidebar improvements (#347)

* Change icons
Adds checked icon

* Adds safeParamAddressFromStateSelector for get current safe selected
Implements check icon on sidebar

* Remove overflow on sidebar
Start alignments

* Removes headerPlaceholder

* Improves header

* Improves header

* Fix header style

* use sameAddress function to check address eqaulity when fetching transactions (#365)

* Bug #352: Owner shown multiple times (#367)

* Ensure lowercased string comparison for owners' addresses

* Use `sameAddress` for addresses comparison

* Use transaction value as a string (#369)

* Update isTokenTransfer to use value as a string

* Rename error message

* Update dependencies

* Refactor

* Fix alternative token abi and token address for incoming transactions (#373)

* Bug #313: Payload breaks ui (#371)

* Makes minMaxLength 2 to AddCustomToken

* Fix styling

* Fix typo

* Feature #200: Show version number (#370)

* Add `dotenv-expand` as a dependency

* Add app version to sidebar

* Add hardcoded latest safe version to env variables

* Add `semver` to compare current vs latest version

* Add Safe version to Safe Details

* Adjustments in version number

* Fix transaction description value (#377)

* Fix transaction description value

* Remove duplicated symbols

* fix checkAndUpdateSafe logic (#379)

* Update .env.example

* update package json version

* update package json version

* Fix app version in side bar

* add REACT_APP_APP_VERSION global env var

* add react_app_version to build script

* remove react_app_app_version from build-mainnet

* Implements notifications for out of date safes

* Updates notification verbiage

Co-authored-by: Germán Martínez <germartinez@users.noreply.github.com>

src/config/index.js

@@ -74,3 +74,5 @@ export const getIntercomId = () =>
     : "plssl1fl"
 
 export const getExchangeRatesUrl = () => 'https://api.exchangeratesapi.io/latest'
+
+export const getSafeLastVersion = () => process.env.REACT_APP_LATEST_SAFE_VERSION

src/logic/notifications/notificationTypes.js

@@ -67,7 +67,10 @@ export type Notifications = {
   // AddressBook
   ADDRESS_BOOK_NEW_ENTRY_SUCCESS: Notification,
   ADDRESS_BOOK_EDIT_ENTRY_SUCCESS: Notification,
-  ADDRESS_BOOK_DELETE_ENTRY_SUCCESS: Notification
+  ADDRESS_BOOK_DELETE_ENTRY_SUCCESS: Notification,
+
+  // Safe Version
+  SAFE_NEW_VERSION_AVAILABLE: Notification,
 }
 
 export const NOTIFICATIONS: Notifications = {
@@ -221,4 +224,10 @@ export const NOTIFICATIONS: Notifications = {
     message: 'Entry deleted successfully',
     options: { variant: SUCCESS, persist: false, preventDuplicate: false },
   },
+
+  // Safe Version
+  SAFE_NEW_VERSION_AVAILABLE: {
+    message: 'There is a new version available for this Safe',
+    options: { variant: WARNING, persist: false, preventDuplicate: true },
+  },
 }

src/logic/safe/utils/safeVersion.js

@@ -0,0 +1,22 @@
+// @flow
+import semverValid from 'semver/functions/valid'
+import semverLessThan from 'semver/functions/lt'
+import { getSafeMasterContract } from '~/logic/contracts/safeContracts'
+import { getSafeLastVersion } from '~/config'
+
+export const getSafeVersion = async () => {
+  let current
+  let latest
+  try {
+    const safeMaster = await getSafeMasterContract()
+    const safeMasterVersion = await safeMaster.VERSION()
+    current = semverValid(safeMasterVersion)
+    latest = semverValid(getSafeLastVersion())
+    const needUpdate = latest ? semverLessThan(current, latest) : false
+
+    return { current, latest, needUpdate }
+  } catch (err) {
+    console.error(err)
+    throw err
+  }
+}

src/routes/safe/components/Settings/SafeDetails/index.jsx

@@ -2,8 +2,6 @@
 import React, { useEffect } from 'react'
 import { makeStyles } from '@material-ui/core/styles'
 import { withSnackbar } from 'notistack'
-import semverLessThan from 'semver/functions/lt'
-import semverValid from 'semver/functions/valid'
 import Block from '~/components/layout/Block'
 import Col from '~/components/layout/Col'
 import Field from '~/components/forms/Field'
@@ -17,7 +15,7 @@ import Button from '~/components/layout/Button'
 import { getNotificationsFromTxType, showSnackbar } from '~/logic/notifications'
 import { TX_NOTIFICATION_TYPES } from '~/logic/safe/transactions'
 import { styles } from './style'
-import { getSafeMasterContract } from '~/logic/contracts/safeContracts'
+import { getSafeVersion } from '~/logic/safe/utils/safeVersion'
 
 export const SAFE_NAME_INPUT_TEST_ID = 'safe-name-input'
 export const SAFE_NAME_SUBMIT_BTN_TEST_ID = 'change-safe-name-btn'
@@ -48,18 +46,11 @@ const SafeDetails = (props: Props) => {
 
   useEffect(() => {
     const getVersion = async () => {
-      let current
-      let latest
       try {
-        const safeMaster = await getSafeMasterContract()
+        const { current, latest, needUpdate } = await getSafeVersion()
-        const safeMasterVersion = await safeMaster.VERSION()
-        current = semverValid(safeMasterVersion)
-        latest = semverValid(process.env.REACT_APP_LATEST_SAFE_VERSION)
-        const needUpdate = semverLessThan(current, latest)
-
         setSafeVersions({ current, latest, needUpdate })
       } catch (err) {
-        setSafeVersions({ current: current || 'Version not defined' })
+        setSafeVersions({ current: 'Version not defined' })
         console.error(err)
       }
     }

src/routes/safe/store/middleware/notificationsMiddleware.js

@@ -14,8 +14,10 @@ import { getIncomingTxAmount } from '~/routes/safe/components/Transactions/TxsTa
 import updateSafe from '~/routes/safe/store/actions/updateSafe'
 import { safesMapSelector } from '~/routes/safe/store/selectors'
 import { isUserOwner } from '~/logic/wallets/ethAddresses'
+import { ADD_SAFE } from '~/routes/safe/store/actions/addSafe'
+import { getSafeVersion } from '~/logic/safe/utils/safeVersion'
 
-const watchedActions = [ADD_TRANSACTIONS, ADD_INCOMING_TRANSACTIONS]
+const watchedActions = [ADD_TRANSACTIONS, ADD_INCOMING_TRANSACTIONS, ADD_SAFE]
 
 const notificationsMiddleware = (store: Store<GlobalState>) => (
   next: Function,
@@ -112,6 +114,22 @@ const notificationsMiddleware = (store: Store<GlobalState>) => (
         })
         break
       }
+      case ADD_SAFE: {
+        const { needUpdate } = await getSafeVersion()
+        const { safe } = action.payload
+        const notificationKey = `${safe.address}`
+        if (needUpdate) {
+          dispatch(
+            enqueueSnackbar(
+              enhanceSnackbarForAction(
+                NOTIFICATIONS.SAFE_NEW_VERSION_AVAILABLE,
+                notificationKey,
+              ),
+            ),
+          )
+        }
+        break
+      }
       default:
         break
     }