From 9c5de90098f7b54d983f095b43961413c9b7bacc Mon Sep 17 00:00:00 2001 From: optrader Date: Fri, 21 Nov 2025 12:49:10 +0900 Subject: [PATCH] [251121] fix: JustForYouTestPanel Top Click MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ๐Ÿ• ์ปค๋ฐ‹ ์‹œ๊ฐ„: 2025. 11. 21. 12:49:09 ๐Ÿ“Š ๋ณ€๊ฒฝ ํ†ต๊ณ„: โ€ข ์ด ํŒŒ์ผ: 5๊ฐœ โ€ข ์ถ”๊ฐ€: +115์ค„ โ€ข ์‚ญ์ œ: -23์ค„ ๐Ÿ“ ์ˆ˜์ •๋œ ํŒŒ์ผ: ~ com.twin.app.shoptime/src/views/DetailPanel/ProductAllSection/ProductAllSection.jsx ~ com.twin.app.shoptime/src/views/DetailPanel/components/FavoriteBtn.jsx ~ com.twin.app.shoptime/src/views/JustForYouPanel/JustForYouPanel.jsx ~ com.twin.app.shoptime/src/views/JustForYouPanel/JustForYouPanel.module.less ~ com.twin.app.shoptime/src/views/JustForYouTestPanel/JustForYouTestPanel.jsx ๐Ÿ”ง ์ฃผ์š” ๋ณ€๊ฒฝ ๋‚ด์šฉ: โ€ข UI ์ปดํฌ๋„ŒํŠธ ์•„ํ‚คํ…์ฒ˜ ๊ฐœ์„  โ€ข ํ…Œ์ŠคํŠธ ์ปค๋ฒ„๋ฆฌ์ง€ ๋ฐ ์•ˆ์ •์„ฑ ํ–ฅ์ƒ โ€ข ์ค‘๊ฐ„ ๊ทœ๋ชจ ๊ธฐ๋Šฅ ๊ฐœ์„  --- .../ProductAllSection/ProductAllSection.jsx | 22 ++++-- .../DetailPanel/components/FavoriteBtn.jsx | 19 ++++- .../views/JustForYouPanel/JustForYouPanel.jsx | 74 ++++++++++++++++--- .../JustForYouPanel.module.less | 2 + .../JustForYouTestPanel.jsx | 21 +++++- 5 files changed, 115 insertions(+), 23 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 c88b49f3..afa56279 100644 --- a/com.twin.app.shoptime/src/views/DetailPanel/ProductAllSection/ProductAllSection.jsx +++ b/com.twin.app.shoptime/src/views/DetailPanel/ProductAllSection/ProductAllSection.jsx @@ -910,6 +910,10 @@ export default function ProductAllSection({ Spotlight.focus('spotlightId_backBtn'); }, []); + const handleSpotlightDown = useCallback((e) => { + e.stopPropagation(); + }, []); + const onFavoriteFlagChanged = useCallback( (newFavoriteFlag) => setFavoriteOverride(newFavoriteFlag), [] @@ -1265,11 +1269,11 @@ export default function ProductAllSection({ {promotions.map((promotion, idx) => { return( - +
SPECIAL PROMOTION
Coupon only applicable to this product!
-
+
@@ -1284,16 +1289,17 @@ export default function ProductAllSection({
- + ) })} {isBillingProductVisible && ( - +
{$L('BUY NOW')}
@@ -1304,14 +1310,15 @@ export default function ProductAllSection({ // onClick={handleAddToCartClick} onClick={handleBuyNowClick} onSpotlightUp={handleSpotlightUpFromBuyButtons} + onSpotlightDown={handleSpotlightDown} type="detail_small" >
{$L('ADD TO CART')}
 - +
)} -
{$L('SHOP BY MOBILE')}
@@ -1338,7 +1346,7 @@ export default function ProductAllSection({ /> )} - +
{orderPhnNo && ( diff --git a/com.twin.app.shoptime/src/views/DetailPanel/components/FavoriteBtn.jsx b/com.twin.app.shoptime/src/views/DetailPanel/components/FavoriteBtn.jsx index 0fd47ee7..152e84de 100644 --- a/com.twin.app.shoptime/src/views/DetailPanel/components/FavoriteBtn.jsx +++ b/com.twin.app.shoptime/src/views/DetailPanel/components/FavoriteBtn.jsx @@ -66,20 +66,33 @@ export default function FavoriteBtn({ onFavoriteFlagChanged(favoriteFlag === 'Y' ? 'N' : 'Y'); }, [dispatch, favoriteFlag, onFavoriteFlagChanged]); + const handleFavoriteKeyDown = useCallback((e) => { + if (e.key === 'Enter') { + e.preventDefault(); + handleFavoriteClick(); + } + }, [handleFavoriteClick]); + + const handleSpotlightDown = useCallback((e) => { + e.stopPropagation(); + }, []); + return (
{activePopup === Config.ACTIVE_POPUP.favoritePopup && ( { const currentSentMenuRef = useRef(null); const focusedContainerIdRef = useRef(panelInfo?.focusedContainerId); + // ๋งˆ์šดํŠธ ๋กœ๊ทธ + useEffect(() => { + console.log('[JustForYouPanel] ๋งˆ์šดํŠธ๋จ', { + isOnTop, + recentItemsCount: recentItems?.length || 0, + timestamp: Date.now(), + }); + + return () => { + console.log('[JustForYouPanel] ์–ธ๋งˆ์šดํŠธ๋จ', { + timestamp: Date.now(), + }); + }; + }, []); + const handleScroll = useCallback((e) => { setShowButton(e.scrollTop === 0); }, []); @@ -120,7 +135,24 @@ const JustForYouPanel = ({ panelInfo, isOnTop, ...rest }) => { } }, []); + const handleWrapClickCapture = useCallback(() => { + console.log("[JustForYouPanel] wrapper capture: ์ƒ์œ„ div ํ†ต๊ณผ"); + }, []); + + const handlePanelClickCapture = useCallback(() => { + console.log("[JustForYouPanel] TPanel capture: panel ํ†ต๊ณผ"); + }, []); + + const handleBodyClickCapture = useCallback(() => { + console.log("[JustForYouPanel] TBody capture: body ํ†ต๊ณผ"); + }, []); + + const handleButtonWrapperClickCapture = useCallback(() => { + console.log("[JustForYouPanel] ๋ฒ„ํŠผ ๊ฐ์‹ธ๋Š” div capture: ๋ฒ„ํŠผ ๋ฐ”๋กœ ์œ„"); + }, []); + const handleTopButtonClick = useCallback(() => { + console.log("[JustForYouPanel] TButton onClick: TOP ๋ฒ„ํŠผ ํด๋ฆญ"); if (cbChangePageRef.current) { cbChangePageRef.current(0, true); } @@ -132,6 +164,10 @@ const JustForYouPanel = ({ panelInfo, isOnTop, ...rest }) => { } }, [recentItems]); + const handleTopButtonSpotlightDown = useCallback((e) => { + e.stopPropagation(); + }, []); + const renderItem = useCallback( (item) => { const { @@ -234,9 +270,15 @@ const JustForYouPanel = ({ panelInfo, isOnTop, ...rest }) => { // // //
-
- - +
+ +
@@ -311,15 +353,23 @@ const JustForYouPanel = ({ panelInfo, isOnTop, ...rest }) => { )} {recentItems && recentItems?.length > 10 && ( - - + +
{ + console.log("[JustForYouPanel] DIV onClick: TOP ๋ฒ„ํŠผ DIV ํด๋ฆญ"); + handleTopButtonClick(); + }} + > + +
)} diff --git a/com.twin.app.shoptime/src/views/JustForYouPanel/JustForYouPanel.module.less b/com.twin.app.shoptime/src/views/JustForYouPanel/JustForYouPanel.module.less index ba9d9ab1..92d5e49c 100644 --- a/com.twin.app.shoptime/src/views/JustForYouPanel/JustForYouPanel.module.less +++ b/com.twin.app.shoptime/src/views/JustForYouPanel/JustForYouPanel.module.less @@ -15,6 +15,8 @@ left: 0; top: 0; width: 100%; + z-index: -1; + pointer-events: none; } .itemsContainer { diff --git a/com.twin.app.shoptime/src/views/JustForYouTestPanel/JustForYouTestPanel.jsx b/com.twin.app.shoptime/src/views/JustForYouTestPanel/JustForYouTestPanel.jsx index 5d4c0f0f..7eeaf291 100644 --- a/com.twin.app.shoptime/src/views/JustForYouTestPanel/JustForYouTestPanel.jsx +++ b/com.twin.app.shoptime/src/views/JustForYouTestPanel/JustForYouTestPanel.jsx @@ -60,19 +60,36 @@ const JustForYouTestPanel = ({ panelInfo, ...rest }) => { }, [dispatch]); const handleTopButtonClick = useCallback(() => { + console.log("[JustForYouTestPanel] TOP ๋ฒ„ํŠผ ํด๋ฆญ๋จ", { + cbChangePageRefExists: !!cbChangePageRef.current, + shelfInfosLength: shelfInfos?.length || 0, + firstShelfProductCount: shelfInfos?.[0]?.productInfos?.length || 0, + }); + if (cbChangePageRef.current) { + console.log("[JustForYouTestPanel] cbChangePageRef ํ˜ธ์ถœ"); cbChangePageRef.current(0, true); + } else { + console.log("[JustForYouTestPanel] โš ๏ธ cbChangePageRef.current๊ฐ€ null"); } if ( shelfInfos && shelfInfos.length > 0 && shelfInfos[0].productInfos?.length > 0 - ) { + ) { + console.log("[JustForYouTestPanel] Spotlight.focus('justForYouList_1') ํ˜ธ์ถœ"); Spotlight.focus("justForYouList_1"); + } else { + console.log("[JustForYouTestPanel] โš ๏ธ shelfInfos ์—†์Œ ๋˜๋Š” ๋น„์–ด์žˆ์Œ"); } }, [shelfInfos]); + const handleTopButtonSpotlightDown = useCallback((e) => { + console.log("[JustForYouTestPanel] TOP ๋ฒ„ํŠผ SpotlightDown"); + e.stopPropagation(); + }, []); + const renderItem = useCallback( (shelfId, shelfExpsOrd, productInfos) => ({ index, ...rest }) => { @@ -138,6 +155,7 @@ const JustForYouTestPanel = ({ panelInfo, ...rest }) => { className={css.tVerticalPagenator} spotlightId={"justforyouspotlight"} topMargin={470} + cbChangePageRef={cbChangePageRef} >
{