From cc19672c3f760c6b382261689cdf6b3cb2f85e2b Mon Sep 17 00:00:00 2001 From: Alvaro Ortiz <84427964+varortz@users.noreply.github.com> Date: Wed, 15 May 2024 15:52:37 -0700 Subject: [PATCH] [fix] fixes routing bugs (#83) * fix: corrects CONFIG.lca path * fix bug where login always redirects to onboarding * remove redundant auth check --------- Co-authored-by: jinkang-0 --- src/app/(auth)/login/page.tsx | 42 ++++++++++++----------- src/components/ProfileMatch/index.tsx | 4 +-- src/lib/configs.ts | 2 +- src/utils/AuthProvider.tsx | 10 +++--- src/utils/ProfileProvider.tsx | 49 +++++++++++++++++++-------- 5 files changed, 64 insertions(+), 43 deletions(-) diff --git a/src/app/(auth)/login/page.tsx b/src/app/(auth)/login/page.tsx index 1c88c373..ca6a30b7 100644 --- a/src/app/(auth)/login/page.tsx +++ b/src/app/(auth)/login/page.tsx @@ -15,26 +15,25 @@ import { ProfileContext } from '@/utils/ProfileProvider'; export default function Login() { const auth = useAuth(); const profile = useContext(ProfileContext); + if (!auth || !profile) { + throw new Error('Page must have auth and profile context defined'); + } + const [email, setEmail] = useState(''); const [password, setPassword] = useState(''); const [errorMessage, setErrorMessage] = useState(''); const [emailError, setEmailError] = useState(''); const [passwordError, setPasswordError] = useState(''); - const [finishLogin, setFinishLogin] = useState(false); + const [isLoggingIn, setIsLoggingIn] = useState(false); + const { push } = useRouter(); const validEmail = (e: string) => e !== '' && isEmail(e); useEffect(() => { - if (!auth) throw new Error('Auth must be defined'); - if (auth.userId && !finishLogin) push(CONFIG.settings); - }, [auth, profile, push]); + if (auth.userId && !isLoggingIn) push(CONFIG.settings); + }, [auth, profile, push, isLoggingIn]); const handleSignIn = async () => { - if (!auth) { - setErrorMessage(''); - return; - } - setEmailError(validEmail(email) ? '' : 'Invalid Email'); setPasswordError(password !== '' ? '' : 'Invalid Password'); if (!validEmail(email) || password === '') { @@ -42,26 +41,29 @@ export default function Login() { return; } - const { error } = await auth.signIn(email, password); + setIsLoggingIn(true); + const { error, data } = await auth.signIn(email, password); if (error) { setErrorMessage(error.message); // TODO: use error.status to check if it's an email-specific or password-specific error // then, raise the error in the TextInput component. } else { - profile?.loadProfile(); setErrorMessage(''); - setFinishLogin(true); + const loadedProfile = await profile.loadProfile(data.user?.id); - // conditional routing after logging in - if (profile?.profileReady) { - if (!profile?.profileData) push(CONFIG.onboardingHome); - else if (profile.roles.map(r => r.role).includes('ATTORNEY')) - push(CONFIG.cases); - else if (profile.roles.map(r => r.role).includes('LEGAL_FELLOW')) - push(CONFIG.lca); - else push(CONFIG.languageSupport); + if (!loadedProfile) { + push(CONFIG.onboardingHome); + return; } + + // conditional routing after logging in + if (!loadedProfile.profileData) push(CONFIG.onboardingHome); + else if (loadedProfile.roles.find(role => role.role === 'ATTORNEY')) + push(CONFIG.cases); + else if (loadedProfile.roles.find(role => role.role === 'LEGAL_FELLOW')) + push(CONFIG.lca); + else push(CONFIG.languageSupport); } }; diff --git a/src/components/ProfileMatch/index.tsx b/src/components/ProfileMatch/index.tsx index 8a85ca70..eae8fe07 100644 --- a/src/components/ProfileMatch/index.tsx +++ b/src/components/ProfileMatch/index.tsx @@ -152,12 +152,12 @@ export default function ProfileMatch({

No information available about languages

)} -

