diff --git a/src/components/account/accountComponent.js b/src/components/account/accountComponent.js index 36c25b3e5..e78547ddd 100644 --- a/src/components/account/accountComponent.js +++ b/src/components/account/accountComponent.js @@ -11,9 +11,17 @@ import { getAccountStatus } from '../../utils/api/account'; * @param {object} props - include properties of component */ class AccountComponent extends React.Component { + constructor(props) { + super(props); + this.update = this.update.bind(this); + } componentDidMount() { this.update(); - document.addEventListener('beat', this.update.bind(this)); + document.addEventListener('beat', this.update); + } + + componentWillUnmount() { + document.removeEventListener('beat', this.update); } update() { diff --git a/src/components/header/header.css b/src/components/header/header.css index 0d42c9dba..0ca71321f 100644 --- a/src/components/header/header.css +++ b/src/components/header/header.css @@ -16,3 +16,7 @@ .material-icons{ font-size: 24px !important; } + +.menu { + right: -16px !important; +} diff --git a/src/components/header/headerElement.js b/src/components/header/headerElement.js index 2ef1391d0..2a7c98d0c 100644 --- a/src/components/header/headerElement.js +++ b/src/components/header/headerElement.js @@ -6,44 +6,47 @@ import styles from './header.css'; import VerifyMessage from '../signVerify/verifyMessage'; import SignMessage from '../signVerify/signMessage'; import Send from '../send'; +import PrivateWrapper from '../privateWrapper'; const HeaderElement = props => (
logo - - - - + + + + props.setActiveDialog({ + title: 'Sign message', + childComponentProps: { + account: props.account, + }, + childComponent: SignMessage, + })} + /> + props.setActiveDialog({ + title: 'Verify message', + childComponent: VerifyMessage, + })} + /> + + + - + title: 'Send', + childComponent: Send, + })}>Send +
); diff --git a/src/components/header/index.js b/src/components/header/index.js index e3fbe2d53..32b3bbb46 100644 --- a/src/components/header/index.js +++ b/src/components/header/index.js @@ -1,5 +1,6 @@ import { connect } from 'react-redux'; import { dialogDisplayed } from '../../actions/dialog'; +import { accountLoggedOut } from '../../actions/account'; import HeaderElement from './headerElement'; const mapStateToProps = state => ({ @@ -8,6 +9,7 @@ const mapStateToProps = state => ({ const mapDispatchToProps = dispatch => ({ setActiveDialog: data => dispatch(dialogDisplayed(data)), + logOut: () => dispatch(accountLoggedOut()), }); const Header = connect( diff --git a/src/components/privateWrapper/index.js b/src/components/privateWrapper/index.js new file mode 100644 index 000000000..4e504bfb5 --- /dev/null +++ b/src/components/privateWrapper/index.js @@ -0,0 +1,12 @@ +import React from 'react'; +import { connect } from 'react-redux'; + +export const PrivateWrapperComponent = ({ isAuthenticated, children }) => ( + isAuthenticated && { children } +); + +const mapStateToProps = state => ({ + isAuthenticated: !!state.account.publicKey, +}); + +export default connect(mapStateToProps)(PrivateWrapperComponent); diff --git a/src/components/privateWrapper/index.test.js b/src/components/privateWrapper/index.test.js new file mode 100644 index 000000000..23f6ae4b8 --- /dev/null +++ b/src/components/privateWrapper/index.test.js @@ -0,0 +1,25 @@ +import React from 'react'; +import { expect } from 'chai'; +import { shallow } from 'enzyme'; +import { PrivateWrapperComponent } from '.'; + +const Private = () =>

Private

; + +describe('PrivateWrapperComponent', () => { + const isAuth = isAuthenticated => ( + shallow( + + + , + ) + ); + it('should render children components if user is authenticated', () => { + const wrapper = isAuth(true); + expect(wrapper.find(Private)).to.have.length(1); + }); + + it('should do not render children components if user is not authenticated', () => { + const wrapper = isAuth(false); + expect(wrapper.find(Private)).to.have.length(0); + }); +}); diff --git a/src/components/transactions/transactionsComponent.js b/src/components/transactions/transactionsComponent.js index 5ea0fc104..27a844e24 100644 --- a/src/components/transactions/transactionsComponent.js +++ b/src/components/transactions/transactionsComponent.js @@ -39,7 +39,7 @@ class Transactions extends React.Component { length: parseInt(res.count, 10), }); }) - .catch(error => console.error(error.message)); + .catch(error => console.error(error.message)); //eslint-disable-line } }