From 1f0b987a14ca4788200204e90176f2582720a3db Mon Sep 17 00:00:00 2001 From: dongyoungKo Date: Tue, 20 May 2025 17:38:43 +0900 Subject: [PATCH] =?UTF-8?q?[=ED=86=B5=ED=95=A9=EB=A1=9C=EA=B7=B8API=20No.1?= =?UTF-8?q?6]=20HotPicks=20=ED=99=94=EB=A9=B4=20=EB=82=B4=EC=97=90?= =?UTF-8?q?=EC=84=9C=20content=20=ED=81=B4=EB=A6=AD=20=EC=8B=9C=20?= =?UTF-8?q?=EB=A1=9C=EA=B7=B8=20=EC=A0=95=EB=B3=B4=20=EC=88=98=EC=A7=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/views/HotPicksPanel/HotPicksPanel.jsx | 16 +++- .../views/HotPicksPanel/Type/TCFI/TCFI.jsx | 10 ++- .../HotPicksPanel/Type/TCFI_2/TCFI_2.jsx | 31 +++++--- .../HotPicksPanel/Type/TCFI_3/TCFI_3.jsx | 31 +++++--- .../HotPicksPanel/Type/TCFI_4/TCFI_4.jsx | 30 ++++--- .../views/HotPicksPanel/Type/TCFV/TCFV.jsx | 7 ++ .../HotPicksPanel/Type/TCFV_2/TCFV_2.jsx | 78 +++++++++++-------- .../HotPicksPanel/Type/TCFV_3/TCFV_3.jsx | 10 +++ .../HotPicksPanel/Type/TCFV_4/TCFV_4.jsx | 10 +++ .../views/HotPicksPanel/Type/TCHH/TCHH.jsx | 27 ++++--- 10 files changed, 168 insertions(+), 82 deletions(-) diff --git a/com.twin.app.shoptime/src/views/HotPicksPanel/HotPicksPanel.jsx b/com.twin.app.shoptime/src/views/HotPicksPanel/HotPicksPanel.jsx index 648cadf6..001323c3 100644 --- a/com.twin.app.shoptime/src/views/HotPicksPanel/HotPicksPanel.jsx +++ b/com.twin.app.shoptime/src/views/HotPicksPanel/HotPicksPanel.jsx @@ -191,10 +191,21 @@ const HotPicksPanel = ({ panelInfo, isOnTop, spotlightId }) => { showEffectiveFlag, smsBtnExpsFlag, eventInfoV2, + curationId, + curationNm, + expsOrd, index ) => { const sendLogClick = () => { - console.log("#sendLogClick", sendLogClick); + const params = { + contextName: Config.LOG_CONTEXT_NAME.HOT_PICKS, + messageId: Config.LOG_MESSAGE_ID.HOTPICKS_CLICK, + curationId: curationId, + curationTitle: curationNm, + location: expsOrd, + }; + + dispatch(sendLogTotalRecommend(params)); }; let itemData = []; @@ -291,6 +302,9 @@ const HotPicksPanel = ({ panelInfo, isOnTop, spotlightId }) => { item.showEffectiveFlag, item.smsBtnExpsFlag, item.eventInfoV2, + item.curationId, + item.curationNm, + item.expsOrd, index ) ); diff --git a/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCFI/TCFI.jsx b/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCFI/TCFI.jsx index 919ad985..a09b941f 100644 --- a/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCFI/TCFI.jsx +++ b/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCFI/TCFI.jsx @@ -35,6 +35,7 @@ export default function TCFI({ changePop, osVersion, eventInfo, + sendLogClick, }) { const bgImgNm = data && data[0].bgImgNo !== null ? data[0].bgImgNo : null; let typeChk = data && data[0].hotelInfos?.length !== 0 ? "hotel" : "theme"; @@ -48,9 +49,14 @@ export default function TCFI({ const currentSmsRetCode = usePrevious(smsRetCode); const dispatch = useDispatch(); - const handleItemClick = () => { + + const handleItemClick = useCallback(() => { const { evntTpCd, evntId, patnrId, curationId, curationNm, eventInfoV2 } = data[0]; + if (sendLogClick) { + sendLogClick(); + } + if ( eventInfo?.evntTpCd === "EVT00102" || eventInfo?.evntTpCd === "EVT00104" @@ -61,7 +67,7 @@ export default function TCFI({ handelEvent(); setClickEvt(false); } - }; + }, [dispatch, sendLogClick, eventInfo]); const changePopTCFI = useCallback( (patnrId, curationId, evntId, evntTpCd, eventInfoV2) => { diff --git a/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCFI_2/TCFI_2.jsx b/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCFI_2/TCFI_2.jsx index e87ad821..f2a4a08c 100644 --- a/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCFI_2/TCFI_2.jsx +++ b/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCFI_2/TCFI_2.jsx @@ -1,18 +1,16 @@ -import React, { useCallback } from 'react'; +import React, { useCallback } from "react"; -import classNames from 'classnames'; -import { useDispatch } from 'react-redux'; +import classNames from "classnames"; +import { useDispatch } from "react-redux"; -import SpotlightContainerDecorator - from '@enact/spotlight/SpotlightContainerDecorator'; -import Spottable from '@enact/spotlight/Spottable'; +import SpotlightContainerDecorator from "@enact/spotlight/SpotlightContainerDecorator"; +import Spottable from "@enact/spotlight/Spottable"; -import defaultImageItem - from '../../../../../assets/images/img-thumb-empty-product@3x.png'; -import { pushPanel } from '../../../../actions/panelActions'; -import CustomImage from '../../../../components/CustomImage/CustomImage'; -import { panel_names } from '../../../../utils/Config'; -import css from './TCFI_2.module.less'; +import defaultImageItem from "../../../../../assets/images/img-thumb-empty-product@3x.png"; +import { pushPanel } from "../../../../actions/panelActions"; +import CustomImage from "../../../../components/CustomImage/CustomImage"; +import { panel_names } from "../../../../utils/Config"; +import css from "./TCFI_2.module.less"; const SpottableComponent = Spottable("li"); @@ -31,12 +29,17 @@ export default function TCFI_2({ onSpotlightDown, onSpotlightUp, onItemClick, + sendLogClick, }) { const dispatch = useDispatch(); const handleItemClick = (prdtId) => { if (onItemClick) { onItemClick(); } + + if (sendLogClick) { + sendLogClick(); + } dispatch( pushPanel({ name: panel_names.DETAIL_PANEL, @@ -55,6 +58,10 @@ export default function TCFI_2({ if (onItemClick) { onItemClick(); } + + if (sendLogClick) { + sendLogClick(); + } dispatch( pushPanel({ name: panel_names.DETAIL_PANEL, diff --git a/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCFI_3/TCFI_3.jsx b/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCFI_3/TCFI_3.jsx index efcbfd3c..237dc884 100644 --- a/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCFI_3/TCFI_3.jsx +++ b/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCFI_3/TCFI_3.jsx @@ -1,18 +1,16 @@ -import React, { useCallback } from 'react'; +import React, { useCallback } from "react"; -import classNames from 'classnames'; -import { useDispatch } from 'react-redux'; +import classNames from "classnames"; +import { useDispatch } from "react-redux"; -import SpotlightContainerDecorator - from '@enact/spotlight/SpotlightContainerDecorator'; -import Spottable from '@enact/spotlight/Spottable'; +import SpotlightContainerDecorator from "@enact/spotlight/SpotlightContainerDecorator"; +import Spottable from "@enact/spotlight/Spottable"; -import defaultImageItem - from '../../../../../assets/images/img-thumb-empty-product@3x.png'; -import { pushPanel } from '../../../../actions/panelActions'; -import CustomImage from '../../../../components/CustomImage/CustomImage'; -import { panel_names } from '../../../../utils/Config'; -import css from './TCFI_3.module.less'; +import defaultImageItem from "../../../../../assets/images/img-thumb-empty-product@3x.png"; +import { pushPanel } from "../../../../actions/panelActions"; +import CustomImage from "../../../../components/CustomImage/CustomImage"; +import { panel_names } from "../../../../utils/Config"; +import css from "./TCFI_3.module.less"; const SpottableComponent = Spottable("li"); const Container = SpotlightContainerDecorator( @@ -29,12 +27,17 @@ export default function TCFI_3({ onSpotlightDown, onSpotlightUp, onItemClick, + sendLogClick, }) { const dispatch = useDispatch(); const handleItemClick = (prdtId) => { if (onItemClick) { onItemClick(); } + if (sendLogClick) { + sendLogClick(); + } + dispatch( pushPanel({ name: panel_names.DETAIL_PANEL, @@ -53,6 +56,10 @@ export default function TCFI_3({ if (onItemClick) { onItemClick(); } + + if (sendLogClick) { + sendLogClick(); + } dispatch( pushPanel({ name: panel_names.DETAIL_PANEL, diff --git a/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCFI_4/TCFI_4.jsx b/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCFI_4/TCFI_4.jsx index 91d06d7c..8f2fe72e 100644 --- a/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCFI_4/TCFI_4.jsx +++ b/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCFI_4/TCFI_4.jsx @@ -1,19 +1,17 @@ // @@@ 포커스 처리 남음 -import React, { useCallback } from 'react'; +import React, { useCallback } from "react"; -import classNames from 'classnames'; -import { useDispatch } from 'react-redux'; +import classNames from "classnames"; +import { useDispatch } from "react-redux"; -import SpotlightContainerDecorator - from '@enact/spotlight/SpotlightContainerDecorator'; -import Spottable from '@enact/spotlight/Spottable'; +import SpotlightContainerDecorator from "@enact/spotlight/SpotlightContainerDecorator"; +import Spottable from "@enact/spotlight/Spottable"; -import defaultImageItem - from '../../../../../assets/images/img-thumb-empty-product@3x.png'; -import { pushPanel } from '../../../../actions/panelActions'; -import CustomImage from '../../../../components/CustomImage/CustomImage'; -import { panel_names } from '../../../../utils/Config'; -import css from './TCFI_4.module.less'; +import defaultImageItem from "../../../../../assets/images/img-thumb-empty-product@3x.png"; +import { pushPanel } from "../../../../actions/panelActions"; +import CustomImage from "../../../../components/CustomImage/CustomImage"; +import { panel_names } from "../../../../utils/Config"; +import css from "./TCFI_4.module.less"; const SpottableComponent = Spottable("li"); @@ -31,12 +29,17 @@ export default function TCFI_4({ onSpotlightDown, onSpotlightUp, onItemClick, + sendLogClick, }) { const dispatch = useDispatch(); const handleItemClick = (prdtId) => { if (onItemClick) { onItemClick(); } + + if (sendLogClick) { + sendLogClick(); + } dispatch( pushPanel({ name: panel_names.DETAIL_PANEL, @@ -52,6 +55,9 @@ export default function TCFI_4({ ); }; const handleHotelClick = (hotelId) => { + if (sendLogClick) { + sendLogClick(); + } if (onItemClick) { onItemClick(); } diff --git a/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCFV/TCFV.jsx b/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCFV/TCFV.jsx index b52be262..e78badf2 100644 --- a/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCFV/TCFV.jsx +++ b/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCFV/TCFV.jsx @@ -36,6 +36,7 @@ export default function TCFV({ onSpotlightUp, currentPage, onItemClick, + sendLogClick, mobilePop, changePop, eventInfo, @@ -60,6 +61,9 @@ export default function TCFV({ if (onItemClick) { onItemClick(); } + if (sendLogClick) { + sendLogClick(); + } if (osVersion === false) { if (mobilePop !== "Y") { dispatch( @@ -122,6 +126,9 @@ export default function TCFV({ }; const handleVideoClick = useCallback(() => { + if (sendLogClick) { + sendLogClick(); + } dispatch( startVideoPlayer({ showId: data[0].showId, diff --git a/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCFV_2/TCFV_2.jsx b/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCFV_2/TCFV_2.jsx index cc9ef218..300a118e 100644 --- a/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCFV_2/TCFV_2.jsx +++ b/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCFV_2/TCFV_2.jsx @@ -35,6 +35,7 @@ export default function TCFV_2({ onSpotlightUp, currentPage, scrolling = false, + sendLogClick, }) { const dispatch = useDispatch(); @@ -45,39 +46,54 @@ export default function TCFV_2({ const spotName = "hotpicks-data-spot" + orders; - const handleItemClick = (prdtId) => { - dispatch(finishVideoPreview()); - dispatch( - pushPanel({ - name: panel_names.DETAIL_PANEL, - panelInfo: { - patnrId: data[0].patnrId, - themePrdtId: prdtId, - prdtId: prdtId, - curationId: data[0].curationId, - curationNm: data[0].curationNm, - type: "theme", - }, - }) - ); - }; - const handleHotelClick = (hotelId) => { - dispatch(finishVideoPreview()); - dispatch( - pushPanel({ - name: panel_names.DETAIL_PANEL, - panelInfo: { - patnrId: data[0].patnrId, - themeHotelId: hotelId, - curationId: data[0].curationId, - curationNm: data[0].curationNm, - type: "hotel", - }, - }) - ); - }; + const handleItemClick = useCallback( + (prdtId) => { + if (sendLogClick) { + sendLogClick(); + } + dispatch(finishVideoPreview()); + dispatch( + pushPanel({ + name: panel_names.DETAIL_PANEL, + panelInfo: { + patnrId: data[0].patnrId, + themePrdtId: prdtId, + prdtId: prdtId, + curationId: data[0].curationId, + curationNm: data[0].curationNm, + type: "theme", + }, + }) + ); + }, + [sendLogClick] + ); + const handleHotelClick = useCallback( + (hotelId) => { + if (sendLogClick) { + sendLogClick(); + } + dispatch(finishVideoPreview()); + dispatch( + pushPanel({ + name: panel_names.DETAIL_PANEL, + panelInfo: { + patnrId: data[0].patnrId, + themeHotelId: hotelId, + curationId: data[0].curationId, + curationNm: data[0].curationNm, + type: "hotel", + }, + }) + ); + }, + [sendLogClick] + ); const handleVideoClick = useCallback(() => { + if (sendLogClick) { + sendLogClick(); + } dispatch( startVideoPlayer({ showId: data[0].showId, diff --git a/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCFV_3/TCFV_3.jsx b/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCFV_3/TCFV_3.jsx index 81d3f691..0579a1fd 100644 --- a/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCFV_3/TCFV_3.jsx +++ b/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCFV_3/TCFV_3.jsx @@ -43,6 +43,7 @@ export default function TCFV_3({ onSpotlightUp, currentPage, scrolling = false, + sendLogClick, }) { const dispatch = useDispatch(); @@ -55,6 +56,9 @@ export default function TCFV_3({ const spotName = "hotpicks-data-spot" + orders; const handleItemClick = (prdtId) => { + if (sendLogClick) { + sendLogClick(); + } dispatch(finishVideoPreview()); dispatch( pushPanel({ @@ -71,6 +75,9 @@ export default function TCFV_3({ ); }; const handleHotelClick = (hotelId) => { + if (sendLogClick) { + sendLogClick(); + } dispatch(finishVideoPreview()); dispatch( pushPanel({ @@ -87,6 +94,9 @@ export default function TCFV_3({ }; const handleVideoClick = useCallback(() => { + if (sendLogClick) { + sendLogClick(); + } dispatch( startVideoPlayer({ showId: data[0].showId, diff --git a/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCFV_4/TCFV_4.jsx b/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCFV_4/TCFV_4.jsx index af769cac..d3ba9e4f 100644 --- a/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCFV_4/TCFV_4.jsx +++ b/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCFV_4/TCFV_4.jsx @@ -35,6 +35,7 @@ export default function TCFV_4({ onSpotlightDown, onSpotlightUp, currentPage, + sendLogClick, scrolling = false, }) { const dispatch = useDispatch(); @@ -46,6 +47,9 @@ export default function TCFV_4({ const spotName = "hotpicks-data-spot" + orders; const handleItemClick = (prdtId) => { + if (sendLogClick) { + sendLogClick(); + } dispatch(finishVideoPreview()); dispatch( pushPanel({ @@ -63,6 +67,9 @@ export default function TCFV_4({ }; const handleHotelClick = (hotelId) => { + if (sendLogClick) { + sendLogClick(); + } dispatch(finishVideoPreview()); dispatch( pushPanel({ @@ -79,6 +86,9 @@ export default function TCFV_4({ }; const handleVideoClick = useCallback(() => { + if (sendLogClick) { + sendLogClick(); + } dispatch( startVideoPlayer({ showId: data[0].showId, diff --git a/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCHH/TCHH.jsx b/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCHH/TCHH.jsx index ae65deca..bfc99c6a 100644 --- a/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCHH/TCHH.jsx +++ b/com.twin.app.shoptime/src/views/HotPicksPanel/Type/TCHH/TCHH.jsx @@ -1,18 +1,16 @@ -import React, { useCallback } from 'react'; +import React, { useCallback } from "react"; -import classNames from 'classnames'; -import { useDispatch } from 'react-redux'; +import classNames from "classnames"; +import { useDispatch } from "react-redux"; -import SpotlightContainerDecorator - from '@enact/spotlight/SpotlightContainerDecorator'; -import Spottable from '@enact/spotlight/Spottable'; +import SpotlightContainerDecorator from "@enact/spotlight/SpotlightContainerDecorator"; +import Spottable from "@enact/spotlight/Spottable"; -import defaultImageItem - from '../../../../../assets/images/img-thumb-empty-product@3x.png'; -import { pushPanel } from '../../../../actions/panelActions'; -import CustomImage from '../../../../components/CustomImage/CustomImage'; -import { panel_names } from '../../../../utils/Config'; -import css from './TCHH.module.less'; +import defaultImageItem from "../../../../../assets/images/img-thumb-empty-product@3x.png"; +import { pushPanel } from "../../../../actions/panelActions"; +import CustomImage from "../../../../components/CustomImage/CustomImage"; +import { panel_names } from "../../../../utils/Config"; +import css from "./TCHH.module.less"; const SpottableComponent = Spottable("div"); const Container = SpotlightContainerDecorator( @@ -30,6 +28,7 @@ export default function TCHH({ onSpotlightDown, onSpotlightUp, onItemClick, + sendLogClick, }) { const dispatch = useDispatch(); @@ -42,6 +41,10 @@ export default function TCHH({ if (onItemClick) { onItemClick(); } + + if (sendLogClick) { + sendLogClick(); + } dispatch( pushPanel({ name: panel_names.DETAIL_PANEL,