From d5e076a30752093d3a823acaa58386f34fe67de0 Mon Sep 17 00:00:00 2001 From: Mikhail Mikheev Date: Fri, 8 Nov 2019 19:02:42 +0400 Subject: [PATCH 1/9] Allow passing dismissAll to closeSnackbar action, to be polished --- package.json | 6 ++--- .../notifications/notificationBuilder.js | 2 +- .../store/reducer/notifications.js | 15 ++++++++++-- .../store/middlewares/providerWatcher.js | 14 ++++++++--- yarn.lock | 24 +++++++++---------- 5 files changed, 40 insertions(+), 21 deletions(-) diff --git a/package.json b/package.json index 6ee34bd63b..83bd43dd66 100644 --- a/package.json +++ b/package.json @@ -43,7 +43,7 @@ "axios": "0.19.0", "bignumber.js": "9.0.0", "connected-react-router": "6.5.2", - "date-fns": "2.6.0", + "date-fns": "2.7.0", "ethereum-ens": "0.7.8", "final-form": "4.18.6", "history": "4.10.1", @@ -118,7 +118,7 @@ "eslint-config-airbnb": "18.0.1", "eslint-plugin-flowtype": "4.3.0", "eslint-plugin-import": "2.18.2", - "eslint-plugin-jest": "23.0.2", + "eslint-plugin-jest": "23.0.3", "eslint-plugin-jsx-a11y": "6.2.3", "eslint-plugin-react": "7.16.0", "ethereumjs-abi": "0.6.8", @@ -141,7 +141,7 @@ "storybook-host": "5.1.0", "storybook-router": "^0.3.4", "style-loader": "1.0.0", - "truffle": "5.0.43", + "truffle": "5.0.44", "truffle-contract": "4.0.31", "truffle-solidity-loader": "0.1.32", "uglifyjs-webpack-plugin": "2.2.0", diff --git a/src/logic/notifications/notificationBuilder.js b/src/logic/notifications/notificationBuilder.js index b1c46f3008..3932dd68b5 100644 --- a/src/logic/notifications/notificationBuilder.js +++ b/src/logic/notifications/notificationBuilder.js @@ -152,7 +152,7 @@ export const enhanceSnackbarForAction = (notification: Notification) => ({ options: { ...notification.options, action: (key) => ( - store.dispatch(closeSnackbarAction(key))}> + store.dispatch(closeSnackbarAction({key}))}> ), diff --git a/src/logic/notifications/store/reducer/notifications.js b/src/logic/notifications/store/reducer/notifications.js index 687f5ae8ad..42aed888a5 100644 --- a/src/logic/notifications/store/reducer/notifications.js +++ b/src/logic/notifications/store/reducer/notifications.js @@ -18,9 +18,20 @@ export default handleActions( return state.set(notification.key, makeNotification(notification)) }, [CLOSE_SNACKBAR]: (state: NotificationReducerState, action: ActionType): NotificationReducerState => { - const key = action.payload + const { key, dismissAll } = action.payload + + if (key) { + return state.update(key, (prev) => prev.set('dismissed', true)) + } + if (dismissAll) { + return state.withMutations((map) => { + map.forEach((notification, notificationKey) => { + map.set(notificationKey, notification.set('dismissed', true)) + }) + }) + } - return state.update(key, (prev) => prev.set('dismissed', true)) + return state }, [REMOVE_SNACKBAR]: (state: NotificationReducerState, action: ActionType): NotificationReducerState => { const key = action.payload diff --git a/src/logic/wallets/store/middlewares/providerWatcher.js b/src/logic/wallets/store/middlewares/providerWatcher.js index 353714d7d3..989a5059cb 100644 --- a/src/logic/wallets/store/middlewares/providerWatcher.js +++ b/src/logic/wallets/store/middlewares/providerWatcher.js @@ -2,9 +2,10 @@ import type { Store, AnyAction } from 'redux' import { type GlobalState } from '~/store/' import { ADD_PROVIDER, REMOVE_PROVIDER } from '../actions' -import { getWeb3, getProviderInfo } from '~/logic/wallets/getWeb3' +import { getWeb3, getProviderInfo, WALLET_PROVIDER } from '~/logic/wallets/getWeb3' import { fetchProvider } from '~/logic/wallets/store/actions' import { loadFromStorage, saveToStorage, removeFromStorage } from '~/utils/storage' +import closeSnackbar from '~/logic/notifications/store/actions/closeSnackbar' const watchedActions = [ADD_PROVIDER, REMOVE_PROVIDER] @@ -30,17 +31,24 @@ const providerWatcherMware = (store: Store) => (next: Function) => clearInterval(watcherInterval) } + if (currentProviderProps.name === WALLET_PROVIDER.METAMASK && window.ethereum) { + window.ethereum.autoRefreshOnNetworkChange = false + } + saveToStorage(LAST_USED_PROVIDER_KEY, currentProviderProps.name) watcherInterval = setInterval(async () => { const web3 = getWeb3() const providerInfo = await getProviderInfo(web3) + const networkChanged = currentProviderProps.network !== providerInfo.network + + store.dispatch(closeSnackbar({ dismissAll: true })) if ( currentProviderProps.account !== providerInfo.account - || currentProviderProps.network !== providerInfo.network + || networkChanged ) { - store.dispatch(fetchProvider(web3, () => {}, () => {})) + store.dispatch(fetchProvider(web3)) } }, 2000) diff --git a/yarn.lock b/yarn.lock index a37d827724..12fc501d01 100644 --- a/yarn.lock +++ b/yarn.lock @@ -6570,10 +6570,10 @@ data-urls@^1.0.0: whatwg-mimetype "^2.2.0" whatwg-url "^7.0.0" -date-fns@2.6.0: - version "2.6.0" - resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-2.6.0.tgz#a5bc82e6a4c3995ae124b0ba1a71aec7b8cbd666" - integrity sha512-F55YxqRdEfP/eYQmQjLN798v0AwLjmZ8nMBjdQvNwEE3N/zWVrlkkqT+9seBlPlsbkybG4JmWg3Ee3dIV9BcGQ== +date-fns@2.7.0: + version "2.7.0" + resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-2.7.0.tgz#8271d943cc4636a1f27698f1b8d6a9f1ceb74026" + integrity sha512-wxYp2PGoUDN5ZEACc61aOtYFvSsJUylIvCjpjDOqM1UDaKIIuMJ9fAnMYFHV3TQaDpfTVxhwNK/GiCaHKuemTA== debug-fabulous@0.0.X: version "0.0.4" @@ -7493,10 +7493,10 @@ eslint-plugin-import@2.18.2: read-pkg-up "^2.0.0" resolve "^1.11.0" -eslint-plugin-jest@23.0.2: - version "23.0.2" - resolved "https://registry.yarnpkg.com/eslint-plugin-jest/-/eslint-plugin-jest-23.0.2.tgz#54a59bfe77245186afe13711a297067aefefff0a" - integrity sha512-fkxcvOJm0hC/jbJqYJjtuC9mvpTJqXd0Nixx7joVQvJoBQuXk/ws3+MtRYzD/4TcKSgvr21uuSLdwSxKJKC2cg== +eslint-plugin-jest@23.0.3: + version "23.0.3" + resolved "https://registry.yarnpkg.com/eslint-plugin-jest/-/eslint-plugin-jest-23.0.3.tgz#d3f157f7791f97713372c13259ba1dfc436eb4c1" + integrity sha512-9cNxr66zeOyz1S9AkQL4/ouilR6QHpYj8vKOQZ60fu9hAt5PJWS4KqWqfr1aqN5NFEZSPjFOla2Azn+KTWiGwg== dependencies: "@typescript-eslint/experimental-utils" "^2.5.0" @@ -18120,10 +18120,10 @@ truffle-solidity-loader@0.1.32: truffle-config "^1.1.19" truffle-core "^5.0.33" -truffle@5.0.43: - version "5.0.43" - resolved "https://registry.yarnpkg.com/truffle/-/truffle-5.0.43.tgz#b5508807ec59789b90749daefb16f8b6fef8ce96" - integrity sha512-PbqOjgtYlkNAbJqzHeiMGvgBCLSuPVAWbM4+TNIGsRyqVCRIvXdLeQXUmdCRcGMWMteCvQ9Knhu4zNzT2Eo53A== +truffle@5.0.44: + version "5.0.44" + resolved "https://registry.yarnpkg.com/truffle/-/truffle-5.0.44.tgz#791df87992e32cf87840d3a58450e9e0331ccc0c" + integrity sha512-nbJAu5P76AU7wZxbQl/yPhf8g8gXMkVQtWZGRec5lz6w4fc4cOLrbAD6G6IJYVJqK3s8FTIjox0YKsI/Az/O6w== dependencies: app-module-path "^2.2.0" mocha "5.2.0" From 66efe219cf1a66b07fbc76309d57f9bd7aa8d0c2 Mon Sep 17 00:00:00 2001 From: Mikhail Mikheev Date: Fri, 8 Nov 2019 19:02:49 +0400 Subject: [PATCH 2/9] eslint fix --- src/logic/notifications/notificationBuilder.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/logic/notifications/notificationBuilder.js b/src/logic/notifications/notificationBuilder.js index 3932dd68b5..7166806477 100644 --- a/src/logic/notifications/notificationBuilder.js +++ b/src/logic/notifications/notificationBuilder.js @@ -152,7 +152,7 @@ export const enhanceSnackbarForAction = (notification: Notification) => ({ options: { ...notification.options, action: (key) => ( - store.dispatch(closeSnackbarAction({key}))}> + store.dispatch(closeSnackbarAction({ key }))}> ), From bfdc36c612b987ff2d316469d2f70ff5e7db362c Mon Sep 17 00:00:00 2001 From: mmv Date: Mon, 11 Nov 2019 14:43:41 +0400 Subject: [PATCH 3/9] close all notifications on network change --- src/logic/wallets/store/middlewares/providerWatcher.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/src/logic/wallets/store/middlewares/providerWatcher.js b/src/logic/wallets/store/middlewares/providerWatcher.js index 989a5059cb..2832ba9b4f 100644 --- a/src/logic/wallets/store/middlewares/providerWatcher.js +++ b/src/logic/wallets/store/middlewares/providerWatcher.js @@ -43,11 +43,11 @@ const providerWatcherMware = (store: Store) => (next: Function) => const networkChanged = currentProviderProps.network !== providerInfo.network - store.dispatch(closeSnackbar({ dismissAll: true })) - if ( - currentProviderProps.account !== providerInfo.account - || networkChanged - ) { + if (networkChanged) { + store.dispatch(closeSnackbar({ dismissAll: true })) + } + + if (currentProviderProps.account !== providerInfo.account || networkChanged) { store.dispatch(fetchProvider(web3)) } }, 2000) From c2e70136ba9ff3097b3ad0e6ca00fdaf7003fb97 Mon Sep 17 00:00:00 2001 From: mmv Date: Mon, 11 Nov 2019 17:43:13 +0400 Subject: [PATCH 4/9] Add info icon, notifications wip --- .../layout/PageFrame/assets/info.svg | 7 ++++ src/components/layout/PageFrame/index.jsx | 15 ++++---- .../notifications/notificationBuilder.js | 14 +++---- src/logic/notifications/notificationTypes.js | 38 +++++++++---------- 4 files changed, 41 insertions(+), 33 deletions(-) create mode 100644 src/components/layout/PageFrame/assets/info.svg diff --git a/src/components/layout/PageFrame/assets/info.svg b/src/components/layout/PageFrame/assets/info.svg new file mode 100644 index 0000000000..9f7502e4bb --- /dev/null +++ b/src/components/layout/PageFrame/assets/info.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/src/components/layout/PageFrame/index.jsx b/src/components/layout/PageFrame/index.jsx index 9c8b1fa88a..c95f7a24e0 100644 --- a/src/components/layout/PageFrame/index.jsx +++ b/src/components/layout/PageFrame/index.jsx @@ -6,9 +6,10 @@ import SidebarProvider from '~/components/Sidebar' import Header from '~/components/Header' import Img from '~/components/layout/Img' import Notifier from '~/components/Notifier' -import AlertLogo from './assets/alert.svg' -import CheckLogo from './assets/check.svg' -import ErrorLogo from './assets/error.svg' +import AlertIcon from './assets/alert.svg' +import CheckIcon from './assets/check.svg' +import ErrorIcon from './assets/error.svg' +import InfoIcon from './assets/info.svg' import styles from './index.scss' const notificationStyles = { @@ -67,10 +68,10 @@ const PageFrame = ({ children, classes }: Props) => ( variantInfo: classes.info, }} iconVariant={{ - success: Success, - error: Error, - warning: Warning, - info: '', + success: Success, + error: Error, + warning: Warning, + info: Info, }} > diff --git a/src/logic/notifications/notificationBuilder.js b/src/logic/notifications/notificationBuilder.js index 7166806477..66d69d2fd8 100644 --- a/src/logic/notifications/notificationBuilder.js +++ b/src/logic/notifications/notificationBuilder.js @@ -9,23 +9,23 @@ import { type Notification, NOTIFICATIONS } from './notificationTypes' export type NotificationsQueue = { beforeExecution: Notification, - pendingExecution: { + pendingExecution: Notification, + afterExecution: { noMoreConfirmationsNeeded: Notification, moreConfirmationsNeeded: Notification, }, - afterExecution: Notification, afterExecutionError: Notification, afterRejection: Notification, } const standardTxNotificationsQueue: NotificationsQueue = { beforeExecution: NOTIFICATIONS.SIGN_TX_MSG, - pendingExecution: { - noMoreConfirmationsNeeded: NOTIFICATIONS.TX_PENDING_MSG, - moreConfirmationsNeeded: NOTIFICATIONS.TX_PENDING_MORE_CONFIRMATIONS_MSG, - }, + pendingExecution: NOTIFICATIONS.TX_PENDING_MSG, afterRejection: NOTIFICATIONS.TX_REJECTED_MSG, - afterExecution: NOTIFICATIONS.TX_EXECUTED_MSG, + afterExecution: { + noMoreConfirmationsNeeded: NOTIFICATIONS.TX_EXECUTED_MSG, + moreConfirmationsNeeded: NOTIFICATIONS.TX_EXECUTED_MORE_CONFIRMATIONS_MSG, + }, afterExecutionError: NOTIFICATIONS.TX_FAILED_MSG, } diff --git a/src/logic/notifications/notificationTypes.js b/src/logic/notifications/notificationTypes.js index 39be1b9d4e..944227f905 100644 --- a/src/logic/notifications/notificationTypes.js +++ b/src/logic/notifications/notificationTypes.js @@ -34,9 +34,9 @@ export type Notifications = { // Regular/Custom Transactions SIGN_TX_MSG: Notification, TX_PENDING_MSG: Notification, - TX_PENDING_MORE_CONFIRMATIONS_MSG: Notification, TX_REJECTED_MSG: Notification, TX_EXECUTED_MSG: Notification, + TX_EXECUTED_MORE_CONFIRMATIONS_MSG: Notification, TX_FAILED_MSG: Notification, // Approval Transactions @@ -113,11 +113,7 @@ export const NOTIFICATIONS: Notifications = { }, TX_PENDING_MSG: { message: 'Transaction pending', - options: { variant: SUCCESS, persist: true }, - }, - TX_PENDING_MORE_CONFIRMATIONS_MSG: { - message: 'Transaction pending: More confirmations required to execute', - options: { variant: SUCCESS, persist: true }, + options: { variant: INFO, persist: true }, }, TX_REJECTED_MSG: { message: 'Transaction rejected', @@ -127,6 +123,10 @@ export const NOTIFICATIONS: Notifications = { message: 'Transaction successfully executed', options: { variant: SUCCESS, persist: false, autoHideDuration: longDuration }, }, + TX_EXECUTED_MORE_CONFIRMATIONS_MSG: { + message: 'Transaction successfully created. More confirmations needed to execute', + options: { variant: SUCCESS, persist: false, autoHideDuration: longDuration }, + }, TX_FAILED_MSG: { message: 'Transaction failed', options: { variant: ERROR, persist: false, autoHideDuration: longDuration }, @@ -158,28 +158,28 @@ export const NOTIFICATIONS: Notifications = { options: { variant: SUCCESS, persist: false, autoHideDuration: shortDuration }, }, - // Owners - SIGN_OWNER_CHANGE_MSG: { - message: 'Please sign the owner change', + // Settings + SETTINGS_CHANGE_MSG: { + message: 'Please sign settings change', options: { variant: SUCCESS, persist: true }, }, - OWNER_CHANGE_PENDING_MSG: { - message: 'Owner change pending', - options: { variant: SUCCESS, persist: true }, + SETTINGS_CHANGE_PENDING_MSG: { + message: 'Settings change pending', + options: { variant: INFO, persist: true }, }, - OWNER_CHANGE_PENDING_MORE_CONFIRMATIONS_MSG: { + SETTINGS_CHANGE_PENDING_MORE_CONFIRMATIONS_MSG: { message: 'Owner change pending: More confirmations required to execute', - options: { variant: SUCCESS, persist: true }, + options: { variant: INFO, persist: true }, }, - OWNER_CHANGE_REJECTED_MSG: { + SETTINGS_CHANGE_REJECTED_MSG: { message: 'Owner change rejected', options: { variant: ERROR, persist: false, autoHideDuration: longDuration }, }, - OWNER_CHANGE_EXECUTED_MSG: { + SETTINGS_CHANGE_EXECUTED_MSG: { message: 'Owner change successfully executed', options: { variant: SUCCESS, persist: false, autoHideDuration: longDuration }, }, - OWNER_CHANGE_FAILED_MSG: { + SETTINGS_CHANGE_FAILED_MSG: { message: 'Owner change failed', options: { variant: ERROR, persist: false, autoHideDuration: longDuration }, }, @@ -191,11 +191,11 @@ export const NOTIFICATIONS: Notifications = { }, THRESHOLD_CHANGE_PENDING_MSG: { message: 'Required confirmations change pending', - options: { variant: SUCCESS, persist: true }, + options: { variant: INFO, persist: true }, }, THRESHOLD_CHANGE_PENDING_MORE_CONFIRMATIONS_MSG: { message: 'Required confirmations change pending: More confirmations required to execute', - options: { variant: SUCCESS, persist: true }, + options: { variant: INFO, persist: true }, }, THRESHOLD_CHANGE_REJECTED_MSG: { message: 'Required confirmations change rejected', From 36817ba9a3eba227c3aa78f1ece8efb007d1c61f Mon Sep 17 00:00:00 2001 From: mmv Date: Tue, 12 Nov 2019 15:10:18 +0400 Subject: [PATCH 5/9] ConnectButton cleanup --- src/components/ConnectButton/index.jsx | 12 ++---------- 1 file changed, 2 insertions(+), 10 deletions(-) diff --git a/src/components/ConnectButton/index.jsx b/src/components/ConnectButton/index.jsx index ca726dadb8..4c91a0048f 100644 --- a/src/components/ConnectButton/index.jsx +++ b/src/components/ConnectButton/index.jsx @@ -1,6 +1,5 @@ // @flow import React from 'react' -import { connect } from 'react-redux' import Web3Connect from 'web3connect' // import Torus from '@toruslabs/torus-embed' import WalletConnectProvider from '@walletconnect/web3-provider' @@ -54,15 +53,11 @@ web3Connect.on('connect', (provider: any) => { }) type Props = { - registerProvider: Function, enqueueSnackbar: Function, closeSnackbar: Function, } -const ConnectButton = ({ - registerProvider, ...props -}: Props) => ( - +const ConnectButton = (props: Props) => (