[통합로그 No.3] HomeBanner 클릭 시 배너의 대한 정보를 수집하는 로그 함수 호출

This commit is contained in:
dongyoungKo
2025-05-09 17:23:09 +09:00
parent 2374829a13
commit e2b45bc08b
2 changed files with 114 additions and 117 deletions

View File

@@ -4,56 +4,45 @@ import React, {
useMemo,
useRef,
useState,
} from 'react';
} from "react";
import classNames from 'classnames';
import {
useDispatch,
useSelector,
} from 'react-redux';
import classNames from "classnames";
import { useDispatch, useSelector } from "react-redux";
import Spotlight from '@enact/spotlight';
import SpotlightContainerDecorator
from '@enact/spotlight/SpotlightContainerDecorator';
import Spottable from '@enact/spotlight/Spottable';
import { getContainerId } from '@enact/spotlight/src/container';
import Spotlight from "@enact/spotlight";
import SpotlightContainerDecorator from "@enact/spotlight/SpotlightContainerDecorator";
import Spottable from "@enact/spotlight/Spottable";
import { getContainerId } from "@enact/spotlight/src/container";
import btnPlay from '../../../../assets/images/btn/btn-play-thumb-nor.png';
import defaultLogoImg
from '../../../../assets/images/ic-tab-partners-default@3x.png';
import emptyHorImage
from '../../../../assets/images/img-home-banner-empty-hor.png';
import emptyVerImage
from '../../../../assets/images/img-home-banner-empty-ver.png';
import defaultImageItem
from '../../../../assets/images/img-thumb-empty-product@3x.png';
import liveShow from '../../../../assets/images/tag-liveshow.png';
import { changeAppStatus } from '../../../actions/commonActions';
import { updateHomeInfo } from '../../../actions/homeActions';
import btnPlay from "../../../../assets/images/btn/btn-play-thumb-nor.png";
import defaultLogoImg from "../../../../assets/images/ic-tab-partners-default@3x.png";
import emptyHorImage from "../../../../assets/images/img-home-banner-empty-hor.png";
import emptyVerImage from "../../../../assets/images/img-home-banner-empty-ver.png";
import defaultImageItem from "../../../../assets/images/img-thumb-empty-product@3x.png";
import liveShow from "../../../../assets/images/tag-liveshow.png";
import { changeAppStatus } from "../../../actions/commonActions";
import { updateHomeInfo } from "../../../actions/homeActions";
import {
sendLogTopContents,
sendLogTotalRecommend,
} from '../../../actions/logActions';
import { pushPanel } from '../../../actions/panelActions';
} from "../../../actions/logActions";
import { pushPanel } from "../../../actions/panelActions";
import {
finishVideoPreview,
startVideoPlayer,
} from '../../../actions/playActions';
import CustomImage from '../../../components/CustomImage/CustomImage';
import usePriceInfo from '../../../hooks/usePriceInfo';
} from "../../../actions/playActions";
import CustomImage from "../../../components/CustomImage/CustomImage";
import usePriceInfo from "../../../hooks/usePriceInfo";
import {
LOG_CONTEXT_NAME,
LOG_MENU,
LOG_MESSAGE_ID,
LOG_TP_NO,
panel_names,
} from '../../../utils/Config';
import {
$L,
formatGMTString,
} from '../../../utils/helperMethods';
import { TEMPLATE_CODE_CONF } from '../HomePanel';
import css from './RandomUnit.module.less';
} from "../../../utils/Config";
import { $L, formatGMTString } from "../../../utils/helperMethods";
import { TEMPLATE_CODE_CONF } from "../HomePanel";
import css from "./RandomUnit.module.less";
const SpottableComponent = Spottable("div");
@@ -153,6 +142,30 @@ export default function RandomUnit({
return {};
}, [shptmTmplCd]);
const sendBannerLog = useCallback(() => {
const data = randomDataRef.current;
if (data && nowMenu === LOG_MENU.HOME_TOP) {
dispatch(
sendLogTotalRecommend({
contextName: LOG_CONTEXT_NAME.HOME,
messageId: LOG_MESSAGE_ID.BANNER,
curationId,
curationTitle,
contentType: data.shptmBanrTpNm,
contentId: "",
productId: data.prdtId,
productTitle: data.prdtNm,
displayType: "rolling",
partner: data.patncNm,
brand: data.brndNm, // <- 'brnad' 확인
location: data.dspyOrder,
bannerType: data.vtctpYn === "Y" ? "Vertical" : "Horizontal",
})
);
}
}, [randomDataRef, nowMenu]);
// 1. 비디오(live) 에러 감지
// 2. 라이브 영상이 2개 이상이면, 그 다음 영상으로 전환
// 3. 라이브 영상이 1개면 그 다음 영상으로 전환을 할 수 없으므로 에러 로고 화면을 보여준다.
@@ -331,6 +344,7 @@ export default function RandomUnit({
let action = linkType === "DSP00507" ? startVideoPlayer : pushPanel;
dispatch(action(linkInfo));
sendBannerLog();
dispatch(
sendLogTopContents({
...topContentsLogInfo,
@@ -362,6 +376,8 @@ export default function RandomUnit({
})
);
sendBannerLog();
dispatch(
sendLogTopContents({
...topContentsLogInfo,
@@ -369,7 +385,13 @@ export default function RandomUnit({
logTpNo: LOG_TP_NO.TOP_CONTENTS.CLICK,
})
);
}, [dispatch, randomData?.patnrId, randomData?.prdtId, topContentsLogInfo]);
}, [
dispatch,
randomData?.patnrId,
randomData?.prdtId,
randomDataRef,
topContentsLogInfo,
]);
// 비디오 클릭
const videoClick = useCallback(() => {
@@ -403,6 +425,8 @@ export default function RandomUnit({
})
);
sendBannerLog();
dispatch(
sendLogTopContents({
...topContentsLogInfo,
@@ -412,7 +436,7 @@ export default function RandomUnit({
);
onBlur();
}, [randomData, spotlightId, topContentsLogInfo]);
}, [randomData, spotlightId, topContentsLogInfo, nowMenu, randomDataRef]);
// 투데이즈 딜 가격 정보
const { originalPrice, discountedPrice, discountRate, offerInfo } =
@@ -438,26 +462,7 @@ export default function RandomUnit({
//통합로그
useEffect(() => {
if (randomDataRef.current && nowMenu === LOG_MENU.HOME_TOP) {
dispatch(
sendLogTotalRecommend({
contextName: LOG_CONTEXT_NAME.HOME,
messageId: LOG_MESSAGE_ID.BANNER,
curationId: curationId,
curationTitle: curationTitle,
contentType: randomDataRef.current.shptmBanrTpNm,
contentId: "",
productId: randomDataRef.current.prdtId,
productTitle: randomDataRef.current.prdtNm,
displayType: "rolling",
partner: randomDataRef.current.patncNm,
brnad: randomDataRef.current.brndNm,
location: randomDataRef.current.dspyOrder,
bannerType:
randomDataRef.current.vtctpYn === "Y" ? "Vertical" : "Horizontal",
})
);
}
sendBannerLog();
}, [randomDataRef, nowMenu]);
useEffect(() => {

View File

@@ -4,55 +4,41 @@ import React, {
useMemo,
useRef,
useState,
} from 'react';
} from "react";
import classNames from 'classnames';
import {
useDispatch,
useSelector,
} from 'react-redux';
import classNames from "classnames";
import { useDispatch, useSelector } from "react-redux";
import Spotlight from '@enact/spotlight';
import SpotlightContainerDecorator
from '@enact/spotlight/SpotlightContainerDecorator';
import Spottable from '@enact/spotlight/Spottable';
import { getContainerId } from '@enact/spotlight/src/container';
import Spotlight from "@enact/spotlight";
import SpotlightContainerDecorator from "@enact/spotlight/SpotlightContainerDecorator";
import Spottable from "@enact/spotlight/Spottable";
import { getContainerId } from "@enact/spotlight/src/container";
import btnPlay from '../../../../assets/images/btn/btn-play-thumb-nor.png';
import defaultLogoImg
from '../../../../assets/images/ic-tab-partners-default@3x.png';
import emptyHorImage
from '../../../../assets/images/img-home-banner-empty-hor.png';
import emptyVerImage
from '../../../../assets/images/img-home-banner-empty-ver.png';
import defaultImageItem
from '../../../../assets/images/img-thumb-empty-product@3x.png';
import liveShow from '../../../../assets/images/tag-liveshow.png';
import {
setBannerIndex,
updateHomeInfo,
} from '../../../actions/homeActions';
import btnPlay from "../../../../assets/images/btn/btn-play-thumb-nor.png";
import defaultLogoImg from "../../../../assets/images/ic-tab-partners-default@3x.png";
import emptyHorImage from "../../../../assets/images/img-home-banner-empty-hor.png";
import emptyVerImage from "../../../../assets/images/img-home-banner-empty-ver.png";
import defaultImageItem from "../../../../assets/images/img-thumb-empty-product@3x.png";
import liveShow from "../../../../assets/images/tag-liveshow.png";
import { setBannerIndex, updateHomeInfo } from "../../../actions/homeActions";
import {
sendLogTopContents,
sendLogTotalRecommend,
} from '../../../actions/logActions';
import { pushPanel } from '../../../actions/panelActions';
import { startVideoPlayer } from '../../../actions/playActions';
import CustomImage from '../../../components/CustomImage/CustomImage';
import usePriceInfo from '../../../hooks/usePriceInfo';
} from "../../../actions/logActions";
import { pushPanel } from "../../../actions/panelActions";
import { startVideoPlayer } from "../../../actions/playActions";
import CustomImage from "../../../components/CustomImage/CustomImage";
import usePriceInfo from "../../../hooks/usePriceInfo";
import {
LOG_CONTEXT_NAME,
LOG_MENU,
LOG_MESSAGE_ID,
LOG_TP_NO,
panel_names,
} from '../../../utils/Config';
import {
$L,
formatGMTString,
} from '../../../utils/helperMethods';
import { TEMPLATE_CODE_CONF } from '../HomePanel';
import css from './RollingUnit.module.less';
} from "../../../utils/Config";
import { $L, formatGMTString } from "../../../utils/helperMethods";
import { TEMPLATE_CODE_CONF } from "../HomePanel";
import css from "./RollingUnit.module.less";
const SpottableComponent = Spottable("div");
@@ -185,6 +171,31 @@ export default function RollingUnit({
return {};
}, [shptmTmplCd, startIndex]);
const sendBannerLog = useCallback(() => {
if (rollingDataRef.current && nowMenu === LOG_MENU.HOME_TOP) {
dispatch(
sendLogTotalRecommend({
contextName: LOG_CONTEXT_NAME.HOME,
messageId: LOG_MESSAGE_ID.BANNER,
curationId: curationId,
curationTitle: curationTitle,
contentType: rollingDataRef.current[startIndex].shptmBanrTpNm,
contentId: "",
productId: rollingDataRef.current[startIndex].prdtId,
productTitle: rollingDataRef.current[startIndex].prdtNm,
displayType: "rolling",
partner: rollingDataRef.current[startIndex].patncNm,
brand: rollingDataRef.current[startIndex].brndNm,
location: rollingDataRef.current[startIndex].dspyOrder,
bannerType:
rollingDataRef.current[startIndex].vtctpYn === "Y"
? "Vertical"
: "Horizontal",
})
);
}
}, [nowMenu, rollingDataRef]);
useEffect(() => {
if (savedIndex !== undefined) {
setStartIndex(savedIndex);
@@ -325,6 +336,7 @@ export default function RollingUnit({
if (bannerType === "Today's Deals") {
handlePushPanel(panel_names.DETAIL_PANEL, createPanelInfo(currentData));
sendBannerLog();
dispatch(
sendLogTopContents({
...topContentsLogInfo,
@@ -392,7 +404,7 @@ export default function RollingUnit({
default:
return;
}
sendBannerLog();
dispatch(
sendLogTopContents({
...topContentsLogInfo,
@@ -445,6 +457,7 @@ export default function RollingUnit({
modalClassName: css.videoModal,
});
sendBannerLog();
dispatch(
sendLogTopContents({
...topContentsLogInfo,
@@ -510,28 +523,7 @@ export default function RollingUnit({
}, [dispatch, entryMenu, nowMenu, startIndex, topContentsLogInfo]);
useEffect(() => {
if (rollingDataRef.current && nowMenu === LOG_MENU.HOME_TOP) {
dispatch(
sendLogTotalRecommend({
contextName: LOG_CONTEXT_NAME.HOME,
messageId: LOG_MESSAGE_ID.BANNER,
curationId: curationId,
curationTitle: curationTitle,
contentType: rollingDataRef.current[startIndex].shptmBanrTpNm,
contentId: "",
productId: rollingDataRef.current[startIndex].prdtId,
productTitle: rollingDataRef.current[startIndex].prdtNm,
displayType: "rolling",
partner: rollingDataRef.current[startIndex].patncNm,
brnad: rollingDataRef.current[startIndex].brndNm,
location: rollingDataRef.current[startIndex].dspyOrder,
bannerType:
rollingDataRef.current[startIndex].vtctpYn === "Y"
? "Vertical"
: "Horizontal",
})
);
}
sendBannerLog();
}, [rollingDataRef, nowMenu, startIndex]);
useEffect(() => {