[search] shopperhouse 상품 이미지 및 링크 연결

- 변수명 수정및 링크를 위한 파트너 아이디 상품 아이디 추가.

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

@@ -1,19 +1,27 @@
-import React, { useCallback, useMemo, useRef, useState } from 'react';
+import React, {
+  useCallback,
+  useMemo,
+  useRef,
+  useState,
+} from 'react';
 
 import classNames from 'classnames';
 import { useDispatch } from 'react-redux';
 
-import SpotlightContainerDecorator from '@enact/spotlight/SpotlightContainerDecorator';
+import SpotlightContainerDecorator
+  from '@enact/spotlight/SpotlightContainerDecorator';
 import Spottable from '@enact/spotlight/Spottable';
 
 import downBtnImg from '../../../assets/images/btn/search_btn_down_arrow.png';
 import upBtnImg from '../../../assets/images/btn/search_btn_up_arrow.png';
 import hotPicksImage from '../../../assets/images/searchpanel/img-hotpicks.png';
-import hotPicksBrandImage from '../../../assets/images/searchpanel/img-search-hotpicks.png';
+import hotPicksBrandImage
+  from '../../../assets/images/searchpanel/img-search-hotpicks.png';
 import CustomImage from '../../components/CustomImage/CustomImage';
 import TButtonTab, { LIST_TYPE } from '../../components/TButtonTab/TButtonTab';
 import TDropDown from '../../components/TDropDown/TDropDown';
-import TVirtualGridList from '../../components/TVirtualGridList/TVirtualGridList';
+import TVirtualGridList
+  from '../../components/TVirtualGridList/TVirtualGridList';
 import { $L } from '../../utils/helperMethods';
 import { SpotlightIds } from '../../utils/SpotlightIds';
 import css from './SearchResults.new.module.less';
@@ -22,28 +30,48 @@ import ShowCard from './SearchResultsNew/ShowCard';
 
 const ITEMS_PER_PAGE = 10;
 
