github.com/anthdm/go-ethereum@v1.8.4-0.20180412101906-60516c83b011/dashboard/assets/components/Header.jsx (about)

     1  // @flow
     2  
     3  // Copyright 2017 The go-ethereum Authors
     4  // This file is part of the go-ethereum library.
     5  //
     6  // The go-ethereum library is free software: you can redistribute it and/or modify
     7  // it under the terms of the GNU Lesser General Public License as published by
     8  // the Free Software Foundation, either version 3 of the License, or
     9  // (at your option) any later version.
    10  //
    11  // The go-ethereum library is distributed in the hope that it will be useful,
    12  // but WITHOUT ANY WARRANTY; without even the implied warranty of
    13  // MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
    14  // GNU Lesser General Public License for more details.
    15  //
    16  // You should have received a copy of the GNU Lesser General Public License
    17  // along with the go-ethereum library. If not, see <http://www.gnu.org/licenses/>.
    18  
    19  import React, {Component} from 'react';
    20  
    21  import withStyles from 'material-ui/styles/withStyles';
    22  import AppBar from 'material-ui/AppBar';
    23  import Toolbar from 'material-ui/Toolbar';
    24  import IconButton from 'material-ui/IconButton';
    25  import Icon from 'material-ui/Icon';
    26  import MenuIcon from 'material-ui-icons/Menu';
    27  import Typography from 'material-ui/Typography';
    28  
    29  // themeStyles returns the styles generated from the theme for the component.
    30  const themeStyles = (theme: Object) => ({
    31  	header: {
    32  		backgroundColor: theme.palette.grey[900],
    33  		color:           theme.palette.getContrastText(theme.palette.grey[900]),
    34  		zIndex:          theme.zIndex.appBar,
    35  	},
    36  	toolbar: {
    37  		paddingLeft:  theme.spacing.unit,
    38  		paddingRight: theme.spacing.unit,
    39  	},
    40  	title: {
    41  		paddingLeft: theme.spacing.unit,
    42  		fontSize:    3 * theme.spacing.unit,
    43  	},
    44  });
    45  
    46  export type Props = {
    47  	classes: Object, // injected by withStyles()
    48  	switchSideBar: () => void,
    49  };
    50  
    51  // Header renders the header of the dashboard.
    52  class Header extends Component<Props> {
    53  	render() {
    54  		const {classes} = this.props;
    55  
    56  		return (
    57  			<AppBar position='static' className={classes.header}>
    58  				<Toolbar className={classes.toolbar}>
    59  					<IconButton onClick={this.props.switchSideBar}>
    60  						<Icon>
    61  							<MenuIcon />
    62  						</Icon>
    63  					</IconButton>
    64  					<Typography type='title' color='inherit' noWrap className={classes.title}>
    65  						Go Ethereum Dashboard
    66  					</Typography>
    67  				</Toolbar>
    68  			</AppBar>
    69  		);
    70  	}
    71  }
    72  
    73  export default withStyles(themeStyles)(Header);