AaronPo/the-biergarten-app
1
0
Fork 0
mirror of https://github.com/aaronpo97/the-biergarten-app.git synced 2026-02-16 18:52:06 +00:00
Code Issues Packages Projects 1 Releases Wiki Activity

Fix login glitch where user session wouldn't load properly into context

Browse Source
This commit is contained in:
Aaron William Po
2023-04-08 02:46:42 -04:00
parent 80bed9b4dc
commit cbc5671b0e
6 changed files with 20 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
components/Login/LoginForm.tsx
View File

@@ -2,9 +2,10 @@ import sendLoginUserRequest from '@/requests/sendLoginUserRequest';
import LoginValidationSchema from '@/services/User/schema/LoginValidationSchema'; import LoginValidationSchema from '@/services/User/schema/LoginValidationSchema';
import { zodResolver } from '@hookform/resolvers/zod'; import { zodResolver } from '@hookform/resolvers/zod';
import { useRouter } from 'next/router'; import { useRouter } from 'next/router';
import { useState } from 'react'; import { useContext, useState } from 'react';
import { useForm, SubmitHandler } from 'react-hook-form'; import { useForm, SubmitHandler } from 'react-hook-form';
import { z } from 'zod'; import { z } from 'zod';
import UserContext from '@/contexts/userContext';
import ErrorAlert from '../ui/alerts/ErrorAlert'; import ErrorAlert from '../ui/alerts/ErrorAlert';
import FormError from '../ui/forms/FormError'; import FormError from '../ui/forms/FormError';
import FormInfo from '../ui/forms/FormInfo'; import FormInfo from '../ui/forms/FormInfo';
@@ -28,10 +29,13 @@ const LoginForm = () => {
const [responseError, setResponseError] = useState<string>(''); const [responseError, setResponseError] = useState<string>('');
const { mutate } = useContext(UserContext);
const onSubmit: SubmitHandler<LoginT> = async (data) => { const onSubmit: SubmitHandler<LoginT> = async (data) => {
try { try {
await sendLoginUserRequest(data); await sendLoginUserRequest(data);
router.push(`/user/current`); await mutate!();
await router.push(`/user/current`);
} catch (error) { } catch (error) {
if (error instanceof Error) { if (error instanceof Error) {
setResponseError(error.message); setResponseError(error.message);

2
contexts/userContext.ts
View File

@@ -1,11 +1,13 @@
import GetUserSchema from '@/services/User/schema/GetUserSchema'; import GetUserSchema from '@/services/User/schema/GetUserSchema';
import { createContext } from 'react'; import { createContext } from 'react';
import { KeyedMutator } from 'swr';
import { z } from 'zod'; import { z } from 'zod';
const UserContext = createContext<{ const UserContext = createContext<{
user?: z.infer<typeof GetUserSchema>; user?: z.infer<typeof GetUserSchema>;
error?: unknown; error?: unknown;
isLoading: boolean; isLoading: boolean;
mutate?: KeyedMutator<z.infer<typeof GetUserSchema>>;
}>({ isLoading: true }); }>({ isLoading: true });
export default UserContext; export default UserContext;

3
hooks/useUser.ts
View File

@@ -16,6 +16,7 @@ const useUser = () => {
data: user, data: user,
error, error,
isLoading, isLoading,
mutate,
} = useSWR('/api/users/current', async (url) => { } = useSWR('/api/users/current', async (url) => {
if (!document.cookie.includes('token')) { if (!document.cookie.includes('token')) {
throw new Error('No token cookie found'); throw new Error('No token cookie found');
@@ -43,7 +44,7 @@ const useUser = () => {
return parsedPayload.data; return parsedPayload.data;
}); });
return { user, isLoading, error: error as unknown }; return { user, isLoading, error: error as unknown, mutate };
}; };
export default useUser; export default useUser;

12
package-lock.json generated
View File

@@ -9963,9 +9963,9 @@
} }
}, },
"node_modules/vm2": { "node_modules/vm2": {
"version": "3.9.14", "version": "3.9.15",
"resolved": "https://registry.npmjs.org/vm2/-/vm2-3.9.14.tgz", "resolved": "https://registry.npmjs.org/vm2/-/vm2-3.9.15.tgz",
"integrity": "sha512-HgvPHYHeQy8+QhzlFryvSteA4uQLBCOub02mgqdR+0bN/akRZ48TGB1v0aCv7ksyc0HXx16AZtMHKS38alc6TA==", "integrity": "sha512-XqNqknHGw2avJo13gbIwLNZUumvrSHc9mLqoadFZTpo3KaNEJoe1I0lqTFhRXmXD7WkLyG01aaraXdXT0pa4ag==",
"optional": true, "optional": true,
"dependencies": { "dependencies": {
"acorn": "^8.7.0", "acorn": "^8.7.0",
@@ -17122,9 +17122,9 @@
} }
}, },
"vm2": { "vm2": {
"version": "3.9.14", "version": "3.9.15",
"resolved": "https://registry.npmjs.org/vm2/-/vm2-3.9.14.tgz", "resolved": "https://registry.npmjs.org/vm2/-/vm2-3.9.15.tgz",
"integrity": "sha512-HgvPHYHeQy8+QhzlFryvSteA4uQLBCOub02mgqdR+0bN/akRZ48TGB1v0aCv7ksyc0HXx16AZtMHKS38alc6TA==", "integrity": "sha512-XqNqknHGw2avJo13gbIwLNZUumvrSHc9mLqoadFZTpo3KaNEJoe1I0lqTFhRXmXD7WkLyG01aaraXdXT0pa4ag==",
"optional": true, "optional": true,
"requires": { "requires": {
"acorn": "^8.7.0", "acorn": "^8.7.0",

4
pages/_app.tsx
View File

@@ -10,7 +10,7 @@ const spaceGrotesk = Space_Grotesk({
}); });
export default function App({ Component, pageProps }: AppProps) { export default function App({ Component, pageProps }: AppProps) {
const { user, isLoading, error } = useUser(); const { user, isLoading, error, mutate } = useUser();
return ( return (
<> <>
@@ -21,7 +21,7 @@ export default function App({ Component, pageProps }: AppProps) {
} }
`} `}
</style> </style>
<UserContext.Provider value={{ user, isLoading, error }}> <UserContext.Provider value={{ user, isLoading, error, mutate }}>
<Component {...pageProps} /> <Component {...pageProps} />
</UserContext.Provider> </UserContext.Provider>
</> </>

4
pages/user/current.tsx
View File

@@ -11,9 +11,9 @@ const ProtectedPage: NextPage = () => {
const currentTime = new Date().getHours(); const currentTime = new Date().getHours();
const isMorning = currentTime > 5 && currentTime < 12; const isMorning = currentTime > 4 && currentTime < 12;
const isAfternoon = currentTime > 12 && currentTime < 18; const isAfternoon = currentTime > 12 && currentTime < 18;
const isEvening = currentTime > 18 && currentTime < 24; const isEvening = currentTime > 18 && currentTime < 24 || currentTime <4
return ( return (
<Layout> <Layout>