From bd54a8a43d698c79f2c9a3bf15c210139c0b13a9 Mon Sep 17 00:00:00 2001
From: "hyunwoo93.cha" <hyunwoo93.cha@lgepartners.com>
Date: Wed, 15 Jan 2025 13:39:26 +0900
Subject: [PATCH] =?UTF-8?q?[=EC=A3=BC=EB=AC=B8=EA=B2=B0=EC=A0=9C]=20detail?=
 =?UTF-8?q?=20Buy=20now=20=ED=81=B4=EB=A6=AD=20=EC=8B=9C=EC=97=90=20refres?=
 =?UTF-8?q?h=20=EB=90=98=EC=96=B4=20qr=20code=20=EC=A0=81=EC=9E=AC?=
 =?UTF-8?q?=EB=90=98=EC=A7=80=20=EC=95=8A=EB=8D=98=20=ED=98=84=EC=83=81=20?=
 =?UTF-8?q?=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/actions/checkoutActions.js            |  3 ++-
 .../src/components/TPanel/TPanel.jsx          | 27 +++++++++++++++----
 .../SingleProduct/SingleOption.jsx            | 11 +++++---
 3 files changed, 31 insertions(+), 10 deletions(-)

diff --git a/com.twin.app.shoptime/src/actions/checkoutActions.js b/com.twin.app.shoptime/src/actions/checkoutActions.js
index 77259f6b..14e0f25d 100644
--- a/com.twin.app.shoptime/src/actions/checkoutActions.js
+++ b/com.twin.app.shoptime/src/actions/checkoutActions.js
@@ -9,7 +9,8 @@ export const getMyInfoCheckoutInfo =
     const { mbrNo, dirPurcSelYn, cartList } = props;
 
     dispatch(
-      changeAppStatus({ showLoadingPanel: { show: true, type: "wait" } })
+      // changeAppStatus({ showLoadingPanel: { show: true, type: "wait" } })
+      changeAppStatus({ isLoading: true })
     );
 
     const onSuccess = (response) => {
diff --git a/com.twin.app.shoptime/src/components/TPanel/TPanel.jsx b/com.twin.app.shoptime/src/components/TPanel/TPanel.jsx
index a0d4de63..7544236c 100644
--- a/com.twin.app.shoptime/src/components/TPanel/TPanel.jsx
+++ b/com.twin.app.shoptime/src/components/TPanel/TPanel.jsx
@@ -1,24 +1,36 @@
-import React, { useCallback, useRef, useEffect } from "react";
+import React, { useCallback, useEffect, useRef } from "react";
 
 import classNames from "classnames";
 import { useDispatch, useSelector } from "react-redux";
 
+import SpotlightContainerDecorator from "@enact/spotlight/SpotlightContainerDecorator";
 import { Cancelable } from "@enact/ui/Cancelable";
 
 import { popPanel } from "../../actions/panelActions";
 import { SpotlightIds } from "../../utils/SpotlightIds";
 import SmoodShowingAnimation from "../SmoodShowingAnimation/SmoodShowingAnimation";
 import css from "./TPanel.module.less";
-import SpotlightContainerDecorator from "@enact/spotlight/SpotlightContainerDecorator";
 
-const CancelablePanel = Cancelable({ modal: true, onCancel: "handleCancel" }, SpotlightContainerDecorator({ enterTo: "last-focused" }, "div"));
+const CancelablePanel = Cancelable(
+  { modal: true, onCancel: "handleCancel" },
+  SpotlightContainerDecorator({ enterTo: "last-focused" }, "div")
+);
 
 const PERFORMANCE_CHECHING_TIME = 200; //ms
 const PERFORMANCE_CHECHING_COUNT = 7;
-const TPanel = ({ className, children, handleCancel, isTabActivated = true, spotlightId = SpotlightIds.TPANEL, isOnTop = false, ...rest }) => {
+const TPanel = ({
+  className,
+  children,
+  handleCancel,
+  isTabActivated = true,
+  spotlightId = SpotlightIds.TPANEL,
+  isOnTop = false,
+  ...rest
+}) => {
   const dispatch = useDispatch();
 
   const isGnbOpened = useSelector((state) => state.common.isGnbOpened);
+  const isLoading = useSelector((state) => state.common.appStatus.isLoading);
 
   const onCancel = useCallback(
     (e) => {
@@ -41,8 +53,13 @@ const TPanel = ({ className, children, handleCancel, isTabActivated = true, spot
       {...rest}
       id={SpotlightIds.TPANEL}
       handleCancel={onCancel}
-      className={classNames(css.tpanelmain, isTabActivated && css.isTabActivated, className)}
+      className={classNames(
+        css.tpanelmain,
+        isTabActivated && css.isTabActivated,
+        className
+      )}
       spotlightId={spotlightId}
+      spotlightDisabled={isLoading}
     >
       {children}
     </CancelablePanel>
diff --git a/com.twin.app.shoptime/src/views/DetailPanel/SingleProduct/SingleOption.jsx b/com.twin.app.shoptime/src/views/DetailPanel/SingleProduct/SingleOption.jsx
index 096cefd3..8b47a540 100644
--- a/com.twin.app.shoptime/src/views/DetailPanel/SingleProduct/SingleOption.jsx
+++ b/com.twin.app.shoptime/src/views/DetailPanel/SingleProduct/SingleOption.jsx
@@ -136,7 +136,7 @@ export default function SingleOption({
     };
 
     setPrdtData(params);
-  }, []);
+  }, [selectedPatnrId, selectedPrdtId, selectedOptions, quantity]);
 
   const logInfo = useMemo(() => {
     if (productData) {
@@ -388,7 +388,8 @@ export default function SingleOption({
           response.data.shippingAddressList.length === 0
         ) {
           dispatch(setShowPopup(Config.ACTIVE_POPUP.qrPopup));
-          dispatch(changeAppStatus({ showLoadingPanel: { show: false } }));
+          // dispatch(changeAppStatus({ showLoadingPanel: { show: false } }));
+          dispatch(changeAppStatus({ isLoading: false }));
 
           return;
         } else {
@@ -406,10 +407,12 @@ export default function SingleOption({
         }
       } else if (response.retCode === 1001) {
         dispatch(setShowPopup(Config.ACTIVE_POPUP.qrPopup));
-        dispatch(changeAppStatus({ showLoadingPanel: { show: false } }));
+        // dispatch(changeAppStatus({ showLoadingPanel: { show: false } }));
+        dispatch(changeAppStatus({ isLoading: false }));
       } else {
         dispatch(showError(response.retCode, response.retMsg, false));
-        dispatch(changeAppStatus({ showLoadingPanel: { show: false } }));
+        // dispatch(changeAppStatus({ showLoadingPanel: { show: false } }));
+        dispatch(changeAppStatus({ isLoading: false }));
 
         return;
       }