fix: build error 수정

frontend/src/components/Chat/ChatLoading.tsx

@@ -1,10 +1,10 @@
 const ChatLoading = () => {
   return (
-    <div className="fixed inset-0 z-50 flex items-center justify-center bg-gray-800 bg-opacity-15">
+    <div className="fixed inset-0 z-50 flex items-center justify-center bg-gray-800/15">
       <div className="flex space-x-6">
         <div className="size-3 animate-pulse rounded-full bg-gray-400" />
-        <div className="animation-delay-200 size-3 animate-pulse rounded-full bg-gray-500" />
-        <div className="animation-delay-400 size-3 animate-pulse rounded-full bg-gray-600" />
+        <div className="delay-200 size-3 animate-pulse rounded-full bg-gray-500" />
+        <div className="delay-400 size-3 animate-pulse rounded-full bg-gray-600" />
       </div>
     </div>
   );

frontend/src/components/common/html/Input.tsx

@@ -1,7 +1,7 @@
 import { ComponentPropsWithoutRef, forwardRef } from "react";
 import { twMerge } from "tailwind-merge";
 
-type InputProps = ComponentPropsWithoutRef<"input">;
+type InputProps = ComponentPropsWithoutRef<"input"> & { isErrored?: boolean };
 
 const Input = forwardRef<HTMLInputElement, InputProps>((props, ref) => {
   const { className, ...rest } = props;
@@ -15,7 +15,7 @@ const Input = forwardRef<HTMLInputElement, InputProps>((props, ref) => {
         )}
         ref={ref}
         {...rest}
-      ></input>
+      />
     </>
   );
 });

frontend/src/components/login/Login.tsx

@@ -96,7 +96,6 @@ const Login = () => {
           setEmailError("이메일을 확인해주세요.");
           setPasswordError("비밀번호를 확인해주세요.");
         });
-
       // zustand로 관리하는 user가 업데이트가 바로 안이루어져서,
       // 임시 방편으로 updateUserInfo 가 userData를 반환하게끔 하고
       // 반환값을 사용하도록 하자
@@ -125,6 +124,7 @@ const Login = () => {
           });
         }
       } catch (error) {
+        console.log(error);
         const errorMessage =
           "예기치 못한 에러가 발생하였습니다. 다시 시도해주세요.";
         if (isLoggedIn) {
@@ -143,7 +143,7 @@ const Login = () => {
           <InputField title="아이디" error={emailError}>
             <Input
               ref={emailRef}
-              isErrored={emailError}
+              isErrored={!!emailError}
               type="email"
               name="email"
               placeholder="이메일을 입력해주세요"
@@ -157,7 +157,7 @@ const Login = () => {
           <InputField title="비밀번호" error={passwordError}>
             <Input
               ref={passwordRef}
-              isErrored={passwordError}
+              isErrored={!!passwordError}
               type="password"
               name="password"
               placeholder="비밀번호를 입력해주세요"

frontend/src/components/login/LoginBottomSheet.tsx

@@ -2,7 +2,7 @@ import { useEffect, useState } from "react";
 import { useLocation } from "react-router-dom";
 import BottomSheet from "@common/BottomSheet";
 import Login from "@components/login/Login";
-import SignUp from "@components/signup/SignUp";
+import SignUp from "@components/signUp/SignUp";
 
 const LoginBottomSheet = () => {
   const location = useLocation();

frontend/src/components/signup/SignUp.tsx

@@ -1,5 +1,5 @@
-import SignUpRequired from "./SignUpRequired";
-import SignUpAdditional from "./SignUpAdditional";
+import SignUpRequired from "@components/signUp/SignUpRequired";
+import SignUpAdditional from "@components/signUp/SignUpAdditional";
 import userStore from "@store/auth.store.ts";
 import { redirect } from "react-router-dom";
 

frontend/src/components/signup/SignUpRequired.tsx

@@ -56,7 +56,7 @@ const SignUpRequired = () => {
 
   const generateYearOptions = (startYear: number, endYear: number) => {
     const options: { value: string; label: string }[] = [];
-    for (let year = startYear; year <= endYear; year++) {
+    for (let year = endYear; year >= startYear; year--) {
       options.push({ value: year.toString(), label: year.toString() });
     }
     return options;
@@ -163,7 +163,7 @@ const SignUpRequired = () => {
       if (user) {
         updateUserData("gender", signUpRequired.gender);
         updateUserData("birthDate", signUpRequired.birthDate);
-
+        console.log(166);
         updateUserInfo();
       } else
         signUpWithCredential({
@@ -174,7 +174,10 @@ const SignUpRequired = () => {
           username: signUpRequired.username,
           birthDate: signUpRequired.birthDate,
         })
-          .then(updateUserInfo)
+          .then(() => {
+            updateUserInfo();
+            console.log(179);
+          })
           .catch((data) => {
             if (data.code === "auth/email-already-in-use")
               setEmailError("이미 사용중인 이메일입니다");
@@ -204,8 +207,8 @@ const SignUpRequired = () => {
               type="email"
               name="email"
               placeholder={user?.email || "이메일을 입력해주세요"}
-              className={`py-[14px h-[48px] w-full rounded-[4px] px-4`}
-              isErrored={emailError}
+              className={`h-[48px] w-full rounded-[4px] px-4 py-[14px]`}
+              isErrored={!!emailError}
               value={user?.email ? "" : signUpRequired.email}
               onChange={handleInputChange}
               disabled={user?.email ? true : false}
@@ -225,7 +228,7 @@ const SignUpRequired = () => {
               ref={passwordRef}
               type="password"
               name="password"
-              isErrored={passwordError}
+              isErrored={!!passwordError}
               placeholder={
                 user?.email
                   ? "소셜 로그인 회원입니다."
@@ -244,7 +247,7 @@ const SignUpRequired = () => {
               ref={userNameRef}
               type="text"
               name="username"
-              isErrored={nameError}
+              isErrored={!!nameError}
               placeholder={user?.displayName || "이름을 입력해주세요"}
               className="h-[48px] w-full rounded-[4px] px-4 py-[14px]"
               value={user?.displayName ? "" : signUpRequired.username}
@@ -270,7 +273,7 @@ const SignUpRequired = () => {
                 className="h-[45px] gap-2 rounded-[6px] border-[#E4E4E7] px-[10px] py-[14px]"
                 menuPlacement="top"
                 placeholder="년"
-                options={birthYearOptions.sort((a, b) => b.value - a.value)}
+                options={birthYearOptions}
                 onChange={(value) => {
                   setBirthYear(value);
                   updateBirthDate(value, birthMonth, birthDay);