wip: working, needs some unit tests for auth functions

This commit is contained in:
Loewy 2024-02-06 11:09:22 -08:00
parent d93d73dc3a
commit eb2534ff94
5 changed files with 31 additions and 22 deletions

View File

@ -5,7 +5,7 @@ import AppNavigator from "./navigation/app-navigator";
import { DEV_USER_ID } from "./config"; import { DEV_USER_ID } from "./config";
import AsyncStorage from "@react-native-async-storage/async-storage"; import AsyncStorage from "@react-native-async-storage/async-storage";
// TODO: can be done when we go with a src top level directory -- should live on cofig // TODO: move to different file?
const SetAuthHeaderBasedOnEnv = () => { const SetAuthHeaderBasedOnEnv = () => {
const { setAuthHeader } = useAuthHeader(); const { setAuthHeader } = useAuthHeader();
@ -21,7 +21,7 @@ const SetAuthHeaderBasedOnEnv = () => {
if (token) { if (token) {
console.log("Setting firebase auth token"); console.log("Setting firebase auth token");
setAuthHeader({ key: "Authorization", value: `Bearer ${token}` }); setAuthHeader({ key: "Authorization", value: `Bearer ${token}` });
} // handle error }
} }
}; };

View File

@ -2,7 +2,7 @@ import AsyncStorage from '@react-native-async-storage/async-storage';
import auth, { FirebaseAuthTypes } from '@react-native-firebase/auth'; import auth, { FirebaseAuthTypes } from '@react-native-firebase/auth';
import { Alert } from 'react-native'; import { Alert } from 'react-native';
export const signInWithPhoneNumber = async (phoneNumber: string): Promise<FirebaseAuthTypes.ConfirmationResult | undefined> => { export const handleSignInWithPhoneNumber = async (phoneNumber: string): Promise<FirebaseAuthTypes.ConfirmationResult | undefined> => {
if (!phoneNumber) { if (!phoneNumber) {
Alert.alert("Please enter a valid phone number with a country code"); Alert.alert("Please enter a valid phone number with a country code");
return; return;
@ -39,7 +39,7 @@ export const getCurrentUserToken = async (): Promise<string | null> => {
return null; return null;
}; };
export const signOut = async (): Promise<void> => { export const handleSignOut = async (): Promise<void> => {
await AsyncStorage.removeItem('token'); await AsyncStorage.removeItem('token');
auth().signOut() await auth().signOut()
} }

View File

@ -1,15 +1,15 @@
import { import {
signInWithPhoneNumber, handleSignInWithPhoneNumber,
confirmCode, confirmCode,
onAuthStateChanged, onAuthStateChanged,
getCurrentUserToken, getCurrentUserToken,
signOut handleSignOut
} from './firebase-auth' } from './firebase-auth'
export { export {
signInWithPhoneNumber, handleSignInWithPhoneNumber,
confirmCode, confirmCode,
onAuthStateChanged, onAuthStateChanged,
getCurrentUserToken, getCurrentUserToken,
signOut handleSignOut
} }

View File

@ -0,0 +1,18 @@
import { handleSignOut } from "../../auth"
import { useAuthHeader } from "../../graphql/client"
import React from "react"
import { Button } from "react-native"
export default function SignOutButton(): React.JSX.Element {
const { setAuthHeader } = useAuthHeader()
return (
<Button
title={'Sign out'}
onPress={async () => {
setAuthHeader({ key: 'Authorization', value: '' })
await handleSignOut()
}}
/>
)
}

View File

@ -8,10 +8,11 @@ import {
TouchableWithoutFeedback, TouchableWithoutFeedback,
View, View,
} from 'react-native'; } from 'react-native';
import { signInWithPhoneNumber, confirmCode, onAuthStateChanged, signOut } from '../auth'; // Adjust the path as necessary import { handleSignInWithPhoneNumber, confirmCode, onAuthStateChanged } from '../auth';
import { FirebaseAuthTypes } from '@react-native-firebase/auth'; import { FirebaseAuthTypes } from '@react-native-firebase/auth';
import { useAuthHeader } from '../graphql/client'; import { useAuthHeader } from '../graphql/client';
import AsyncStorage from '@react-native-async-storage/async-storage'; import AsyncStorage from '@react-native-async-storage/async-storage';
import SignOutButton from '../component/buttons/sign-out';
export default function Login() { export default function Login() {
const [phoneNumber, setPhoneNumber] = useState<string>(''); const [phoneNumber, setPhoneNumber] = useState<string>('');
@ -22,9 +23,6 @@ export default function Login() {
useEffect(() => { useEffect(() => {
const unsubscribe = onAuthStateChanged(async (user) => { const unsubscribe = onAuthStateChanged(async (user) => {
console.log('🦊 | useFirebaseAuthSetup | onAuthStateChanged | user:', user);
// TODO: see if should save the user in the store or use those info some how or not, ot just need the accessToken
setUser(user) setUser(user)
if (user) { if (user) {
const token = await user.getIdToken() const token = await user.getIdToken()
@ -33,7 +31,6 @@ export default function Login() {
setAuthHeader({ key: "Authorization", value: `Bearer ${token}` }); setAuthHeader({ key: "Authorization", value: `Bearer ${token}` });
} }
} }
console.log('🦛 | user.emailVerified:', user?.emailVerified);
}); });
return unsubscribe; return unsubscribe;
// eslint-disable-next-line react-hooks/exhaustive-deps // eslint-disable-next-line react-hooks/exhaustive-deps
@ -78,7 +75,7 @@ export default function Login() {
)} )}
<Button <Button
title={!confirm ? 'Receive code' : 'Confirm code'} title={!confirm ? 'Receive code' : 'Confirm code'}
onPress={() => !confirm ? signInWithPhoneNumber(phoneNumber).then(setConfirm) : confirm && confirmCode(confirm, code)} onPress={() => !confirm ? handleSignInWithPhoneNumber(phoneNumber).then(setConfirm) : confirm && confirmCode(confirm, code)}
/> />
<Text>{authHeader.key}: {authHeader.value}</Text> <Text>{authHeader.key}: {authHeader.value}</Text>
{user && ( {user && (
@ -88,13 +85,7 @@ export default function Login() {
</Text> </Text>
<Text>Phone number: {user?.phoneNumber}</Text> <Text>Phone number: {user?.phoneNumber}</Text>
<Button <SignOutButton />
title={'Sign out'}
onPress={() => {
setAuthHeader({ key: 'Authorization', value: '' })
signOut()
}}
/>
</> </>
)} )}
</View> </View>