From 9b12e9bfec9df82f69f9c49d47f92c56728dd91b Mon Sep 17 00:00:00 2001
From: "younghoon100.park" <younghoon100.park@lgepartner.com>
Date: Tue, 8 Oct 2024 18:23:58 +0900
Subject: [PATCH] =?UTF-8?q?[SHOPTIME-3731]=20SBM=20/=20=ED=8C=9D=EC=97=85?=
 =?UTF-8?q?=EC=9D=B4=20=EC=97=B4=EB=A6=B4=EB=95=8C=20=ED=8F=AC=EC=BB=A4?=
 =?UTF-8?q?=EC=8A=A4=EA=B0=80=20=EB=B9=A0=EB=A5=B4=EA=B2=8C=20=EC=9D=B4?=
 =?UTF-8?q?=EB=8F=99=ED=95=B4=EC=84=9C=20=EA=B9=9C=EB=B9=A1=20=EA=B1=B0?=
 =?UTF-8?q?=EB=A6=AC=EB=8A=94=20=ED=98=84=EC=83=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Changed files:
1. MobileSendPopUp.jsx

Detail note:
- 원인: History가 있을 경우의 포커스 예외 처리 부재
- 대책: History가 있을 경우에 포커스 예외 처리
---
 .../components/MobileSend/MobileSendPopUp.jsx | 35 ++++++++-----------
 1 file changed, 14 insertions(+), 21 deletions(-)

diff --git a/com.twin.app.shoptime/src/components/MobileSend/MobileSendPopUp.jsx b/com.twin.app.shoptime/src/components/MobileSend/MobileSendPopUp.jsx
index f2f77195..d04606ab 100644
--- a/com.twin.app.shoptime/src/components/MobileSend/MobileSendPopUp.jsx
+++ b/com.twin.app.shoptime/src/components/MobileSend/MobileSendPopUp.jsx
@@ -1,4 +1,10 @@
-import React, { useCallback, useEffect, useMemo, useState } from "react";
+import React, {
+  useCallback,
+  useEffect,
+  useMemo,
+  useRef,
+  useState,
+} from "react";
 
 import classNames from "classnames";
 import {
@@ -85,9 +91,6 @@ export default function MobileSendPopUp({
   const [recentSentNumber, setRecentSentNumber] = useState([]);
   const [keyPadOff, setKeyPadOff] = useState(false);
   const [smsRetCode, setSmsRetCode] = useState(undefined);
-  const [chkAgreeBtn, setChkAgreeBtn] = useState(false);
-  const [popText, setPopText] = useState(false);
-  const [spotlightDisabled, setSpotlightDisabled] = useState(true);
   const { httpHeader } = useSelector((state) => state.common);
   const regDeviceInfoRetCode = useSelector(
     (state) => state.device?.regDeviceInfoData?.retCode
@@ -106,6 +109,8 @@ export default function MobileSendPopUp({
   const deviceCountryCode = httpHeader["X-Device-Country"];
   const dispatch = useDispatch();
 
+  const agreeBtnClickedRef = useRef(false);
+
   const getMaxNum = useCallback((_deviceCountryCode) => {
     if (_deviceCountryCode === "DE" || _deviceCountryCode === "GB") {
       return 11;
@@ -232,13 +237,15 @@ export default function MobileSendPopUp({
   }, [deviceInfo, dispatch]);
 
   useEffect(() => {
-    if (!chkAgreeBtn) {
+    if (!agreeBtnClickedRef.current) {
       if (recentSentNumber && recentSentNumber.length > 0) {
         setKeyPadOff(true);
         setMobileNumber(recentSentNumber[0]);
+        setTimeout(() => Spotlight.focus("agreeAndSend"));
       } else {
         setKeyPadOff(false);
         setMobileNumber("");
+        setTimeout(() => Spotlight.focus("keypad-number-1"));
       }
     }
   }, [recentSentNumber]);
@@ -305,7 +312,7 @@ export default function MobileSendPopUp({
       }
 
       updatedNumbers.unshift(mobileNumber);
-      setChkAgreeBtn(true);
+      agreeBtnClickedRef.current = true;
       setRecentSentNumber(updatedNumbers);
 
       const encryptedNumbers = updatedNumbers.map(encryptPhoneNumber);
@@ -501,20 +508,6 @@ export default function MobileSendPopUp({
     }
   }, [curationCouponSuccess, mobileNumber]);
 
-  useEffect(() => {
-    if (keyPadOff) {
-      setTimeout(() => {
-        Spotlight.focus("agreeAndSend");
-      });
-      setSpotlightDisabled(false);
-    } else {
-      setSpotlightDisabled(true);
-      setTimeout(() => {
-        Spotlight.focus("keypad-number-1");
-      });
-    }
-  }, [keyPadOff]);
-
   const retCodeError =
     (smsRetCode !== undefined && smsRetCode !== 0) ||
     (curationCouponSuccess !== undefined && curationCouponSuccess !== 0);
@@ -577,7 +570,7 @@ export default function MobileSendPopUp({
                   <SpottableComponent
                     className={css.inputNum}
                     onClick={handleInputClick}
-                    spotlightDisabled={spotlightDisabled}
+                    spotlightDisabled={!keyPadOff}
                   >
                     {deviceCountryCode && deviceCountryCode === "RU" && (
                       <span className={css.rucInput}>{"+7 "}</span>