add: authentication WIP

This commit is contained in:
Elie Baier 2023-12-18 10:01:22 +01:00
parent 2eaccd52e4
commit c48f1e23a3
5 changed files with 52 additions and 48 deletions

View File

@ -1,17 +1,19 @@
import prisma from '@/lib/prisma'; import prisma from '@/lib/prisma';
import ActiveCard from './ActiveCard'; import ActiveCard from './ActiveCard';
import { getAuthServerSession } from '@/lib/authenticate'; import { getAuthServerSession } from '@/lib/authenticate';
import { red } from 'next/dist/lib/picocolors';
import { redirect } from 'next/navigation';
export default async function Dashboard() { export default async function Dashboard() {
const authSession = await getAuthServerSession();
console.log(authSession);
if (!authSession || !authSession.user.isTeacher) return redirect('/');
const tests = await prisma.test.findMany({ select: { isActive: true, isPassed: true, id: true, testOf: { select: { id: true, firstName: true, lastName: true, isTeacher: true } } } }); const tests = await prisma.test.findMany({ select: { isActive: true, isPassed: true, id: true, testOf: { select: { id: true, firstName: true, lastName: true, isTeacher: true } } } });
const activeTests = tests.filter((test) => test.isActive); const activeTests = tests.filter((test) => test.isActive);
const passedTests = tests.filter((test) => test.isPassed); const passedTests = tests.filter((test) => test.isPassed);
const authSession = await getAuthServerSession();
console.log(authSession);
return ( return (
<div> <div>
<h1>Dashboard</h1> <h1>Dashboard</h1>

View File

@ -5,9 +5,9 @@ import { useRouter } from 'next/navigation';
import { useState, useEffect } from 'react'; import { useState, useEffect } from 'react';
import useSWR from 'swr'; import useSWR from 'swr';
import { fetcher } from '@/lib/fetcher'; import { fetcher } from '@/lib/fetcher';
import Image from "next/image"; import Image from 'next/image';
import Logo from "/images/logo.svg"; import Logo from '/images/logo.svg';
import LogOut from "@images/logout.svg"; import LogOut from '@images/logout.svg';
export default function Play() { export default function Play() {
const router = useRouter(); const router = useRouter();
@ -15,17 +15,17 @@ export default function Play() {
const { data, error, isLoading } = useSWR('/api/test?key=' + password, fetcher); const { data, error, isLoading } = useSWR('/api/test?key=' + password, fetcher);
useEffect(() => { // useEffect(() => {
const pass = localStorage.getItem('@password'); // const pass = localStorage.getItem('@password');
setPassword(pass); // setPassword(pass);
if (!pass) { // if (!pass) {
router.push('/'); // router.push('/');
} // }
}, [router]); // }, [router]);
return ( return (
<div className={"w-full h-[100vh] text-[#F0F0F0] bg-black p-12 flex flex-col items-center justify-center gap-y-28"}> <div className={'w-full h-[100vh] text-[#F0F0F0] bg-black p-12 flex flex-col items-center justify-center gap-y-28'}>
<Image src={Logo} alt={"Logo"} width={100} height={200} className={"mx-auto w-full md:w-[400px]"}/> <Image src={Logo} alt={'Logo'} width={100} height={200} className={'mx-auto w-full md:w-[400px]'} />
<TestCard data={data} error={error} isLoading={isLoading} /> <TestCard data={data} error={error} isLoading={isLoading} />
{data && data.status == 200 && password && <GradingForm password={password} data={data} />} {data && data.status == 200 && password && <GradingForm password={password} data={data} />}
<div> <div>
@ -35,7 +35,7 @@ export default function Play() {
router.push('/'); router.push('/');
}} }}
> >
<Image src={LogOut} alt={"Logo"} width={50} height={50} className={"mx-auto w-full md:w-[400px]"}/> <Image src={LogOut} alt={'Logo'} width={50} height={50} className={'mx-auto w-full md:w-[400px]'} />
</button> </button>
</div> </div>
</div> </div>

View File

@ -1,49 +1,49 @@
'use client'; 'use client';
import Calendar from "../../images/date.svg"; import Calendar from '../../images/date.svg';
import Image from "next/image"; import Image from 'next/image';
import { Ban, Snowflake, CircleOff } from "lucide-react"; import { Ban, Snowflake, CircleOff } from 'lucide-react';
export function TestCard({ data, error, isLoading }: { data: any; error: any; isLoading: boolean }) { export function TestCard({ data, error, isLoading }: { data: any; error: any; isLoading: boolean }) {
console.log(data); //console.log(data);
if (isLoading) if (isLoading)
return ( return (
<div className={"w-fit h-fit relative"}> <div className={'w-fit h-fit relative'}>
<Image src={Calendar} alt={"Calendrier absolute"} /> <Image src={Calendar} alt={'Calendrier absolute'} />
<div className={"w-full h-full absolute top-0 left-0 p-4 flex flex-col place-content-end text-center"}> <div className={'w-full h-full absolute top-0 left-0 p-4 flex flex-col place-content-end text-center'}>
<Snowflake width={36} height={36} color={"#000000"} className={"animate-spin place-self-center"} /> <Snowflake width={36} height={36} color={'#000000'} className={'animate-spin place-self-center'} />
<span className={"text-black text-xs"}>Chargement</span> <span className={'text-black text-xs'}>Chargement</span>
</div> </div>
</div> </div>
); );
if (error) if (error)
return ( return (
<div className={"w-fit h-fit relative"}> <div className={'w-fit h-fit relative'}>
<Image src={Calendar} alt={"Calendrier absolute"} /> <Image src={Calendar} alt={'Calendrier absolute'} />
<div className={"w-full h-full absolute top-0 left-0 p-4 flex flex-col place-content-end text-center"}> <div className={'w-full h-full absolute top-0 left-0 p-4 flex flex-col place-content-end text-center'}>
<Ban width={36} height={36} color={"#000000"} className={"place-self-center"}/> <Ban width={36} height={36} color={'#000000'} className={'place-self-center'} />
<span className={"text-black text-xs"}>Erreur</span> <span className={'text-black text-xs'}>Erreur</span>
</div> </div>
</div> </div>
); );
if (data.status == 404) if (data.status == 404)
return ( return (
<div className={"w-fit h-fit relative"}> <div className={'w-fit h-fit relative'}>
<Image src={Calendar} alt={"Calendrier absolute"} /> <Image src={Calendar} alt={'Calendrier absolute'} />
<div className={"w-full h-full absolute top-0 left-0 p-4 flex flex-col place-content-end text-center"}> <div className={'w-full h-full absolute top-0 left-0 p-4 flex flex-col place-content-end text-center'}>
<CircleOff width={36} height={36} color={"#000000"} className={"place-self-center"}/> <CircleOff width={36} height={36} color={'#000000'} className={'place-self-center'} />
<span className={"text-black text-xs"}>Pas de test</span> <span className={'text-black text-xs'}>Pas de test</span>
</div> </div>
</div> </div>
); );
return ( return (
<div className={"w-fit h-fit relative"}> <div className={'w-fit h-fit relative'}>
<Image src={Calendar} alt={"Calendrier absolute"} /> <Image src={Calendar} alt={'Calendrier absolute'} />
<div className={"w-full h-full absolute top-0 left-0 p-4 flex flex-col place-content-end text-center"}> <div className={'w-full h-full absolute top-0 left-0 p-4 flex flex-col place-content-end text-center'}>
<span className={"text-black text-[36px] font-medium"}>{new Date().getDate()}</span> <span className={'text-black text-[36px] font-medium'}>{new Date().getDate()}</span>
<span className={"text-black text-xs"}>{data.testOf.firstName}</span> <span className={'text-black text-xs'}>{data.testOf.firstName}</span>
</div> </div>
</div> </div>
); );

View File

@ -30,7 +30,7 @@ export const authOptions: NextAuthOptions = {
callbacks: { callbacks: {
async jwt({ token, user }) { async jwt({ token, user }) {
if (user) { if (user) {
token.userId = user.id; token.userId = parseInt(user.id as string);
token.firstName = user.firstName; token.firstName = user.firstName;
token.lastName = user.lastName; token.lastName = user.lastName;
token.isTeacher = user.isTeacher; token.isTeacher = user.isTeacher;
@ -38,10 +38,12 @@ export const authOptions: NextAuthOptions = {
return token; return token;
}, },
async session({ session, token, user }) { async session({ session, token, user }) {
if(token) {
session.user.id = token.userId; session.user.id = token.userId;
session.user.firstName = token.firstName; session.user.firstName = token.firstName;
session.user.lastName = token.lastName; session.user.lastName = token.lastName;
session.user.isTeacher = token.isTeacher; session.user.isTeacher = token.isTeacher;
}
return session; return session;
}, },
}, },

View File

@ -2,13 +2,13 @@ import NextAuth, { DefaultSession, DefaultJWT, DefaultUser } from "next-auth";
import { JWT } from "next-auth/jwt"; import { JWT } from "next-auth/jwt";
declare module "next-auth" { declare module "next-auth" {
interface Session extends Omit<DefaultSession, 'user'> { interface Session {
user: { user: {
id: number; id: number;
firstName: string; firstName: string;
lastName: string lastName: string
isTeacher: boolean; isTeacher: boolean;
}; } & DefaultSession["user"];
} }
interface User { interface User {
id: number; id: number;