From 94fcbee80875c75fb3c3f42282b2023acdb80bfa Mon Sep 17 00:00:00 2001 From: Aditya Pawar Date: Sat, 7 Oct 2023 11:34:42 -0700 Subject: [PATCH] Add AuthContext --- src/app/_layout.tsx | 13 ++++--- src/utils/AuthContext.tsx | 75 +++++++++++++++++++++++++++++++++++++++ 2 files changed, 83 insertions(+), 5 deletions(-) create mode 100644 src/utils/AuthContext.tsx diff --git a/src/app/_layout.tsx b/src/app/_layout.tsx index 9f24129b..a96faef8 100644 --- a/src/app/_layout.tsx +++ b/src/app/_layout.tsx @@ -1,12 +1,15 @@ import { Stack } from 'expo-router'; +import { AuthContextProvider } from '../utils/AuthContext'; function StackLayout() { return ( - - - - - + + + + + + + ); } diff --git a/src/utils/AuthContext.tsx b/src/utils/AuthContext.tsx new file mode 100644 index 00000000..af6decdd --- /dev/null +++ b/src/utils/AuthContext.tsx @@ -0,0 +1,75 @@ +import { Session } from '@supabase/supabase-js'; +import React, { createContext, useContext, useEffect, useReducer } from 'react'; +import supabase from './supabase'; + +export interface AuthState { + session: Session | null; +} +enum AuthActionType { + SIGN_IN, + SIGN_OUT, +} +type AuthContextAction = + | { type: AuthActionType.SIGN_IN; session: Session } + | { type: AuthActionType.SIGN_OUT }; + +const AuthContext = createContext({} as AuthState); +export const useAuthContext = () => useContext(AuthContext); + +const useAuthReducer = () => + useReducer( + (prevState: AuthState, action: AuthContextAction) => { + switch (action.type) { + case AuthActionType.SIGN_IN: + return { + session: action.session, + }; + case AuthActionType.SIGN_OUT: + return { + session: null, + }; + default: + return prevState; + } + }, + { session: null }, + ); + +export function useSession() { + const value = React.useContext(AuthContext); + if (process.env.NODE_ENV !== 'production') { + if (!value) { + throw new Error('useSession must be wrapped in a '); + } + } + + return value; +} + +export function AuthContextProvider({ + children, +}: { + children: React.ReactNode; +}) { + const [authState, dispatch] = useAuthReducer(); + + useEffect(() => { + supabase.auth.getSession().then(({ data: { session: newSession } }) => { + if (newSession) { + dispatch({ type: AuthActionType.SIGN_IN, session: newSession }); + } + }); + + supabase.auth.onAuthStateChange((_event, newSession) => { + if (newSession) { + dispatch({ type: AuthActionType.SIGN_IN, session: newSession }); + } + }); + }, []); + + return ( + + {children} + + ); +}