[DetailPanel] saveToLocalStorage 추가

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

@@ -1,29 +1,23 @@
-import React, {
-  useEffect,
-  useState,
-} from 'react';
+import React, { useCallback, useEffect, useState } from "react";
 
-import {
-  useDispatch,
-  useSelector,
-} from 'react-redux';
+import { useDispatch, useSelector } from "react-redux";
 
 import {
   getThemeCurationDetailInfo,
   getThemeHotelDetailInfo,
-} from '../../actions/homeActions';
-import { getMainCategoryDetail } from '../../actions/mainActions';
-import { popPanel } from '../../actions/panelActions';
-import { getProductGroup } from '../../actions/productActions';
-import TBody from '../../components/TBody/TBody';
-import THeader from '../../components/THeader/THeader';
-import TPanel from '../../components/TPanel/TPanel';
-import css from './DetailPanel.module.less';
-import GroupProduct from './GroupProduct/GroupProduct';
-import SingleProduct from './SingleProduct/SingleProduct';
-import ThemeProduct from './ThemeProduct/ThemeProduct';
-import UnableProduct from './UnableProduct/UnableProduct';
-import YouMayLike from './YouMayLike/YouMayLike';
+} from "../../actions/homeActions";
+import { getMainCategoryDetail } from "../../actions/mainActions";
+import { popPanel } from "../../actions/panelActions";
+import { getProductGroup } from "../../actions/productActions";
+import TBody from "../../components/TBody/TBody";
+import THeader from "../../components/THeader/THeader";
+import TPanel from "../../components/TPanel/TPanel";
+import css from "./DetailPanel.module.less";
+import GroupProduct from "./GroupProduct/GroupProduct";
+import SingleProduct from "./SingleProduct/SingleProduct";
+import ThemeProduct from "./ThemeProduct/ThemeProduct";
+import UnableProduct from "./UnableProduct/UnableProduct";
+import YouMayLike from "./YouMayLike/YouMayLike";
 
 export default function ItemDetail() {
   const [selectedPatnrId, setSelectedPatnrId] = useState("");
@@ -99,6 +93,29 @@ export default function ItemDetail() {
     dispatch(popPanel());
   };
 
+  useEffect(() => {
+    if (panels && selectedPatnrId && selectedPrdtId) {
+      saveToLocalStorage();
+    }
+  }, [selectedPatnrId, selectedPrdtId]);
+
+  const saveToLocalStorage = useCallback(() => {
+    const recentItmes =
+      JSON.parse(window.localStorage.getItem("recentItems")) || [];
+
+    const currentDate = new Date();
+    const formattedDate = `${
+      currentDate.getMonth() + 1
+    }/${currentDate.getDate()}`;
+    recentItmes.push({
+      prdtId: selectedPrdtId,
+      patnrId: selectedPatnrId,
+      date: formattedDate,
+      cntryCd: "US",
+    });
+    window.localStorage.setItem("recentItems", JSON.stringify(recentItmes));
+  }, [panels, selectedPatnrId, selectedPatnrId]);
+
   return (
     <TPanel isTabActivated={false}>
       <THeader