From cc4db06588bb3bcee9ff267cbbe167635ccc4da1 Mon Sep 17 00:00:00 2001
From: pakxe <pigkill40@naver.com>
Date: Wed, 21 Aug 2024 14:28:48 +0900
Subject: [PATCH] =?UTF-8?q?fix:=20=EC=9C=A0=ED=9A=A8=EA=B8=B8=EC=9D=B4?=
 =?UTF-8?q?=EB=A5=BC=20=EC=B4=88=EA=B3=BC=ED=95=B4=20=EC=9E=85=EB=A0=A5?=
 =?UTF-8?q?=ED=95=98=EB=A0=A4=EB=8A=94=20=EA=B2=BD=EC=9A=B0=20=EA=B0=92?=
 =?UTF-8?q?=EC=9D=80=20=EC=9D=B4=EC=A0=84=EC=9D=98=20=EC=9C=A0=ED=9A=A8?=
 =?UTF-8?q?=EA=B0=92=EC=9C=BC=EB=A1=9C=20=EA=B3=A0=EC=A0=95=EC=9D=B4?=
 =?UTF-8?q?=EC=A7=80=EB=A7=8C=20canSubmit=EC=9D=B4=20false=EB=9D=BC=20?=
 =?UTF-8?q?=EC=9A=94=EC=B2=AD=EC=9D=B4=20=EB=B6=88=EA=B0=80=EB=8A=A5?=
 =?UTF-8?q?=ED=95=9C=20=EC=98=A4=EB=A5=98=EB=A5=BC=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/hooks/usePutAndDeleteBillAction.ts | 29 +++++++++++--------
 1 file changed, 17 insertions(+), 12 deletions(-)

diff --git a/client/src/hooks/usePutAndDeleteBillAction.ts b/client/src/hooks/usePutAndDeleteBillAction.ts
index 02f738904..69e364c8a 100644
--- a/client/src/hooks/usePutAndDeleteBillAction.ts
+++ b/client/src/hooks/usePutAndDeleteBillAction.ts
@@ -1,6 +1,6 @@
 import type {Bill} from 'types/serviceType';
 
-import {useState} from 'react';
+import {useEffect, useState} from 'react';
 
 import {ValidateResult} from '@utils/validate/type';
 
@@ -24,19 +24,21 @@ const usePutAndDeleteBillAction = (
   const {mutate: putBillAction} = usePutBillAction();
   const {mutate: deleteBillAction} = useDeleteBillAction();
 
+  // 현재 타겟의 event.target.value를 넣어주기 위해서
+  const getFieldValue = (field: BillInputType, value: string) => {
+    if (field === 'title') {
+      return {title: value, price: Number(inputPair.price)};
+    } else {
+      return {title: inputPair.title, price: Number(value)};
+    }
+  };
+
+  // TODO: (@weadie) getFieldValue 를 리펙토링해야한다.
+
   const handleInputChange = (field: BillInputType, event: React.ChangeEvent<HTMLInputElement>) => {
     const {value} = event.target;
 
-    // 현재 타겟의 event.target.value를 넣어주기 위해서
-    const getFieldValue = (): Bill => {
-      if (field === 'title') {
-        return {title: value, price: Number(inputPair.price)};
-      } else {
-        return {title: inputPair.title, price: Number(value)};
-      }
-    };
-
-    const {isValid, errorMessage, errorInfo} = validateFunc(getFieldValue());
+    const {isValid, errorMessage, errorInfo} = validateFunc(getFieldValue(field, value));
 
     setErrorMessage(errorMessage);
 
@@ -50,9 +52,12 @@ const usePutAndDeleteBillAction = (
       });
       setCanSubmit(value.length !== 0);
     } else {
+      const {isValid: isValidName} = validateFunc(getFieldValue('title', inputPair.title));
+      const {isValid: isValidPrice} = validateFunc(getFieldValue('price', inputPair.price));
+
+      setCanSubmit(isValidName && isValidPrice);
       // valid하지 않으면 event.target.value 덮어쓰기
       event.target.value = inputPair[field];
-      setCanSubmit(false);
     }
 
     if (field === 'title') {