-const SearchResultsNew = ({ itemInfo, showInfo, themeInfo, shopperHouseInfo }) => {
+const SearchResultsNew = ({
+  itemInfo,
+  showInfo,
+  themeInfo,
+  shopperHouseInfo,
+  onClick,
+}) => {
   // ShopperHouse 데이터를 ItemCard 형식으로 변환
   const convertedShopperHouseItems = useMemo(() => {
-    if (!shopperHouseInfo || !shopperHouseInfo.results || shopperHouseInfo.results.length === 0) {
+    if (
+      !shopperHouseInfo ||
+      !shopperHouseInfo.results ||
+      shopperHouseInfo.results.length === 0
+    ) {
       return null;
     }
 
     const docs = shopperHouseInfo.results[0].docs || [];
-    return docs.map((doc, index) => ({
-      thumbnail: doc.thumbNail || doc.imgPath || '', // 이미지 경로
-      title: doc.title || doc.prdtName || '', // 제목
-      dcPrice: doc.dcPrice || doc.price || '', // 할인가격
-      price: doc.orgPrice || doc.price || '', // 원가
-      soldout: doc.soldout || false, // 품절 여부
-      contentId: `shopperhouse_${doc.partnerName}_${doc.prdtId || index}_${doc.partnerId || ''}_${doc.partnerId || ''}_${doc.prdtId || index}`, // contentId 생성
-      reviewGrade: doc.reviewGrade || '', // 리뷰 점수 (추가 정보)
-      partnerName: doc.partnerName || '', // 파트너 이름
-    }));
+    return docs.map((doc, index) => {
+      const contentId = doc.contentId;
+      const tokens = contentId.split("_");
+      const patnrId = tokens?.[4] || "";
+      const prdtId = tokens?.[5] || "";
+
+      return {
+        thumbnail: doc.thumnail || doc.imgPath || "", //이미지 경로
+        title: doc.title || doc.prdtName || "", // 제목
+        dcPrice: doc.dcPrice || doc.price || "", // 할인가격
+        price: doc.orgPrice || doc.price || "", // 원가
+        soldout: doc.soldout || false, // 품절 여부
+        contentId, //콘텐트 아이디
+        reviewGrade: doc.reviewGrade || "", //리뷰 점수 (추가 정보)
+        partnerName: doc.partnerName || "", //파트너 네임
+        patnrId, // 파트너 아이디
+        prdtId, // 상품 아이디
+      };
+    });
   }, [shopperHouseInfo]);
   const getButtonTabList = () => {
     // ShopperHouse 데이터가 있으면 그것을 사용, 없으면 기존 검색 결과 사용
-    const itemLength = convertedShopperHouseItems?.length || itemInfo?.length || 0;
+    const itemLength =
+      convertedShopperHouseItems?.length || itemInfo?.length || 0;
     const showLength = showInfo?.length || 0;
 
     return [
@@ -70,7 +98,8 @@ const SearchResultsNew = ({ itemInfo, showInfo, themeInfo, shopperHouseInfo }) =
   }
 
   // 현재 탭의 데이터 가져오기 - ShopperHouse 데이터 우선
-  const currentData = tab === 0 ? convertedShopperHouseItems || itemInfo : showInfo;
+  const currentData =
+    tab === 0 ? convertedShopperHouseItems || itemInfo : showInfo;
 
   // 표시할 데이터 (처음부터 visibleCount 개수만큼)
   const displayedData = useMemo(() => {
@@ -118,8 +147,8 @@ const SearchResultsNew = ({ itemInfo, showInfo, themeInfo, shopperHouseInfo }) =
     [dropDownTab]
   );
 
-  const SpottableLi = Spottable('li');
-  const SpottableDiv = Spottable('div');
+  const SpottableLi = Spottable("li");
+  const SpottableDiv = Spottable("div");
 
   // 맨 처음으로 이동 (위 버튼)
   const upBtnClick = () => {
@@ -138,7 +167,8 @@ const SearchResultsNew = ({ itemInfo, showInfo, themeInfo, shopperHouseInfo }) =
   // ProductCard 컴포넌트
   const renderItem = useCallback(
     ({ index, ...rest }) => {
-      const { bgImgPath, title, partnerLogo, partnerName, keyword } = themeInfo[index];
+      const { bgImgPath, title, partnerLogo, partnerName, keyword } =
+        themeInfo[index];
       return (
         <SpottableDiv
           key={`searchProduct-${index}`}
@@ -151,7 +181,11 @@ const SearchResultsNew = ({ itemInfo, showInfo, themeInfo, shopperHouseInfo }) =
           </div>
           <div className={css.productInfo}>
             <div className={css.productBrandWrapper}>
-              <img src={partnerLogo} alt={partnerName} className={css.brandLogo} />
+              <img
+                src={partnerLogo}
+                alt={partnerName}
+                className={css.brandLogo}
+              />
             </div>
             <div className={css.productDetails}>
               {keyword && (
@@ -170,6 +204,15 @@ const SearchResultsNew = ({ itemInfo, showInfo, themeInfo, shopperHouseInfo }) =
     [themeInfo]
   );
 
+  const _onClick = useCallback(
+    (e) => {
+      if (onClick) {
+        onClick(e);
+      }
+    },
+    [onClick]
+  );
+
   return (
     <div className={css.searchBox}>
       <div className={css.topBox}>
@@ -184,11 +227,13 @@ const SearchResultsNew = ({ itemInfo, showInfo, themeInfo, shopperHouseInfo }) =
         <div
           className={css.hotpicksSection}
           data-wheel-point={true}
-          spotlightId={'hot-picks-section'}
+          spotlightId={"hot-picks-section"}
         >
           <div className={css.sectionHeader}>
             <div className={css.sectionIndicator}></div>
-            <div className={css.sectionTitle}>Hot Picks ({themeInfo?.length})</div>
+            <div className={css.sectionTitle}>
+              Hot Picks ({themeInfo?.length})
+            </div>
           </div>
           <div className={css.productList}>
             <TVirtualGridList