ADD:added decode jwt token and automated login to dashboard after login

frontend/src/pages/AuthContext.tsx

@@ -3,7 +3,7 @@ import React, { createContext, useContext, useState, useEffect } from 'react';
 interface AuthContextType {
   token: string | null;
   userId: string | null;
-  login: (token: string, userId: string) => void;
+  login: (token: string, userId: string, role: string) => void;
   logout: () => void;
 }
 
@@ -12,6 +12,7 @@ const AuthContext = createContext<AuthContextType | undefined>(undefined);
 export const AuthProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => {
   const [token, setToken] = useState<string | null>(null);
   const [userId, setUserId] = useState<string | null>(null);
+  const [role, setRole] = useState<string | null>(null);
 
   useEffect(() => {
     const storedToken = localStorage.getItem('token');
@@ -22,18 +23,22 @@ export const AuthProvider: React.FC<{ children: React.ReactNode }> = ({ children
     }
   }, []);
 
-  const login = (token: string, userId: string) => {
+  const login = (token: string, userId: string, role: string) => {
     setToken(token);
     setUserId(userId);
+    setRole(role);
     localStorage.setItem('token', token);
     localStorage.setItem('userId', userId);
+    localStorage.setItem('role', role);
   };
 
   const logout = () => {
     setToken(null);
     setUserId(null);
+    setRole(null);
     localStorage.removeItem('token');
     localStorage.removeItem('userId');
+    localStorage.removeItem('role');
   };
 
   return (
@@ -43,6 +48,15 @@ export const AuthProvider: React.FC<{ children: React.ReactNode }> = ({ children
   );
 };
 
+/**
+ * Custom React hook to access the authentication context.
+ *
+ * @returns {AuthContextType} The current authentication context value.
+ * @throws {Error} If used outside of an `AuthProvider`.
+ *
+ * @example
+ * const { user, login, logout } = useAuth();
+ */
 export function useAuth() {
   const context = useContext(AuthContext);
   if (!context) throw new Error('useAuth must be used within AuthProvider');

frontend/src/pages/LoginPage.tsx

@@ -1,22 +1,35 @@
 import { useState } from 'react';
 import { useAuth } from './AuthContext';
 import { login as apiLogin } from './api';
+import { jwtDecode } from 'jwt-decode';
+import { useNavigate } from 'react-router-dom';
 
 export default function LoginPage() {
   const { login } = useAuth();
   const [email, setEmail] = useState('');
   const [password, setPassword] = useState('');
   const [error, setError] = useState<string | null>(null);
+  const navigate = useNavigate(); // ← Navigation-Hook
+
 
   async function handleSubmit(e: React.FormEvent) {
     e.preventDefault();
     try {
       const data = await apiLogin(email, password);
-      console.log(data);
       // Token aus JWT extrahieren (hier: UserID im Token Payload)
       // Für Demo: Einfach Dummy UserID setzen, oder später JWT decode implementieren
-      login(data.token, 'user-id-from-token');
-    } catch {
+      type MyJwtPayload = {
+         userId: string 
+          email: string;
+          role: string;
+        } & object;
+      const decodedData = jwtDecode<MyJwtPayload>(data.token);
+      login(data.token, decodedData.userId, decodedData.role);
+      // Nach dem Login zur Dashboard-Seite navigieren
+      setTimeout(() => {
+          navigate('/');
+      }, 1000);   
+     } catch {
       setError('Login fehlgeschlagen');
     }
   }