here you go loewy
This commit is contained in:
parent
b9221fa949
commit
3a476e0db4
@ -30,7 +30,7 @@ module.exports = {
|
|||||||
rules: {
|
rules: {
|
||||||
// Best Practices
|
// Best Practices
|
||||||
eqeqeq: ["error", "always"], // Enforce '===' instead of '=='
|
eqeqeq: ["error", "always"], // Enforce '===' instead of '=='
|
||||||
curly: "error", // Require curly braces for all control statements
|
curly: ["error", "multi-line", "consistent"], // Require curly braces for all control statements
|
||||||
"no-unused-vars": "warn", // Warn about variables that are declared but not used
|
"no-unused-vars": "warn", // Warn about variables that are declared but not used
|
||||||
|
|
||||||
// React Specific
|
// React Specific
|
||||||
|
@ -38,6 +38,8 @@ export const onAuthStateChanged = (
|
|||||||
return auth().onAuthStateChanged(callback);
|
return auth().onAuthStateChanged(callback);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
export const currentUser = () => auth().currentUser;
|
||||||
|
|
||||||
export const getCurrentUserToken = async (): Promise<string | null> => {
|
export const getCurrentUserToken = async (): Promise<string | null> => {
|
||||||
const user = auth().currentUser;
|
const user = auth().currentUser;
|
||||||
if (user) {
|
if (user) {
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
import {
|
import {
|
||||||
confirmCode,
|
confirmCode,
|
||||||
getCurrentUserToken,
|
currentUser,
|
||||||
handleSignInWithPhoneNumber,
|
handleSignInWithPhoneNumber,
|
||||||
handleSignOut,
|
handleSignOut,
|
||||||
onAuthStateChanged,
|
onAuthStateChanged,
|
||||||
@ -8,7 +8,7 @@ import {
|
|||||||
|
|
||||||
export {
|
export {
|
||||||
confirmCode,
|
confirmCode,
|
||||||
getCurrentUserToken,
|
currentUser,
|
||||||
handleSignInWithPhoneNumber,
|
handleSignInWithPhoneNumber,
|
||||||
handleSignOut,
|
handleSignOut,
|
||||||
onAuthStateChanged,
|
onAuthStateChanged,
|
||||||
|
@ -1,8 +1,7 @@
|
|||||||
import { DEV_USER_ID } from "@env";
|
import { DEV_USER_ID } from "@env";
|
||||||
import AsyncStorage from "@react-native-async-storage/async-storage";
|
|
||||||
import { FirebaseAuthTypes } from "@react-native-firebase/auth";
|
import { FirebaseAuthTypes } from "@react-native-firebase/auth";
|
||||||
import React, { createContext, useContext, useEffect, useState } from "react";
|
import React, { createContext, useContext, useEffect, useState } from "react";
|
||||||
import { handleSignOut, onAuthStateChanged } from "../auth/firebase-auth";
|
import { currentUser, handleSignOut, onAuthStateChanged } from "../auth";
|
||||||
import { useAuthHeader } from "../graphql/client";
|
import { useAuthHeader } from "../graphql/client";
|
||||||
|
|
||||||
interface AuthContextType {
|
interface AuthContextType {
|
||||||
@ -19,25 +18,44 @@ export const AuthProvider: React.FC<{ children: React.ReactNode }> = ({
|
|||||||
}) => {
|
}) => {
|
||||||
const { setAuthHeader } = useAuthHeader();
|
const { setAuthHeader } = useAuthHeader();
|
||||||
|
|
||||||
const [user, setUser] = useState<FirebaseAuthTypes.User | null>(null);
|
const [contextUser, setContextUser] = useState<FirebaseAuthTypes.User | null>(
|
||||||
|
null,
|
||||||
|
);
|
||||||
const [isLoggedIn, setIsLoggedIn] = useState<boolean>(false);
|
const [isLoggedIn, setIsLoggedIn] = useState<boolean>(false);
|
||||||
const [isLoading, setIsLoading] = useState<boolean>(true); // this is for a LoadingContext (auth, app reloads, foreground etc)
|
const [isLoading, setIsLoading] = useState<boolean>(true); // this is for a LoadingContext (auth, app reloads, foreground etc)
|
||||||
|
|
||||||
const authStateChangeCallback = async (user) => {
|
const _completeAuthentication = (
|
||||||
console.log("user:", user);
|
user: FirebaseAuthTypes.User,
|
||||||
|
token: string,
|
||||||
|
isLoggedIn: boolean,
|
||||||
|
) => {
|
||||||
|
setAuthHeader({ key: "Authorization", value: token });
|
||||||
|
setContextUser(user);
|
||||||
|
setIsLoggedIn(isLoggedIn);
|
||||||
|
setIsLoading(false);
|
||||||
|
};
|
||||||
|
|
||||||
|
const authStateChangeCallback = async (user: FirebaseAuthTypes.User) => {
|
||||||
if (user) {
|
if (user) {
|
||||||
const token = await user.getIdToken();
|
const token = await user.getIdToken();
|
||||||
if (token) {
|
_completeAuthentication(user, token, true);
|
||||||
await AsyncStorage.setItem("token", token);
|
|
||||||
setAuthHeader({ key: "Authorization", value: token });
|
|
||||||
setUser(user);
|
|
||||||
setIsLoggedIn(true);
|
|
||||||
setIsLoading(false)
|
|
||||||
}
|
|
||||||
} else {
|
} else {
|
||||||
setIsLoggedIn(false);
|
_completeAuthentication(undefined, undefined, false);
|
||||||
}
|
}
|
||||||
}
|
};
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
let unsubscribe = () => {
|
||||||
|
console.log("Dev mode unsubscribe - really dense fn");
|
||||||
|
};
|
||||||
|
|
||||||
|
if (!DEV_USER_ID) {
|
||||||
|
unsubscribe = onAuthStateChanged(authStateChangeCallback);
|
||||||
|
}
|
||||||
|
|
||||||
|
return unsubscribe;
|
||||||
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||||
|
}, []);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const setAuthAsync = async () => {
|
const setAuthAsync = async () => {
|
||||||
@ -47,27 +65,19 @@ export const AuthProvider: React.FC<{ children: React.ReactNode }> = ({
|
|||||||
setAuthHeader({ key: "user_id", value: DEV_USER_ID });
|
setAuthHeader({ key: "user_id", value: DEV_USER_ID });
|
||||||
setIsLoggedIn(true);
|
setIsLoggedIn(true);
|
||||||
setIsLoading(false);
|
setIsLoading(false);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
setAuthAsync();
|
setAuthAsync();
|
||||||
}, [setAuthHeader]);
|
}, [setAuthHeader]);
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
let unsubscribe: () => void = () => console.log('Dev mode unsubscribe - really dense fn')
|
|
||||||
if (!DEV_USER_ID) {
|
|
||||||
unsubscribe = onAuthStateChanged(authStateChangeCallback);
|
|
||||||
}
|
|
||||||
return unsubscribe;
|
|
||||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
||||||
}, [])
|
|
||||||
|
|
||||||
const logOut = async () => {
|
const logOut = async () => {
|
||||||
await AsyncStorage.removeItem("token");
|
|
||||||
await handleSignOut();
|
await handleSignOut();
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<AuthContext.Provider value={{ isLoggedIn, isLoading, user, logOut }}>
|
<AuthContext.Provider
|
||||||
|
value={{ isLoggedIn, isLoading, user: contextUser, logOut }}
|
||||||
|
>
|
||||||
{children}
|
{children}
|
||||||
</AuthContext.Provider>
|
</AuthContext.Provider>
|
||||||
);
|
);
|
||||||
|
@ -1,36 +1,39 @@
|
|||||||
import React, { createContext, useEffect, useState } from 'react';
|
import React, { createContext, useEffect, useState } from "react";
|
||||||
import { ActivityIndicator, StyleSheet, View } from 'react-native';
|
import { ActivityIndicator, StyleSheet, View } from "react-native";
|
||||||
|
|
||||||
import { colors } from '../../styles';
|
import AsyncStorage from "@react-native-async-storage/async-storage";
|
||||||
import AsyncStorage from '@react-native-async-storage/async-storage';
|
import { colors } from "../../styles";
|
||||||
|
|
||||||
const LoadingContext = createContext<boolean>(false);
|
const LoadingContext = createContext<boolean>(false);
|
||||||
|
|
||||||
export default function Loading({ children }) {
|
export default function Loading({ children }) {
|
||||||
const [loading, setLoading] = useState(true);
|
const [loading, setLoading] = useState(true);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const checkHasToken = async () => {
|
const checkHasToken = async () => {
|
||||||
const hasToken = await AsyncStorage.getItem('token');
|
const hasToken = await AsyncStorage.getItem("token");
|
||||||
// needs to connect to app state
|
// needs to connect to app state
|
||||||
return hasToken
|
return hasToken;
|
||||||
}
|
};
|
||||||
|
|
||||||
checkHasToken()
|
checkHasToken().then(() => setLoading(false));
|
||||||
.then(() => setLoading(false))
|
}, []);
|
||||||
}, []);
|
|
||||||
|
|
||||||
if (!loading) {
|
if (!loading) {
|
||||||
return <LoadingContext.Provider value={loading}>{children}</LoadingContext.Provider>;
|
return (
|
||||||
}
|
<LoadingContext.Provider value={loading}>
|
||||||
|
{children}
|
||||||
|
</LoadingContext.Provider>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<View style={s.container}>
|
<View style={s.container}>
|
||||||
<ActivityIndicator size="large" color={colors.tournamentBlue} />
|
<ActivityIndicator size="large" color={colors.tournamentBlue} />
|
||||||
</View>
|
</View>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
const s = StyleSheet.create({
|
const s = StyleSheet.create({
|
||||||
container: { flex: 1, justifyContent: 'center', alignItems: 'center' }
|
container: { flex: 1, justifyContent: "center", alignItems: "center" },
|
||||||
});
|
});
|
||||||
|
Loading…
Reference in New Issue
Block a user