aboutsummaryrefslogtreecommitdiffstats
path: root/ui/app/components/send/send-header
diff options
context:
space:
mode:
Diffstat (limited to 'ui/app/components/send/send-header')
-rw-r--r--ui/app/components/send/send-header/README.md0
-rw-r--r--ui/app/components/send/send-header/index.js1
-rw-r--r--ui/app/components/send/send-header/send-header.component.js34
-rw-r--r--ui/app/components/send/send-header/send-header.container.js19
-rw-r--r--ui/app/components/send/send-header/send-header.selectors.js37
-rw-r--r--ui/app/components/send/send-header/tests/send-header-component.test.js70
-rw-r--r--ui/app/components/send/send-header/tests/send-header-container.test.js59
-rw-r--r--ui/app/components/send/send-header/tests/send-header-selectors.test.js47
8 files changed, 267 insertions, 0 deletions
diff --git a/ui/app/components/send/send-header/README.md b/ui/app/components/send/send-header/README.md
new file mode 100644
index 000000000..e69de29bb
--- /dev/null
+++ b/ui/app/components/send/send-header/README.md
diff --git a/ui/app/components/send/send-header/index.js b/ui/app/components/send/send-header/index.js
new file mode 100644
index 000000000..0b17f0b7d
--- /dev/null
+++ b/ui/app/components/send/send-header/index.js
@@ -0,0 +1 @@
+export { default } from './send-header.container'
diff --git a/ui/app/components/send/send-header/send-header.component.js b/ui/app/components/send/send-header/send-header.component.js
new file mode 100644
index 000000000..efc4bbf27
--- /dev/null
+++ b/ui/app/components/send/send-header/send-header.component.js
@@ -0,0 +1,34 @@
+import React, { Component } from 'react'
+import PropTypes from 'prop-types'
+import PageContainerHeader from '../../page-container/page-container-header'
+import { DEFAULT_ROUTE } from '../../../routes'
+
+export default class SendHeader extends Component {
+
+ static propTypes = {
+ clearSend: PropTypes.func,
+ history: PropTypes.object,
+ titleKey: PropTypes.string,
+ subtitleParams: PropTypes.array,
+ };
+
+ static contextTypes = {
+ t: PropTypes.func,
+ };
+
+ onClose () {
+ this.props.clearSend()
+ this.props.history.push(DEFAULT_ROUTE)
+ }
+
+ render () {
+ return (
+ <PageContainerHeader
+ onClose={() => this.onClose()}
+ subtitle={this.context.t(...this.props.subtitleParams)}
+ title={this.context.t(this.props.titleKey)}
+ />
+ )
+ }
+
+}
diff --git a/ui/app/components/send/send-header/send-header.container.js b/ui/app/components/send/send-header/send-header.container.js
new file mode 100644
index 000000000..4bcd0d1b6
--- /dev/null
+++ b/ui/app/components/send/send-header/send-header.container.js
@@ -0,0 +1,19 @@
+import { connect } from 'react-redux'
+import { clearSend } from '../../../actions'
+import SendHeader from './send-header.component'
+import { getSubtitleParams, getTitleKey } from './send-header.selectors'
+
+export default connect(mapStateToProps, mapDispatchToProps)(SendHeader)
+
+function mapStateToProps (state) {
+ return {
+ titleKey: getTitleKey(state),
+ subtitleParams: getSubtitleParams(state),
+ }
+}
+
+function mapDispatchToProps (dispatch) {
+ return {
+ clearSend: () => dispatch(clearSend()),
+ }
+}
diff --git a/ui/app/components/send/send-header/send-header.selectors.js b/ui/app/components/send/send-header/send-header.selectors.js
new file mode 100644
index 000000000..d7c9d3766
--- /dev/null
+++ b/ui/app/components/send/send-header/send-header.selectors.js
@@ -0,0 +1,37 @@
+const {
+ getSelectedToken,
+ getSendEditingTransactionId,
+} = require('../send.selectors.js')
+
+const selectors = {
+ getTitleKey,
+ getSubtitleParams,
+}
+
+module.exports = selectors
+
+function getTitleKey (state) {
+ const isEditing = Boolean(getSendEditingTransactionId(state))
+ const isToken = Boolean(getSelectedToken(state))
+
+ if (isEditing) {
+ return 'edit'
+ } else if (isToken) {
+ return 'sendTokens'
+ } else {
+ return 'sendETH'
+ }
+}
+
+function getSubtitleParams (state) {
+ const isEditing = Boolean(getSendEditingTransactionId(state))
+ const token = getSelectedToken(state)
+
+ if (isEditing) {
+ return [ 'editingTransaction' ]
+ } else if (token) {
+ return [ 'onlySendTokensToAccountAddress', [ token.symbol ] ]
+ } else {
+ return [ 'onlySendToEtherAddress' ]
+ }
+}
diff --git a/ui/app/components/send/send-header/tests/send-header-component.test.js b/ui/app/components/send/send-header/tests/send-header-component.test.js
new file mode 100644
index 000000000..930bfa387
--- /dev/null
+++ b/ui/app/components/send/send-header/tests/send-header-component.test.js
@@ -0,0 +1,70 @@
+import React from 'react'
+import assert from 'assert'
+import { shallow } from 'enzyme'
+import sinon from 'sinon'
+import { DEFAULT_ROUTE } from '../../../../routes'
+import SendHeader from '../send-header.component.js'
+
+import PageContainerHeader from '../../../page-container/page-container-header'
+
+const propsMethodSpies = {
+ clearSend: sinon.spy(),
+}
+const historySpies = {
+ push: sinon.spy(),
+}
+
+sinon.spy(SendHeader.prototype, 'onClose')
+
+describe('SendHeader Component', function () {
+ let wrapper
+
+ beforeEach(() => {
+ wrapper = shallow(<SendHeader
+ clearSend={propsMethodSpies.clearSend}
+ history={historySpies}
+ titleKey={'mockTitleKey'}
+ subtitleParams={[ 'mockSubtitleKey', 'mockVal']}
+ />, { context: { t: (str1, str2) => str2 ? str1 + str2 : str1 } })
+ })
+
+ afterEach(() => {
+ propsMethodSpies.clearSend.resetHistory()
+ historySpies.push.resetHistory()
+ SendHeader.prototype.onClose.resetHistory()
+ })
+
+ describe('onClose', () => {
+ it('should call clearSend', () => {
+ assert.equal(propsMethodSpies.clearSend.callCount, 0)
+ wrapper.instance().onClose()
+ assert.equal(propsMethodSpies.clearSend.callCount, 1)
+ })
+
+ it('should call history.push', () => {
+ assert.equal(historySpies.push.callCount, 0)
+ wrapper.instance().onClose()
+ assert.equal(historySpies.push.callCount, 1)
+ assert.equal(historySpies.push.getCall(0).args[0], DEFAULT_ROUTE)
+ })
+ })
+
+ describe('render', () => {
+ it('should render a PageContainerHeader compenent', () => {
+ assert.equal(wrapper.find(PageContainerHeader).length, 1)
+ })
+
+ it('should pass the correct props to PageContainerHeader', () => {
+ const {
+ onClose,
+ subtitle,
+ title,
+ } = wrapper.find(PageContainerHeader).props()
+ assert.equal(subtitle, 'mockSubtitleKeymockVal')
+ assert.equal(title, 'mockTitleKey')
+ assert.equal(SendHeader.prototype.onClose.callCount, 0)
+ onClose()
+ assert.equal(SendHeader.prototype.onClose.callCount, 1)
+ })
+ })
+})
diff --git a/ui/app/components/send/send-header/tests/send-header-container.test.js b/ui/app/components/send/send-header/tests/send-header-container.test.js
new file mode 100644
index 000000000..41a7e8a89
--- /dev/null
+++ b/ui/app/components/send/send-header/tests/send-header-container.test.js
@@ -0,0 +1,59 @@
+import assert from 'assert'
+import proxyquire from 'proxyquire'
+import sinon from 'sinon'
+
+let mapStateToProps
+let mapDispatchToProps
+
+const actionSpies = {
+ clearSend: sinon.spy(),
+}
+
+proxyquire('../send-header.container.js', {
+ 'react-redux': {
+ connect: (ms, md) => {
+ mapStateToProps = ms
+ mapDispatchToProps = md
+ return () => ({})
+ },
+ },
+ '../../../actions': actionSpies,
+ './send-header.selectors': {
+ getTitleKey: (s) => `mockTitleKey:${s}`,
+ getSubtitleParams: (s) => `mockSubtitleParams:${s}`,
+ },
+})
+
+describe('send-header container', () => {
+
+ describe('mapStateToProps()', () => {
+
+ it('should map the correct properties to props', () => {
+ assert.deepEqual(mapStateToProps('mockState'), {
+ titleKey: 'mockTitleKey:mockState',
+ subtitleParams: 'mockSubtitleParams:mockState',
+ })
+ })
+
+ })
+
+ describe('mapDispatchToProps()', () => {
+ let dispatchSpy
+ let mapDispatchToPropsObject
+
+ beforeEach(() => {
+ dispatchSpy = sinon.spy()
+ mapDispatchToPropsObject = mapDispatchToProps(dispatchSpy)
+ })
+
+ describe('clearSend()', () => {
+ it('should dispatch an action', () => {
+ mapDispatchToPropsObject.clearSend()
+ assert(dispatchSpy.calledOnce)
+ assert(actionSpies.clearSend.calledOnce)
+ })
+ })
+
+ })
+
+})
diff --git a/ui/app/components/send/send-header/tests/send-header-selectors.test.js b/ui/app/components/send/send-header/tests/send-header-selectors.test.js
new file mode 100644
index 000000000..e0c6a3ab3
--- /dev/null
+++ b/ui/app/components/send/send-header/tests/send-header-selectors.test.js
@@ -0,0 +1,47 @@
+import assert from 'assert'
+import proxyquire from 'proxyquire'
+
+const {
+ getTitleKey,
+ getSubtitleParams,
+} = proxyquire('../send-header.selectors', {
+ '../send.selectors': {
+ getSelectedToken: (mockState) => mockState.t,
+ getSendEditingTransactionId: (mockState) => mockState.e,
+ },
+})
+
+describe('send-header selectors', () => {
+
+ describe('getTitleKey()', () => {
+ it('should return the correct key when getSendEditingTransactionId is truthy', () => {
+ assert.equal(getTitleKey({ e: 1, t: true }), 'edit')
+ })
+
+ it('should return the correct key when getSendEditingTransactionId is falsy and getSelectedToken is truthy', () => {
+ assert.equal(getTitleKey({ e: null, t: 'abc' }), 'sendTokens')
+ })
+
+ it('should return the correct key when getSendEditingTransactionId is falsy and getSelectedToken is falsy', () => {
+ assert.equal(getTitleKey({ e: null }), 'sendETH')
+ })
+ })
+
+ describe('getSubtitleParams()', () => {
+ it('should return the correct params when getSendEditingTransactionId is truthy', () => {
+ assert.deepEqual(getSubtitleParams({ e: 1, t: true }), [ 'editingTransaction' ])
+ })
+
+ it('should return the correct params when getSendEditingTransactionId is falsy and getSelectedToken is truthy', () => {
+ assert.deepEqual(
+ getSubtitleParams({ e: null, t: { symbol: 'ABC' } }),
+ [ 'onlySendTokensToAccountAddress', [ 'ABC' ] ]
+ )
+ })
+
+ it('should return the correct params when getSendEditingTransactionId is falsy and getSelectedToken is falsy', () => {
+ assert.deepEqual(getSubtitleParams({ e: null }), [ 'onlySendToEtherAddress' ])
+ })
+ })
+
+})