logaction

com.twin.app.shoptime/src/views/FeaturedBrandsPanel/RecommendedShows/RecommendedShowsNav/RecommendedShowsNav.jsx

@@ -1,6 +1,6 @@
 import React, { memo, useEffect, useRef } from "react";
 
-import { useSelector } from "react-redux";
+import { useSelector, useDispatch} from "react-redux";
 
 import { Job } from "@enact/core/util";
 import SpotlightContainerDecorator from "@enact/spotlight/SpotlightContainerDecorator";
@@ -10,10 +10,10 @@ import {
 } from "@enact/spotlight/src/container";
 
 import TScroller from "../../../../components/TScroller/TScroller";
-import useLogService from "../../../../hooks/useLogService";
 import useScrollTo from "../../../../hooks/useScrollTo";
 import css from "./RecommendedShowsNav.module.less";
 import RecommendedShowsNavItem from "./RecommendedShowsNavItem/RecommendedShowsNavItem";
+import { sendLogFeaturedBrands } from "../../../../actions/logActions";
 
 const Container = SpotlightContainerDecorator(
   { leaveFor: { right: "" }, enterTo: "last-focused" },
@@ -31,8 +31,7 @@ export default memo(function RecommendedShowsNav({
   selectedPatnrId,
   setSelectedCatCd,
 }) {
-  const { sendLogFeaturedBrands } = useLogService();
+  const dispatch = useDispatch();
-
   const { getScrollTo, scrollLeft } = useScrollTo();
 
   const panelInfo = useSelector((state) => state.panels.panels[0]?.panelInfo);
@@ -82,12 +81,12 @@ export default memo(function RecommendedShowsNav({
   useEffect(() => {
     if (fromGNB || fromQuickMenu) {
       logTimerRef.current = setTimeout(() => {
-        sendLogFeaturedBrands({
+        dispatch(sendLogFeaturedBrands({
           patnrId: selectedPatnrId,
           patncNm: selectedPatncNm,
           catCd: firstCatCdRef.current,
           catNm: firstCatNmRef.current,
-        });
+        }));
       }, 500);
 
       return () => clearTimeout(logTimerRef.current);
@@ -97,7 +96,6 @@ export default memo(function RecommendedShowsNav({
     fromQuickMenu,
     selectedPatnrId,
     selectedPatncNm,
-    sendLogFeaturedBrands,
   ]);
 
   return (

com.twin.app.shoptime/src/views/FeaturedBrandsPanel/RecommendedShows/RecommendedShowsNav/RecommendedShowsNavItem/RecommendedShowsNavItem.jsx

@@ -1,10 +1,10 @@
 import React, { useCallback } from "react";
 
 import { useDispatch, useSelector } from "react-redux";
+import { sendLogFeaturedBrands } from "../../../../../actions/logActions";
 
 import { updatePanel } from "../../../../../actions/panelActions";
 import TButton, { TYPES } from "../../../../../components/TButton/TButton";
-import useLogService from "../../../../../hooks/useLogService";
 import useScrollReset from "../../../../../hooks/useScrollReset";
 // import useScrollTopByDistance from "../../../../../hooks/useScrollTopByDistance";
 import { panel_names } from "../../../../../utils/Config";
@@ -21,7 +21,6 @@ export default function RecommendedShowsNavItem({
   selectedPatncNm,
   setSelectedCatCd,
 }) {
-  const { sendLogFeaturedBrands } = useLogService();
   const { handleScrollReset, handleStopScrolling } = useScrollReset(
     scrollLeft,
     true
@@ -75,12 +74,12 @@ export default function RecommendedShowsNavItem({
         );
       }
 
-      sendLogFeaturedBrands({
+      dispatch(sendLogFeaturedBrands({
         patnrId: selectedPatnrId ?? panelInfo?.patnrId,
         patncNm: selectedPatncNm,
         catNm,
         catCd: catCd.toString(),
-      });
+      }));
 
       setSelectedCatCd(catCd.toString());
     },
@@ -91,7 +90,6 @@ export default function RecommendedShowsNavItem({
       panelInfo?.patnrId,
       selectedPatncNm,
       selectedPatnrId,
-      sendLogFeaturedBrands,
       setSelectedCatCd,
     ]
   );

com.twin.app.shoptime/src/views/FeaturedBrandsPanel/Series/SeriesNav/SeriesNav.jsx

@@ -12,12 +12,12 @@ import {
 import { updatePanel } from "../../../../actions/panelActions";
 import TButton, { TYPES } from "../../../../components/TButton/TButton";
 import TScroller from "../../../../components/TScroller/TScroller";
-import useLogService from "../../../../hooks/useLogService";
 import useScrollReset from "../../../../hooks/useScrollReset";
 import useScrollTo from "../../../../hooks/useScrollTo";
 import { panel_names } from "../../../../utils/Config";
 import { $L } from "../../../../utils/helperMethods";
 import css from "./SeriesNav.module.less";
+import { sendLogFeaturedBrands } from "../../../../actions/logActions";
 
 const Container = SpotlightContainerDecorator(
   { leaveFor: { right: "" }, enterTo: "last-focused" },
@@ -38,8 +38,6 @@ export default memo(function SeriesNav({
   selectedSeriesId,
   setSelectedSeriesId,
 }) {
-  const { sendLogFeaturedBrands } = useLogService();
-
   const { getScrollTo, scrollLeft } = useScrollTo();
   const { handleScrollReset, handleStopScrolling } = useScrollReset(
     scrollLeft,
@@ -87,12 +85,12 @@ export default memo(function SeriesNav({
   useEffect(() => {
     if (fromGNB || fromQuickMenu) {
       logTimerRef.current = setTimeout(() => {
-        sendLogFeaturedBrands({
+        dispatch(sendLogFeaturedBrands({
           patnrId: selectedPatnrId,
           patncNm: selectedPatncNm,
           srsId: "All",
           srsNm: "All",
-        });
+        }));
       }, 500);
 
       return () => clearTimeout(logTimerRef.current);
@@ -102,7 +100,6 @@ export default memo(function SeriesNav({
     fromQuickMenu,
     selectedPatncNm,
     selectedPatnrId,
-    sendLogFeaturedBrands,
   ]);
 
   const handleBlur = useCallback(
@@ -137,12 +134,12 @@ export default memo(function SeriesNav({
         );
       }
 
-      sendLogFeaturedBrands({
+      dispatch(sendLogFeaturedBrands({
         patnrId: selectedPatnrId ?? panelInfo?.patnrId,
         patncNm: selectedPatncNm,
         srsId: seriesId,
         srsNm: seriesNm,
-      });
+      }));
 
       setSelectedSeriesId(seriesId);
     },
@@ -151,7 +148,6 @@ export default memo(function SeriesNav({
       panelInfo?.patnrId,
       selectedPatncNm,
       selectedPatnrId,
-      sendLogFeaturedBrands,
       setSelectedSeriesId,
     ]
   );

com.twin.app.shoptime/src/views/FeaturedBrandsPanel/Showroom/ShowroomNav/ShowroomNav.jsx

@@ -1,6 +1,6 @@
 import React, { memo, useEffect, useRef } from "react";
 
-import { useSelector } from "react-redux";
+import { useSelector, useDispatch } from "react-redux";
 
 import { Job } from "@enact/core/util";
 import SpotlightContainerDecorator from "@enact/spotlight/SpotlightContainerDecorator";
@@ -10,10 +10,10 @@ import {
 } from "@enact/spotlight/src/container";
 
 import TScroller from "../../../../components/TScroller/TScroller";
-import useLogService from "../../../../hooks/useLogService";
 import useScrollTo from "../../../../hooks/useScrollTo";
 import css from "./ShowroomNav.module.less";
 import ShowroomNavItem from "./ShowroomNavItem/ShowroomNavItem";
+import { sendLogFeaturedBrands } from "../../../../actions/logActions";
 
 const Container = SpotlightContainerDecorator(
   { leaveFor: { right: "" }, enterTo: "last-focused" },
@@ -30,7 +30,7 @@ export default memo(function ShowroomNav({
   selectedRoomId,
   setSelectedRoomId,
 }) {
-  const { sendLogFeaturedBrands } = useLogService();
+  const dispatch = useDispatch();
 
   const { getScrollTo, scrollLeft } = useScrollTo();
 
@@ -71,12 +71,12 @@ export default memo(function ShowroomNav({
   useEffect(() => {
     if (fromGNB || fromQuickMenu) {
       logTimerRef.current = setTimeout(() => {
-        sendLogFeaturedBrands({
+        dispatch(sendLogFeaturedBrands({
           catCd: firstRoomIdRef.current,
           catNm: firstRoomNmRef.current,
           patnrId: selectedPatnrId,
           patncNm: selectedPatncNm,
-        });
+        }));
       }, 500);
 
       return () => clearTimeout(logTimerRef.current);
@@ -86,7 +86,6 @@ export default memo(function ShowroomNav({
     fromQuickMenu,
     selectedPatncNm,
     selectedPatnrId,
-    sendLogFeaturedBrands,
   ]);
 
   return (

com.twin.app.shoptime/src/views/FeaturedBrandsPanel/Showroom/ShowroomNav/ShowroomNavItem/ShowroomNavItem.jsx

@@ -1,10 +1,10 @@
 import React, { useCallback } from "react";
 
 import { useDispatch, useSelector } from "react-redux";
+import { sendLogFeaturedBrands } from "../../../../../actions/logActions";
 
 import { updatePanel } from "../../../../../actions/panelActions";
 import TButton, { TYPES } from "../../../../../components/TButton/TButton";
-import useLogService from "../../../../../hooks/useLogService";
 import useScrollReset from "../../../../../hooks/useScrollReset";
 import { panel_names } from "../../../../../utils/Config";
 import css from "./ShowroomNavItem.module.less";
@@ -20,7 +20,6 @@ export default function ShowroomNavItem({
   selectedRoomId,
   setSelectedRoomId,
 }) {
-  const { sendLogFeaturedBrands } = useLogService();
   const { handleScrollReset, handleStopScrolling } = useScrollReset(
     scrollLeft,
     true
@@ -71,12 +70,12 @@ export default function ShowroomNavItem({
         );
       }
 
-      sendLogFeaturedBrands({
+      dispatch(sendLogFeaturedBrands({
         catCd: roomId,
         catNm: roomNm,
         patnrId: selectedPatnrId,
         patncNm: selectedPatncNm,
-      });
+      }));
 
       setSelectedRoomId(roomId);
     },
@@ -86,7 +85,6 @@ export default function ShowroomNavItem({
       roomNm,
       selectedPatncNm,
       selectedPatnrId,
-      sendLogFeaturedBrands,
       setSelectedRoomId,
     ]
   );

com.twin.app.shoptime/src/views/FeaturedBrandsPanel/UpComing/UpComingList/UpComingList.jsx

@@ -9,12 +9,12 @@ import { setMainLiveUpcomingAlarm } from "../../../../actions/mainActions";
 import { getMyUpcomingAlertShow } from "../../../../actions/myPageActions";
 import { convertUtcToLocal } from "../../../../components/MediaPlayer/util";
 import TVirtualGridList from "../../../../components/TVirtualGridList/TVirtualGridList";
-import useLogService from "../../../../hooks/useLogService";
 import useScrollTo from "../../../../hooks/useScrollTo";
 import { ACTIVE_POPUP } from "../../../../utils/Config";
 import { formatGMTString } from "../../../../utils/helperMethods";
 import UpComingCard from "./UpComingCard/UpComingCard";
 import css from "./UpComingList.module.less";
+import { sendLogUpcomingFlag } from "../../../../actions/logActions";
 
 const getTimeDifferenceInSeconds = (strtDt) => {
   const isoStrtDt = strtDt.replace(" ", "T");
@@ -39,8 +39,6 @@ export default memo(function UpComingList({
   handleItemFocus,
   selectedPatnrId,
 }) {
-  const { sendLogUpcomingFlag } = useLogService();
-
   const { getScrollTo, scrollLeft } = useScrollTo();
 
   const dispatch = useDispatch();
@@ -144,7 +142,7 @@ export default memo(function UpComingList({
             })
           );
 
-          sendLogUpcomingFlag({
+          dispatch(sendLogUpcomingFlag({
             items: [
               {
                 alertFlag: isReserved ? "Off" : "On",
@@ -158,7 +156,7 @@ export default memo(function UpComingList({
                 showNm,
               },
             ],
-          });
+          }));
 
           alamTimer.current = setTimeout(
             () => dispatch(getMyUpcomingAlertShow()),
@@ -166,7 +164,7 @@ export default memo(function UpComingList({
           );
         }
       },
-    [alertShows, dispatch, sendLogUpcomingFlag, upcomAlamUseFlag]
+    [alertShows, dispatch, upcomAlamUseFlag]
   );
 
   const handleFocus = useCallback(() => {

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

@@ -30,7 +30,6 @@ import { pushPanel } from '../../../actions/panelActions';
 import { startVideoPlayer } from '../../../actions/playActions';
 import MobileSendPopUp from '../../../components/MobileSend/MobileSendPopUp';
 import TPopUp from '../../../components/TPopUp/TPopUp';
-import useLogService from '../../../hooks/useLogService';
 import { launchMembershipApp } from '../../../lunaSend';
 import {
   ACTIVE_POPUP,
@@ -41,6 +40,7 @@ import {
 } from '../../../utils/Config';
 import { $L } from '../../../utils/helperMethods';
 import css from '../EventPopUpBanner/EventPopUpBanner.module.less';
+import { sendLogGNB, sendLogShopByMobile } from '../../../actions/logActions';
 
 const Container = SpotlightContainerDecorator(
   { enterTo: "last-focused" },
@@ -48,8 +48,6 @@ const Container = SpotlightContainerDecorator(
 );
 
 export default function EventPopUpBanner() {
-  const { sendLogGNB, sendLogShopByMobile } = useLogService();
-
   const dispatch = useDispatch();
 
   const eventPopInfosData = useSelector(
@@ -77,8 +75,8 @@ export default function EventPopUpBanner() {
   const [eventPopData, setEventPopData] = useState({});
 
   useEffect(() => {
-    sendLogGNB(LOG_MENU.EVENT_POPUP);
+    dispatch(sendLogGNB(LOG_MENU.EVENT_POPUP));
-  }, [sendLogGNB]);
+  }, []);
 
   useEffect(() => {
     if (eventPopInfosData) {
@@ -139,7 +137,7 @@ export default function EventPopUpBanner() {
             tsvFlag: "N",
           };
 
-          sendLogShopByMobile(params);
+          dispatch(sendLogShopByMobile(params));
           shopByMobileLogRef.current = params;
           break;
         }

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

@@ -25,11 +25,11 @@ import {
   startVideoPlayer,
 } from "../../../actions/playActions";
 import CustomImage from "../../../components/CustomImage/CustomImage";
-import useLogService from "../../../hooks/useLogService";
 import usePriceInfo from "../../../hooks/usePriceInfo";
 import { LOG_MENU, LOG_TP_NO, panel_names } from "../../../utils/Config";
 import { $L, formatGMTString } from "../../../utils/helperMethods";
 import css from "./RandomUnit.module.less";
+import { sendLogTopContents } from "../../../actions/logActions";
 
 const SpottableComponent = Spottable("div");
 
@@ -47,8 +47,6 @@ export default function RandomUnit({
 }) {
   const bannerDetailInfos = bannerData.bannerDetailInfos;
 
-  const { sendLogTopContents } = useLogService();
-
   const dispatch = useDispatch();
 
   const curationId = useSelector((state) => state.home?.bannerData?.curationId);
@@ -313,9 +311,9 @@ export default function RandomUnit({
         tmplCd: shptmTmplCd,
       };
 
-      return () => sendLogTopContents(params);
+      return () => dispatch(sendLogTopContents(params));
     }
-  }, [curationId, curtNm, nowMenu, sendLogTopContents, shptmTmplCd]);
+  }, [curationId, curtNm, nowMenu, shptmTmplCd]);
 
   useEffect(() => {
     if (bannerData) {

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

@@ -21,12 +21,12 @@ import liveShow from "../../../../assets/images/tag-liveshow.png";
 import { pushPanel } from "../../../actions/panelActions";
 import { startVideoPlayer } from "../../../actions/playActions";
 import CustomImage from "../../../components/CustomImage/CustomImage";
-import useLogService from "../../../hooks/useLogService";
 import usePriceInfo from "../../../hooks/usePriceInfo";
 import useScrollReset from "../../../hooks/useScrollReset";
 import { LOG_MENU, LOG_TP_NO, panel_names } from "../../../utils/Config";
 import { formatGMTString } from "../../../utils/helperMethods";
 import css from "./RollingUnit.module.less";
+import { sendLogTopContents } from "../../../actions/logActions";
 
 const SpottableComponent = Spottable("div");
 
@@ -44,8 +44,6 @@ export default function RollingUnit({
   const rollingData = bannerData.bannerDetailInfos;
   const rollingDataLength = bannerData.bannerDetailInfos.length;
 
-  const { sendLogTopContents } = useLogService();
-
   const dispatch = useDispatch();
 
   const curationId = useSelector((state) => state.home?.bannerData?.curationId);
@@ -378,7 +376,7 @@ export default function RollingUnit({
 
       return () => {
         if (arrRef.current.every((number) => number !== startIndex)) {
-          sendLogTopContents(params);
+          dispatch(sendLogTopContents(params));
           arrRef.current.push(startIndex);
         }
       };
@@ -387,7 +385,6 @@ export default function RollingUnit({
     curationId,
     curtNm,
     nowMenu,
-    sendLogTopContents,
     shptmTmplCd,
     startIndex,
   ]);

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

@@ -19,13 +19,13 @@ import TItemCard, {
   removeDotAndColon,
 } from "../../../components/TItemCard/TItemCard";
 import TScroller from "../../../components/TScroller/TScroller";
-import useLogService from "../../../hooks/useLogService";
 import useScrollReset from "../../../hooks/useScrollReset";
 import useScrollTo from "../../../hooks/useScrollTo";
 import { 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";
+import { sendLogCuration } from "../../../actions/logActions";
 
 const SpottableComponent = Spottable("div");
 const Container = SpotlightContainerDecorator(
@@ -57,8 +57,6 @@ const SubCategory = ({
 }) => {
   const dispatch = useDispatch();
 
-  const { sendLogCuration } = useLogService();
-
   const { getScrollTo, scrollLeft } = useScrollTo();
 
   const { handleScrollReset, handleStopScrolling } = useScrollReset(
@@ -172,16 +170,16 @@ const SubCategory = ({
   useEffect(() => {
     if (categoryInfos) {
       logRef.current = setTimeout(() => {
-        sendLogCuration({
+        dispatch(sendLogCuration({
           expsOrd: getExpsOrdByLgCatCd(categoryInfos, currentLgCatCd),
           lgCatCd: currentLgCatCd,
           lgCatNm: currentLgCatNm,
           logTpNo: LOG_TP_NO.CURATION.HOME,
-        });
+        }));
       }, 300);
     }
     return () => clearTimeout(logRef.current);
-  }, [categoryInfos, sendLogCuration, currentLgCatCd, currentLgCatNm]);
+  }, [categoryInfos, currentLgCatCd, currentLgCatNm]);
 
   const handleBlur = useCallback((itemIndex) => {
     if (itemIndex === 0) {

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

@@ -40,7 +40,6 @@ import MobileSendPopUp from "../../components/MobileSend/MobileSendPopUp";
 import TBody from "../../components/TBody/TBody";
 import TButton, { TYPES } from "../../components/TButton/TButton";
 import TPanel from "../../components/TPanel/TPanel";
-import useLogService from "../../hooks/useLogService";
 import usePrevious from "../../hooks/usePrevious";
 import useScrollTo from "../../hooks/useScrollTo";
 import { launchMembershipApp } from "../../lunaSend";

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

@@ -10,11 +10,11 @@ import SpotlightContainerDecorator from "@enact/spotlight/SpotlightContainerDeco
 import { updatePanel } from "../../actions/panelActions";
 import CustomImage from "../../components/CustomImage/CustomImage";
 import TPanel from "../../components/TPanel/TPanel";
-import useLogService from "../../hooks/useLogService";
 import { LOG_TP_NO, panel_names } from "../../utils/Config";
 import ImageOverlayContents from "./ImageOverlayContents/ImageOverlayContents";
 import css from "./ImagePanel.module.less";
 import ImageSideContents from "./ImageSideContents/ImageSideContents";
+import { sendLogCuration, sendLogGNB } from "../../actions/logActions";
 
 const Container = SpotlightContainerDecorator(
   { enterTo: "last-focused" },
@@ -40,8 +40,6 @@ const findSelector = (selector, maxAttempts = 5, currentAttempts = 0) => {
 };
 
 export default function ImagePanel({ panelInfo, spotlightId, ...rest }) {
-  const { sendLogCuration, sendLogGNB } = useLogService();
-
   const dispatch = useDispatch();
 
   const brandShowroomInfo = useSelector(
@@ -115,12 +113,12 @@ export default function ImagePanel({ panelInfo, spotlightId, ...rest }) {
       };
 
       themeViewTimer.current = setTimeout(() => {
-        sendLogCuration(params);
+        dispatch(sendLogCuration(params));
       }, 3000);
 
       return () => clearTimeout(themeViewTimer.current);
     }
-  }, [panelInfo, selectedRoomThemeInfo, sendLogCuration]);
+  }, [panelInfo, selectedRoomThemeInfo]);
 
   useEffect(() => {
     if (panelInfo) {
@@ -251,9 +249,9 @@ export default function ImagePanel({ panelInfo, spotlightId, ...rest }) {
 
   const handleSeletedTab = useCallback(
     (nowMenu) => {
-      sendLogGNB(nowMenu);
+      dispatch(sendLogGNB(nowMenu));
     },
-    [sendLogGNB]
+    []
   );
 
   return (

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

@@ -21,11 +21,11 @@ import TButtonTab from "../../components/TButtonTab/TButtonTab";
 import TPanel from "../../components/TPanel/TPanel";
 import TPopUp from "../../components/TPopUp/TPopUp";
 import useDebugKey from "../../hooks/useDebugKey";
-import useLogService from "../../hooks/useLogService";
 import * as Config from "../../utils/Config";
 import { panel_names } from "../../utils/Config";
 import { $L, scaleH, scaleW } from "../../utils/helperMethods";
 import css from "./IntroPanel.module.less";
+import { sendLogGNB, sendLogTerms } from "../../actions/logActions";
 
 const Container = SpotlightContainerDecorator(
   { enterTo: "last-focused" },
@@ -43,7 +43,6 @@ export default function IntroPanel({
   delete rest.panelInfo;
 
   useDebugKey({});
-  const { sendLogTerms, sendLogGNB } = useLogService();
   const dispatch = useDispatch();
   const termsData = useSelector((state) => state.home.termsData);
   const { popupVisible, activePopup } = useSelector(
@@ -65,8 +64,8 @@ export default function IntroPanel({
   const [currentTerms, setCurrentTerms] = useState(null);
 
   useEffect(() => {
-    sendLogGNB(Config.LOG_MENU.TERMS_CONDITIONS);
+    dispatch(sendLogGNB(Config.LOG_MENU.TERMS_CONDITIONS));
-  }, [sendLogGNB]);
+  }, []);
 
   const handleTermsClick = useCallback(
     (trmsTpCdList) => {
@@ -82,10 +81,10 @@ export default function IntroPanel({
           trmsTpCdList === "MST00402"
             ? Config.LOG_TP_NO.TERMS.TEARMS_CONDITIONS
             : Config.LOG_TP_NO.TERMS.PRIVACY_POLICY;
-        sendLogTerms({ logTpNo });
+        dispatch(sendLogTerms({ logTpNo }));
       }
     },
-    [introTermsData, dispatch, sendLogTerms]
+    [introTermsData, dispatch]
   );
 
   const onClose = useCallback(() => {
@@ -102,16 +101,16 @@ export default function IntroPanel({
         })
       );
 
-      sendLogTerms({ logTpNo: Config.LOG_TP_NO.TERMS.AGREE });
+      dispatch(sendLogTerms({ logTpNo: Config.LOG_TP_NO.TERMS.AGREE }));
       // dispatch(popPanel(Config.panel_names.INTRO_PANEL));
     }
-  }, [introTermsData, dispatch, sendLogTerms]);
+  }, [introTermsData, dispatch]);
 
   const handleDisagree = useCallback(() => {
     dispatch(setShowPopup(Config.ACTIVE_POPUP.exitPopup));
 
-    sendLogTerms({ logTpNo: Config.LOG_TP_NO.TERMS.DO_NOT_AGREE });
+    dispatch(sendLogTerms({ logTpNo: Config.LOG_TP_NO.TERMS.DO_NOT_AGREE }));
-  }, [dispatch, sendLogTerms]);
+  }, [dispatch]);
 
   const onExit = useCallback(() => {
     dispatch(setExitApp());

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

@@ -35,7 +35,6 @@ import PreloadImage from "../../components/PreloadImage/PreloadImage";
 import SystemNotification from "../../components/SystemNotification/SystemNotification";
 import TabLayout from "../../components/TabLayout/TabLayout";
 import TPopUp from "../../components/TPopUp/TPopUp";
-import useLogService from "../../hooks/useLogService";
 import usePrevious from "../../hooks/usePrevious";
 import * as Config from "../../utils/Config";
 import { panel_names } from "../../utils/Config";
@@ -63,6 +62,7 @@ import TrendingNowPanel from "../TrendingNowPanel/TrendingNowPanel";
 import VideoTestPanel from "../VideoTestPanel/VideoTestPanel";
 import WelcomeEventPanel from "../WelcomeEventPanel/WelcomeEventPanel";
 import css from "./MainView.module.less";
+import { sendLogAlarmClick, sendLogAlarmPop, sendLogLive, sendLogVOD } from "../../actions/logActions";
 
 const preloadImages = [
   LoadingPreloadImage,
@@ -111,8 +111,6 @@ const STRING_CONF = {
 };
 
 export default function MainView({ className }) {
-  const { sendLogAlarmPop, sendLogAlarmClick, sendLogLive, sendLogVOD } =
-    useLogService();
   const dispatch = useDispatch();
   const httpHeader = useSelector((state) => state.common.httpHeader);
   const mainIndex = useSelector((state) => state.appData.mainIndex);
@@ -353,7 +351,7 @@ export default function MainView({ className }) {
         strtDt: alarmDt,
       } = alertItems[0];
 
-      sendLogAlarmPop({
+      dispatch(sendLogAlarmPop({
         alarmDt,
         alarmType: "Upcoming",
         cnt: "0",
@@ -365,9 +363,9 @@ export default function MainView({ className }) {
         patnrId: patnrId.toString(),
         showId,
         showNm,
-      });
+      }));
     }
-  }, [activePopup, alertItems, sendLogAlarmPop, popupVisible]);
+  }, [activePopup, alertItems, popupVisible]);
 
   // 팝업 30초 후 종료
   useEffect(() => {
@@ -444,7 +442,7 @@ export default function MainView({ className }) {
       strtDt: alarmDt,
     } = alertItems[0];
 
-    sendLogAlarmClick({
+    dispatch(sendLogAlarmClick({
       alarmDt,
       alarmType: "Upcoming",
       clickFlag: "Ok",
@@ -458,7 +456,7 @@ export default function MainView({ className }) {
       patnrId: patnrId.toString(),
       showId,
       showNm,
-    });
+    }));
 
     dispatch(resetPanels());
     dispatch(
@@ -474,7 +472,7 @@ export default function MainView({ className }) {
       clearTimeout(popupTimerRef.current); // 버튼 클릭 시 타이머 제거
       popupTimerRef.current = null;
     }
-  }, [dispatch, alertItems, sendLogAlarmClick]);
+  }, [dispatch, alertItems]);
 
   const onWatchClose = useCallback(() => {
     const {
@@ -488,7 +486,7 @@ export default function MainView({ className }) {
       strtDt: alarmDt,
     } = alertItems[0];
 
-    sendLogAlarmClick({
+    dispatch(sendLogAlarmClick({
       alarmDt,
       alarmType: "Upcoming",
       clickFlag: "No",
@@ -502,11 +500,11 @@ export default function MainView({ className }) {
       patnrId: patnrId.toString(),
       showId,
       showNm,
-    });
+    }));
 
     setIntervalActive((prev) => !prev);
     dispatch(setHidePopup());
-  }, [alertItems, sendLogAlarmClick, dispatch]);
+  }, [alertItems, dispatch]);
 
   const sendLogIfNeeded = useCallback(() => {
     if (
@@ -521,8 +519,8 @@ export default function MainView({ className }) {
     const resetWatchRecord = () =>
       dispatch(changeLocalSettings({ watchRecord: {} }));
 
-    sendLog({ ...watchRecordRef.current }, resetWatchRecord);
+    dispatch(sendLog({ ...watchRecordRef.current }, resetWatchRecord));
-  }, [dispatch, sendLogLive, sendLogVOD, watchRecordRef]);
+  }, [dispatch]);
 
   useEffect(() => {
     if (httpHeader) {

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

@@ -3,7 +3,6 @@ import React, { useEffect } from "react";
 import Spotlight from "@enact/spotlight";
 
 import TPanel from "../../components/TPanel/TPanel";
-import useLogService from "../../hooks/useLogService";
 import useScrollTo from "../../hooks/useScrollTo";
 import { LOG_MENU } from "../../utils/Config";
 import { SpotlightIds } from "../../utils/SpotlightIds";
@@ -15,10 +14,11 @@ import RecentlyViewed from "./MyPageSub/RecentlyViewed/RecentlyViewed";
 import Reminders from "./MyPageSub/Reminders/Reminders";
 import Support from "./MyPageSub/Support/Support";
 import TermsOfService from "./MyPageSub/TermsOfService/TermsOfService";
+import { useDispatch } from "react-redux";
+import { sendLogGNB } from "../../actions/logActions";
 
 export default function MyPagePanel({ panelInfo, isOnTop, spotlightId }) {
-  const { sendLogGNB } = useLogService();
+  const dispatch = useDispatch();
-
   const { menuNm, menuOrd, menuId } = panelInfo || {};
   const { getScrollTo, scrollTop } = useScrollTo();
 
@@ -43,9 +43,9 @@ export default function MyPagePanel({ panelInfo, isOnTop, spotlightId }) {
 
   useEffect(() => {
     if (panelInfo?.menuNm) {
-      sendLogGNB(LOG_MENU.MY_PAGE + "/" + panelInfo.menuNm);
+      dispatch(sendLogGNB(LOG_MENU.MY_PAGE + "/" + panelInfo.menuNm));
     }
-  }, [panelInfo?.menuNm, sendLogGNB]);
+  }, [panelInfo?.menuNm]);
 
   return (
     <TPanel className={css.tPanel} spotlightId={spotlightId}>

com.twin.app.shoptime/src/views/MyPagePanel/MyPageSub/Favorites/Favorites.jsx

@@ -21,19 +21,17 @@ import TButton, { TYPES } from "../../../../components/TButton/TButton";
 import TCheckBox from "../../../../components/TCheckBox/TCheckBox";
 import THeader from "../../../../components/THeader/THeader";
 import TVerticalPagenator from "../../../../components/TVerticalPagenator/TVerticalPagenator";
-import useLogService from "../../../../hooks/useLogService";
 import usePrevious from "../../../../hooks/usePrevious";
 import { panel_names } from "../../../../utils/Config";
 import { $L } from "../../../../utils/helperMethods";
 import { SpotlightIds } from "../../../../utils/SpotlightIds";
 import MyPageItemCard, { SIZES } from "../../MyPageItemCard/MyPageItemCard";
 import css from "../Favorites/Favorites.module.less";
+import { sendLogMyPageMyDelete } from "../../../../actions/logActions";
 
 const HeaderButtonContainer = SpotlightContainerDecorator("div");
 const ContainerBasic = SpotlightContainerDecorator({ enterTo: null }, "div");
 export default function Favorites({ title, panelInfo, isOnTop }) {
-  const { sendLogMyPageMyDelete } = useLogService();
-
   const dispatch = useDispatch();
 
   const favoritesDatas = useSelector(
@@ -154,9 +152,9 @@ export default function Favorites({ title, panelInfo, isOnTop }) {
 
       if (productList.length > 0 || showList.length > 0) {
         dispatch(deleteMyFavorite({ productList, showList }));
-        sendLogMyPageMyDelete({
+        dispatch(sendLogMyPageMyDelete({
           cnt: `${productList.length + showList.length}`,
-        });
+        }));
       }
     }
 
@@ -172,7 +170,6 @@ export default function Favorites({ title, panelInfo, isOnTop }) {
     favoritesDatas,
     selectedItems,
     activeDelete,
-    sendLogMyPageMyDelete,
   ]);
 
   const handleSelectAllToggle = useCallback(() => {

com.twin.app.shoptime/src/views/MyPagePanel/MyPageSub/MyInfo/MyInfo.jsx

@@ -31,7 +31,6 @@ import TButtonTab, {
 import THeader from "../../../../components/THeader/THeader";
 import TPopUp from "../../../../components/TPopUp/TPopUp";
 import TQRCode from "../../../../components/TQRCode/TQRCode";
-import useLogService from "../../../../hooks/useLogService";
 import { getLoginUserData } from "../../../../lunaSend";
 import * as Config from "../../../../utils/Config";
 import { $L, getQRCodeUrl } from "../../../../utils/helperMethods";
@@ -40,6 +39,7 @@ import BillingAddressTab from "./MyInfoTabContents/BillingAddressTab/BillingAddr
 import CouponTab from "./MyInfoTabContents/CouponTab/CouponTab";
 import PaymentTab from "./MyInfoTabContents/PaymentTab/PaymentTab";
 import ShippingAddressTab from "./MyInfoTabContents/ShippingAddressTab/ShippingAddressTab";
+import { sendLogLgAccountLogin, sendLogMyInfoEdit } from "../../../../actions/logActions";
 
 const TabContainer = SpotlightContainerDecorator(
   { enterTo: "last-focused" },
@@ -76,8 +76,6 @@ export default function MyInfo({ title, cbScrollTo }) {
     buttonTabList = getButtonTabList();
   }
 
-  const { sendLogLgAccountLogin, sendLogMyInfoEdit } = useLogService();
-
   const dispatch = useDispatch();
 
   const { profileNick, userNumber, userId } = useSelector(
@@ -109,14 +107,14 @@ export default function MyInfo({ title, cbScrollTo }) {
 
   useEffect(() => {
     if (loginSuccess && userNumber) {
-      sendLogLgAccountLogin({
+      dispatch(sendLogLgAccountLogin({
         lginTpNm: "Tv",
         usrNo: userNumber,
-      });
+      }));
 
       setLoginSuccess(false);
     }
-  }, [loginSuccess, sendLogLgAccountLogin, userNumber]);
+  }, [loginSuccess, userNumber]);
 
   useEffect(() => {
     if (panelInfos && panelInfos.panelInfo && panelInfos.panelInfo.tabForced) {
@@ -233,10 +231,10 @@ export default function MyInfo({ title, cbScrollTo }) {
     } else if (tab === 2) {
       btnNm = "SHIPPING ADDRESS";
     }
-    sendLogMyInfoEdit({ btnNm });
+    dispatch(sendLogMyInfoEdit({ btnNm }));
 
     dispatch(setShowPopup(Config.ACTIVE_POPUP.qrPopup));
-  }, [dispatch, sendLogMyInfoEdit, tab]);
+  }, [dispatch, tab]);
 
   useEffect(() => {
     Spotlight.focus();

com.twin.app.shoptime/src/views/MyPagePanel/MyPageSub/MyOrders/MyOrders.jsx

@@ -53,7 +53,6 @@ import THeader from "../../../../components/THeader/THeader";
 import TPopUp from "../../../../components/TPopUp/TPopUp";
 import TScroller from "../../../../components/TScroller/TScroller";
 import TVerticalPagenator from "../../../../components/TVerticalPagenator/TVerticalPagenator";
-import useLogService from "../../../../hooks/useLogService";
 import usePrevious from "../../../../hooks/usePrevious";
 import * as Config from "../../../../utils/Config";
 import { GET_MY_INFO_ORDER_SEARCH_LIMIT } from "../../../../utils/Config";
@@ -66,6 +65,7 @@ import { SpotlightIds } from "../../../../utils/SpotlightIds";
 import NoOrderList from "./components/NoOrderList";
 import OrderListCard from "./components/OrderListCard";
 import css from "./MyOrders.module.less";
+import { sendLogOrderBtnClick, sendLogOrderChange } from "../../../../actions/logActions";
 
 const Container = SpotlightContainerDecorator("div");
 const ListContainer = SpotlightContainerDecorator("div");
@@ -85,7 +85,6 @@ const getButtonTabList = () => {
 };
 
 export default function MyOrders({ title, panelInfo, isOnTop }) {
-  const { sendLogOrderBtnClick, sendLogOrderChange } = useLogService();
   const buttonTabList = useMemo(() => getButtonTabList(), []);
   const dispatch = useDispatch();
 
@@ -416,8 +415,8 @@ export default function MyOrders({ title, panelInfo, isOnTop }) {
 
     dispatch(setHidePopup());
     dispatch(paymentTotalCancel(params, moveToCancelTab));
-    sendLogOrderChange({ reqRsn, reqTpNm });
+    dispatch(sendLogOrderChange({ reqRsn, reqTpNm }));
-  }, [dispatch, popup, moveToCancelTab, sendLogOrderChange]);
+  }, [dispatch, popup, moveToCancelTab]);
 
   useEffect(() => {
     Spotlight.focus();
@@ -448,9 +447,9 @@ export default function MyOrders({ title, panelInfo, isOnTop }) {
 
   const doSendLogOrderBtnClick = useCallback(
     (btnNm) => {
-      sendLogOrderBtnClick({ btnNm });
+      dispatch(sendLogOrderBtnClick({ btnNm }));
     },
-    [sendLogOrderBtnClick]
+    []
   );
 
   return (

com.twin.app.shoptime/src/views/MyPagePanel/MyPageSub/RecentlyViewed/RecentlyViewed.jsx

@@ -29,11 +29,11 @@ import TCheckBox from '../../../../components/TCheckBox/TCheckBox';
 import THeader from '../../../../components/THeader/THeader';
 import TVerticalPagenator
   from '../../../../components/TVerticalPagenator/TVerticalPagenator';
-import useLogService from '../../../../hooks/useLogService';
 import { $L } from '../../../../utils/helperMethods';
 import { SpotlightIds } from '../../../../utils/SpotlightIds';
 import css from '../RecentlyViewed/RecentlyViewed.module.less';
 import RecentlyViewedContents from './RecentlyViewedContents';
+import { sendLogMyPageMyDelete } from '../../../../actions/logActions';
 
 const HeaderButtonContainer = SpotlightContainerDecorator(
   { enterTo: "last-focused" },
@@ -41,7 +41,6 @@ const HeaderButtonContainer = SpotlightContainerDecorator(
 );
 
 export default function RecentlyViewed({ title, panelInfo, isOnTop }) {
-  const { sendLogMyPageMyDelete } = useLogService();
   const [activeDelete, setActiveDelete] = useState(false);
   const [selectedItems, setSelectedItems] = useState({});
   const [selectAll, setSelectAll] = useState(false);
@@ -169,9 +168,9 @@ export default function RecentlyViewed({ title, panelInfo, isOnTop }) {
       dispatch(changeLocalSettings({ recentItems }));
 
       if (Object.keys(selectedItems).length - recentItems.length > 0) {
-        sendLogMyPageMyDelete({
+        dispatch(sendLogMyPageMyDelete({
           cnt: `${Object.keys(selectedItems).length - recentItems.length}`,
-        });
+        }));
       }
       groupByDate();
     }
@@ -182,7 +181,6 @@ export default function RecentlyViewed({ title, panelInfo, isOnTop }) {
     selectedItems,
     activeDelete,
     localRecentItems,
-    sendLogMyPageMyDelete,
   ]);
 
   const handleSelectAllToggle = useCallback(() => {

com.twin.app.shoptime/src/views/MyPagePanel/MyPageSub/Reminders/Reminders.jsx

@@ -31,12 +31,12 @@ import TPopUp from '../../../../components/TPopUp/TPopUp';
 import TSwitch from '../../../../components/TSwitch/TSwitch';
 import TVirtualGridList
   from '../../../../components/TVirtualGridList/TVirtualGridList';
-import useLogService from '../../../../hooks/useLogService';
 import * as Config from '../../../../utils/Config';
 import { $L } from '../../../../utils/helperMethods';
 import { SpotlightIds } from '../../../../utils/SpotlightIds';
 import css from './Reminders.module.less';
 import RemindersCard, { SIZES } from './RemindersCard';
+import { sendLogMyPageAlertFlag, sendLogMyPageMyDelete } from '../../../../actions/logActions';
 
 const HeaderButtonContainer = SpotlightContainerDecorator(
   {
@@ -46,7 +46,6 @@ const HeaderButtonContainer = SpotlightContainerDecorator(
 );
 
 export default function Reminders({ title, cbScrollTo }) {
-  const { sendLogMyPageAlertFlag, sendLogMyPageMyDelete } = useLogService();
 
   const dispatch = useDispatch();
 
@@ -81,10 +80,10 @@ export default function Reminders({ title, cbScrollTo }) {
     dispatch(setMyUpcomingUseAlert({ upcomingAlamUseFlag: flag }));
     setUseAlarm(!useAlarm);
 
-    sendLogMyPageAlertFlag({
+    dispatch(sendLogMyPageAlertFlag({
       alertFlag: flag === "N" ? "off" : "on",
-    });
+    }));
-  }, [dispatch, sendLogMyPageAlertFlag, useAlarm]);
+  }, [dispatch, useAlarm]);
 
   const handleDeleteBtnClick = useCallback(() => {
     if (activeDelete) {
@@ -119,7 +118,7 @@ export default function Reminders({ title, cbScrollTo }) {
 
         alertShowTimer.current = setTimeout(() => {
           dispatch(getMyUpcomingAlertShow());
-          sendLogMyPageMyDelete({ cnt: `${showList.length}` });
+          dispatch(sendLogMyPageMyDelete({ cnt: `${showList.length}` }));
         }, 200);
       }
     }

com.twin.app.shoptime/src/views/MyPagePanel/MyPageSub/Support/ListContents/ListContents.jsx

@@ -10,15 +10,14 @@ import TButton from "../../../../../components/TButton/TButton";
 import TButtonScroller from "../../../../../components/TButtonScroller/TButtonScroller";
 import TPopUp from "../../../../../components/TPopUp/TPopUp";
 import TScroller from "../../../../../components/TScroller/TScroller";
-import useLogService from "../../../../../hooks/useLogService";
 import useScrollTo from "../../../../../hooks/useScrollTo";
 import { scaleH, scaleW } from "../../../../../utils/helperMethods";
 import css from "./ListContents.module.less";
+import { sendLogMyPageNotice } from "../../../../../actions/logActions";
 
 const SpottableComponent = Spottable("li");
 
 export default function ListContents({ selectedTab }) {
-  const { sendLogMyPageNotice } = useLogService();
 
   const dispatch = useDispatch();
 
@@ -53,14 +52,14 @@ export default function ListContents({ selectedTab }) {
         setOpenIdx(idx);
         setFaqPopUpOpen(true);
 
-        sendLogMyPageNotice({
+        dispatch(sendLogMyPageNotice({
           itemId: `${selectedTab === 0 ? "FAQ/" : "Notice/"}${
             listInfos[idx]?.notiNo
           }`,
           title: `${selectedTab === 0 ? "FAQ/" : "Notice/"}${
             listInfos[idx]?.notiTitl
           }`,
-        });
+        }));
       }
     },
     [
@@ -68,7 +67,6 @@ export default function ListContents({ selectedTab }) {
       currentInfos,
       faqInfos,
       noticeInfos,
-      sendLogMyPageNotice,
       selectedTab,
     ]
   );

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

@@ -40,7 +40,6 @@ import VideoOverlayWithPhoneNumber from "../../components/VideoOverlayWithPhoneN
 import Media from "../../components/VideoPlayer/Media";
 import TReactPlayer from "../../components/VideoPlayer/TReactPlayer";
 import { VideoPlayer } from "../../components/VideoPlayer/VideoPlayer";
-import useLogService from "../../hooks/useLogService";
 import usePrevious from "../../hooks/usePrevious";
 import * as Config from "../../utils/Config";
 import { panel_names } from "../../utils/Config";
@@ -51,6 +50,7 @@ import PlayerOverlayQRCode from "./PlayerOverlay/PlayerOverlayQRCode";
 import css from "./PlayerPanel.module.less";
 import PlayerTabButton from "./PlayerTabContents/TabButton/PlayerTabButton";
 import TabContainer from "./PlayerTabContents/TabContaienr";
+import { sendLogGNB, sendLogLive, sendLogVOD } from "../../actions/logActions";
 
 const Container = SpotlightContainerDecorator(
   { enterTo: "default-element", preserveld: true },
@@ -148,7 +148,6 @@ const PlayerPanel = ({
   spotlightId,
   ...props
 }) => {
-  const { sendLogGNB, sendLogLive, sendLogVOD } = useLogService();
   const dispatch = useDispatch();
   const videoPlayer = useRef(null);
   const [playListInfo, setPlayListInfo] = useState("");
@@ -229,12 +228,12 @@ const PlayerPanel = ({
 
   useEffect(() => {
     if (!panelInfo?.modal && panelInfo?.shptmBanrTpNm === "MEDIA") {
-      sendLogGNB(Config.LOG_MENU.FULL);
+      dispatch(sendLogGNB(Config.LOG_MENU.FULL));
       prevNowMenuRef.current = nowMenuRef.current;
 
-      return () => sendLogGNB(prevNowMenuRef.current);
+      return () => dispatch(sendLogGNB(prevNowMenuRef.current));
     }
-  }, [panelInfo?.modal, panelInfo?.shptmBanrTpNm, sendLogGNB]);
+  }, [panelInfo?.modal, panelInfo?.shptmBanrTpNm]);
 
   useEffect(() => {
     // case live
@@ -395,9 +394,9 @@ const PlayerPanel = ({
       }, 10000);
 
       return () => {
-        sendLogLive({ ...liveLogParamsRef.current, watchStrtDt }, () =>
+        dispatch(sendLogLive({ ...liveLogParamsRef.current, watchStrtDt }, () =>
           dispatch(changeLocalSettings({ watchRecord: {} }))
-        );
+        ));
         setLogStatus((status) => ({
           ...status,
           isModalLiveLogReady: false,
@@ -428,9 +427,9 @@ const PlayerPanel = ({
       }, 10000);
 
       return () => {
-        sendLogLive({ ...liveLogParamsRef.current, watchStrtDt }, () =>
+        dispatch(sendLogLive({ ...liveLogParamsRef.current, watchStrtDt }, () =>
           dispatch(changeLocalSettings({ watchRecord: {} }))
-        );
+        ));
         setLogStatus((status) => ({
           ...status,
           isFullLiveLogReady: false,
@@ -461,9 +460,9 @@ const PlayerPanel = ({
       }, 10000);
 
       return () => {
-        sendLogLive({ ...liveLogParamsRef.current, watchStrtDt }, () =>
+        dispatch(sendLogLive({ ...liveLogParamsRef.current, watchStrtDt }, () =>
           dispatch(changeLocalSettings({ watchRecord: {} }))
-        );
+        ));
         setLogStatus((status) => ({
           ...status,
           isDetailLiveLogReady: false,
@@ -495,9 +494,9 @@ const PlayerPanel = ({
       }, 10000);
 
       return () => {
-        sendLogVOD({ ...vodLogParamsRef.current, watchStrtDt }, () =>
+        dispatch(sendLogVOD({ ...vodLogParamsRef.current, watchStrtDt }, () =>
           dispatch(changeLocalSettings({ watchRecord: {} }))
-        );
+        ));
         setLogStatus((status) => ({
           ...status,
           isModalVodLogReady: false,
@@ -528,9 +527,9 @@ const PlayerPanel = ({
       }, 10000);
 
       return () => {
-        sendLogVOD({ ...vodLogParamsRef.current, watchStrtDt }, () =>
+        dispatch(sendLogVOD({ ...vodLogParamsRef.current, watchStrtDt }, () =>
           dispatch(changeLocalSettings({ watchRecord: {} }))
-        );
+        ));
         setLogStatus((status) => ({
           ...status,
           isFullVodLogReady: false,
@@ -561,9 +560,9 @@ const PlayerPanel = ({
       }, 10000);
 
       return () => {
-        sendLogVOD({ ...vodLogParamsRef.current, watchStrtDt }, () =>
+        dispatch(sendLogVOD({ ...vodLogParamsRef.current, watchStrtDt }, () =>
           dispatch(changeLocalSettings({ watchRecord: {} }))
-        );
+        ));
         setLogStatus((status) => ({
           ...status,
           isDetailVodLogReady: false,
@@ -594,9 +593,9 @@ const PlayerPanel = ({
       }, 10000);
 
       return () => {
-        sendLogVOD({ ...mediaLogParamsRef.current, watchStrtDt }, () =>
+        dispatch(sendLogVOD({ ...mediaLogParamsRef.current, watchStrtDt }, () =>
           dispatch(changeLocalSettings({ watchRecord: {} }))
-        );
+        ));
         setLogStatus((status) => ({
           ...status,
           isModalMediaLogReady: false,
@@ -626,9 +625,9 @@ const PlayerPanel = ({
       }, 10000);
 
       return () => {
-        sendLogVOD({ ...mediaLogParamsRef.current, watchStrtDt }, () =>
+        dispatch(sendLogVOD({ ...mediaLogParamsRef.current, watchStrtDt }, () =>
           dispatch(changeLocalSettings({ watchRecord: {} }))
-        );
+        ));
         setLogStatus((status) => ({
           ...status,
           isFullMediaLogReady: false,
@@ -654,15 +653,13 @@ const PlayerPanel = ({
     nowMenuRef,
     panelInfo?.modal,
     panelInfo?.showUrl,
-    sendLogLive,
-    sendLogVOD,
   ]);
 
   const handleItemFocus = useCallback(
     (menu) => {
-      sendLogGNB(menu);
+      dispatch(sendLogGNB(menu));
     },
-    [sendLogGNB]
+    []
   );
 
   const videoVerticalVisible = useMemo(() => {
@@ -1638,6 +1635,9 @@ const PlayerPanel = ({
 const propsAreEqual = (prev, next) => {
   const keys = Object.keys(prev);
   const nextKeys = Object.keys(next);
+  if(!next.isOnTop){ //ignore event on background
+    return true;
+  }
   if (keys.length !== nextKeys.length) {
     return false;
   }

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

@@ -12,7 +12,6 @@ import TBody from "../../components/TBody/TBody";
 import TInput, { ICONS, KINDS } from "../../components/TInput/TInput";
 import TPanel from "../../components/TPanel/TPanel";
 import TVerticalPagenator from "../../components/TVerticalPagenator/TVerticalPagenator";
-import useLogService from "../../hooks/useLogService";
 import usePrevious from "../../hooks/usePrevious";
 import { LOG_MENU, panel_names } from "../../utils/Config";
 import NoSearchResults from "./NoSearchResults/NoSearchResults";
@@ -21,6 +20,7 @@ import css from "./SearchPanel.module.less";
 import SearchResults from "./SearchResults/SearchResults";
 import { setContainerLastFocusedElement } from "@enact/spotlight/src/container";
 import { SpotlightIds } from "../../utils/SpotlightIds";
+import { sendLogGNB } from "../../actions/logActions";
 
 const ContainerBasic = SpotlightContainerDecorator(
   { enterTo: "last-focused" },
@@ -29,7 +29,6 @@ const ContainerBasic = SpotlightContainerDecorator(
 const ITEMS_PER_PAGE = 9;
 
 export default function SearchPanel({ panelInfo, isOnTop, spotlightId }) {
-  const { sendLogGNB } = useLogService();
   const dispatch = useDispatch();
   const [firstSpot, setFirstSpot] = useState(false);
   const recommandedKeywords = useSelector(
@@ -63,8 +62,8 @@ export default function SearchPanel({ panelInfo, isOnTop, spotlightId }) {
         ? LOG_MENU.SEARCH_RESULT
         : LOG_MENU.SEARCH_SEARCH;
 
-    sendLogGNB(nowMenu);
+    dispatch(sendLogGNB(nowMenu));
-  }, [searchPerformed, searchQuery, sendLogGNB]);
+  }, [searchPerformed, searchQuery]);
 
   useEffect(() => {
     if (!searchQuery) {
@@ -191,9 +190,9 @@ export default function SearchPanel({ panelInfo, isOnTop, spotlightId }) {
 
   const handleItemFocus = useCallback(
     (nowMenu) => {
-      sendLogGNB(nowMenu);
+      dispatch(sendLogGNB(nowMenu));
     },
-    [sendLogGNB]
+    []
   );
   const onFocusedContainerId = useCallback((containerId) => {
     setFocusedContainerId(containerId);

com.twin.app.shoptime/src/views/SearchPanel/SearchResults/SearchCard/SearchItemCard.jsx

@@ -12,12 +12,12 @@ import {
 import defaultImageItem from "../../../../../assets/images/img-thumb-empty-product@3x.png";
 import { pushPanel, updatePanel } from "../../../../actions/panelActions";
 import CustomImage from "../../../../components/CustomImage/CustomImage";
-import useLogService from "../../../../hooks/useLogService";
 import useScrollTo from "../../../../hooks/useScrollTo";
 import { LOG_TP_NO, panel_names } from "../../../../utils/Config";
 import { getTranslate3dValueByDirection } from "../../../../utils/helperMethods";
 import { SpotlightIds } from "../../../../utils/SpotlightIds";
 import css from "./SearchItemCard.module.less";
+import { sendLogSearchClick } from "../../../../actions/logActions";
 
 const ItemContainer = Spottable("div");
 
@@ -37,8 +37,6 @@ export default memo(function SearchItemCard({
 }) {
   const [firstChk, setFirstChk] = useState(0);
 
-  const { sendLogSearchClick } = useLogService();
-
   const dispatch = useDispatch();
 
   const handleItemClick = useCallback(
@@ -88,14 +86,14 @@ export default memo(function SearchItemCard({
         })
       );
 
-      sendLogSearchClick({
+      dispatch(sendLogSearchClick({
         dcAfPrice: dcPrice,
         keyword: searchQueryRef.current,
         patncNm,
         patnrId,
         prdtId,
         prdtNm: title,
-      });
+      }));
     },
     [
       contentId,
@@ -104,7 +102,6 @@ export default memo(function SearchItemCard({
       idx,
       patncNm,
       searchQueryRef,
-      sendLogSearchClick,
       title,
     ]
   );

com.twin.app.shoptime/src/views/SearchPanel/SearchResults/SearchCard/SearchShowCard.jsx

@@ -9,11 +9,11 @@ import defaultShowImage from "../../../../../assets/images/img-thumb-empty-produ
 import IcLiveShow from "../../../../../assets/images/tag/tag-liveshow.svg";
 import { pushPanel, updatePanel } from "../../../../actions/panelActions";
 import CustomImage from "../../../../components/CustomImage/CustomImage";
-import useLogService from "../../../../hooks/useLogService";
 import { LOG_TP_NO, panel_names } from "../../../../utils/Config";
 import { getTranslate3dValueByDirection } from "../../../../utils/helperMethods";
 import { SpotlightIds } from "../../../../utils/SpotlightIds";
 import css from "./SearchShowCard.module.less";
+import { sendLogSearchClick } from "../../../../actions/logActions";
 
 const CardContainer = Spottable("div");
 
@@ -30,8 +30,6 @@ export default memo(function SearchShowCard({
 }) {
   const [firstChk, setFirstChk] = useState(0);
 
-  const { sendLogSearchClick } = useLogService();
-
   const dispatch = useDispatch();
 
   const handleShowClick = useCallback(
@@ -83,13 +81,13 @@ export default memo(function SearchShowCard({
         })
       );
 
-      sendLogSearchClick({
+      dispatch(sendLogSearchClick({
         keyword: searchQueryRef.current,
         patncNm,
         patnrId,
         showId,
         showNm: title,
-      });
+      }));
     },
     [
       contentId,
@@ -97,7 +95,6 @@ export default memo(function SearchShowCard({
       idx,
       patncNm,
       searchQueryRef,
-      sendLogSearchClick,
       title,
     ]
   );

com.twin.app.shoptime/src/views/SearchPanel/SearchResults/SearchCard/SearchThemeCard.jsx

@@ -6,11 +6,11 @@ import Spotlight from "@enact/spotlight";
 import Spottable from "@enact/spotlight/Spottable";
 
 import { pushPanel, updatePanel } from "../../../../actions/panelActions";
-import useLogService from "../../../../hooks/useLogService";
 import { panel_names } from "../../../../utils/Config";
 import { getTranslate3dValueByDirection } from "../../../../utils/helperMethods";
 import { SpotlightIds } from "../../../../utils/SpotlightIds";
 import css from "./SearchThemeCard.module.less";
+import { sendLogSearchClick } from "../../../../actions/logActions";
 
 const ThemeContainer = Spottable("div");
 
@@ -25,8 +25,6 @@ export default memo(function SearchThemeCard({
 
   ...rest
 }) {
-  const { sendLogSearchClick } = useLogService();
-
   const dispatch = useDispatch();
 
   const [firstChk, setFirstChk] = useState(0);
@@ -81,21 +79,19 @@ export default memo(function SearchThemeCard({
         })
       );
 
-      sendLogSearchClick({
+      dispatch(sendLogSearchClick({
         curationId,
         curationNm: title,
         keyword: searchQueryRef.current,
         patncNm,
         patnrId,
-      });
+      }));
     },
     [
       contentId,
       dispatch,
       idx,
       patncNm,
-      searchQueryRef,
-      sendLogSearchClick,
       title,
     ]
   );

com.twin.app.shoptime/src/views/SearchPanel/SearchResults/SearchResults.jsx

@@ -5,18 +5,18 @@ import React, {
   useRef,
 } from 'react';
 
-import { useSelector } from 'react-redux';
+import { useSelector, useDispatch } from 'react-redux';
 
 import { Job } from '@enact/core/util';
 import Spotlight from '@enact/spotlight';
 import SpotlightContainerDecorator
   from '@enact/spotlight/SpotlightContainerDecorator';
 
-import useLogService from '../../../hooks/useLogService';
 import { $L } from '../../../utils/helperMethods';
 import { SpotlightIds } from '../../../utils/SpotlightIds';
 import css from './SearchResults.module.less';
 import SearchResultsType from './SearchResultsType';
+import { sendLogSearch } from '../../../actions/logActions';
 
 const Container = SpotlightContainerDecorator(
   { enterTo: "last-focused" },
@@ -28,8 +28,7 @@ export default memo(function SearchResults({
   panelInfo,
   searchQueryRef,
 }) {
-  const { sendLogSearch } = useLogService();
+  const dispatch = useDispatch();
-
   const searchDatas = useSelector((state) => state.search.searchDatas) || {};
   const totalCount = useSelector((state) => state.search.totalCount) || {};
 
@@ -78,13 +77,13 @@ export default memo(function SearchResults({
       };
 
       logTimerRef.current = setTimeout(() => {
-        sendLogSearch(params);
+        dispatch(sendLogSearch(params));
         isRecommendedSearchRef.current = false;
       }, 300);
     }
 
     return () => clearTimeout(logTimerRef.current);
-  }, [isRecommendedSearchRef, searchQueryRef, sendLogSearch, totalCount]);
+  }, [totalCount]);
 
   return (
     <Container className={css.container} spotlightId="search-result-type">

com.twin.app.shoptime/src/views/ThemeCurationPanel/ThemeCurationContents/ThemeCurationProductList/ThemeCurationProductListItem/ThemeCurationProductListItem.jsx

@@ -6,11 +6,11 @@ import { Spotlight } from "@enact/spotlight";
 
 import { pushPanel, updatePanel } from "../../../../../actions/panelActions";
 import TItemCard from "../../../../../components/TItemCard/TItemCard";
-import useLogService from "../../../../../hooks/useLogService";
 import usePriceInfo from "../../../../../hooks/usePriceInfo";
 import useScrollReset from "../../../../../hooks/useScrollReset";
 import { panel_names } from "../../../../../utils/Config";
 import css from "./ThemeCurationProductListItem.module.less";
+import { sendLogThemeProduct } from "../../../../../actions/logActions";
 
 export default function ThemeCurationProductListItem({
   contentsIndex,
@@ -19,8 +19,6 @@ export default function ThemeCurationProductListItem({
   shelfProductInfosLength,
   themeProductInfosItem,
 }) {
-  const { sendLogThemeProduct } = useLogService();
-
   const { handleScrollReset, handleStopScrolling } = useScrollReset(
     scrollLeft,
     true
@@ -102,7 +100,7 @@ export default function ThemeCurationProductListItem({
         tsvFlag: themeProductInfosItem?.todaySpclFlag,
       };
 
-      sendLogThemeProduct(params);
+      dispatch(sendLogThemeProduct(params));
     },
     [
       contentsIndex,
@@ -111,7 +109,6 @@ export default function ThemeCurationProductListItem({
       originalPrice,
       panelInfo?.linkTpCd,
       rewardFlag,
-      sendLogThemeProduct,
       themeMenuShelfInfo,
       themeProductInfosItem,
     ]

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

@@ -13,15 +13,14 @@ import THeader from "../../components/THeader/THeader";
 import { removeDotAndColon } from "../../components/TItemCard/TItemCard";
 import TPanel from "../../components/TPanel/TPanel";
 import TVerticalPagenator from "../../components/TVerticalPagenator/TVerticalPagenator";
-import useLogService from "../../hooks/useLogService";
 import { LOG_MENU, panel_names } from "../../utils/Config";
 import { $L } from "../../utils/helperMethods";
 // import { SpotlightIds } from "../../utils/SpotlightIds";
 import ThemeCurationContents from "./ThemeCurationContents/ThemeCurationContents";
 import css from "./ThemeCurationPanel.module.less";
+import { sendLogGNB } from "../../actions/logActions";
 
 export default function ThemeCurationPanel({ panelInfo, spotlightId }) {
-  const { sendLogGNB } = useLogService();
 
   const dispatch = useDispatch();
 
@@ -52,8 +51,8 @@ export default function ThemeCurationPanel({ panelInfo, spotlightId }) {
   const { banrImgUrl, curationId, shelfInfos } = themeMenuShelfInfo || {};
 
   useEffect(() => {
-    sendLogGNB(LOG_MENU.THEME_PAGE);
+    dispatch(sendLogGNB(LOG_MENU.THEME_PAGE));
-  }, [sendLogGNB]);
+  }, []);
 
   const handlePreviousButton = useCallback(
     () => () => {

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

@@ -28,10 +28,10 @@ import TButtonScroller from "../../components/TButtonScroller/TButtonScroller";
 import TButtonTab from "../../components/TButtonTab/TButtonTab";
 import TPanel from "../../components/TPanel/TPanel";
 import TPopUp from "../../components/TPopUp/TPopUp";
-import useLogService from "../../hooks/useLogService";
 import * as Config from "../../utils/Config";
 import { $L, scaleH, scaleW } from "../../utils/helperMethods";
 import css from "../WelcomeEventPanel/WelcomeEventPanel.module.less";
+import { sendLogGNB, sendLogShopByMobile } from "../../actions/logActions";
 
 const Container = SpotlightContainerDecorator(
   { enterTo: "last-focused" },
@@ -50,7 +50,6 @@ const getShopTpNm = (evntTpCd) => {
 };
 
 const WelcomeEventPanel = ({ spotlightId }) => {
-  const { sendLogGNB, sendLogShopByMobile } = useLogService();
 
   const dispatch = useDispatch();
 
@@ -126,8 +125,8 @@ const WelcomeEventPanel = ({ spotlightId }) => {
   }, [billCpnSno, dispatch, eventDatas, evntId, evntTpCd, userNumber]);
 
   useEffect(() => {
-    sendLogGNB(Config.LOG_MENU.WELCOME_EVENT);
+    dispatch(sendLogGNB(Config.LOG_MENU.WELCOME_EVENT));
-  }, [sendLogGNB]);
+  }, []);
 
   useEffect(() => {
     if (eventIssuedStatusSuccess === 0 && eventIssuedStatusSuccess !== null) {
@@ -159,7 +158,7 @@ const WelcomeEventPanel = ({ spotlightId }) => {
         tsvFlag: "N",
       };
 
-      sendLogShopByMobile(params);
+      dispatch(sendLogShopByMobile(params));
       shopByMobileLogRef.current = params;
     } else if (
       eventIssuedStatusSuccess !== null &&
@@ -176,7 +175,6 @@ const WelcomeEventPanel = ({ spotlightId }) => {
     eventInfo?.shptmLnkInfo?.lnkPatnrId,
     eventIssuedStatusSuccess,
     evntTpCd,
-    sendLogShopByMobile,
   ]);
 
   const onClose = useCallback(() => {