diff --git a/com.twin.app.shoptime/src/views/FeaturedBrandsPanel/FeaturedBrandsPanel.jsx b/com.twin.app.shoptime/src/views/FeaturedBrandsPanel/FeaturedBrandsPanel.jsx index b00a0c90..7d991f2f 100644 --- a/com.twin.app.shoptime/src/views/FeaturedBrandsPanel/FeaturedBrandsPanel.jsx +++ b/com.twin.app.shoptime/src/views/FeaturedBrandsPanel/FeaturedBrandsPanel.jsx @@ -250,16 +250,17 @@ const FeaturedBrandsPanel = ({ isOnTop, panelInfo, spotlightId }) => { const [selectedSeriesId, setSelectedSeriesId] = useState(null); const [selectedCatCdLv1, setSelectedCatCdLv1] = useState(null); const [selectedCatCdLv2, setSelectedCatCdLv2] = useState(null); - const [_, forceUpdate] = useState({}); + const [, forceUpdate] = useState({}); const brandInfoRef = usePrevious(brandInfo || []); const displayTopButtonRef = usePrevious(displayTopButton); const initialFocusTimeoutJob = useRef(new Job((func) => func(), 0)); - const alamTimer = useRef(null); + const alarmTimer = useRef(null); const cbChangePageRef = useRef(null); const focusedContainerIdRef = useRef(panelInfo?.focusedContainerId); + const lastMenuRef = useRef(null); const orderableFlexContainerRef = useRef(null); const noneTargetTimer = useRef({ timer: null, @@ -310,17 +311,28 @@ const FeaturedBrandsPanel = ({ isOnTop, panelInfo, spotlightId }) => { useEffect(() => { if (brandInfo && isInitialRendered) { + let menu; + if (fromGNB || fromQuickMenu || fromDeepLink) { - setSelectedPatncNm( - findItemByValue(brandInfo, panelInfo?.patnrId)?.patncNm - ); + const patncNm = // + findItemByValue(brandInfo, panelInfo?.patnrId)?.patncNm; + menu = `${LOG_MENU.FEATURED_BRANDS}/${patncNm} ${LOG_MENU.FEATURED_BRANDS_QUICK_MENU}`; + + setSelectedPatncNm(patncNm); setSelectedPatnrId(panelInfo?.patnrId); } + // + else if (fromDetail) { + const patncNm = // + findItemByValue(panelInfo?.brandInfo, panelInfo?.patnrId)?.patncNm; + menu = panelInfo?.lastMenu; - if (fromDetail) { - setSelectedPatncNm( - findItemByValue(panelInfo?.brandInfo, panelInfo?.patnrId)?.patncNm - ); + setSelectedPatncNm(patncNm); + } + + if (menu) { + dispatch(sendLogGNB(menu)); + setIsLogGNBSent(true); } setIsInitialRendered(false); @@ -335,16 +347,10 @@ const FeaturedBrandsPanel = ({ isOnTop, panelInfo, spotlightId }) => { fromQuickMenu, isInitialRendered, panelInfo?.brandInfo, + panelInfo?.lastMenu, panelInfo?.patnrId, ]); - useEffect(() => { - if (fromQuickMenu && selectedPatncNm) { - let menu = `${LOG_MENU.FEATURED_BRANDS}/${selectedPatncNm} ${LOG_MENU.FEATURED_BRANDS_QUICK_MENU}`; - dispatch(sendLogGNB(menu)); - } - }, [fromQuickMenu, panelInfo?.patnrId, selectedPatncNm]); - useEffect(() => { if (sortedBrandLayoutInfo && selectedPatnrId) { const dispatchMap = { @@ -445,9 +451,11 @@ const FeaturedBrandsPanel = ({ isOnTop, panelInfo, spotlightId }) => { setSpotlightDisabled(false); - initialFocusTarget - ? Spotlight.focus(initialFocusTarget) - : findAndFocusFirstContainer(noneTargetTimer); + if (initialFocusTarget) { + Spotlight.focus(initialFocusTarget); + } else { + findAndFocusFirstContainer(noneTargetTimer); + } setIsInitialFocusOccurred(true); dispatch(changeAppStatus({ showLoadingPanel: { show: false } })); @@ -477,7 +485,13 @@ const FeaturedBrandsPanel = ({ isOnTop, panelInfo, spotlightId }) => { }) ); } - }, [isLogGNBSent, isInitialFocusOccurred, selectedPatnrId, selectedPatncNm]); + }, [ + dispatch, + isLogGNBSent, + isInitialFocusOccurred, + selectedPatnrId, + selectedPatncNm, + ]); useEffect(() => { if (selectedCatCd) { @@ -538,15 +552,16 @@ const FeaturedBrandsPanel = ({ isOnTop, panelInfo, spotlightId }) => { name: panel_names.FEATURED_BRANDS_PANEL, panelInfo: { brandInfo: brandInfoRef.current, + displayTopButton: displayTopButtonRef.current, focusedContainerId: focusedContainerIdRef.current, from: null, + lastMenu: lastMenuRef.current, noResetFlag: true, - displayTopButton: displayTopButtonRef.current, }, }) ); - clearTimeout(alamTimer.current); + clearTimeout(alarmTimer.current); clearTimeout(noneTargetTimer.current); initialFocusTimeoutJob.current.stop(); }; @@ -591,7 +606,7 @@ const FeaturedBrandsPanel = ({ isOnTop, panelInfo, spotlightId }) => { dispatch(setMainLiveUpcomingAlarm(upcomingAlarmInfo)); dispatch(deleteMyUpcomingAlertShow({ showList: deletedAlertShows })); - alamTimer.current = setTimeout( + alarmTimer.current = setTimeout( () => dispatch(getMyUpcomingAlertShow()), 200 ); @@ -608,11 +623,12 @@ const FeaturedBrandsPanel = ({ isOnTop, panelInfo, spotlightId }) => { const handleItemFocus = useCallback( (nowMenu) => { - let menu = `${LOG_MENU.FEATURED_BRANDS}/${selectedPatncNm} ${nowMenu}`; + const menu = `${LOG_MENU.FEATURED_BRANDS}/${selectedPatncNm} ${nowMenu}`; dispatch(sendLogGNB(menu)); setIsLogGNBSent(true); + lastMenuRef.current = menu; }, - [selectedPatncNm] + [dispatch, selectedPatncNm] ); const onFocusedContainerId = useCallback((containerId) => {