From 9ab0a964836b29dfec43d5485d7ab723b99249d9 Mon Sep 17 00:00:00 2001
From: JinHo Kim <81083461+jinhokim98@users.noreply.github.com>
Date: Wed, 21 Aug 2024 14:14:18 +0900
Subject: [PATCH] =?UTF-8?q?fix:=20=EC=B0=A8=EB=93=B1=20=EC=A0=81=EC=9A=A9?=
 =?UTF-8?q?=20can=20submit=EC=9D=B4=20valid=20=ED=95=98=EC=A7=80=EB=A7=8C?=
 =?UTF-8?q?=20false=EB=90=98=EB=8A=94=20=EB=B2=84=EA=B7=B8=20(#428)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* fix: 0원을 허용하도록 수정

* feat: 총 금액이 변동됐을 때 재계산을 실행하는 기능 추가

* feat: 하나라도 조정값이 있는지를 판단하는 기능 추가

* test: 조정된 값이 있는지 여부를 주는 기능 test 작성

* feat: 조정되지 않은 인원이 1명일 때, input을 막아버리는 기능 추가

* feat: 서버상태와 클라이언트 상태 가격이 전부 동일하면 can submit false 기능 추가

* fix: input list가 변했을 때 can submit이 돌도록 변경

* fix: 데이터가 없을 때 초기화 되어버리는 현상 해결
---
 .../useMemberReportInput.tsx                     | 16 ++++++++++++++--
 .../useMemberReportListInAction.ts               |  4 ++--
 2 files changed, 16 insertions(+), 4 deletions(-)

diff --git a/client/src/hooks/useMemberReportListInAction/useMemberReportInput.tsx b/client/src/hooks/useMemberReportListInAction/useMemberReportInput.tsx
index 9f0cb4449..9c9cd80d9 100644
--- a/client/src/hooks/useMemberReportListInAction/useMemberReportInput.tsx
+++ b/client/src/hooks/useMemberReportListInAction/useMemberReportInput.tsx
@@ -26,7 +26,7 @@ const useMemberReportInput = ({
   const [inputList, setInputList] = useState<MemberReportInput[]>(data.map((item, index) => ({...item, index})));
   const [canSubmit, setCanSubmit] = useState<boolean>(false);
 
-  const [canEditList, setCanEditList] = useState<boolean[]>(new Array(data.length).fill(true));
+  const [canEditList, setCanEditList] = useState<boolean[]>([]);
 
   const onChange = (event: React.ChangeEvent<HTMLInputElement>, index: number) => {
     const {value} = event.target;
@@ -36,7 +36,6 @@ const useMemberReportInput = ({
 
   const validateAndAddAdjustedMember = (price: string, index: number) => {
     const {isValid} = validateMemberReportInAction(price, totalPrice);
-    setCanSubmit(isValid);
 
     if (isValid) {
       const newInputList = [...inputList];
@@ -52,6 +51,14 @@ const useMemberReportInput = ({
     }
   };
 
+  // 서버와 값이 같지 않고 input price의 상태가 모두 valid하다면 can submit true
+  useEffect(() => {
+    const isSamePriceState = getIsSamePriceStateAndServerState();
+    const isAllValid = inputList.every(input => validateMemberReportInAction(String(input.price), totalPrice));
+
+    setCanSubmit(!isSamePriceState && isAllValid);
+  }, [inputList]);
+
   // addAdjustedMember로 인해 data가 변했을 때 input list의 값을 맞춰주기 위함
   useEffect(() => {
     setCanSubmit(!getIsSamePriceStateAndServerState());
@@ -59,6 +66,11 @@ const useMemberReportInput = ({
 
     // 남은 인원이 1명일 때 수정을 불가능하도록 설정
     const onlyOneIndex = getOnlyOneNotAdjustedRemainMemberIndex();
+
+    if (data.length !== 0) {
+      setCanEditList(new Array(data.length).fill(true));
+    }
+
     if (onlyOneIndex !== null) {
       const newCanEditList = new Array(data.length).fill(true);
       newCanEditList[onlyOneIndex] = false;
diff --git a/client/src/hooks/useMemberReportListInAction/useMemberReportListInAction.ts b/client/src/hooks/useMemberReportListInAction/useMemberReportListInAction.ts
index 3d332ea25..c9e16ff3b 100644
--- a/client/src/hooks/useMemberReportListInAction/useMemberReportListInAction.ts
+++ b/client/src/hooks/useMemberReportListInAction/useMemberReportListInAction.ts
@@ -34,10 +34,10 @@ const useMemberReportListInAction = (actionId: number, totalPrice: number) => {
   useEffect(() => {
     const totalPriceFromServer = memberReportListInActionFromServer.reduce((acc, cur) => acc + cur.price, 0);
 
-    if (totalPriceFromServer !== totalPrice) {
+    if (totalPriceFromServer !== totalPrice && totalPriceFromServer !== 0) {
       reCalculatePriceByTotalPriceChange();
     }
-  }, [totalPrice]);
+  }, [totalPrice, memberReportListInActionFromServer]);
 
   useEffect(() => {
     if (queryResult.isSuccess) {