Default to the new UI for all users

feature/default_network_editable
Whymarrh Whitby 6 years ago
parent c18b6f4117
commit a7a6318c13
  1. 22
      app/scripts/ui.js
  2. 2
      ui/app/app.js
  3. 2
      ui/app/components/send/tests/send-selectors-test-data.js
  4. 12
      ui/app/root.js
  5. 65
      ui/app/select-app.js
  6. 26
      ui/app/selectors.js

@ -1,7 +1,5 @@
const injectCss = require('inject-css') const injectCss = require('inject-css')
const OldMetaMaskUiCss = require('../../old-ui/css')
const NewMetaMaskUiCss = require('../../ui/css') const NewMetaMaskUiCss = require('../../ui/css')
const {getShouldUseNewUi} = require('../../ui/app/selectors')
const startPopup = require('./popup-core') const startPopup = require('./popup-core')
const PortStream = require('extension-port-stream') const PortStream = require('extension-port-stream')
const { getEnvironmentType } = require('./lib/util') const { getEnvironmentType } = require('./lib/util')
@ -49,30 +47,14 @@ async function start () {
if (err) return displayCriticalError(err) if (err) return displayCriticalError(err)
const state = store.getState() const state = store.getState()
const { metamask: { completedOnboarding, featureFlags } = {} } = state const { metamask: { completedOnboarding } = {} } = state
if (!completedOnboarding && windowType !== ENVIRONMENT_TYPE_FULLSCREEN) { if (!completedOnboarding && windowType !== ENVIRONMENT_TYPE_FULLSCREEN) {
global.platform.openExtensionInBrowser() global.platform.openExtensionInBrowser()
return return
} }
let betaUIState = Boolean(featureFlags && featureFlags.betaUI) injectCss(NewMetaMaskUiCss())
const useBetaCss = getShouldUseNewUi(state)
let css = useBetaCss ? NewMetaMaskUiCss() : OldMetaMaskUiCss()
let deleteInjectedCss = injectCss(css)
let newBetaUIState
store.subscribe(() => {
const state = store.getState()
newBetaUIState = state.metamask.featureFlags.betaUI
if (newBetaUIState !== betaUIState) {
deleteInjectedCss()
betaUIState = newBetaUIState
css = betaUIState ? NewMetaMaskUiCss() : OldMetaMaskUiCss()
deleteInjectedCss = injectCss(css)
}
})
}) })

