diff --git a/app/(full-page)/auth/google/page.tsx b/app/(full-page)/auth/google/page.tsx index c6136b6..6bd952f 100644 --- a/app/(full-page)/auth/google/page.tsx +++ b/app/(full-page)/auth/google/page.tsx @@ -4,19 +4,22 @@ import { useSearchParams } from 'next/navigation' import { useCookies} from 'react-cookie' import { redirect } from 'next/navigation' import { GoogleSigninService } from '@/service/GoogleSignInService' -import { useEffect, useState } from 'react' +import { useContext , useEffect, useState } from 'react' import { IS_LOGIN } from '../../../../lib/constants' +import { LayoutContext } from '../../../../layout/context/layoutcontext'; +import { classNames } from 'primereact/utils'; +import { Button } from 'primereact/button'; const GoogleAuthPage = () => { + const { layoutConfig } = useContext(LayoutContext); const searchParams = useSearchParams() - - const state = searchParams.get("state"); - const authCode = searchParams.get("code"); const [cookies, setCookies, removeCookie] = useCookies(['state', 'code_verifier']); const clientState = cookies.state; const codeVerifier = cookies.code_verifier; const [isDenyAccess, setIsDenyAccess] = useState(false); const [isLogin, setIsLogin] = useState(false); + const state = searchParams.get("state"); + const authCode = searchParams.get("code"); useEffect(()=>{ if(isDenyAccess) @@ -30,30 +33,79 @@ const GoogleAuthPage = () => { //console.debug(clientState != state); //console.debug("authorisation code", authCode); //console.debug("code verifier", codeVerifier); + if(state !== null || authCode !== null){ + if(clientState != state || !authCode){ + console.log('redirection'); + setIsDenyAccess(true); + } - if(clientState != state || !authCode){ - console.log('redirection'); - setIsDenyAccess(true); + GoogleSigninService.getAuthenticated(codeVerifier, authCode) + .then((data) => { + console.log(data); + //clear cookies + removeCookie('state'); + removeCookie('code_verifier'); + localStorage.setItem(IS_LOGIN, "true" ); + setIsLogin(true); + }) + .catch((err) => { + console.log("getAccessToken", err); + setIsDenyAccess(true); + }) } - - GoogleSigninService.getAuthenticated(codeVerifier, authCode) - .then((data) => { - console.log(data); - //clear cookies - removeCookie('state'); - removeCookie('code_verifier'); - localStorage.setItem(IS_LOGIN, "true" ); - setIsLogin(true); - }) - .catch((err) => { - console.log("getAccessToken", err); - setIsDenyAccess(true); - }) },[]) + async function signIn() { + var state = GoogleSigninService.generateRandomBytes(); + + await GoogleSigninService.generateCodeChallenge() + .then((result:any)=>{ + console.log(result); + setCookies('code_verifier', result.codeVerifier, { + httpOnly: false, + secure: false, + maxAge: 60, //60 secs + path: '/' + }); + setCookies('state', state, { + httpOnly: false, + secure: false, + maxAge: 60, //60 secs + path: '/' + }); + GoogleSigninService.signIn(state, result.codeChallenge); + }); + } + const containerClassName = classNames('surface-ground flex align-items-center justify-content-center min-h-screen min-w-screen overflow-hidden', { 'p-input-filled': layoutConfig.inputStyle === 'filled' }); - return (
-

Loading

-
); + return ( +
+
+ Quemistry logo +
+
+
+ Sign in to continue +
+ +
+ +
+
+
+
+
+ ); } export default GoogleAuthPage; \ No newline at end of file diff --git a/app/(full-page)/page.tsx b/app/(full-page)/page.tsx index e05a873..6aa2e9d 100644 --- a/app/(full-page)/page.tsx +++ b/app/(full-page)/page.tsx @@ -1,6 +1,6 @@ 'use client'; /* eslint-disable @next/next/no-img-element */ -import React, { useCallback, useContext, useRef, useState } from 'react'; +import React, { useContext, useRef, useState } from 'react'; import Link from 'next/link'; import { StyleClass } from 'primereact/styleclass'; @@ -11,14 +11,11 @@ import { LayoutContext } from '../../layout/context/layoutcontext'; import { NodeRef } from '@/types'; import { classNames } from 'primereact/utils'; import { Dialog } from 'primereact/dialog'; -import { GoogleSigninService } from '../../service/GoogleSignInService'; -import { useCookies } from 'react-cookie' const LandingPage = () => { const [isHidden, setIsHidden] = useState(false); const { layoutConfig } = useContext(LayoutContext); const [showSignIn, setShowSignIn] = useState(false); - const [cookies, setCookies] = useCookies(['state', 'code_verifier']); const menuRef = useRef(null); @@ -26,28 +23,6 @@ const LandingPage = () => { setIsHidden((prevState) => !prevState); }; - async function signIn() { - var state = GoogleSigninService.generateRandomBytes(); - - await GoogleSigninService.generateCodeChallenge() - .then((result:any)=>{ - console.log(result); - setCookies('code_verifier', result.codeVerifier, { - httpOnly: false, - secure: false, - maxAge: 60, //60 secs - path: '/' - }); - setCookies('state', state, { - httpOnly: false, - secure: false, - maxAge: 60, //60 secs - path: '/' - }); - GoogleSigninService.signIn(state, result.codeChallenge); - }); - } - return (
@@ -87,31 +62,11 @@ const LandingPage = () => {
- +
-
- {if(!showSignIn) return; setShowSignIn(false)}} style={{ width: '30rem' }}> -

- Sign in / Sign up. -

- -
- -
-
-
- -
- -
((props, ref) => { const { layoutConfig, layoutState, onMenuToggle, showProfileSidebar } = useContext(LayoutContext); const menubuttonRef = useRef(null); const topbarmenuRef = useRef(null); const topbarmenubuttonRef = useRef(null); + const profilemenubuttonRef = useRef(null); useImperativeHandle(ref, () => ({ menubutton: menubuttonRef.current, topbarmenu: topbarmenuRef.current, - topbarmenubutton: topbarmenubuttonRef.current + topbarmenubutton: topbarmenubuttonRef.current, + profilemenubutton: profilemenubuttonRef.current })); + const toggleProfileMenu = (event: React.MouseEvent) => { + profilemenubuttonRef.current?.toggle(event); + }; + const overlayMenuItems = [ + { + label: 'View Profile' + }, + { + separator: true + }, + { + label: 'Sign out', + icon: 'pi pi-sign-out' + } + ]; + return (
@@ -34,15 +54,23 @@ const AppTopbar = forwardRef((props, ref) => {
+ {localStorage.getItem(IS_LOGIN) === "true" || + } {localStorage.getItem(IS_LOGIN) !== "true" || } - {localStorage.getItem(IS_LOGIN) !== "true" || +
}