Problem to access main Page from LoginForm

Hi everyone,

I am a newbie and currently on Reddit Project which I have issue as the title mentioned. Here is my code:

import { useState } from ‘react’;
import { Link } from ‘react-router-dom’;

export const Login = () => {
const [details, setDetails] = useState({user:“”, password:“”});
const [login, setLogin] = useState(false);

    const access = {
            userOri: "admin",
            passwordOri: "admin"

    function handleSubmit(e) {
            if(details.user == access.userOri && details.password == access.passwordOri) {
                    return setLogin = true;

    const loginForm = 
                    <form id="login-form" onSubmit={handleSubmit}>
                            <div className="login-item">
                                    <input type="text" value={details.user} placeholder="user" onChange={e=>setDetails({...details, user:})}/>
                            <div className="login-item">
                                    <input type="password" value={details.password} placeholder="password" onChange={e=>setDetails({...details, password:})}/>
                                    <button type="submit">Submit</button>

return (

{login? : loginForm }

You could as well visit my github Reddit-Project/src/components/login/Login.js at main · BiruSkai/Reddit-Project · GitHub .
I am working on folder and file Login, Main, App.js
I would appreciate the assistance.


Instead of `return setLogin = true’, you should do what you did with setDetails:


No return necessary.

Moreover, since the username and password’s data is only important at the moment of submission, you don’t need to store their information in state. You can unwrap them from the event created by their submission, compare them to the correct credentials, and allow access that way. There’s less overhead, and you’re not doing anything with them while they’re being held in state anyways.