[디테일 수정]

- 현재 매직마우스로는 팝업및 노출 정상적으로 가능하지만 4방향키 수정진행해야함.
 - 토스트가 유지가 안됌에 따른 수정이 더 필요함.

com.twin.app.shoptime/src/utils/Config.js

@@ -113,6 +113,7 @@ export const ACTIVE_POPUP = {
   toast: 'toast',
   optionalConfirm: 'optionalConfirm',
   energyPopup: 'energyPopup',
+  addCartPopup: 'addCartPopup',  
 };
 export const DEBUG_VIDEO_SUBTITLE_TEST = false;
 export const AUTO_SCROLL_DELAY = 600;

com.twin.app.shoptime/src/views/CartPanel/CartPanel.jsx

@@ -22,6 +22,7 @@ import {
   popPanel,
   updatePanel,
 } from '../../actions/panelActions';
+import { clearAllToasts } from '../../actions/toastActions';
 import TBody from '../../components/TBody/TBody';
 import THeader from '../../components/THeader/THeader';
 import TPanel from '../../components/TPanel/TPanel';
@@ -207,6 +208,11 @@ export default function CartPanel({ spotlightId, scrollOptions = [], panelInfo }
     }
   },[userNumber, dispatch])
 
+  useEffect(()=>{    
+    dispatch(clearAllToasts());
+    //혹시라도 넘어올 토스트 제거.
+  },[])
+
   return (
     <TPanel spotlightId={spotlightId} isTabActivated={true}>
       <TBody className={css.tbody} cbScrollTo={getScrollTo}>

com.twin.app.shoptime/src/views/DetailPanel/ProductAllSection/ProductAllSection.jsx

@@ -431,8 +431,11 @@ export default function ProductAllSection({
               >
                 {downloadCouponArr.length > 0 &&
                 downloadCouponArr.includes(cpnSno)
-                  ? $L("DOWNLOAD COMPLETED")
+                  ? 
-                  : $L("DOWNLOAD")}
+                    $L("DOWNLOAD COMPLETED")
+                  : 
+                    $L("DOWNLOAD")
+                }
               </div>
             )}
           </div>
@@ -663,9 +666,13 @@ export default function ProductAllSection({
 
   //닫히도록
   const handleCloseToast = useCallback(() => {
-    dispatch(clearAllToasts());
+  // 팝업이 열려있으면 닫지 않음
-    setOpenToast(false);
+  if (popupVisible) {    
-  }, [dispatch]);
+    return; // 팝업이 활성이면 무시
+  }    
+  dispatch(clearAllToasts());
+  setOpenToast(false);
+}, [dispatch, popupVisible]);
 
   // 스크롤 컨테이너의 클릭 이벤트 추적용 로깅
   const handleScrollContainerClick = useCallback((e) => {

com.twin.app.shoptime/src/views/DetailPanel/components/BuyOption.jsx

@@ -639,7 +639,8 @@ const BuyOption = ({
     Spotlight.focus('buy-option-buy-now-button');
   }
 
-  const handleBuyNowClick = useCallback(() => {
+  const handleBuyNowClick = useCallback((e) => {
+    e.stopPropagation()
     console.log('%c🔥🔥🔥 BUY NOW CLICKED! FUNCTION CALLED! 🔥🔥🔥', 'background: red; color: white; font-size: 16px; font-weight: bold; padding: 5px;');
     console.log('%cproductInfo exists:', 'background: red; color: white; padding: 3px;', !!productInfo);
     console.log('%cuserNumber exists:', 'background: red; color: white; padding: 3px;', !!userNumber);
@@ -1013,7 +1014,7 @@ const BuyOption = ({
         console.log('%c[BuyOption] ✅ AFTER pushPanel dispatch', 'background: orange; color: white; font-weight: bold; padding: 5px;');
         
         // Toast 정리는 성공적으로 패널 이동 후에만 실행
-        dispatch(clearAllToasts());
+        // dispatch(clearAllToasts());
       }
     }
   }, [
@@ -1035,7 +1036,8 @@ const BuyOption = ({
   ]);
 
   // ADD TO CART 버튼 클릭 핸들러
-  const handleAddToCartClick = useCallback(() => {
+  const handleAddToCartClick = useCallback((e) => {
+    e.stopPropagation();
     console.log('[BuyOption] ADD TO CART clicked');
 
     const isMock = isMockMode;
@@ -1180,17 +1182,18 @@ const BuyOption = ({
         name: optionLabel,
         price: optionForUse?.optPrc || '0.00',
       };
-
+      dispatch(setShowPopup(Config.ACTIVE_POPUP.addCartPopup));
-      dispatch(
+      return;
-        pushPanel({
+      // dispatch(
-          name: Config.panel_names.CART_PANEL,
+      //   pushPanel({
-          panelInfo: {
+      //     name: Config.panel_names.CART_PANEL,
-            productInfo: productInfoForCart,
+      //     panelInfo: {
-            optionInfo: optionInfoForCart,
+      //       productInfo: productInfoForCart,
-            quantity: effectiveQuantity,
+      //       optionInfo: optionInfoForCart,
-          },
+      //       quantity: effectiveQuantity,
-        })
+      //     },
-      );
+      //   })
+      // );
     } else {
       console.log('[BuyOption] Mock Mode - Adding to cart (Mock)');
 
@@ -1241,7 +1244,7 @@ const BuyOption = ({
             optionInfo,
             quantity: effectiveQuantity,
           },
-        })
+        })        
       );
     }
     dispatch(clearAllToasts());
@@ -1403,7 +1406,7 @@ const BuyOption = ({
       if (typeof spotlightId === 'string') {
         currentSpot = spotlightId;
       } else {
-        currentSpot = 'buy-option-buy-now-button';
+        currentSpot = 'buy-option-add-to-cart-button';
       }
 
       if (currentSpot) {
@@ -1447,8 +1450,25 @@ const BuyOption = ({
     }
   }, [dispatch, hasOnClose, isOptionValue, webOSVersion, userNumber]);
 
+  useEffect(()=>{
+    return(()=>{
+      dispatch(clearAllToasts());
+    })
+  },[])
+
+const handleCartMove = useCallback(() => {
+  dispatch(setHidePopup());
+  dispatch(
+    pushPanel({
+      name: Config.panel_names.CART_PANEL,      
+    })
+  )
+},[dispatch])
+
   return (
-    <Container className={styles.buy_option}>
+    <Container 
+      className={styles.buy_option}      
+    >
       <div className={styles.buy_option__left_section}>
         {/* 동적 옵션 렌더링 */}
         {productOptionInfos &&
@@ -1582,8 +1602,24 @@ const BuyOption = ({
           onClose={onClose}
         />
       )}
+      {activePopup === Config.ACTIVE_POPUP.addCartPopup && (
+        <TPopUp
+          kind="textPopup"
+          hasText
+          open={popupVisible}
+          text={"Added to Cart"}
+          hasButton
+          hasOnClose={hasOnClose}
+          button1Text={$L('VIEW CART')}
+          button2Text={$L('CONTINUE SHOPPING')}
+          onClick={handleCartMove}
+          onClose={onClose}
+        />
+      )}
     </Container>
   );
 };
 
+
+
 export default BuyOption;

com.twin.app.shoptime/src/views/DetailPanel/components/BuyOption.module.less

@@ -133,3 +133,11 @@
     text-align: center;
   }
 }
+
+
+
+[id="floatLayer"] > div:not([id]) > div > div:nth-child(2) {
+    bottom: 54%;
+    transform: translateY(50%);
+    overflow: initial;
+}