text: /**
   *
   * App
   *
   * This component is the skeleton around the actual pages, and should only
   * contain code that should be seen on all pages. (e.g. navigation bar)
   */
  
  import React, { Component } from 'react';
  import { Helmet } from 'react-helmet';
  import styled from 'styled-components';
  
  import Header from 'components/Header';
  import Footer from 'components/Footer';
  import { renderRoutes } from 'react-router-config';
  
  import PropTypes from 'prop-types';
  import GlobalStyle from '../../global-styles';
  
  const AppWrapper = styled.div`
    max-width: calc(768px + 16px * 2);
    margin: 0 auto;
    display: flex;
    min-height: 100%;
    padding: 0 16px;
    flex-direction: column;
  `;
  
  class App extends Component {
    componentWillMount() {
      window.scrollTo(0, 0);
    }
  
    render() {
      const { route = {} } = this.props;
  
      return (
        <AppWrapper>
          <Helmet
            titleTemplate="%s - React.js Boilerplate"
            defaultTitle="React.js Boilerplate"
          >
            <meta
              name="description"
              content="A React.js Boilerplate application"
            />
          </Helmet>
          <Header />
          {renderRoutes(route.routes)}
          <Footer />
          <GlobalStyle />
        </AppWrapper>
      );
    }
  }
  
  App.propTypes = {
    route: PropTypes.any,
  };
  
  export default App;
  