From cf5ac91ed2008795ae7b47a93b98e00cbc8a002a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?C=C3=A9dric=20FAMIBELLE-PRONZOLA?= Date: Sat, 22 May 2021 23:41:18 +0200 Subject: [PATCH] Update _app with next-auth Provider --- pages/_app.js | 41 ++++++++++++++++++++++++++++++++++++++--- 1 file changed, 38 insertions(+), 3 deletions(-) diff --git a/pages/_app.js b/pages/_app.js index 68d8dd6..982a221 100644 --- a/pages/_app.js +++ b/pages/_app.js @@ -1,7 +1,9 @@ -import React from 'react' +import React, {useEffect} from 'react' +import {useRouter} from 'next/router' import PropTypes from 'prop-types' import {createMuiTheme, ThemeProvider} from '@material-ui/core/styles' import CssBaseline from '@material-ui/core/CssBaseline' +import {Provider, useSession} from 'next-auth/client' const darkTheme = createMuiTheme({ palette: { @@ -18,7 +20,7 @@ const darkTheme = createMuiTheme({ export default function MyApp(props) { const {Component, pageProps} = props - React.useEffect(() => { + useEffect(() => { const jssStyles = document.querySelector('#jss-server-side') if (jssStyles) { jssStyles.remove() @@ -28,12 +30,45 @@ export default function MyApp(props) { return ( - + + {Component.auth ? ( + + ) : ( + + )} + ) } +function Auth({children}) { + const [session, loading] = useSession() + const isUser = Boolean(session?.user) + const router = useRouter() + useEffect(() => { + if (loading) { + return + } + + if (!isUser) { + router.push('/kont') + } + }, [isUser, loading, router]) + + if (isUser) { + return children + } + + return ( +
Loading...
+ ) +} + MyApp.propTypes = { Component: PropTypes.elementType.isRequired, pageProps: PropTypes.object.isRequired } + +Auth.propTypes = { + children: PropTypes.node.isRequired +}