@ -303,7 +303,6 @@ App.propTypes = {
unapprovedTypedMessagesCount: PropTypes.number, unapprovedTypedMessagesCount: PropTypes.number,
welcomeScreenSeen: PropTypes.bool, welcomeScreenSeen: PropTypes.bool,
isPopup: PropTypes.bool, isPopup: PropTypes.bool,
betaUI: PropTypes.bool,
isMouseUser: PropTypes.bool, isMouseUser: PropTypes.bool,
setMouseUserState: PropTypes.func, setMouseUserState: PropTypes.func,
t: PropTypes.func, t: PropTypes.func,
@ -375,7 +374,6 @@ function mapStateToProps (state) {
frequentRpcListDetail: state.metamask.frequentRpcListDetail || [], frequentRpcListDetail: state.metamask.frequentRpcListDetail || [],
currentCurrency: state.metamask.currentCurrency, currentCurrency: state.metamask.currentCurrency,
isMouseUser: state.appState.isMouseUser, isMouseUser: state.appState.isMouseUser,
betaUI: state.metamask.featureFlags.betaUI,
isRevealingSeedWords: state.metamask.isRevealingSeedWords, isRevealingSeedWords: state.metamask.isRevealingSeedWords,
Qr: state.appState.Qr, Qr: state.appState.Qr,
welcomeScreenSeen: state.metamask.welcomeScreenSeen, welcomeScreenSeen: state.metamask.welcomeScreenSeen,

@ -2,7 +2,7 @@ module.exports = {
'metamask': { 'metamask': {
'isInitialized': true, 'isInitialized': true,
'isUnlocked': true, 'isUnlocked': true,
'featureFlags': {'betaUI': true, 'sendHexData': true}, 'featureFlags': {'sendHexData': true},
'rpcTarget': 'https://rawtestrpc.metamask.io/', 'rpcTarget': 'https://rawtestrpc.metamask.io/',
'identities': { 'identities': {
'0xfdea65c8e26263f6d9a1b5de9555d2931a33b825': { '0xfdea65c8e26263f6d9a1b5de9555d2931a33b825': {

@ -2,7 +2,9 @@ const { Component } = require('react')
const PropTypes = require('prop-types') const PropTypes = require('prop-types')
const { Provider } = require('react-redux') const { Provider } = require('react-redux')
const h = require('react-hyperscript') const h = require('react-hyperscript')
const SelectedApp = require('./select-app') const { HashRouter } = require('react-router-dom')
const App = require('./app')
const I18nProvider = require('./i18n-provider')
class Root extends Component { class Root extends Component {
render () { render () {
@ -10,7 +12,13 @@ class Root extends Component {
return ( return (
h(Provider, { store }, [ h(Provider, { store }, [
h(SelectedApp), h(HashRouter, {
hashType: 'noslash',
}, [
h(I18nProvider, [
h(App),
]),
]),
]) ])
) )
} }

@ -1,65 +0,0 @@
const inherits = require('util').inherits
const Component = require('react').Component
const connect = require('react-redux').connect
const h = require('react-hyperscript')
const { HashRouter } = require('react-router-dom')
const App = require('./app')
const OldApp = require('../../old-ui/app/app')
const { getShouldUseNewUi } = require('./selectors')
const { setFeatureFlag } = require('./actions')
const I18nProvider = require('./i18n-provider')
function mapStateToProps (state) {
return {
isMascara: state.metamask.isMascara,
shouldUseNewUi: getShouldUseNewUi(state),
}
}
function mapDispatchToProps (dispatch) {
return {
setFeatureFlagWithModal: () => {
return dispatch(setFeatureFlag('betaUI', true, 'BETA_UI_NOTIFICATION_MODAL'))
},
setFeatureFlagWithoutModal: () => {
return dispatch(setFeatureFlag('betaUI', true))
},
}
}
module.exports = connect(mapStateToProps, mapDispatchToProps)(SelectedApp)
inherits(SelectedApp, Component)
function SelectedApp () {
Component.call(this)
}
SelectedApp.prototype.componentWillReceiveProps = function (nextProps) {
// Code commented out until we begin auto adding users to NewUI
const {
// isUnlocked,
// setFeatureFlagWithModal,
setFeatureFlagWithoutModal,
isMascara,
// firstTime,
} = this.props
// if (isMascara || firstTime) {
if (isMascara) {
setFeatureFlagWithoutModal()
}
// } else if (!isUnlocked && nextProps.isUnlocked && (nextProps.autoAdd)) {
// setFeatureFlagWithModal()
// }
}
SelectedApp.prototype.render = function () {
const { shouldUseNewUi } = this.props
const newUi = h(HashRouter, {
hashType: 'noslash',
}, [
h(I18nProvider, [
h(App),
]),
])
return shouldUseNewUi ? newUi : h(OldApp)
}

@ -28,8 +28,6 @@ const selectors = {
getSendAmount, getSendAmount,
getSelectedTokenToFiatRate, getSelectedTokenToFiatRate,
getSelectedTokenContract, getSelectedTokenContract,
autoAddToBetaUI,
getShouldUseNewUi,
getSendMaxModeState, getSendMaxModeState,
getCurrentViewContext, getCurrentViewContext,
getTotalUnapprovedCount, getTotalUnapprovedCount,
@ -212,30 +210,6 @@ function getSelectedTokenContract (state) {
: null : null
} }
function autoAddToBetaUI (state) {
const autoAddTransactionThreshold = 12
const autoAddAccountsThreshold = 2
const autoAddTokensThreshold = 1
const numberOfTransactions = state.metamask.selectedAddressTxList.length
const numberOfAccounts = Object.keys(getMetaMaskAccounts(state)).length
const numberOfTokensAdded = state.metamask.tokens.length
const userPassesThreshold = (numberOfTransactions > autoAddTransactionThreshold) &&
(numberOfAccounts > autoAddAccountsThreshold) &&
(numberOfTokensAdded > autoAddTokensThreshold)
const userIsNotInBeta = !state.metamask.featureFlags.betaUI
return userIsNotInBeta && userPassesThreshold
}
function getShouldUseNewUi (state) {
const isAlreadyUsingBetaUi = state.metamask.featureFlags.betaUI
const isMascara = state.metamask.isMascara
const isFreshInstall = Object.keys(state.metamask.identities).length === 0
return isAlreadyUsingBetaUi || isMascara || isFreshInstall
}
function getCurrentViewContext (state) { function getCurrentViewContext (state) {
const { currentView = {} } = state.appState const { currentView = {} } = state.appState
return currentView.context return currentView.context

Loading…
Cancel
Save