player 통합로그 적용 수정

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

@@ -316,7 +316,11 @@ const PlayerPanel = ({
   const mediaLogParamsRef = useRef(null);
   const prevNowMenuRef = useRef(null);
   const watchInterval = useRef(null);
-
+  // useEffect(() => {
+  //   console.log("###videoLoaded", videoLoaded);
+  //   if (nowMenu) {
+  //   }
+  // }, [videoLoaded]);
   const currentLiveShowInfo = useMemo(() => {
     if (liveShowInfos && liveShowInfos.length > 0) {
       const panelInfoChanId = panelInfo?.chanId;
@@ -1927,7 +1931,6 @@ const PlayerPanel = ({
 
     return panelInfo.shptmBanrTpNm;
   }, [panelInfo.shptmBanrTpNm, playListInfo, selectedIndex]);
-
   const clearTimer = useCallback(() => {
     clearTimeout(timerId.current);
     timerId.current = null;
@@ -2009,7 +2012,7 @@ const PlayerPanel = ({
   }, [panelInfo.thumbnail, broadcast]);
 
   const isPlayer = useMemo(() => {
-    if (!panelInfo.modal) {
+    if (!panelInfo?.modal) {
       return "full player";
     }
 
@@ -2031,36 +2034,72 @@ const PlayerPanel = ({
     }
   }, [panelInfo.modal, panels]);
 
-  useEffect(() => {
-    if (!panelInfo?.shptmBanrTpNm) return;
-
-    const brandArray =
-      showDetailInfo?.[0]?.productInfos?.map((item) => item.brndNm) || [];
-    const categoryArray =
-      showDetailInfo?.[0]?.productInfos?.map((item) => item.catNm) || [];
-    const params = {
-      visible: "true",
-      showType: panelInfo.shptmBanrTpNm,
+  const createLogParams = useCallback(
+    (visible) => {
+      if (videoLoaded && isShowType) {
+        if (showDetailInfo?.[0]) {
+          return {
+            visible,
+            showType: isShowType,
             player: isPlayer,
-      contentId: showDetailInfo?.[0]?.showId || "",
-      contentTitle: showDetailInfo?.[0]?.showNm || "",
-      partner: showDetailInfo?.[0]?.patncNm || "",
-      brand: brandArray.join("|") || null,
-      category: categoryArray.join("|") || null,
+            category: showDetailInfo[0].showCatNm,
+            contentId: showDetailInfo[0].showId,
+            contentTitle: showDetailInfo[0].showNm,
+            partner: showDetailInfo[0].patncNm,
             contextName: Config.LOG_CONTEXT_NAME.SHOW,
             messageId: Config.LOG_MESSAGE_ID.SHOWVIEW,
           };
+        } else if (playListInfo?.[selectedIndex]) {
+          const currentItem = playListInfo[selectedIndex];
+          console.log("###visible", visible);
+          return {
+            visible,
+            showType: isShowType,
+            player: isPlayer,
+            category: currentItem.catNm,
+            contentId: currentItem.showId,
+            contentTitle: currentItem.showNm,
+            partner: currentItem.patncNm,
+            contextName: Config.LOG_CONTEXT_NAME.SHOW,
+            messageId: Config.LOG_MESSAGE_ID.SHOWVIEW,
+          };
+        }
+      }
+      return null;
+    },
+    [
+      isShowType,
+      videoLoaded,
+      showDetailInfo?.[0]?.showId,
+      playListInfo?.[selectedIndex]?.showId,
+    ]
+  );
 
+  // isVODPaused 상태 변경 시에만 로그를 보냄
+  useEffect(() => {
+    if (showDetailInfo?.[0]) {
+      const params = createLogParams(!isVODPaused);
+      if (params) {
         dispatch(sendLogTotalRecommend(params));
+      }
+    } else if (playListInfo?.[selectedIndex]) {
+      const params = createLogParams(true);
+      if (params) {
+        dispatch(sendLogTotalRecommend(params));
+      }
+    }
+  }, [isVODPaused, createLogParams]);
 
+  // 컴포넌트 언마운트 시에만 로그를 보냄
+  useEffect(() => {
     return () => {
-      const unmountParams = {
-        ...params,
-        visible: "false",
+      console.log("###cleanup");
+      const params = createLogParams(false);
+      if (params) {
+        dispatch(sendLogTotalRecommend(params));
+      }
     };
-      dispatch(sendLogTotalRecommend(unmountParams));
-    };
-  }, [panelInfo?.shptmBanrTpNm, isPlayer]);
+  }, [createLogParams, dispatch]);
 
   return (
     <TPanel