import React, { Component } from 'react'
import { MuiThemeProvider, createMuiTheme } from 'material-ui/styles'
import { BrowserRouter as Router, Route } from 'react-router-dom'
import Reboot from 'material-ui/Reboot'
import routes from '../routes'

class App extends Component {
    componentDidCatch(error, info) {
        console.log(error)
        console.log(info)
    }

    render() {
        const theme = createMuiTheme({
            html: {
                fontSize: '62.5%'
            },
            palette: {
                primary: { 
                    main: '#0288d1'
                },
            },
            typography: {
                fontSize: 12
            }
        })

        return (
            <MuiThemeProvider theme={theme}>
                <Reboot />
                <Router>
                    <div>
                        {routes.map((route, index) =>
                            <Route key={index} path={route.path} component={route.component} />
                        )}
                    </div>
                </Router>
            </MuiThemeProvider>
        )
    }
}

export default App