issue #

Enter키 동작 구현

src/ui/page/account/login/LoginPage.tsx

@@ -4,7 +4,7 @@ import { Field, FieldError, FieldLabel } from '@/components/ui/field';
 import { Button } from '@/components/ui/button';
 import { Input } from '@/components/ui/input';
 import { zodResolver } from '@hookform/resolvers/zod';
-import { useCallback, useState } from 'react';
+import React, { useCallback, useState } from 'react';
 import { Controller, useForm } from 'react-hook-form';
 import { useNavigate } from 'react-router-dom';
 import { PageRouting } from '@/const/PageRouting';
@@ -98,6 +98,13 @@ export default function LoginPage() {
     )
   }
 
+  const handleEnterKeyDown = async (e: React.KeyboardEvent<HTMLInputElement>) => {
+    if (!(e.key === 'Enter')) return;
+    const result = await loginForm.trigger();
+    if (!result) return;
+    await reqLogin();
+  }
+
   return (
     <div className="w-full h-full flex flex-col justify-center items-center">
       <Card className="w-md pl-2 pr-2">
@@ -117,6 +124,8 @@ export default function LoginPage() {
                     type="text"
                     id="form-login-id"
                     aria-invalid={fieldState.invalid}
+                    tabIndex={1}
+                    onKeyDown={handleEnterKeyDown}
                   />
                   <FieldError errors={[fieldState.error]} />
                 </Field>
@@ -134,6 +143,7 @@ export default function LoginPage() {
                       className="p-0 bg-transparent hover:bg-transparent h-fit w-fit text-xs text-gray-400 hover:text-gray-500 cursor-pointer"
                       onClick={moveToResetPasswordPage}
                       type="button"
+                      tabIndex={3}
                     >
                       비밀번호를 잊으셨습니까?
                     </Button>
@@ -143,6 +153,8 @@ export default function LoginPage() {
                     type="password"
                     id="form-login-password"
                     aria-invalid={fieldState.invalid}
+                    tabIndex={2}
+                    onKeyDown={handleEnterKeyDown}
                   />
                   <FieldError errors={[fieldState.error]} />
                 </Field>