fix: allow user to press Enter in login page

This commit is contained in:
Afrie Irham
2023-07-05 18:40:48 +08:00
parent 2f1bd9ca61
commit 37707c422a
@@ -1,4 +1,4 @@
import { useState } from "react"; import { FormEvent, useState } from "react";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import Link from "next/link"; import Link from "next/link";
import { useRouter } from "next/router"; import { useRouter } from "next/router";
@@ -31,7 +31,8 @@ export default function InitialLoginStep({
const [isLoading, setIsLoading] = useState(false); const [isLoading, setIsLoading] = useState(false);
const [loginError, setLoginError] = useState(false); const [loginError, setLoginError] = useState(false);
const handleLogin = async () => { const handleLogin = async (e: FormEvent<HTMLFormElement>) => {
e.preventDefault()
try { try {
if (!email || !password) { if (!email || !password) {
return; return;
@@ -98,7 +99,7 @@ export default function InitialLoginStep({
setIsLoading(false); setIsLoading(false);
} }
return <div className='flex flex-col mx-auto w-full justify-center items-center'> return <form onSubmit={handleLogin} className='flex flex-col mx-auto w-full justify-center items-center'>
<h1 className='text-xl font-medium text-transparent bg-clip-text bg-gradient-to-b from-white to-bunker-200 text-center mb-8' >Login to Infisical</h1> <h1 className='text-xl font-medium text-transparent bg-clip-text bg-gradient-to-b from-white to-bunker-200 text-center mb-8' >Login to Infisical</h1>
{/* <div className='lg:w-1/6 w-1/4 min-w-[20rem] rounded-md'> {/* <div className='lg:w-1/6 w-1/4 min-w-[20rem] rounded-md'>
<Button <Button
@@ -143,7 +144,7 @@ export default function InitialLoginStep({
{!isLoading && loginError && <Error text={t("login.error-login") ?? ""} />} {!isLoading && loginError && <Error text={t("login.error-login") ?? ""} />}
<div className='lg:w-1/6 w-1/4 min-w-[21.2rem] md:min-w-[20.1rem] text-center rounded-md mt-4'> <div className='lg:w-1/6 w-1/4 min-w-[21.2rem] md:min-w-[20.1rem] text-center rounded-md mt-4'>
<Button <Button
onClick={async () => handleLogin()} type="submit"
size="sm" size="sm"
isFullWidth isFullWidth
className='h-12' className='h-12'
@@ -180,5 +181,5 @@ export default function InitialLoginStep({
<span className='hover:underline hover:underline-offset-4 hover:decoration-primary-700 hover:text-bunker-200 duration-200 cursor-pointer'>Recover your account</span> <span className='hover:underline hover:underline-offset-4 hover:decoration-primary-700 hover:text-bunker-200 duration-200 cursor-pointer'>Recover your account</span>
</Link> </Link>
</div> </div>
</div> </form>
} }