From 279d16d59a59f5866a70b6250ad61405dceb0e4a Mon Sep 17 00:00:00 2001 From: Zoe Roux Date: Fri, 23 Jun 2023 00:12:25 +0900 Subject: [PATCH] Add google things on the front --- back/src/auth/auth.controller.ts | 4 ++-- back/src/auth/google.strategy.ts | 11 ++++++----- front/API.ts | 2 +- front/Navigation.tsx | 6 ++++++ front/nginx.conf.template | 2 +- front/views/AuthenticationView.tsx | 16 ++++++++-------- front/views/GoogleView.tsx | 23 +++++++++++++++++++++++ 7 files changed, 47 insertions(+), 17 deletions(-) create mode 100644 front/views/GoogleView.tsx diff --git a/back/src/auth/auth.controller.ts b/back/src/auth/auth.controller.ts index bd69b01..d4320bf 100644 --- a/back/src/auth/auth.controller.ts +++ b/back/src/auth/auth.controller.ts @@ -51,9 +51,9 @@ export class AuthController { @Get("logged/google") @UseGuards(AuthGuard('google')) async googleLoginCallbakc(@Req() req: any) { - let user = await this.usersService.user({googleID: req.id}); + let user = await this.usersService.user({googleID: req.user.googleID}); if (!user) { - user = await this.usersService.createUser(req) + user = await this.usersService.createUser(req.user) await this.settingsService.createUserSetting(user.id); } return this.authService.login(user); diff --git a/back/src/auth/google.strategy.ts b/back/src/auth/google.strategy.ts index 9fb2406..60dbf61 100644 --- a/back/src/auth/google.strategy.ts +++ b/back/src/auth/google.strategy.ts @@ -1,6 +1,7 @@ import { PassportStrategy } from '@nestjs/passport'; import { Strategy, VerifyCallback } from 'passport-google-oauth20'; import { Injectable } from '@nestjs/common'; +import { User } from '@prisma/client'; @Injectable() export class GoogleStrategy extends PassportStrategy(Strategy) { @@ -8,7 +9,7 @@ export class GoogleStrategy extends PassportStrategy(Strategy) { super({ clientID: process.env.GOOGLE_CLIENT_ID, clientSecret: process.env.GOOGLE_SECRET, - callbackURL: 'http://localhost:3000/google/redirect', + callbackURL: process.env.GOOGLE_CALLBACK_URL, scope: ['email', 'profile'], }); } @@ -19,16 +20,16 @@ export class GoogleStrategy extends PassportStrategy(Strategy) { profile: any, done: VerifyCallback, ): Promise { - console.log(profile); - const { name, emails, photos, username } = profile; const user = { - email: emails[0].value, - username, + email: profile.emails[0].value, + username: profile.displayName, password: null, + googleID: profile.id, // firstName: name.givenName, // lastName: name.familyName, // picture: photos[0].value, }; done(null, user); + return user; } } diff --git a/front/API.ts b/front/API.ts index 3f0b407..39d54d6 100644 --- a/front/API.ts +++ b/front/API.ts @@ -47,7 +47,7 @@ export class APIError extends Error { } // we will need the same thing for the scorometer API url -const baseAPIUrl = +export const baseAPIUrl = process.env.NODE_ENV != 'development' && Platform.OS === 'web' ? '/api' : Constants.manifest?.extra?.apiUrl; diff --git a/front/Navigation.tsx b/front/Navigation.tsx index 011967b..10c759a 100644 --- a/front/Navigation.tsx +++ b/front/Navigation.tsx @@ -28,6 +28,7 @@ import { Button, Center, VStack } from 'native-base'; import { unsetAccessToken } from './state/UserSlice'; import TextButton from './components/TextButton'; import ErrorView from './views/ErrorView'; +import GoogleView from './views/GoogleView'; // Util function to hide route props in URL const removeMe = () => ''; @@ -100,6 +101,11 @@ const publicRoutes = () => options: { title: 'Oops', headerShown: false }, link: undefined, }, + Google: { + component: GoogleView, + options: { title: 'Google signin', headerShown: false }, + link: '/logged/google', + }, } as const); // eslint-disable-next-line @typescript-eslint/no-explicit-any diff --git a/front/nginx.conf.template b/front/nginx.conf.template index d2e1042..9baf3ed 100644 --- a/front/nginx.conf.template +++ b/front/nginx.conf.template @@ -22,4 +22,4 @@ server { proxy_set_header Connection $http_connection; proxy_http_version 1.1; } -} \ No newline at end of file +} diff --git a/front/views/AuthenticationView.tsx b/front/views/AuthenticationView.tsx index df8eee4..1f18f72 100644 --- a/front/views/AuthenticationView.tsx +++ b/front/views/AuthenticationView.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { useDispatch } from '../state/Store'; import { Translate, translate } from '../i18n/i18n'; -import API, { APIError } from '../API'; +import API, { APIError, baseAPIUrl } from '../API'; import { setAccessToken } from '../state/UserSlice'; import { Center, Button, Text } from 'native-base'; import SigninForm from '../components/forms/signinform'; @@ -56,6 +56,13 @@ const AuthenticationView = ({ isSignup }: RouteProps) = + window.location.href = `${baseAPIUrl}/auth/login/google`} + /> {mode === 'signin' ? ( @@ -78,13 +85,6 @@ const AuthenticationView = ({ isSignup }: RouteProps) = {translate('forgottenPassword')} )} - window.location.href = "/api/login/google"} - /> { + const dispatch = useDispatch(); + + useEffect(() => { + async function run() { + const accessToken = await API.fetch({ + route: `/auth/logged/google${window.location.search}`, + method: 'GET', + }).then((responseBody) => responseBody.access_token as AccessToken) + dispatch(setAccessToken(accessToken)) + } + run(); + }, []); + + return

Loading please wait

; +} + +export default GoogleView;