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

Merge pull request #18 from aaronpo97/style-updates-and-login-fix

Browse Source 
Style updates and login fix
This commit is contained in:
Aaron Po
2023-04-08 02:48:44 -04:00
committed by GitHub
parent d2821eeec0 cbc5671b0e
commit 06f496ecd2
12 changed files with 37 additions and 31 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 { zodResolver } from '@hookform/resolvers/zod';
import { useRouter } from 'next/router';
import { useState } from 'react';
import { useContext, useState } from 'react';
import { useForm, SubmitHandler } from 'react-hook-form';
import { z } from 'zod';
import UserContext from '@/contexts/userContext';
import ErrorAlert from '../ui/alerts/ErrorAlert';
import FormError from '../ui/forms/FormError';
import FormInfo from '../ui/forms/FormInfo';
@@ -28,10 +29,13 @@ const LoginForm = () => {
const [responseError, setResponseError] = useState<string>('');
const { mutate } = useContext(UserContext);
const onSubmit: SubmitHandler<LoginT> = async (data) => {
try {
await sendLoginUserRequest(data);
router.push(`/user/current`);
await mutate!();
await router.push(`/user/current`);
} catch (error) {
if (error instanceof Error) {
setResponseError(error.message);

6
components/ui/Layout.tsx
View File

@@ -4,10 +4,10 @@ import Navbar from './Navbar';
const Layout: FC<{ children: ReactNode }> = ({ children }) => {
return (
<div className="flex h-screen flex-col">
<header className="sticky top-0 z-50">
<Navbar />
</header>
<div className="relative top-0 h-full flex-1">{children}</div>
<div className="top-0 h-full flex-1 overflow-x-auto animate-in fade-in">
{children}
</div>
</div>
);
};

8
components/ui/Navbar.tsx
View File

@@ -42,10 +42,10 @@ const Navbar = () => {
];
return (
<nav className="navbar bg-primary text-primary-content">
<nav className="navbar sticky top-0 z-50 bg-primary text-primary-content">
<div className="flex-1">
<Link className="btn-ghost btn text-3xl normal-case" href="/">
<span className="cursor-pointer text-xl font-bold">The Biergarten App</span>
<Link className="btn-ghost btn normal-case" href="/">
<span className="cursor-pointer text-lg font-bold">The Biergarten App</span>
</Link>
</div>
<div className="hidden flex-none lg:block">
@@ -68,7 +68,7 @@ const Navbar = () => {
</ul>
</div>
<div className="flex-none lg:hidden">
<div className="dropdown dropdown-end">
<div className="dropdown-end dropdown">
<label tabIndex={0} className="btn-ghost btn-circle btn">
<span className="w-10 rounded-full">
<svg

2
contexts/userContext.ts
View File

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

3
hooks/useUser.ts
View File

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

12
package-lock.json generated
View File

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

11
pages/_app.tsx
View File

@@ -3,26 +3,25 @@ import useUser from '@/hooks/useUser';
import '@/styles/globals.css';
import type { AppProps } from 'next/app';
import { Roboto } from 'next/font/google';
import { Space_Grotesk } from 'next/font/google';
const roboto = Roboto({
weight: ['100', '300', '400', '500', '700', '900'],
const spaceGrotesk = Space_Grotesk({
subsets: ['latin'],
});
export default function App({ Component, pageProps }: AppProps) {
const { user, isLoading, error } = useUser();
const { user, isLoading, error, mutate } = useUser();
return (
<>
<style jsx global>
{`
html {
font-family: ${roboto.style.fontFamily};
font-family: ${spaceGrotesk.style.fontFamily};
}
`}
</style>
<UserContext.Provider value={{ user, isLoading, error }}>
<UserContext.Provider value={{ user, isLoading, error, mutate }}>
<Component {...pageProps} />
</UserContext.Provider>
</>

6
pages/login/index.tsx
View File

@@ -19,16 +19,16 @@ const LoginPage: NextPage = () => {
</Head>
<div className="flex h-full flex-row">
<div className="hidden h-full flex-col items-center justify-center bg-base-100 lg:flex lg:w-[60%]">
<div className="hidden h-full flex-col items-center justify-center bg-base-100 lg:flex lg:w-[55%]">
<Image
src="https://picsum.photos/1040/1080"
src="https://picsum.photos/5000/5000"
alt="Login Image"
width={4920}
height={4080}
className="h-full w-full object-cover"
/>
</div>
<div className="flex h-full w-full flex-col items-center justify-center bg-base-300 lg:w-[40%]">
<div className="flex h-full w-full flex-col items-center justify-center bg-base-300 lg:w-[45%]">
<div className="w-10/12 space-y-5 sm:w-9/12">
<div className=" flex flex-col items-center space-y-2">
<FaUserCircle className="text-3xl" />

4
pages/user/current.tsx
View File

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

2
prisma/DBClient.ts
View File

@@ -1,5 +1,5 @@
import { NODE_ENV } from '@/config/env';
import { PrismaClient } from '@prisma/client';
import { NODE_ENV } from '../config/env';
const globalForPrisma = global as unknown as { prisma: PrismaClient };

2
prisma/seed/create/createNewBeerImages.ts
View File

@@ -23,7 +23,7 @@ const createNewBeerImages = async ({
beerImagesPromises.push(
prisma.beerImage.create({
data: {
path: 'https://picsum.photos/1040/1080',
path: 'https://picsum.photos/5000/5000',
alt: 'Placeholder beer image.',
caption: 'Placeholder beer image caption.',
beerPost: { connect: { id: beerPost.id } },

2
prisma/seed/create/createNewBreweryImages.ts
View File

@@ -27,7 +27,7 @@ const createNewBreweryImages = async ({
breweryImagesPromises.push(
prisma.breweryImage.create({
data: {
path: 'https://picsum.photos/1040/1080',
path: 'https://picsum.photos/5000/5000',
alt: 'Placeholder brewery image.',
caption: 'Placeholder brewery image caption.',
breweryPost: { connect: { id: breweryPost.id } },