import React, { Component } from 'react'
import { ConnectedRouter } from 'connected-react-router'
import { Route, Switch } from 'react-router'

import { Header, Footer } from './common'
import * as Paper from './paper'

export default class App extends Component {
  render() {
    return (
      <ConnectedRouter history={this.props.history}>
        <div>
          <Header />
          <div className='app'>
            <div className='body'>
              <Route path="/paper/:key/" component={Paper.Manager} />
              <Switch>
                <Route exact path="/paper/:key/" component={Paper.Info} />
                <Route exact path="/paper/:key/citations/" component={Paper.Citations} />
                <Route exact path="/paper/:key/info/" component={Paper.Info} />
                <Route exact path="/paper/:key/random/" component={Paper.Random} />
                <Route exact path="/paper/:key/address/:sha256" component={Paper.Address} />
                <Route exact path="/paper/:key/verify/:sha256" component={Paper.Verify} />
              </Switch>
            </div>
          </div>
          <Footer />
        </div>
      </ConnectedRouter>
    )
  }
}