From 4e3161d84dd2b303cf01422c21205724e1110e2e Mon Sep 17 00:00:00 2001 From: falcaodiogo Date: Thu, 22 May 2025 00:53:56 +0100 Subject: [PATCH 1/3] Google Auth Library, google services --- .gitignore | 6 +++- app.json | 9 ++++-- bun.lock | 3 ++ components/LoginBottomSheet.tsx | 53 ++++++++++++++++++++++++++++++++- package.json | 1 + 5 files changed, 67 insertions(+), 5 deletions(-) diff --git a/.gitignore b/.gitignore index 27a6f5d..7aadb01 100644 --- a/.gitignore +++ b/.gitignore @@ -44,4 +44,8 @@ app-example # Continuous Native Generation android/ -ios/ \ No newline at end of file +ios/ + +# Google Auth +google-services.json +GoogleService-Info.plist \ No newline at end of file diff --git a/app.json b/app.json index efa6a2d..013be25 100644 --- a/app.json +++ b/app.json @@ -15,9 +15,11 @@ "dark": "./assets/images/logos/ios-dark.png", "light": "./assets/images/logos/ios-light.png", "tinted": "./assets/images/logos/ios-tinted.png" - } + }, + "googleServicesFile": "./GoogleService-Info.plist" }, "android": { + "googleServicesFile": "./google-services.json", "adaptiveIcon": { "foregroundImage": "./assets/images/logos/android-adaptive-icon.png", "monochromeImage": "./assets/images/logos/android-tinted-icon.png" @@ -47,7 +49,8 @@ "react-native-edge-to-edge", "expo-secure-store", "expo-speech-recognition", - "@maplibre/maplibre-react-native" + "@maplibre/maplibre-react-native", + "@react-native-google-signin/google-signin" ], "experiments": { "typedRoutes": true, @@ -68,4 +71,4 @@ "url": "https://u.expo.dev/0bab4576-b4ae-4290-9835-f6e61e1b2bf8" } } -} \ No newline at end of file +} diff --git a/bun.lock b/bun.lock index d16c329..7c7c8e2 100644 --- a/bun.lock +++ b/bun.lock @@ -15,6 +15,7 @@ "@graphql-typed-document-node/core": "~3.2.0", "@legendapp/list": "^1.0.10", "@maplibre/maplibre-react-native": "~10.1.4", + "@react-native-google-signin/google-signin": "^14.0.1", "@react-native-masked-view/masked-view": "~0.3.2", "@react-native-picker/picker": "^2.11.0", "@react-navigation/bottom-tabs": "~7.2.0", @@ -681,6 +682,8 @@ "@radix-ui/react-slot": ["@radix-ui/react-slot@1.0.1", "", { "dependencies": { "@babel/runtime": "^7.13.10", "@radix-ui/react-compose-refs": "1.0.0" }, "peerDependencies": { "react": "^16.8 || ^17.0 || ^18.0" } }, "sha512-avutXAFL1ehGvAXtPquu0YK5oz6ctS474iM3vNGQIkswrVhdrS52e3uoMQBzZhNRAIE0jBnUyXWNmSjGHhCFcw=="], + "@react-native-google-signin/google-signin": ["@react-native-google-signin/google-signin@14.0.1", "", { "peerDependencies": { "expo": ">=52.0.40", "react": "*", "react-dom": "*", "react-native": "*" }, "optionalPeers": ["expo", "react-dom"] }, "sha512-2f903eaHiv/Ob96vsWZitz+Z0k2J2W0/C7Ygrr6ejAT2JVzJCatmjF/eq62MWhuTNdU2WDX/oePxMbpQW6k2UA=="], + "@react-native-masked-view/masked-view": ["@react-native-masked-view/masked-view@0.3.2", "", { "peerDependencies": { "react": ">=16", "react-native": ">=0.57" } }, "sha512-XwuQoW7/GEgWRMovOQtX3A4PrXhyaZm0lVUiY8qJDvdngjLms9Cpdck6SmGAUNqQwcj2EadHC1HwL0bEyoa/SQ=="], "@react-native-picker/picker": ["@react-native-picker/picker@2.11.0", "", { "peerDependencies": { "react": "*", "react-native": "*" } }, "sha512-QuZU6gbxmOID5zZgd/H90NgBnbJ3VV6qVzp6c7/dDrmWdX8S0X5YFYgDcQFjE3dRen9wB9FWnj2VVdPU64adSg=="], diff --git a/components/LoginBottomSheet.tsx b/components/LoginBottomSheet.tsx index 7b98628..db0b624 100644 --- a/components/LoginBottomSheet.tsx +++ b/components/LoginBottomSheet.tsx @@ -6,7 +6,7 @@ import { ThemedText } from "@/components/ThemedText"; import { Button } from "@/components/Button"; import AppleIcon from "@/assets/images/brands/apple.svg"; import GoogleIcon from "@/assets/images/brands/google.svg"; -import React, { useRef } from "react"; +import React, { useEffect, useRef, useState } from "react"; import { useSafeAreaInsets } from "react-native-safe-area-context"; import { useBackground } from "@/hooks/useBackground"; import { Redirect, useRouter } from "expo-router"; @@ -16,6 +16,11 @@ import { FetchResult, useMutation } from "@apollo/client"; import { UpsertUserMutation } from "@/graphql/graphql"; import { useToast } from "@/hooks/useToast"; import { useAuth } from "@/hooks/useAuth"; +import { + GoogleSignin, + GoogleSigninButton, + SignInResponse, +} from "@react-native-google-signin/google-signin"; interface LoginBottomSheetProps { animatedPosition: SharedValue; @@ -45,6 +50,36 @@ export const LoginBottomSheet = ({ const router = useRouter(); const { id, setId } = useAuth(); const { toast, toastOnError } = useToast(); + const [error, setError] = useState(); + const [userInfo, setUserInfo] = useState(null); + + useEffect(() => { + GoogleSignin.configure({ + webClientId: + "1035898946515-uqk7ud62tcefu3jbmljnlsroon34vt2v.apps.googleusercontent.com", + }); + }, []); + + const signin = async () => { + try { + const userInfo = await GoogleSignin.signIn(); + setUserInfo(userInfo); + console.log(userInfo); + } catch (error) { + console.error(error); + setError(error); + } + }; + + const logout = async () => { + try { + await GoogleSignin.signOut(); + setUserInfo(null); + } catch (error) { + console.error(error); + setError(error); + } + }; const [upsertUser, { loading }] = useMutation(UPSERT_USER, { variables: { @@ -76,6 +111,12 @@ export const LoginBottomSheet = ({ } const methods: LoginMethod[] = [ + { + name: "Manual", + icon: GoogleIcon, + onPress: async () => await upsertUser(), + type: Platform.OS === "web" ? "primary" : "secondary", + }, { name: "Apple", icon: AppleIcon, @@ -107,6 +148,16 @@ export const LoginBottomSheet = ({ by logging in. + {userInfo && {JSON.stringify(userInfo.data)}} + {userInfo ? ( +