feat: disable login/signup buttons when all inputs are not filled (#141)
This commit is contained in:
parent
f1bd83e657
commit
c554a337b6
|
@ -29,6 +29,9 @@ function Login() {
|
||||||
user.login(userData)
|
user.login(userData)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// disable submit button is any input has not been filled
|
||||||
|
const disabledSubmitBtn = Object.values(userData).some((val) => val === '')
|
||||||
|
|
||||||
if (user.user) {
|
if (user.user) {
|
||||||
router.push('/dashboard')
|
router.push('/dashboard')
|
||||||
}
|
}
|
||||||
|
@ -69,7 +72,11 @@ function Login() {
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<button type="submit" className="submit-button">
|
<button
|
||||||
|
type="submit"
|
||||||
|
className="submit-button"
|
||||||
|
disabled={disabledSubmitBtn}
|
||||||
|
>
|
||||||
Submit
|
Submit
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
|
|
|
@ -28,6 +28,9 @@ function Reg() {
|
||||||
context.createAcc(userData)
|
context.createAcc(userData)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// disable submit button is any input has not been filled
|
||||||
|
const disabledSubmitBtn = Object.values(userData).some((val) => val === '')
|
||||||
|
|
||||||
if (context.user) {
|
if (context.user) {
|
||||||
router.push('/dashboard')
|
router.push('/dashboard')
|
||||||
}
|
}
|
||||||
|
@ -96,7 +99,11 @@ function Reg() {
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<button type="submit" className="submit-button">
|
<button
|
||||||
|
type="submit"
|
||||||
|
className="submit-button"
|
||||||
|
disabled={disabledSubmitBtn}
|
||||||
|
>
|
||||||
Submit
|
Submit
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
|
|
|
@ -9,8 +9,8 @@ body {
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
a, a:hover
|
a,
|
||||||
{
|
a:hover {
|
||||||
color: inherit;
|
color: inherit;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
@ -50,6 +50,11 @@ body::-webkit-scrollbar-thumb {
|
||||||
border-width: 2px 0 2px;
|
border-width: 2px 0 2px;
|
||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
button:disabled {
|
||||||
|
cursor: not-allowed;
|
||||||
|
}
|
||||||
|
|
||||||
.home{
|
.home{
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue