diff --git a/com.twin.app.shoptime/src/utils/Config.js b/com.twin.app.shoptime/src/utils/Config.js index 1d15ebb7..451bf540 100644 --- a/com.twin.app.shoptime/src/utils/Config.js +++ b/com.twin.app.shoptime/src/utils/Config.js @@ -595,6 +595,7 @@ export const LOG_CONTEXT_NAME = { FEATURED_BRANDS: "shoptime.featuredpartner", MYINFO: "shoptime.myinfo", ON_SALE: "shoptime.onsale", + TRENDING_NOW: "shoptime.trendingnow", }; export const LOG_MESSAGE_ID = { diff --git a/com.twin.app.shoptime/src/views/TrendingNowPanel/PopularShow/PopularShowIndicator.jsx b/com.twin.app.shoptime/src/views/TrendingNowPanel/PopularShow/PopularShowIndicator.jsx index d1684879..6b1c3594 100644 --- a/com.twin.app.shoptime/src/views/TrendingNowPanel/PopularShow/PopularShowIndicator.jsx +++ b/com.twin.app.shoptime/src/views/TrendingNowPanel/PopularShow/PopularShowIndicator.jsx @@ -20,6 +20,7 @@ const PopularShowIndicator = ({ onSpotlightRight, handleItemFocus, handleItemClick, + currentShelf, isOnTop, }) => { const { @@ -37,7 +38,8 @@ const PopularShowIndicator = ({ const isVertical = Boolean(vtctpYn === "Y"); const _handleItemFocus = useCallback(() => { - if (handleItemFocus) handleItemFocus(LOG_MENU.TRENDING_NOW_POPULAR_SHOWS); + if (handleItemFocus) + handleItemFocus(LOG_MENU.TRENDING_NOW_POPULAR_SHOWS, currentShelf); }, [handleItemFocus]); const _handleItemClick = useCallback(() => { diff --git a/com.twin.app.shoptime/src/views/TrendingNowPanel/TrendingNowPanel.jsx b/com.twin.app.shoptime/src/views/TrendingNowPanel/TrendingNowPanel.jsx index 404a5b95..72120106 100644 --- a/com.twin.app.shoptime/src/views/TrendingNowPanel/TrendingNowPanel.jsx +++ b/com.twin.app.shoptime/src/views/TrendingNowPanel/TrendingNowPanel.jsx @@ -7,7 +7,7 @@ import Spotlight from "@enact/spotlight"; import SpotlightContainerDecorator from "@enact/spotlight/SpotlightContainerDecorator"; import { setContainerLastFocusedElement } from "@enact/spotlight/src/container"; -import { sendLogGNB } from "../../actions/logActions"; +import { sendLogGNB, sendLogTotalRecommend } from "../../actions/logActions"; import { getTop20Show } from "../../actions/mainActions"; import { pushPanel, updatePanel } from "../../actions/panelActions"; import { finishVideoPreview } from "../../actions/playActions"; @@ -21,7 +21,12 @@ import TItemCard, { import TPanel from "../../components/TPanel/TPanel"; import TVerticalPagenator from "../../components/TVerticalPagenator/TVerticalPagenator"; import useWhyDidYouUpdate from "../../hooks/useWhyDidYouUpdate"; -import { LOG_MENU, panel_names } from "../../utils/Config"; +import { + LOG_CONTEXT_NAME, + LOG_MENU, + LOG_MESSAGE_ID, + panel_names, +} from "../../utils/Config"; import { $L } from "../../utils/helperMethods"; import { SpotlightIds } from "../../utils/SpotlightIds"; import PopularShowIndicator from "./PopularShow/PopularShowIndicator"; @@ -62,6 +67,7 @@ const TrendingNowPanel = ({ panelInfo, spotlightId, isOnTop, ...rest }) => { const cbChangePageRef = useRef(null); const isInitialRef = useRef(true); + const currentSentMenuRef = useRef(null); const focusedContainerIdRef = useRef(panelInfo?.focusedContainerId); // effect: data fetching when no data exists in the store @@ -129,6 +135,7 @@ const TrendingNowPanel = ({ panelInfo, spotlightId, isOnTop, ...rest }) => { const handleScroll = useCallback((e) => { setShowButton(e.scrollTop === 0); + if (e.scrollTop !== 0) dispatch(finishVideoPreview()); }, []); @@ -188,7 +195,7 @@ const TrendingNowPanel = ({ panelInfo, spotlightId, isOnTop, ...rest }) => { ); const handleBestSellerFocus = useCallback(() => { - handleItemFocus(LOG_MENU.TRENDING_NOW_BEST_SELLER); + handleItemFocus(LOG_MENU.TRENDING_NOW_BEST_SELLER, STRING_CONF.BEST_SELLER); }, [handleItemFocus]); const handleItemClick = useCallback(() => { @@ -207,9 +214,40 @@ const TrendingNowPanel = ({ panelInfo, spotlightId, isOnTop, ...rest }) => { ); }, [selectedIndex]); - const handleItemFocus = useCallback((nowMenu) => { - setTimeout(() => dispatch(sendLogGNB(nowMenu))); - }, []); + const handleItemFocus = useCallback( + (nowMenu, currentShelf) => { + setTimeout(() => dispatch(sendLogGNB(nowMenu))); + + if (nowMenu !== currentSentMenuRef.current) { + let order; + let spotlightId; + switch (currentShelf) { + case STRING_CONF.POPULAR_SHOW: + order = 1; + spotlightId = SpotlightIds.TRENDING_NOW_POPULAR_SHOW; + break; + case STRING_CONF.BEST_SELLER: + order = 2; + spotlightId = SpotlightIds.TRENDING_NOW_BEST_SELLER; + break; + } + + if (order && spotlightId) { + const params = { + contextName: LOG_CONTEXT_NAME.TRENDING_NOW, + messageId: LOG_MESSAGE_ID.SHELF_CLICK, + shelfLocation: order, + shelfId: spotlightId, + shelfTitle: currentShelf, + }; + dispatch(sendLogTotalRecommend(params)); + + currentSentMenuRef.current = nowMenu; + } + } + }, + [currentSentMenuRef] + ); const handleTopButtonClick = useCallback(() => { if (cbChangePageRef.current) { @@ -293,6 +331,7 @@ const TrendingNowPanel = ({ panelInfo, spotlightId, isOnTop, ...rest }) => { handleItemFocus={handleItemFocus} handleItemClick={handleItemClick} isOnTop={isOnTop} + currentShelf={STRING_CONF.POPULAR_SHOW} /> )}