content: /* @flow */
  import type { State } from '../../common/types';
  import React from 'react';
  import linksMessages from '../../common/app/linksMessages';
  import { FormattedMessage } from 'react-intl';
  import { Link, Space, Toolbar } from '../app/components';
  import { connect } from 'react-redux';
  
  const styles = {
    toolbar: {
      flexWrap: 'wrap',
    },
    prefetch: {
      display: 'none',
    },
  };
  
  const Header = () => (
    <Toolbar style={styles.toolbar}>
      <Link bold inverted exactly to="/">
        <FormattedMessage {...linksMessages.home} />
      </Link>
      <Space x={2} />
      <Link bold inverted to="/cards">
        <FormattedMessage {...linksMessages.cards} />
      </Link>
      <Space x={2} />
      <Link bold inverted to="/stack">
        <FormattedMessage {...linksMessages.stack} />
      </Link>
    </Toolbar>
  );
  
  Header.propTypes = {
    viewer: React.PropTypes.object,
  };
  
  export default connect(
    (state: State) => ({
      viewer: state.users.viewer,
    }),
  )(Header);
  