import '../styles/globals.scss'
import { ApolloClient, InMemoryCache, ApolloProvider } from '@apollo/client'
import { Provider } from 'next-auth/client'
import { FundErrorModal, FundErrorProvider } from '../components/fund-error'
import { MeProvider } from '../components/me'

const client = new ApolloClient({
  uri: '/api/graphql',
  cache: new InMemoryCache()
})

function MyApp ({ Component, pageProps }) {
  return (
    <Provider session={pageProps.session}>
      <ApolloProvider client={client}>
        <MeProvider>
          <FundErrorProvider>
            <FundErrorModal />
            <Component {...pageProps} />
          </FundErrorProvider>
        </MeProvider>
      </ApolloProvider>
    </Provider>
  )
}

export default MyApp