[통합로그API No.5] Home Category Item Click log

com.twin.app.shoptime/src/components/TItemCard/TItemCard.jsx

@@ -1,32 +1,19 @@
-import React, {
+import React, { memo, useCallback, useEffect, useMemo, useState } from "react";
-  memo,
-  useCallback,
-  useEffect,
-  useMemo,
-  useState,
-} from 'react';
 
-import classNames from 'classnames';
+import classNames from "classnames";
-import { useDispatch, useSelector } from 'react-redux';
+import { useDispatch, useSelector } from "react-redux";
 
-import Spottable from '@enact/spotlight/Spottable';
+import Spottable from "@enact/spotlight/Spottable";
 
-import defaultLogoImg
+import defaultLogoImg from "../../../assets/images/ic-tab-partners-default@3x.png";
-  from '../../../assets/images/ic-tab-partners-default@3x.png';
+import defaultimgHorizontal from "../../../assets/images/img-thumb-empty-hor@3x.png";
-import defaultimgHorizontal
+import defaultImageItem from "../../../assets/images/img-thumb-empty-product@3x.png";
-  from '../../../assets/images/img-thumb-empty-hor@3x.png';
+import defaultimgVertical from "../../../assets/images/img-thumb-empty-ver@3x.png";
-import defaultImageItem
+import IcLiveShow from "../../../assets/images/tag/tag-liveshow.png";
-  from '../../../assets/images/img-thumb-empty-product@3x.png';
+import usePriceInfo from "../../hooks/usePriceInfo";
-import defaultimgVertical
+import { $L, removeSpecificTags } from "../../utils/helperMethods";
-  from '../../../assets/images/img-thumb-empty-ver@3x.png';
+import CustomImage from "../CustomImage/CustomImage";
-import IcLiveShow from '../../../assets/images/tag/tag-liveshow.png';
+import css from "./TItemCard.module.less";
-import usePriceInfo from '../../hooks/usePriceInfo';
-import {
-  $L,
-  removeSpecificTags,
-} from '../../utils/helperMethods';
-import CustomImage from '../CustomImage/CustomImage';
-import css from './TItemCard.module.less';
 import { sendLogTotalRecommend } from "../../actions/logActions";
 
 const SpottableComponent = Spottable("div");
@@ -78,6 +65,14 @@ export default memo(function TItemCard({
   firstLabel,
   label,
   lastLabel,
+  contextName,
+  messageId,
+  location,
+  patnerName,
+  brandName,
+  shelfId,
+  shelfLocation,
+  shelfTitle,
   ...rest
 }) {
   const dispatch = useDispatch();
@@ -117,34 +112,25 @@ export default memo(function TItemCard({
       if (onClick) {
         onClick(e);
 
-      //         const params = {
+        const params = {
-      //   contextName: "",
+          contextName: contextName,
-      //   messageId: "",
+          messageId: messageId,
-      //   shelfLocation: "",
+          shelfLocation: shelfLocation,
-      //   shelfId: "",
+          shelfId: shelfId,
-      //   shelfTitle: "",
+          shelfTitle: shelfTitle,
-      //   productId: productId,
+          productId: productId,
-      //   productTitle: productName,
+          productTitle: productName,
-      //   partner: "",
+          partner: patnerName,
-      //   brand: "",
+          brand: brandName,
-      //   price: originalPrice,
+          price: originalPrice,
-      //   discount: discountRate,
+          discount: discountRate,
-      //   locaiton: "",
+          locaiton: location,
-      //   category: catNm,
+          category: catNm,
-      // }
+        };
-
+        dispatch(sendLogTotalRecommend(params));
-      // dispatch(sendLogTotalRecommend(
-      //   ...params
-      // ))
 
+        console.log("#params", params);
       }
-
-     
-
-
-
-
-
     },
     [onClick, disabled]
   );

com.twin.app.shoptime/src/utils/Config.js

@@ -601,6 +601,7 @@ export const LOG_MESSAGE_ID = {
   CONTENTCLICK: "AL_PAGE_CONTENT_CLICK",
   SHOWVIEW: "AL_SHOW_VIEW_CHANGE",
   SHELF: "AL_SHELF_LIST_SHOWN",
+  SHELF_CLICK: "AL_SHELF_CONTENT_CLICK",
   SMB: "AL_SBM",
   GNB: "AL_GNB_CLICK",
   BUTTONCLICK: "AL_BUTTON_CLICK",

com.twin.app.shoptime/src/views/HomePanel/HomePanel.jsx

@@ -315,6 +315,8 @@ const HomePanel = ({ isOnTop }) => {
                       el.shptmApphmDspyOptNm
                     )}
                     handleItemFocus={handleItemFocus(el.shptmApphmDspyOptCd)}
+                    shelfLocation={el.expsOrd}
+                    shelfTitle={el.shptmApphmDspyOptNm}
                   />
                 );
               } else break;
@@ -331,6 +333,8 @@ const HomePanel = ({ isOnTop }) => {
                       el.shptmApphmDspyOptNm
                     )}
                     handleItemFocus={handleItemFocus(el.shptmApphmDspyOptCd)}
+                    shelfLocation={el.expsOrd}
+                    shelfTitle={el.shptmApphmDspyOptNm}
                   />
                 );
               } else break;

com.twin.app.shoptime/src/views/HomePanel/SubCategory/SubCategory.jsx

@@ -14,7 +14,12 @@ import TScroller from "../../../components/TScroller/TScroller";
 import usePrevious from "../../../hooks/usePrevious";
 import useScrollReset from "../../../hooks/useScrollReset";
 import useScrollTo from "../../../hooks/useScrollTo";
-import { LOG_TP_NO, panel_names } from "../../../utils/Config";
+import {
+  LOG_CONTEXT_NAME,
+  LOG_MESSAGE_ID,
+  LOG_TP_NO,
+  panel_names,
+} from "../../../utils/Config";
 import { SpotlightIds } from "../../../utils/SpotlightIds";
 import CategoryNav from "../../HomePanel/SubCategory/CategoryNav/CategoryNav";
 import css from "../../HomePanel/SubCategory/SubCategory.module.less";
@@ -37,6 +42,8 @@ export default memo(function SubCategory({
   cateNm,
   handleItemFocus,
   handleShelfFocus,
+  shelfLocation,
+  shelfTitle,
 }) {
   const dispatch = useDispatch();
   const { getScrollTo, scrollLeft } = useScrollTo();
@@ -227,12 +234,30 @@ export default memo(function SubCategory({
           {categoryItemInfos &&
             categoryItemInfos?.subCatItemList.map(
               (
-                { prdtId, imgUrl, priceInfo, prdtNm, patnrId, offerInfo },
+                {
+                  prdtId,
+                  imgUrl,
+                  priceInfo,
+                  prdtNm,
+                  patnrId,
+                  offerInfo,
+                  brndNm,
+                  patncNm,
+                },
                 itemIndex
               ) => {
                 return (
                   <TItemCard
                     key={"subItem" + itemIndex}
+                    contextName={LOG_CONTEXT_NAME.HOME}
+                    messageId={LOG_MESSAGE_ID.SHELF_CLICK}
+                    catNm={categoryItemInfos.catNm}
+                    location={itemIndex + 1}
+                    shelfId={spotlightId}
+                    shelfLocation={shelfLocation}
+                    shelfTitle={shelfTitle}
+                    brandName={brndNm}
+                    patnerName={patncNm}
                     imageAlt={prdtId}
                     imageSource={imgUrl}
                     priceInfo={priceInfo}