From f62ccef420d82e6870f0ed43724d6c061db21a44 Mon Sep 17 00:00:00 2001 From: optrader Date: Fri, 12 Dec 2025 17:12:43 +0900 Subject: [PATCH] [251212] fix: FeaturedBrandsPanel Debugging - 1 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ๐Ÿ• ์ปค๋ฐ‹ ์‹œ๊ฐ„: 2025. 12. 12. 17:12:43 ๐Ÿ“Š ๋ณ€๊ฒฝ ํ†ต๊ณ„: โ€ข ์ด ํŒŒ์ผ: 5๊ฐœ โ€ข ์ถ”๊ฐ€: +145์ค„ โ€ข ์‚ญ์ œ: -13์ค„ ๐Ÿ“ ์ˆ˜์ •๋œ ํŒŒ์ผ: ~ com.twin.app.shoptime/src/actions/panelActions.js ~ com.twin.app.shoptime/src/actions/playActions.js ~ com.twin.app.shoptime/src/middleware/panelHistoryMiddleware.js ~ com.twin.app.shoptime/src/views/DetailPanel/DetailPanel.jsx ~ com.twin.app.shoptime/src/views/PlayerPanel/PlayerTabContents/TabContents/ShopNowContents.jsx ๐Ÿ”ง ์ฃผ์š” ๋ณ€๊ฒฝ ๋‚ด์šฉ: โ€ข ํ•ต์‹ฌ ๋น„์ฆˆ๋‹ˆ์Šค ๋กœ์ง ๊ฐœ์„  โ€ข ์ค‘๊ฐ„ ๊ทœ๋ชจ ๊ธฐ๋Šฅ ๊ฐœ์„  --- .../src/actions/panelActions.js | 50 ++++++++- .../src/actions/playActions.js | 102 ++++++++++++++++-- .../src/middleware/panelHistoryMiddleware.js | 2 +- .../src/views/DetailPanel/DetailPanel.jsx | 2 + .../TabContents/ShopNowContents.jsx | 2 +- 5 files changed, 145 insertions(+), 13 deletions(-) diff --git a/com.twin.app.shoptime/src/actions/panelActions.js b/com.twin.app.shoptime/src/actions/panelActions.js index 03ba8237..cfe19ad7 100644 --- a/com.twin.app.shoptime/src/actions/panelActions.js +++ b/com.twin.app.shoptime/src/actions/panelActions.js @@ -93,6 +93,11 @@ export const navigateToDetail = ({ ...additionalInfo, }; + const state = getState(); + const panels = state.panels.panels; + + + // ์„ ํƒ์  ํŒŒ๋ผ๋ฏธํ„ฐ๋“ค ์ถ”๊ฐ€ if (curationId) panelInfo.curationId = curationId; if (nowShelf) panelInfo.nowShelf = nowShelf; @@ -176,8 +181,21 @@ export const navigateToDetail = ({ const isCurrentBannerVideoPlaying = playerPanelInfo.panelInfo?.modal !== false; + console.log('[Detail-BG] ๐ŸŽฏ navigateToDetail - Checking HomeBanner video status:', { + playerPanelModalValue: playerPanelInfo.panelInfo?.modal, + isCurrentBannerVideoPlaying, + sourceMenu, + timestamp: Date.now(), + }); + // HomeBanner์˜ modal=true ๋น„๋””์˜ค๊ฐ€ ์žฌ์ƒ ์ค‘์ด๋ฉด ์ •์ง€ if (isCurrentBannerVideoPlaying) { + console.log('[Detail-BG] ๐ŸŽฌ navigateToDetail - HomeBanner video is playing (modal !== false)', { + playerPanelModal: playerPanelInfo.panelInfo?.modal, + sourceMenu, + action: 'finishVideoPreview', + timestamp: Date.now(), + }); // ๐Ÿ”ฝ ๋น„๋””์˜ค ์ƒํƒœ ์ €์žฅ ํ›„ ์ •์ง€ const { finishVideoPreview } = require('./playActions'); @@ -204,11 +222,15 @@ export const navigateToDetail = ({ }) ); - // ๋น„๋””์˜ค ์ƒํƒœ ์ €์žฅ ํ›„ ์ •์ง€ (๋กœ๊ทธ๋Š” ๊ฐœ๋ฐœ ์‹œ ํ•„์š” ์‹œ ์ฃผ์„ ํ•ด์ œ) - + // ๋น„๋””์˜ค ์ƒํƒœ ์ €์žฅ ํ›„ ์ •์ง€ dispatch(finishVideoPreview()); } else { // ๋น„๋””์˜ค๊ฐ€ ์žฌ์ƒ ์ค‘์ด ์•„๋‹ˆ์–ด๋„ HomePanel ์ƒํƒœ ์ €์žฅ + console.log('[Detail-BG] โญ๏ธ navigateToDetail - HomeBanner video is NOT playing (modal === false or undefined)', { + playerPanelModal: playerPanelInfo.panelInfo?.modal, + sourceMenu, + timestamp: Date.now(), + }); dispatch( updatePanel({ name: panel_names.HOME_PANEL, @@ -458,11 +480,28 @@ export const restoreVideoOnBack = () => { const homePanel = panels.find((p) => p.name === panel_names.HOME_PANEL); const videoStateToRestore = homePanel?.panelInfo?.videoStateToRestore; + console.log('[Detail-BG] ๐Ÿ” restoreVideoOnBack - Checking video restore state:', { + hasVideoStateToRestore: !!videoStateToRestore, + restoreOnBack: videoStateToRestore?.restoreOnBack, + sourceMenu: videoStateToRestore?.sourceMenu, + timestamp: Date.now(), + }); + if (!videoStateToRestore || !videoStateToRestore.restoreOnBack) { + console.log('[Detail-BG] โญ๏ธ restoreVideoOnBack - No video state to restore (skipping)', { + reason: !videoStateToRestore ? 'no videoStateToRestore' : 'restoreOnBack is false', + timestamp: Date.now(), + }); return; } - // ๋น„๋””์˜ค ๋ณต์› ์‹œ์ž‘ (๋กœ๊ทธ๋Š” ๊ฐœ๋ฐœ ์‹œ ํ•„์š” ์‹œ ์ฃผ์„ ํ•ด์ œ) + console.log('[Detail-BG] โ–ถ๏ธ restoreVideoOnBack - Starting video restore', { + sourceMenu: videoStateToRestore.sourceMenu, + patnrId: videoStateToRestore.patnrId, + showId: videoStateToRestore.showId, + modal: true, + timestamp: Date.now(), + }); // ๋น„๋””์˜ค ์ƒํƒœ ๋ณต์› const { startVideoPlayerNew } = require('./playActions'); @@ -489,6 +528,11 @@ export const restoreVideoOnBack = () => { }) ); + console.log('[Detail-BG] โœ… restoreVideoOnBack - Video restore dispatched', { + restoredWithModal: restoreInfo.modal, + timestamp: Date.now(), + }); + // ๋ณต์› ์ƒํƒœ ์ •๋ฆฌ dispatch( updatePanel({ diff --git a/com.twin.app.shoptime/src/actions/playActions.js b/com.twin.app.shoptime/src/actions/playActions.js index b432e9a9..6a7d005c 100644 --- a/com.twin.app.shoptime/src/actions/playActions.js +++ b/com.twin.app.shoptime/src/actions/playActions.js @@ -384,6 +384,13 @@ export const pauseModalVideo = () => (dispatch, getState) => { (panel) => panel.name === panel_names.PLAYER_PANEL && panel.panelInfo?.modal ); + console.log('[Detail-BG] โธ๏ธ pauseModalVideo - Pausing modal video', { + found: !!modalPlayerPanel, + playerPanelModal: modalPlayerPanel?.panelInfo?.modal, + currentIsPaused: modalPlayerPanel?.panelInfo?.isPaused, + timestamp: Date.now(), + }); + if (modalPlayerPanel) { if (DEBUG_MODE === true) { dlog('[pauseModalVideo] Pausing modal video'); @@ -397,6 +404,14 @@ export const pauseModalVideo = () => (dispatch, getState) => { }, }) ); + + console.log('[Detail-BG] โœ… pauseModalVideo - Modal video paused successfully', { + timestamp: Date.now(), + }); + } else { + console.log('[Detail-BG] โš ๏ธ pauseModalVideo - No modal PlayerPanel found', { + timestamp: Date.now(), + }); } }; @@ -409,6 +424,13 @@ export const resumeModalVideo = () => (dispatch, getState) => { (panel) => panel.name === panel_names.PLAYER_PANEL && panel.panelInfo?.modal ); + console.log('[Detail-BG] โ–ถ๏ธ resumeModalVideo - Resuming modal video', { + found: !!modalPlayerPanel, + playerPanelModal: modalPlayerPanel?.panelInfo?.modal, + currentIsPaused: modalPlayerPanel?.panelInfo?.isPaused, + timestamp: Date.now(), + }); + if (modalPlayerPanel && modalPlayerPanel.panelInfo?.isPaused) { if (DEBUG_MODE === true) { dlog('[resumeModalVideo] Resuming modal video'); @@ -422,6 +444,16 @@ export const resumeModalVideo = () => (dispatch, getState) => { }, }) ); + + console.log('[Detail-BG] โœ… resumeModalVideo - Modal video resumed successfully', { + timestamp: Date.now(), + }); + } else { + console.log('[Detail-BG] โš ๏ธ resumeModalVideo - Modal video not paused or panel not found', { + found: !!modalPlayerPanel, + isPaused: modalPlayerPanel?.panelInfo?.isPaused, + timestamp: Date.now(), + }); } }; @@ -434,6 +466,13 @@ export const pauseFullscreenVideo = () => (dispatch, getState) => { (panel) => panel.name === panel_names.PLAYER_PANEL && !panel.panelInfo?.modal ); + console.log('[Detail-BG] โธ๏ธ pauseFullscreenVideo - Pausing fullscreen video', { + found: !!fullscreenPlayerPanel, + playerPanelModal: fullscreenPlayerPanel?.panelInfo?.modal, + currentIsPaused: fullscreenPlayerPanel?.panelInfo?.isPaused, + timestamp: Date.now(), + }); + if (fullscreenPlayerPanel) { dispatch( updatePanel({ @@ -444,6 +483,14 @@ export const pauseFullscreenVideo = () => (dispatch, getState) => { }, }) ); + + console.log('[Detail-BG] โœ… pauseFullscreenVideo - Fullscreen video paused successfully', { + timestamp: Date.now(), + }); + } else { + console.log('[Detail-BG] โš ๏ธ pauseFullscreenVideo - No fullscreen PlayerPanel found', { + timestamp: Date.now(), + }); } }; @@ -451,21 +498,19 @@ export const pauseFullscreenVideo = () => (dispatch, getState) => { export const resumeFullscreenVideo = () => (dispatch, getState) => { const panels = getState().panels.panels; - // console.log('[BgVideo] resumeFullscreenVideo called - panels:', { - // panelsCount: panels?.length, - // panels: panels?.map(p => ({ name: p.name, modal: p.panelInfo?.modal, isPaused: p.panelInfo?.isPaused })) - // }); - // ์ „์ฒดํ™”๋ฉด PlayerPanel ์ฐพ๊ธฐ (modal์ด false์ธ ํŒจ๋„) const fullscreenPlayerPanel = panels.find( (panel) => panel.name === panel_names.PLAYER_PANEL && !panel.panelInfo?.modal ); - // console.log('[BgVideo] resumeFullscreenVideo - fullscreenPlayerPanel found:', !!fullscreenPlayerPanel); - // console.log('[BgVideo] resumeFullscreenVideo - isPaused:', fullscreenPlayerPanel?.panelInfo?.isPaused); + console.log('[Detail-BG] โ–ถ๏ธ resumeFullscreenVideo - Resuming fullscreen video', { + found: !!fullscreenPlayerPanel, + playerPanelModal: fullscreenPlayerPanel?.panelInfo?.modal, + currentIsPaused: fullscreenPlayerPanel?.panelInfo?.isPaused, + timestamp: Date.now(), + }); if (fullscreenPlayerPanel && fullscreenPlayerPanel.panelInfo?.isPaused) { - // console.log('[BgVideo] resumeFullscreenVideo - dispatching updatePanel with isPaused: false'); dispatch( updatePanel({ name: panel_names.PLAYER_PANEL, @@ -475,7 +520,16 @@ export const resumeFullscreenVideo = () => (dispatch, getState) => { }, }) ); + + console.log('[Detail-BG] โœ… resumeFullscreenVideo - Fullscreen video resumed successfully', { + timestamp: Date.now(), + }); } else { + console.log('[Detail-BG] โš ๏ธ resumeFullscreenVideo - Fullscreen video not paused or panel not found', { + found: !!fullscreenPlayerPanel, + isPaused: fullscreenPlayerPanel?.panelInfo?.isPaused, + timestamp: Date.now(), + }); if (DEBUG_MODE === true) { dlog('[BgVideo] resumeFullscreenVideo - Not resuming (not found or not paused)'); } @@ -951,6 +1005,12 @@ export const resumePlayerControl = (ownerId) => (dispatch, getState) => { * ์ด ์•ก์…˜์€ ์–ด๋–ค ๋ฐฐ๋„ˆ์—์„œ๋“  ํด๋ฆญ ์‹œ ํ˜ธ์ถœ๋ฉ๋‹ˆ๋‹ค. */ export const goToFullScreen = () => (dispatch, getState) => { + console.log('[Detail-BG] ๐ŸŽฌ goToFullScreen - Setting PlayerPanel to fullscreen mode', { + targetModal: false, + action: 'updatePanel', + timestamp: Date.now(), + }); + // ๊ณต์œ  PlayerPanel์˜ 'modal' ์ƒํƒœ๋ฅผ false๋กœ ๋ณ€๊ฒฝํ•˜์—ฌ ์ „์ฒดํ™”๋ฉด์œผ๋กœ ์ „ํ™˜ dispatch( updatePanel({ @@ -961,6 +1021,10 @@ export const goToFullScreen = () => (dispatch, getState) => { }, }) ); + + console.log('[Detail-BG] โœ… goToFullScreen - PlayerPanel modal set to false (fullscreen)', { + timestamp: Date.now(), + }); }; /** @@ -1171,6 +1235,14 @@ export const startBannerVideo = (videoInfo) => (dispatch, getState) => { ...rest } = videoInfo; + console.log('[Detail-BG] ๐ŸŽฅ startBannerVideo - Starting banner video', { + modalStatus: modal, + bannerId, + displayMode: modal ? 'VISIBLE (modal=true)' : 'FULLSCREEN (modal=false)', + videoId, + timestamp: Date.now(), + }); + // ๋น„๋””์˜ค ์‹๋ณ„์ž ์ƒ์„ฑ const videoIdentifier = videoId || showUrl || bannerId; if (videoIdentifier) { @@ -1190,11 +1262,21 @@ export const startBannerVideo = (videoInfo) => (dispatch, getState) => { // ๊ธฐ์กด PlayerPanel์ด ์žˆ์œผ๋ฉด ์ดˆ๊ธฐํ™” if (existingPlayerPanel) { dlog('[startBannerVideo] ๐Ÿ”„ Resetting existing PLAYER_PANEL before start'); + console.log('[Detail-BG] ๐Ÿ”„ startBannerVideo - Clearing existing PlayerPanel', { + existingModalStatus: existingPlayerPanel.panelInfo?.modal, + timestamp: Date.now(), + }); clearAllVideoTimers(); dispatch(popPanel(panel_names.PLAYER_PANEL)); } // ์ƒˆ๋กœ์šด PlayerPanel push + console.log('[Detail-BG] โž• startBannerVideo - Pushing new PlayerPanel with modal status', { + modal, + modalContainerId, + timestamp: Date.now(), + }); + dispatch( pushPanel( { @@ -1216,6 +1298,10 @@ export const startBannerVideo = (videoInfo) => (dispatch, getState) => { ) ); + console.log('[Detail-BG] โœ… startBannerVideo - PlayerPanel pushed with modal=' + modal, { + timestamp: Date.now(), + }); + dlog('[startBannerVideo] โœจ Panel action dispatched'); }; diff --git a/com.twin.app.shoptime/src/middleware/panelHistoryMiddleware.js b/com.twin.app.shoptime/src/middleware/panelHistoryMiddleware.js index 8c38901b..d7c05ea8 100644 --- a/com.twin.app.shoptime/src/middleware/panelHistoryMiddleware.js +++ b/com.twin.app.shoptime/src/middleware/panelHistoryMiddleware.js @@ -16,7 +16,7 @@ import { calculateIsPanelOnTop } from '../utils/panelUtils'; // ๐ŸŽฏ isOnTop ์œ  // DEBUG_MODE - true์ธ ๊ฒฝ์šฐ์—๋งŒ ๋กœ๊ทธ ์ถœ๋ ฅ // โš ๏ธ [251122] panelHistory ๋กœ๊ทธ ๋น„ํ™œ์„ฑํ™” - ๋กœ๊ทธ ์ƒ์„ฑ ์ฐจ๋‹จ -const DEBUG_MODE = false; +const DEBUG_MODE = true; /** * Panel history middleware diff --git a/com.twin.app.shoptime/src/views/DetailPanel/DetailPanel.jsx b/com.twin.app.shoptime/src/views/DetailPanel/DetailPanel.jsx index f2af6e9b..7923c89f 100644 --- a/com.twin.app.shoptime/src/views/DetailPanel/DetailPanel.jsx +++ b/com.twin.app.shoptime/src/views/DetailPanel/DetailPanel.jsx @@ -303,6 +303,8 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) { const sourcePanel = panelInfo?.sourcePanel; const sourceMenu = panelInfo?.sourceMenu; + console.log('[Detail-BG] 306-line sourcePanel:', sourcePanel, 'sourceMenu:', sourceMenu); + // DetailPanel์ด unmount๋˜๋Š” ์‹œ์  console.log('[DetailPanel] unmount:', { sourcePanel, diff --git a/com.twin.app.shoptime/src/views/PlayerPanel/PlayerTabContents/TabContents/ShopNowContents.jsx b/com.twin.app.shoptime/src/views/PlayerPanel/PlayerTabContents/TabContents/ShopNowContents.jsx index 40af25e0..fb3b1e20 100644 --- a/com.twin.app.shoptime/src/views/PlayerPanel/PlayerTabContents/TabContents/ShopNowContents.jsx +++ b/com.twin.app.shoptime/src/views/PlayerPanel/PlayerTabContents/TabContents/ShopNowContents.jsx @@ -292,7 +292,7 @@ export default function ShopNowContents({ // ===== navigateToDetail ๋ฐฉ์‹ (handleYouMayLikeItemClick ์ฐธ๊ณ ) ===== console.log( - "[ShopNowContents] ShopNow DetailPanel ์ง„์ž… - sourceMenu:", + "[DetailPanel-BG][ShopNowContents] ShopNow DetailPanel ์ง„์ž… - sourceMenu:", SOURCE_MENUS.PLAYER_SHOP_NOW );