layout; routing; login

src/components/Login.tsx

@@ -1,8 +1,10 @@
 import {useState,useContext} from 'react';
 import { Link } from 'react-router-dom';
 import {UserCtx, UserCtxT} from '../context/UserContext';
+import './Login.css'
+
 const Login = () => {
-    const {loginUser, wait, getUser} = useContext<UserCtxT | null>(UserCtx) as UserCtxT;
+    const {loginUser, wait, getUser, user} = useContext<UserCtxT | null>(UserCtx) as UserCtxT;
     const [redirect, setRedirect] = useState("false");
     const [errMsg, setErrMsg] = useState("false");
     const [formData, setFormData] = useState({
@@ -31,27 +33,40 @@ const Login = () => {
         }
 
         const data = await loginUser(formData);
-        if(data.success){
+        if(data.success)
+        {
             setRedirect('Redirecting...');
+            setErrMsg(data.message);
             await getUser();
-            //e.currentTarget.reset();
+            e.currentTarget.reset();
             return;
         }
         setErrMsg(data.message);
     }
 
     return (
-        <div>
+        <div className='Login'>
             <h2>Login</h2>
-            <form onSubmit={submitForm}>
-                <label htmlFor="email">Email:</label>
-                <input type="email" name="email" onChange={onChangeInput} placeholder="Your email" id="email" value={formData.email} required />
-                <label htmlFor="password">Password:</label>
-                <input type="password" name="password" onChange={onChangeInput} placeholder="New password" id="password" value={formData.password} required />
+            { user &&
+            <>
+            <div>Logged in als:</div>
+            <div>{user?.email}</div>
+            <div className="bottom-link"><Link to="/">Home</Link></div> 
+            </> }
+
+            {!user &&<form onSubmit={submitForm}>
+                <div>
+                    <label htmlFor="email">Email:</label>
+                    <input type="email" name="email" onChange={onChangeInput} placeholder="Your email" id="email" value={formData.email} required />
+                </div>
+                <div>
+                    <label htmlFor="password">Password:</label>
+                    <input type="password" name="password" onChange={onChangeInput} placeholder="New password" id="password" value={formData.password} required />
+                </div>
                 {errMsg !== "false" && <div className="err-msg">{errMsg}</div>}
                 {redirect  !== "false" ? redirect : <button type="submit" disabled={wait}>Login</button>}
                 <div className="bottom-link"><Link to="/reg">Register</Link></div>
-            </form>
+            </form> }
         </div>
     )
 }