Updated login page

This commit is contained in:
MarcUs7i 2025-04-28 14:10:40 +02:00
parent bb0405b3f2
commit 4071153754

View file

@ -2,29 +2,32 @@ import React, { useState } from 'react';
import { useNavigate } from 'react-router-dom';
import { Brain } from 'lucide-react';
import { CodeInput } from '../components/CodeInput';
import { Button } from '../components/Button';
import { login, adminLogin } from '../lib/api';
import { useAuthStore } from '../store/auth';
export const Login: React.FC = () => {
const [error, setError] = useState<string | null>(null);
const [isAdmin, setIsAdmin] = useState(false);
const navigate = useNavigate();
const setToken = useAuthStore(state => state.setToken);
const handleLogin = async (code: string) => {
try {
setError(null);
const response = isAdmin
? await adminLogin(code)
: await login(code);
const response = await login(code); // user login
console.info(response);
if (response.success) {
setToken(response.accessToken, isAdmin);
navigate(isAdmin ? '/admin' : '/dashboard');
setToken(response.accessToken, false);
navigate('/dashboard');
} else {
const adminResponse = await adminLogin(code); // admin login
if (adminResponse.success) {
setToken(adminResponse.accessToken, true);
navigate('/admin');
} else {
setError(response.errorMessage || 'Login failed');
}
}
} catch (err) {
setError('An error occurred. Please try again.');
}
@ -32,14 +35,14 @@ export const Login: React.FC = () => {
return (
<div className="min-h-screen bg-gray-900 flex flex-col items-center justify-center p-4">
<div className="w-full max-w-md">
<div className="w-full max-w-md bg-gray-800 rounded-lg p-8 shadow-xl">
<div className="text-center mb-8">
<Brain className="w-16 h-16 text-blue-500 mx-auto mb-4" />
<h1 className="text-4xl font-bold text-white mb-2">QuizConnect</h1>
<p className="text-gray-400">Enter your {isAdmin ? 'admin' : 'user'} code to continue</p>
<p className="text-gray-400">Enter your user code to continue</p>
</div>
<div className="bg-gray-800 rounded-lg p-8 shadow-xl">
<div className="flex flex-col items-center">
<div className="flex justify-center mb-8">
<CodeInput onComplete={handleLogin} />
</div>
@ -49,16 +52,6 @@ export const Login: React.FC = () => {
{error}
</div>
)}
<div className="flex justify-center">
<Button
variant="secondary"
onClick={() => setIsAdmin(!isAdmin)}
className="mt-4"
>
Switch to {isAdmin ? 'User' : 'Admin'} Login
</Button>
</div>
</div>
</div>
</div>