+

Go to{' '} Profile {' '} - to update any information. + to update any information

); diff --git a/src/lib/configs.ts b/src/lib/configs.ts index 28ff2580..ebcebedc 100644 --- a/src/lib/configs.ts +++ b/src/lib/configs.ts @@ -4,7 +4,7 @@ const CONFIG = { pageSize: 20, settings: '/settings', cases: '/cases', - lca: '/limited-case-assistance', + lca: '/limited-case-assignments', languageSupport: '/language-support', }; diff --git a/src/utils/AuthProvider.tsx b/src/utils/AuthProvider.tsx index 027af492..efe59866 100644 --- a/src/utils/AuthProvider.tsx +++ b/src/utils/AuthProvider.tsx @@ -50,12 +50,10 @@ export default function AuthProvider({ const setAll = useCallback((newSession: Session | null) => { if (!newSession) return; setSession(newSession); - if (newSession?.user?.id) { - const sessionUserId = newSession.user.id as UUID; - const sessionUserEmail = newSession.user.email; - setUserId(sessionUserId); - setUserEmail(sessionUserEmail); - } + const sessionUserId = (newSession.user.id as UUID) ?? undefined; + const sessionUserEmail = newSession.user.email ?? undefined; + setUserId(sessionUserId); + setUserEmail(sessionUserEmail); }, []); // on page load, check if there's a session and set it diff --git a/src/utils/ProfileProvider.tsx b/src/utils/ProfileProvider.tsx index 3e93a414..07a3c9ec 100644 --- a/src/utils/ProfileProvider.tsx +++ b/src/utils/ProfileProvider.tsx @@ -9,6 +9,7 @@ import { useMemo, useState, } from 'react'; +import { UUID } from 'crypto'; import { deleteLanguages, deleteRoles, @@ -30,6 +31,12 @@ import { } from '@/types/schema'; import { useAuth } from '@/utils/AuthProvider'; +interface LoadedProfileData { + profileData: Profile | null; + languages: ProfileLanguage[]; + roles: ProfileRole[]; +} + interface ProfileContextType { profileData: Profile | null; languages: ProfileLanguage[]; @@ -43,7 +50,7 @@ interface ProfileContextType { languages: ProfileLanguage[], roles: ProfileRole[], ) => Promise; - loadProfile: () => Promise; + loadProfile: (id?: string) => Promise; } export const ProfileContext = createContext( @@ -63,22 +70,36 @@ export default function ProfileProvider({ children }: { children: ReactNode }) { const [profileRoles, setProfileRoles] = useState([]); const { userId } = auth; - const loadProfile = useCallback(async () => { - setProfileReady(false); + const loadProfile = useCallback( + async (id?: string) => { + setProfileReady(false); - if (!userId) { - setProfileReady(true); - return; - } + if (!userId && !id) { + setProfileReady(true); + return null; + } - await Promise.all([ - fetchProfileById(userId).then(data => setProfileData(data)), - fetchLanguagesById(userId).then(data => setProfileLangs(data)), - fetchRolesById(userId).then(data => setProfileRoles(data)), - ]); + const fetchId = (id || userId) as UUID; - setProfileReady(true); - }, [userId]); + const [fetchedProfileData, languagesData, rolesData] = await Promise.all([ + fetchProfileById(fetchId), + fetchLanguagesById(fetchId), + fetchRolesById(fetchId), + ]); + + setProfileData(fetchedProfileData); + setProfileLangs(languagesData); + setProfileRoles(rolesData); + setProfileReady(true); + + return { + profileData: fetchedProfileData, + languages: languagesData, + roles: rolesData, + }; + }, + [userId], + ); useEffect(() => { loadProfile();