Adds feature flag toggle for the hex data row on the send screen.

feature/default_network_editable
Dan Miller 6 years ago
parent 30e49b8545
commit 65873e33e4
  1. 6
      app/_locales/en/messages.json
  2. 29
      ui/app/components/pages/settings/settings.js
  3. 3
      ui/app/components/send/send-content/send-content.component.js
  4. 14
      ui/app/components/send/send-content/tests/send-content-component.test.js
  5. 3
      ui/app/components/send/send.component.js
  6. 2
      ui/app/components/send/send.container.js
  7. 5
      ui/app/components/send/send.selectors.js
  8. 5
      ui/app/components/send/tests/send-component.test.js
  9. 2
      ui/app/components/send/tests/send-container.test.js
  10. 2
      ui/app/components/send/tests/send-selectors-test-data.js
  11. 10
      ui/app/components/send/tests/send-selectors.test.js

@ -870,6 +870,12 @@
"secretPhrase": {
"message": "Enter your secret twelve word phrase here to restore your vault."
},
"showHexData": {
"message": "Show Hex Data"
},
"showHexDataDescription": {
"message": "Select this to show the hex data field on the send screen"
},
"newPassword8Chars": {
"message": "New Password (min 8 chars)"
},

@ -66,6 +66,30 @@ class Settings extends Component {
])
}
renderHexDataOptIn () {
const { metamask: { featureFlags: { sendHexData } }, setHexDataFeatureFlag } = this.props
return h('div.settings__content-row', [
h('div.settings__content-item', [
h('span', this.context.t('showHexData')),
h(
'div.settings__content-description',
this.context.t('showHexDataDescription')
),
]),
h('div.settings__content-item', [
h('div.settings__content-item-col', [
h(ToggleButton, {
value: sendHexData,
onToggle: (value) => setHexDataFeatureFlag(!value),
activeLabel: '',
inactiveLabel: '',
}),
]),
]),
])
}
renderCurrentConversion () {
const { metamask: { currentCurrency, conversionDate }, setCurrentCurrency } = this.props
@ -307,6 +331,7 @@ class Settings extends Component {
!isMascara && this.renderOldUI(),
this.renderResetAccount(),
this.renderBlockieOptIn(),
this.renderHexDataOptIn(),
])
)
}
@ -315,6 +340,7 @@ class Settings extends Component {
Settings.propTypes = {
metamask: PropTypes.object,
setUseBlockie: PropTypes.func,
setHexDataFeatureFlag: PropTypes.func,
setCurrentCurrency: PropTypes.func,
setRpcTarget: PropTypes.func,
displayWarning: PropTypes.func,
@ -349,6 +375,9 @@ const mapDispatchToProps = dispatch => {
setFeatureFlagToBeta: () => {
return dispatch(actions.setFeatureFlag('betaUI', false, 'OLD_UI_NOTIFICATION_MODAL'))
},
setHexDataFeatureFlag: (featureFlagShowState) => {
return dispatch(actions.setFeatureFlag('sendHexData', featureFlagShowState))
},
showResetAccountConfirmationModal: () => {
return dispatch(actions.showModal({ name: 'CONFIRM_RESET_ACCOUNT' }))
},

@ -12,6 +12,7 @@ export default class SendContent extends Component {
static propTypes = {
updateGas: PropTypes.func,
scanQrCode: PropTypes.func,
showHexData: PropTypes.bool,
};
render () {
@ -25,7 +26,7 @@ export default class SendContent extends Component {
/>
<SendAmountRow updateGas={(updateData) => this.props.updateGas(updateData)} />
<SendGasRow />
<SendHexDataRow />
{ this.props.showHexData ? <SendHexDataRow /> : null }
</div>
</PageContainerContent>
)

@ -8,12 +8,13 @@ import SendAmountRow from '../send-amount-row/send-amount-row.container'
import SendFromRow from '../send-from-row/send-from-row.container'
import SendGasRow from '../send-gas-row/send-gas-row.container'
import SendToRow from '../send-to-row/send-to-row.container'
import SendHexDataRow from '../send-hex-data-row/send-hex-data-row.container'
describe('SendContent Component', function () {
let wrapper
beforeEach(() => {
wrapper = shallow(<SendContent />)
wrapper = shallow(<SendContent showHexData={true} />)
})
describe('render', () => {
@ -33,6 +34,17 @@ describe('SendContent Component', function () {
assert(PageContainerContentChild.childAt(1).is(SendToRow))
assert(PageContainerContentChild.childAt(2).is(SendAmountRow))
assert(PageContainerContentChild.childAt(3).is(SendGasRow))
assert(PageContainerContentChild.childAt(4).is(SendHexDataRow))
})
it('should not render the SendHexDataRow if props.showHexData is false', () => {
wrapper.setProps({ showHexData: false })
const PageContainerContentChild = wrapper.find(PageContainerContent).children()
assert(PageContainerContentChild.childAt(0).is(SendFromRow))
assert(PageContainerContentChild.childAt(1).is(SendToRow))
assert(PageContainerContentChild.childAt(2).is(SendAmountRow))
assert(PageContainerContentChild.childAt(3).is(SendGasRow))
assert.equal(PageContainerContentChild.childAt(4).html(), null)
})
})
})

@ -193,7 +193,7 @@ export default class SendTransactionScreen extends PersistentForm {
}
render () {
const { history } = this.props
const { history, showHexData } = this.props
return (
<div className="page-container">
@ -201,6 +201,7 @@ export default class SendTransactionScreen extends PersistentForm {
<SendContent
updateGas={(updateData) => this.updateGas(updateData)}
scanQrCode={_ => this.props.scanQrCode()}
showHexData={showHexData}
/>
<SendFooter history={history}/>
</div>

@ -18,6 +18,7 @@ import {
getSelectedTokenToFiatRate,
getSendAmount,
getSendEditingTransactionId,
getSendHexDataFeatureFlagState,
getSendFromObject,
getSendTo,
getTokenBalance,
@ -64,6 +65,7 @@ function mapStateToProps (state) {
recentBlocks: getRecentBlocks(state),
selectedAddress: getSelectedAddress(state),
selectedToken: getSelectedToken(state),
showHexData: getSendHexDataFeatureFlagState(state),
to: getSendTo(state),
tokenBalance: getTokenBalance(state),
tokenContract: getSelectedTokenContract(state),

@ -34,6 +34,7 @@ const selectors = {
getSelectedTokenToFiatRate,
getSendAmount,
getSendHexData,
getSendHexDataFeatureFlagState,
getSendEditingTransactionId,
getSendErrors,
getSendFrom,
@ -216,6 +217,10 @@ function getSendHexData (state) {
return state.metamask.send.data
}
function getSendHexDataFeatureFlagState (state) {
return state.metamask.featureFlags.sendHexData
}
function getSendEditingTransactionId (state) {
return state.metamask.send.editingTransactionId
}

@ -47,6 +47,7 @@ describe('Send Component', function () {
recentBlocks={['mockBlock']}
selectedAddress={'mockSelectedAddress'}
selectedToken={'mockSelectedToken'}
showHexData={true}
tokenBalance={'mockTokenBalance'}
tokenContract={'mockTokenContract'}
updateAndSetGasTotal={propsMethodSpies.updateAndSetGasTotal}
@ -328,5 +329,9 @@ describe('Send Component', function () {
}
)
})
it('should pass showHexData to SendContent', () => {
assert.equal(wrapper.find(SendContent).props().showHexData, true)
})
})
})

@ -39,6 +39,7 @@ proxyquire('../send.container.js', {
getSelectedToken: (s) => `mockSelectedToken:${s}`,
getSelectedTokenContract: (s) => `mockTokenContract:${s}`,
getSelectedTokenToFiatRate: (s) => `mockTokenToFiatRate:${s}`,
getSendHexDataFeatureFlagState: (s) => `mockSendHexDataFeatureFlagState:${s}`,
getSendAmount: (s) => `mockAmount:${s}`,
getSendTo: (s) => `mockTo:${s}`,
getSendEditingTransactionId: (s) => `mockEditingTransactionId:${s}`,
@ -73,6 +74,7 @@ describe('send container', () => {
recentBlocks: 'mockRecentBlocks:mockState',
selectedAddress: 'mockSelectedAddress:mockState',
selectedToken: 'mockSelectedToken:mockState',
showHexData: 'mockSendHexDataFeatureFlagState:mockState',
to: 'mockTo:mockState',
tokenBalance: 'mockTokenBalance:mockState',
tokenContract: 'mockTokenContract:mockState',

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

@ -31,6 +31,7 @@ const {
getSendFrom,
getSendFromBalance,
getSendFromObject,
getSendHexDataFeatureFlagState,
getSendMaxModeState,
getSendTo,
getSendToAccounts,
@ -379,6 +380,15 @@ describe('send selectors', () => {
})
})
describe('getSendHexDataFeatureFlagState()', () => {
it('should return the sendHexData feature flag state', () => {
assert.deepEqual(
getSendHexDataFeatureFlagState(mockState),
true
)
})
})
describe('getSendFrom()', () => {
it('should return the send.from', () => {
assert.deepEqual(

Loading…
Cancel
Save