From bd2a90b6f5278887e056223d75cca3e65022e4e2 Mon Sep 17 00:00:00 2001
From: optrader <optrader8@gmail.com>
Date: Sat, 22 Nov 2025 06:32:49 +0900
Subject: [PATCH] [251122] fix: DetailPaneel->ProductAllSection Focus-2
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

🕐 커밋 시간: 2025. 11. 22. 06:32:49

📊 변경 통계:
  • 총 파일: 1개
  • 추가: +51줄
  • 삭제: -27줄

📝 수정된 파일:
  ~ com.twin.app.shoptime/src/views/DetailPanel/ProductAllSection/ProductAllSection.jsx

🔧 함수 변경 내용:
  📄 com.twin.app.shoptime/src/views/DetailPanel/ProductAllSection/ProductAllSection.jsx (javascript):
    🔄 Modified: extractProductMeta()
---
 .../ProductAllSection/ProductAllSection.jsx   | 51 ++++++++++++++-----
 1 file changed, 39 insertions(+), 12 deletions(-)

diff --git a/com.twin.app.shoptime/src/views/DetailPanel/ProductAllSection/ProductAllSection.jsx b/com.twin.app.shoptime/src/views/DetailPanel/ProductAllSection/ProductAllSection.jsx
index 44ccd1f6..20947fe1 100644
--- a/com.twin.app.shoptime/src/views/DetailPanel/ProductAllSection/ProductAllSection.jsx
+++ b/com.twin.app.shoptime/src/views/DetailPanel/ProductAllSection/ProductAllSection.jsx
@@ -868,20 +868,20 @@ export default function ProductAllSection({
     Spotlight.focus('spotlightId_backBtn');
   }, []);
 
-  const handleSpotlightDown = useCallback((e) => {
-    e.stopPropagation();
-  }, []);
-
-  // SHOP BY MOBILE에서 아래로 이동 시 제품 정보 영역으로 포커스 이동
-  const handleSpotlightDownFromShopByMobile = useCallback((e) => {
-    e.stopPropagation();
-    e.preventDefault();
+  // 아래 방향 이동 시 버튼 영역으로 포커스 이동
+  // BUY NOW / ADD TO CART / SHOP BY MOBILE / FavoriteBtn 등에서 공통 사용
+  const focusNextButtons = useCallback(() => {
+    // 1) SHOP BY MOBILE이 있으면 우선 이동
+    if (SpotlightIds?.DETAIL_SHOPBYMOBILE) {
+      if (Spotlight.focus(SpotlightIds.DETAIL_SHOPBYMOBILE)) return;
+    }
+    if (Spotlight.focus('detail_shop_by_mobile')) return;
 
+    // 2) 상품 정보 버튼들로 이동
     if (!Spotlight.focus('product-details-button')) {
       Spotlight.focus('user-reviews-button');
     }
-
-    // 포커스가 비거나 다른 곳으로 튀는 경우를 방어
+    // 포커스가 비거나 다른 곳으로 튈 때 다시 보정
     setTimeout(() => {
       const current = Spotlight.getCurrent();
       const currentId = current?.dataset?.spotlightId;
@@ -894,6 +894,31 @@ export default function ProductAllSection({
     }, 0);
   }, []);
 
+  const handleSpotlightDown = useCallback((e) => {
+    e.stopPropagation();
+  }, []);
+
+  // SHOP BY MOBILE에서 아래로 이동 시 제품 정보 영역으로 포커스 이동
+  const handleSpotlightDownFromShopByMobile = useCallback(
+    (e) => {
+      e.stopPropagation();
+      e.preventDefault();
+
+      focusNextButtons();
+    },
+    [focusNextButtons]
+  );
+
+  // BUY NOW / ADD TO CART에서 아래로 이동 시 동일하게 전달
+  const handleSpotlightDownFromBuyButtons = useCallback(
+    (e) => {
+      e.stopPropagation();
+      e.preventDefault();
+      focusNextButtons();
+    },
+    [focusNextButtons]
+  );
+
   const onFavoriteFlagChanged = useCallback(
     (newFavoriteFlag) => setFavoriteOverride(newFavoriteFlag),
     []
@@ -1275,7 +1300,8 @@ export default function ProductAllSection({
                     className={css.buyNowButton}
                     onClick={handleBuyNowClick}
                     onSpotlightUp={handleSpotlightUpFromBuyButtons}
-                    onSpotlightDown={handleSpotlightDown}
+                    onSpotlightDown={handleSpotlightDownFromBuyButtons}
+                    data-spotlight-next-down={SpotlightIds.DETAIL_SHOPBYMOBILE}
                     type="detail_small"
                   >
                     <div className={css.buyNowText}>{$L('BUY NOW')}</div>
@@ -1286,7 +1312,8 @@ export default function ProductAllSection({
                     // onClick={handleAddToCartClick}
                     onClick={handleBuyNowClick}
                     onSpotlightUp={handleSpotlightUpFromBuyButtons}
-                    onSpotlightDown={handleSpotlightDown}
+                    onSpotlightDown={handleSpotlightDownFromBuyButtons}
+                    data-spotlight-next-down={SpotlightIds.DETAIL_SHOPBYMOBILE}
                     type="detail_small"
                   >
                     <div className={css.addToCartText}>{$L('ADD TO CART')}</div>