diff options
Diffstat (limited to 'ui/app/pages/home')
| -rw-r--r-- | ui/app/pages/home/home.component.js | 99 | ||||
| -rw-r--r-- | ui/app/pages/home/home.container.js | 47 |
2 files changed, 130 insertions, 16 deletions
diff --git a/ui/app/pages/home/home.component.js b/ui/app/pages/home/home.component.js index 4d96c3131..66d962ff1 100644 --- a/ui/app/pages/home/home.component.js +++ b/ui/app/pages/home/home.component.js @@ -2,25 +2,49 @@ import React, { PureComponent } from 'react' import PropTypes from 'prop-types' import Media from 'react-media' import { Redirect } from 'react-router-dom' +import HomeNotification from '../../components/app/home-notification' +import MultipleNotifications from '../../components/app/multiple-notifications' import WalletView from '../../components/app/wallet-view' import TransactionView from '../../components/app/transaction-view' import ProviderApproval from '../provider-approval' import { - INITIALIZE_SEED_PHRASE_ROUTE, RESTORE_VAULT_ROUTE, CONFIRM_TRANSACTION_ROUTE, CONFIRM_ADD_SUGGESTED_TOKEN_ROUTE, + INITIALIZE_BACKUP_SEED_PHRASE_ROUTE, } from '../../helpers/constants/routes' export default class Home extends PureComponent { + static contextTypes = { + t: PropTypes.func, + } + + static defaultProps = { + activeTab: {}, + unsetMigratedPrivacyMode: null, + forceApproveProviderRequestByOrigin: null, + } + static propTypes = { + activeTab: PropTypes.shape({ + origin: PropTypes.string, + protocol: PropTypes.string, + title: PropTypes.string, + url: PropTypes.string, + }), history: PropTypes.object, forgottenPassword: PropTypes.bool, - seedWords: PropTypes.string, suggestedTokens: PropTypes.object, unconfirmedTransactionsCount: PropTypes.number, providerRequests: PropTypes.array, + showPrivacyModeNotification: PropTypes.bool.isRequired, + unsetMigratedPrivacyMode: PropTypes.func, + viewingUnconnectedDapp: PropTypes.bool.isRequired, + forceApproveProviderRequestByOrigin: PropTypes.func, + shouldShowSeedPhraseReminder: PropTypes.bool, + rejectProviderRequestByOrigin: PropTypes.func, + isPopup: PropTypes.bool, } componentWillMount () { @@ -42,23 +66,26 @@ export default class Home extends PureComponent { // suggested new tokens if (Object.keys(suggestedTokens).length > 0) { - history.push(CONFIRM_ADD_SUGGESTED_TOKEN_ROUTE) + history.push(CONFIRM_ADD_SUGGESTED_TOKEN_ROUTE) } } render () { + const { t } = this.context const { + activeTab, forgottenPassword, - seedWords, providerRequests, history, + showPrivacyModeNotification, + unsetMigratedPrivacyMode, + viewingUnconnectedDapp, + forceApproveProviderRequestByOrigin, + shouldShowSeedPhraseReminder, + rejectProviderRequestByOrigin, + isPopup, } = this.props - // seed words - if (seedWords) { - return <Redirect to={{ pathname: INITIALIZE_SEED_PHRASE_ROUTE }}/> - } - if (forgottenPassword) { return <Redirect to={{ pathname: RESTORE_VAULT_ROUTE }} /> } @@ -68,7 +95,6 @@ export default class Home extends PureComponent { <ProviderApproval providerRequest={providerRequests[0]} /> ) } - return ( <div className="main-container"> <div className="account-and-transaction-details"> @@ -76,7 +102,58 @@ export default class Home extends PureComponent { query="(min-width: 576px)" render={() => <WalletView />} /> - { !history.location.pathname.match(/^\/confirm-transaction/) ? <TransactionView /> : null } + { !history.location.pathname.match(/^\/confirm-transaction/) + ? ( + <TransactionView> + <MultipleNotifications + className + notifications={[ + { + shouldBeRendered: showPrivacyModeNotification, + component: <HomeNotification + descriptionText={t('privacyModeDefault')} + acceptText={t('learnMore')} + onAccept={() => { + window.open('https://medium.com/metamask/42549d4870fa', '_blank', 'noopener') + unsetMigratedPrivacyMode() + }} + key="home-privacyModeDefault" + />, + }, + { + shouldBeRendered: viewingUnconnectedDapp, + component: <HomeNotification + descriptionText={t('shareAddressToConnect', [activeTab.origin])} + acceptText={t('shareAddress')} + onAccept={() => { + forceApproveProviderRequestByOrigin(activeTab.origin) + }} + ignoreText={t('dismiss')} + onIgnore={() => rejectProviderRequestByOrigin(activeTab.origin)} + infoText={t('shareAddressInfo', [activeTab.origin])} + key="home-shareAddressToConnect" + />, + }, + { + shouldBeRendered: shouldShowSeedPhraseReminder, + component: <HomeNotification + descriptionText={t('backupApprovalNotice')} + acceptText={t('backupNow')} + onAccept={() => { + if (isPopup) { + global.platform.openExtensionInBrowser(INITIALIZE_BACKUP_SEED_PHRASE_ROUTE) + } else { + history.push(INITIALIZE_BACKUP_SEED_PHRASE_ROUTE) + } + }} + infoText={t('backupApprovalInfo')} + key="home-backupApprovalNotice" + />, + }, + ]}/> + </TransactionView> + ) + : null } </div> </div> ) diff --git a/ui/app/pages/home/home.container.js b/ui/app/pages/home/home.container.js index d0a5d7b47..f03ffdc02 100644 --- a/ui/app/pages/home/home.container.js +++ b/ui/app/pages/home/home.container.js @@ -3,28 +3,65 @@ import { compose } from 'recompose' import { connect } from 'react-redux' import { withRouter } from 'react-router-dom' import { unconfirmedTransactionsCountSelector } from '../../selectors/confirm-transaction' -`` +import { getCurrentEthBalance } from '../../selectors/selectors' +import { + forceApproveProviderRequestByOrigin, + unsetMigratedPrivacyMode, + rejectProviderRequestByOrigin, +} from '../../store/actions' +import { getEnvironmentType } from '../../../../app/scripts/lib/util' +import { ENVIRONMENT_TYPE_POPUP } from '../../../../app/scripts/lib/enums' + +const activeTabDappProtocols = ['http:', 'https:', 'dweb:', 'ipfs:', 'ipns:', 'ssb:'] + const mapStateToProps = state => { - const { metamask, appState } = state + const { activeTab, metamask, appState } = state const { + approvedOrigins, + dismissedOrigins, lostAccounts, - seedWords, suggestedTokens, providerRequests, + migratedPrivacyMode, + featureFlags: { + privacyMode, + } = {}, + seedPhraseBackedUp, + tokens, } = metamask + const accountBalance = getCurrentEthBalance(state) const { forgottenPassword } = appState + const isUnconnected = Boolean( + activeTab && + activeTabDappProtocols.includes(activeTab.protocol) && + privacyMode && + !approvedOrigins[activeTab.origin] && + !dismissedOrigins[activeTab.origin] + ) + const isPopup = getEnvironmentType(window.location.href) === ENVIRONMENT_TYPE_POPUP + return { lostAccounts, forgottenPassword, - seedWords, suggestedTokens, unconfirmedTransactionsCount: unconfirmedTransactionsCountSelector(state), providerRequests, + showPrivacyModeNotification: migratedPrivacyMode, + activeTab, + viewingUnconnectedDapp: isUnconnected && isPopup, + shouldShowSeedPhraseReminder: !seedPhraseBackedUp && (parseInt(accountBalance, 16) > 0 || tokens.length > 0), + isPopup, } } +const mapDispatchToProps = (dispatch) => ({ + unsetMigratedPrivacyMode: () => dispatch(unsetMigratedPrivacyMode()), + forceApproveProviderRequestByOrigin: (origin) => dispatch(forceApproveProviderRequestByOrigin(origin)), + rejectProviderRequestByOrigin: origin => dispatch(rejectProviderRequestByOrigin(origin)), +}) + export default compose( withRouter, - connect(mapStateToProps) + connect(mapStateToProps, mapDispatchToProps) )(Home) |