Allow redux state to flow through Header component into LanguageDropDown/NodeDropDown Components.
This commit is contained in:
parent
c890c8872a
commit
024c14610b
|
@ -1,6 +1,7 @@
|
||||||
import React, {Component} from 'react'
|
import React, {Component} from 'react'
|
||||||
import NodeDropdownComponent from './components/NodeDropdownComponent'
|
import NodeDropdownComponent from './components/NodeDropdownComponent'
|
||||||
import LanguageDropDownComponent from './components/LanguageDropdownComponent'
|
import LanguageDropDownComponent from './components/LanguageDropdownComponent'
|
||||||
|
import PropTypes from 'prop-types';
|
||||||
|
|
||||||
export default class Header extends Component {
|
export default class Header extends Component {
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
|
@ -8,17 +9,48 @@ export default class Header extends Component {
|
||||||
}
|
}
|
||||||
|
|
||||||
static propTypes = {
|
static propTypes = {
|
||||||
title: React.PropTypes.string,
|
// LanguageDropDownComponentProps
|
||||||
toggleSidebar: React.PropTypes.func,
|
changeLanguage: PropTypes.func,
|
||||||
onHeaderRightButtonClick: React.PropTypes.func,
|
toggleLanguageDropdown: PropTypes.func,
|
||||||
isLoggedIn: React.PropTypes.bool
|
languageSelection: PropTypes.number,
|
||||||
|
languageToggle: PropTypes.bool,
|
||||||
|
// NodeDropdownComponentProps
|
||||||
|
changeNode: PropTypes.func,
|
||||||
|
toggleNodeDropdown: PropTypes.func,
|
||||||
|
nodeSelection: PropTypes.number,
|
||||||
|
nodeToggle: PropTypes.bool
|
||||||
};
|
};
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
|
let {
|
||||||
|
languageSelection,
|
||||||
|
changeLanguage,
|
||||||
|
toggleLanguageDropdown,
|
||||||
|
languageToggle,
|
||||||
|
changeNode,
|
||||||
|
toggleNodeDropdown,
|
||||||
|
nodeSelection,
|
||||||
|
nodeToggle
|
||||||
|
} = this.props;
|
||||||
|
|
||||||
|
let LanguageDropDownComponentProps = {
|
||||||
|
languageSelection,
|
||||||
|
changeLanguage,
|
||||||
|
toggleLanguageDropdown,
|
||||||
|
languageToggle,
|
||||||
|
}
|
||||||
|
|
||||||
|
let NodeDropdownComponentProps = {
|
||||||
|
changeNode,
|
||||||
|
toggleNodeDropdown,
|
||||||
|
nodeSelection,
|
||||||
|
nodeToggle
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<section className="bg-gradient header-branding">
|
<section className="bg-gradient header-branding">
|
||||||
<section className="container">
|
<section className="container">
|
||||||
<a className="brand" href="https://www.myetherwallet.com/" aria-label="Go to homepage">
|
<a className="brand" href="/" aria-label="Go to homepage">
|
||||||
{/* TODO - don't hardcode image path*/}
|
{/* TODO - don't hardcode image path*/}
|
||||||
<img
|
<img
|
||||||
src={"https://www.myetherwallet.com/images/logo-myetherwallet.svg"} height="64px"
|
src={"https://www.myetherwallet.com/images/logo-myetherwallet.svg"} height="64px"
|
||||||
|
@ -30,9 +62,9 @@ export default class Header extends Component {
|
||||||
Open-Source & Client-Side Ether Wallet · v3.6.0
|
Open-Source & Client-Side Ether Wallet · v3.6.0
|
||||||
</span>
|
</span>
|
||||||
|
|
||||||
<LanguageDropDownComponent/>
|
<LanguageDropDownComponent {...LanguageDropDownComponentProps}/>
|
||||||
|
|
||||||
<NodeDropdownComponent/>
|
<NodeDropdownComponent {...NodeDropdownComponentProps}/>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
</section>
|
</section>
|
||||||
|
|
Loading…
Reference in New Issue