100 lines
2.9 KiB
JavaScript
100 lines
2.9 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';
|
|
|
|
// 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 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);
|
|
|
|
class App extends Component {
|
|
render() {
|
|
|
|
return (
|
|
<BrowserRouter>
|
|
<ApolloProvider client={client}>
|
|
|
|
<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='/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>
|
|
|
|
</ApolloProvider>
|
|
</BrowserRouter>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default App;
|