import React , { useEffect } from "react" ; import Head from "next/head" ; import { ThemeProvider } from "@material-ui/core/styles" ; import CssBaseline from "@material-ui/core/CssBaseline" ; import Header from "../components/Header" ; import theme from "../theme" ; import type { AppProps } from "next/app" ; import Amplify from "aws-amplify" ; import awsconfig from "../aws-exports" ; import AuthContext from "../context/AuthContext" ; Amplify . configure ( { ... awsconfig , ssr : true } ) ; function MyApp ( { Component , pageProps } ) { useEffect ( ( ) => { const jssStyles = document . querySelector ( "#jss-server-side" ) ; if ( jssStyles ) { jssStyles . parentElement . removeChild ( jssStyles ) ; } } , [ ] ) ; return ( < React . Fragment > < Head > < title > Reddit Clone < /title> < meta name = "viewport" content = "minimum-scale=1, initial-scale=1, width=device-width" / > < /Head> < AuthContext > < ThemeProvider theme = { theme } > { } < CssBaseline / > < Header /> < Component { ... pageProps } /> < /ThemeProvider> < /AuthContext> < /React.Fragment>); } export default MyApp ;