115 lines
3.5 KiB
JavaScript
115 lines
3.5 KiB
JavaScript
import React, { Component } from 'react'
|
|
import { ApolloClient } from 'apollo-client'
|
|
import { InMemoryCache } from 'apollo-cache-inmemory'
|
|
import { ApolloProvider } from 'react-apollo'
|
|
import { ApolloLink } from 'apollo-link'
|
|
import { HttpLink } from 'apollo-link-http'
|
|
import { onError } from 'apollo-link-error'
|
|
import { setContext } from 'apollo-link-context'
|
|
|
|
import { Route, BrowserRouter, Switch } from 'react-router-dom'
|
|
|
|
// Material UI
|
|
|
|
import { MuiThemeProvider, createMuiTheme } from '@material-ui/core/styles'
|
|
|
|
// Components
|
|
|
|
import NavBar from './components/NavBar'
|
|
|
|
import Home from './components/Home'
|
|
import User from './components/User'
|
|
import Browse from './components/Browse'
|
|
import Search from './components/Search'
|
|
import About from './components/About'
|
|
import Modules from './components/Modules'
|
|
import Contact from './components/Contact'
|
|
import Logout from './components/Logout'
|
|
import Post from './components/Post'
|
|
import Footer from './components/Footer'
|
|
import Callback from './components/Callback'
|
|
|
|
import Auth from './auth/Auth'
|
|
|
|
// Apollo Client Setup
|
|
const httpLink = new HttpLink({ uri: 'http://localhost:4000/graphql', changeOrigin: true })
|
|
|
|
const errorLink = onError(({ graphQLErrors, networkError }) => {
|
|
if (graphQLErrors) {
|
|
graphQLErrors.map(({ message, locations, path }) =>
|
|
console.log(
|
|
`[GraphQL error]: Message: ${message}, Location: ${locations}, Path: ${path}`,
|
|
),
|
|
)
|
|
}
|
|
if (networkError) console.log(`[Network error]: ${networkError}`)
|
|
})
|
|
|
|
const authLink = setContext((_, { headers }) => {
|
|
// get the authentication token from local storage if it exists
|
|
const token = localStorage.getItem('access_token')
|
|
// return the headers to the context so httpLink can read them
|
|
return {
|
|
headers: {
|
|
...headers,
|
|
Authorization: token ? `Bearer ${token}` : ``
|
|
}
|
|
}
|
|
})
|
|
|
|
export const client = new ApolloClient({
|
|
link: ApolloLink.from([errorLink, authLink, httpLink]),
|
|
cache: new InMemoryCache()
|
|
})
|
|
|
|
/*
|
|
export const client = new ApolloClient({
|
|
uri:'http://localhost:4000/graphql'
|
|
})
|
|
*/
|
|
|
|
export const auth = new Auth(result => console.log('auth result', result), client)
|
|
|
|
/* Here we change the default Material UI theme for Advanced Algos brand colors. */
|
|
|
|
const theme = createMuiTheme({
|
|
palette: {
|
|
primary: { main: '#303036' }, // DARK.
|
|
secondary: { main: '#CC5835' } // RUSTED_RED.
|
|
}
|
|
})
|
|
|
|
class App extends Component {
|
|
render () {
|
|
return (
|
|
<BrowserRouter>
|
|
<ApolloProvider client={client}>
|
|
<MuiThemeProvider theme={theme}>
|
|
<div className='App'>
|
|
<NavBar />
|
|
<Switch>
|
|
<Route exact path='/' component={Home} />
|
|
<Route path='/user' component={User} />
|
|
<Route path='/browse' component={Browse} />
|
|
<Route path='/search' component={Search} />
|
|
<Route path='/about' component={About} />
|
|
<Route path='/modules' component={Modules} />
|
|
<Route path='/contact' component={Contact} />
|
|
<Route path='/logout' component={Logout} />
|
|
<Route path='/:post_id' component={Post} />
|
|
<Route path='/callback' render={(props) => {
|
|
auth.handleAuthentication(props)
|
|
return <Callback {...props} />
|
|
}} />
|
|
</Switch>
|
|
<Footer />
|
|
</div>
|
|
</MuiThemeProvider>
|
|
</ApolloProvider>
|
|
</BrowserRouter>
|
|
)
|
|
}
|
|
}
|
|
|
|
export default App
|