wip: working, needs some unit tests for auth functions
This commit is contained in:
parent
d93d73dc3a
commit
eb2534ff94
4
App.tsx
4
App.tsx
@ -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
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -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()
|
||||||
}
|
}
|
@ -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
|
||||||
}
|
}
|
18
component/buttons/sign-out.tsx
Normal file
18
component/buttons/sign-out.tsx
Normal 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()
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
}
|
@ -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>
|
||||||
|
Loading…
Reference in New Issue
Block a user