ammar/cally
1
0
Fork 0
mirror of https://github.com/urosran/cally.git synced 2025-07-10 07:07:16 +00:00
Code Issues Packages Projects Releases Wiki Activity

- Added proper oauth2 authentication with google and saving of the access token to the profile

Browse Source
This commit is contained in:
Dejan
2024-10-06 22:40:50 +02:00
parent 9be3e2849e
commit 45f52bbb52
1 changed files with 54 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

107
components/pages/settings/CalendarSettingsPage.tsx
View File

@ -1,5 +1,5 @@
import {AntDesign, Ionicons} from "@expo/vector-icons";
import React, {useState} from "react";
import React, {useEffect, useState} from "react";
import {Button, Checkbox, Text, View} from "react-native-ui-lib";
import {ScrollView, StyleSheet} from "react-native";
import {colorMap} from "@/contexts/SettingsContext";
@ -9,18 +9,9 @@ import {fetchMicrosoftCalendarEvents} from "@/calendar-integration/microsoft-cal
import {useCreateEventFromProvider} from "@/hooks/firebase/useCreateEvent";
import {useAuthContext} from "@/contexts/AuthContext";
import {useUpdateUserData} from "@/hooks/firebase/useUpdateUserData";
import {GoogleSignin} from "@react-native-google-signin/google-signin";
import * as AuthSession from "expo-auth-session";
GoogleSignin.configure({
webClientId:
"406146460310-hjadmfa1gg4ptaouira5rkhu0djlo5ut.apps.googleusercontent.com",
scopes: ["profile", "email"], // Note: add calendar scope
});
const GoogleLogin = async () => {
return await GoogleSignin.signIn();
};
import * as Google from "expo-auth-session/providers/google";
import * as WebBrowser from "expo-web-browser";
const microsoftConfig = {
clientId: "13c79071-1066-40a9-9f71-b8c4b138b4af", // Replace with your Microsoft client ID
@ -37,6 +28,13 @@ const microsoftConfig = {
tokenEndpoint: "https://login.microsoftonline.com/common/oauth2/v2.0/token"
};
const googleConfig = {
androidClientId: "406146460310-2u67ab2nbhu23trp8auho1fq4om29fc0.apps.googleusercontent.com",
iosClientId: "406146460310-2u67ab2nbhu23trp8auho1fq4om29fc0.apps.googleusercontent.com",
webClientId: "406146460310-2u67ab2nbhu23trp8auho1fq4om29fc0.apps.googleusercontent.com",
scopes: ["email", "profile", "https://www.googleapis.com/auth/calendar.events.owned"]
};
const CalendarSettingsPage = (props: {
setSelectedPage: (page: number) => void;
}) => {
@ -47,6 +45,26 @@ const CalendarSettingsPage = (props: {
const {mutateAsync: createEventFromProvider} = useCreateEventFromProvider();
const {mutateAsync: updateUserData} = useUpdateUserData();
WebBrowser.maybeCompleteAuthSession()
const [request, response, promptAsync] = Google.useAuthRequest(googleConfig);
const signInWithGoogle = async () => {
try {
// Attempt to retrieve user information from AsyncStorage
if (response?.type === 'success') {
console.log(response.authentication)
await updateUserData({newUserData: {googleToken: response.authentication?.accessToken}})
}
} catch (error) {
// Handle any errors that occur during AsyncStorage retrieval or other operations
console.error("Error retrieving user data from AsyncStorage:", error);
}
};
useEffect(() => {
signInWithGoogle();
}, [response]);
const fetchAndSaveGoogleEvents = () => {
const timeMin = new Date(new Date().setHours(0, 0, 0, 0));
const timeMax = new Date(
@ -85,22 +103,6 @@ const CalendarSettingsPage = (props: {
});
};
const handleGoogleLogin = async () => {
try {
const response = await GoogleLogin();
if (response) {
const googleUserData = response.data;
let idToken = googleUserData?.idToken;
if (idToken) {
await updateUserData({newUserData: {googleToken: idToken}});
}
}
} catch (apiError) {
console.log(apiError || "Something went wrong");
}
};
const handleMicrosoftSignIn = async () => {
try {
console.log("Starting Microsoft sign-in...");
@ -266,7 +268,7 @@ const CalendarSettingsPage = (props: {
backgroundColor="white"
color="#464039"
borderRadius={15}
onPress={handleGoogleLogin}
onPress={() => promptAsync()}
/>
<Button
label={"Connect Microsoft"}
@ -293,7 +295,28 @@ const CalendarSettingsPage = (props: {
<View style={styles.card}>
<Text text70>Calendars</Text>
<View style={{marginTop: 20}}>
<Button
{profileData?.googleToken !== undefined && profileData.googleToken !== '' && <Button
label={"Sync Google"}
iconSource={() => (
<View
backgroundColor="#ededed"
width={40}
height={40}
style={{borderRadius: 50}}
marginR-10
centerV
centerH
>
<Ionicons name="logo-google" size={22} color="#979797"/>
</View>
)}
backgroundColor="white"
color="#464039"
borderRadius={15}
onPress={fetchAndSaveGoogleEvents}
/>}
{profileData?.microsoftToken !== undefined && profileData.microsoftToken !== '' &&<Button
label={"Sync Outlook"}
iconSource={() => (
<View
@ -312,29 +335,7 @@ const CalendarSettingsPage = (props: {
color="#464039"
borderRadius={15}
onPress={fetchAndSaveMicrosoftEvents}
/>
{profileData?.googleToken !== undefined && (
<Button
label={"Sync Google"}
iconSource={() => (
<View
backgroundColor="#ededed"
width={40}
height={40}
style={{borderRadius: 50}}
marginR-10
centerV
centerH
>
<Ionicons name="logo-google" size={22} color="#979797"/>
</View>
)}
backgroundColor="white"
color="#464039"
borderRadius={15}
onPress={fetchAndSaveGoogleEvents}
/>
)}
/>}
</View>
</View>
</View>