mirror of
https://github.com/quepasaevents/qpa-client.git
synced 2023-12-14 05:33:02 +01:00
Extract providers
This commit is contained in:
parent
22457474df
commit
dd348bee0b
|
@ -19,44 +19,30 @@ import Header from "./Header/Header"
|
||||||
import Login from "./Auth/Login"
|
import Login from "./Auth/Login"
|
||||||
import styled from "@emotion/styled"
|
import styled from "@emotion/styled"
|
||||||
|
|
||||||
const httpLink = new HttpLink({
|
|
||||||
uri: "/graphql"
|
|
||||||
})
|
|
||||||
|
|
||||||
const graphqlClient = new ApolloClient({
|
|
||||||
connectToDevTools: true,
|
|
||||||
link: httpLink,
|
|
||||||
cache: new InMemoryCache()
|
|
||||||
}) as ApolloClient<any>
|
|
||||||
|
|
||||||
const App = () => (
|
const App = () => (
|
||||||
<ApolloProvider client={graphqlClient}>
|
<Root>
|
||||||
<AppContextProvider>
|
<Header />
|
||||||
<Router>
|
<Content>
|
||||||
<Header />
|
<Switch>
|
||||||
<Content>
|
<Route path="/create" component={CreateEvent} />
|
||||||
|
<Route
|
||||||
<Switch>
|
path="/event/:eventId/edit"
|
||||||
<Route path="/create" component={CreateEvent} />
|
render={(
|
||||||
<Route
|
routeProps: RouteComponentProps<{ eventId: string }>
|
||||||
path="/event/:eventId/edit"
|
) => <EditEvent eventId={routeProps.match.params.eventId} />}
|
||||||
render={(
|
/>
|
||||||
routeProps: RouteComponentProps<{ eventId: string }>
|
<Route path="/login" component={Login} />
|
||||||
) => <EditEvent eventId={routeProps.match.params.eventId} />}
|
<Route path="/" component={Calendar} />
|
||||||
/>
|
<Redirect to="/" />
|
||||||
<Route path="/login" component={Login} />
|
</Switch>
|
||||||
<Route path="/" component={Calendar} />
|
</Content>
|
||||||
<Redirect to="/" />
|
</Root>
|
||||||
</Switch>
|
|
||||||
</Content>
|
|
||||||
|
|
||||||
</Router>
|
|
||||||
|
|
||||||
</AppContextProvider>
|
|
||||||
</ApolloProvider>
|
|
||||||
)
|
)
|
||||||
|
|
||||||
|
const Root = styled.div`
|
||||||
|
|
||||||
|
`
|
||||||
const Content = styled.div`
|
const Content = styled.div`
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
|
35
client/App/Providers.tsx
Normal file
35
client/App/Providers.tsx
Normal file
|
@ -0,0 +1,35 @@
|
||||||
|
import * as React from 'react'
|
||||||
|
import {AppContextProvider} from "./Context/AppContext"
|
||||||
|
import {BrowserRouter as Router, Redirect, Route, Switch} from "react-router-dom"
|
||||||
|
import {ApolloProvider} from "react-apollo"
|
||||||
|
import {HttpLink} from "apollo-link-http"
|
||||||
|
import {ApolloClient} from "apollo-client"
|
||||||
|
import {InMemoryCache} from "apollo-cache-inmemory"
|
||||||
|
|
||||||
|
interface Props {
|
||||||
|
children: React.ReactChild | React.ReactChildren
|
||||||
|
}
|
||||||
|
|
||||||
|
const httpLink = new HttpLink({
|
||||||
|
uri: "/graphql"
|
||||||
|
})
|
||||||
|
|
||||||
|
const graphqlClient = new ApolloClient({
|
||||||
|
connectToDevTools: true,
|
||||||
|
link: httpLink,
|
||||||
|
cache: new InMemoryCache()
|
||||||
|
}) as ApolloClient<any>
|
||||||
|
|
||||||
|
|
||||||
|
const Providers = (props: Props) => (
|
||||||
|
<ApolloProvider client={graphqlClient}>
|
||||||
|
<AppContextProvider>
|
||||||
|
<Router>
|
||||||
|
{ props.children }
|
||||||
|
</Router>
|
||||||
|
</AppContextProvider>
|
||||||
|
</ApolloProvider>
|
||||||
|
)
|
||||||
|
|
||||||
|
|
||||||
|
export default Providers
|
|
@ -1,10 +1,13 @@
|
||||||
import * as React from 'react'
|
import * as React from 'react'
|
||||||
import * as ReactDOM from 'react-dom'
|
import * as ReactDOM from 'react-dom'
|
||||||
import App from './App'
|
import App from './App'
|
||||||
|
import Providers from "./Providers"
|
||||||
|
|
||||||
const appWrapper = document.createElement('div')
|
const appWrapper = document.createElement('div')
|
||||||
document.body.appendChild(appWrapper)
|
document.body.appendChild(appWrapper)
|
||||||
|
|
||||||
ReactDOM.render(<App />, appWrapper)
|
ReactDOM.render((
|
||||||
|
<Providers><App /></Providers>
|
||||||
|
), appWrapper)
|
||||||
|
|
||||||
export default App
|
export default App
|
||||||
|
|
Loading…
Reference in a new issue