Skip to content

Instantly share code, notes, and snippets.

@ziedHamdi
Created August 27, 2021 13:11
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save ziedHamdi/a574e3ce51e808188667426fd279685e to your computer and use it in GitHub Desktop.
Save ziedHamdi/a574e3ce51e808188667426fd279685e to your computer and use it in GitHub Desktop.
An example of _app.js
import React from 'react';
import {ApolloProvider} from '@apollo/client'
import {useApollo} from '../apollo/client'
import {ThemeProvider} from '@material-ui/core/styles';
import CssBaseline from '@material-ui/core/CssBaseline';
import Head from 'next/head';
import theme from '../components/theme';
import PropTypes from 'prop-types';
import {appWithTranslation} from 'next-i18next';
import {Provider} from 'next-auth/client'
import '../lib/overrides/react-image-gallery/image-gallery.css'
import '../lib/overrides/global.css'
function App({Component, pageProps}) {
const apolloClient = useApollo(pageProps)
//Material-ui SSR https://github.com/mui-org/material-ui/tree/master/examples/nextjs
React.useEffect(() => {
// Remove the server-side injected CSS.
const jssStyles = document.querySelector('#jss-server-side');
if (jssStyles) {
jssStyles.parentElement.removeChild(jssStyles);
}
}, []);
return (
<ApolloProvider client={apolloClient}>
<Provider session={pageProps.session}>
<Head>
<title>WeAlly</title>
<meta name="viewport" content="minimum-scale=1, initial-scale=1, width=device-width"/>
<link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png"/>
<link rel="icon" type="image/png" sizes="32x32" href="/images/favicon-32x32.png"/>
<link rel="icon" type="image/png" sizes="16x16" href="/images/favicon-16x16.png"/>
<link rel="manifest" href="/images/site.webmanifest"/>
</Head>
<ThemeProvider theme={theme}>
{/* CssBaseline kickstart an elegant, consistent, and simple baseline to build upon. */}
<CssBaseline/>
<Component {...pageProps} />
</ThemeProvider>
</Provider>
</ApolloProvider>
)
}
//i18n config https://github.com/isaachinman/next-i18next
export default appWithTranslation(App);
App.propTypes = {
Component: PropTypes.elementType.isRequired,
pageProps: PropTypes.object.isRequired,
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment