[nbcu 관련수정]

- youmayalsolike 파트너사 21일때는 노출하지않음.
 - see more product 쉘프에 스폰서 이미지 추가
 - see more product 쉘프에 쉘프명 수정.

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

@@ -30,6 +30,7 @@ export default function THeader({
   ariaLabel,
   children,
   kind,
+  sponserImage,
   ...rest
 }) {
   const convertedTitle = useMemo(() => {
@@ -86,6 +87,17 @@ export default function THeader({
       </Marquee>
 
       {children}
+      {sponserImage &&(
+        <div className={css.sponserImgBox}>
+          <CustomImage
+            src={sponserImage}                                            
+            className={css.sponserImg}
+          />
+          <div className={css.sponserTextBox}>
+            SPONSORED BY
+          </div>          
+        </div>
+      )}
     </Container>
   );
 }

com.twin.app.shoptime/src/components/THeader/THeader.module.less

@@ -10,7 +10,7 @@
   display: flex;
   justify-content: flex-start;
   align-items: center;
-
+  position: relative;
   .title {
     width: 1788px;
     font-size: 42px;
@@ -42,3 +42,24 @@
     box-shadow: 0px 6px 30px 0 rgba(0, 0, 0, 0.4);
   }
 }
+
+.sponserImgBox {
+  position:absolute;
+  right:0;
+  top:0;
+  height:30px;
+  display:flex;
+  flex-wrap: wrap;
+  align-items: center;
+  justify-content: center;
+  .sponserImg {
+    height:30px;
+  }
+  .sponserTextBox {
+    padding:3px;
+    background-color: #474747;
+    color:rgba(255, 255, 255, 0.5);
+    font-size:14px;
+    border-radius: 6px;
+  }
+}

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

@@ -1366,7 +1366,7 @@ export default function ProductAllSection({
             });
 
             // 🆕 SeeMoreProducts 컴포넌트를 위한 데이터 변환
-            const formattedProducts = otherProducts.map(product => ({
+            const formattedProducts = otherProducts.map(product => ({              
               prdtId: product.prdtId,
               prdtNm: product.prdtNm,
               priceInfo: product.priceInfo,
@@ -1376,6 +1376,7 @@ export default function ProductAllSection({
               imgUrl: product.prdtImgUrl,
               lgCatCd: product.lgCatCd,
               offerInfo: product.offerInfo,
+              groupNm: foundGroup.clctNm,
             }));
 
             // YouMayAlsoLike 데이터 형식으로 맞추기
@@ -1600,6 +1601,8 @@ export default function ProductAllSection({
     };
   }, []);
 
+  const sponserImage = useMemo(() => productData?.spnsrImgUrl, [productData]);
+
   // WebOS TV focus-within 대체 로직
   // useEffect(() => {
   //   const detailAreaElement = document.querySelector('.detailArea');
@@ -1878,7 +1881,7 @@ export default function ProductAllSection({
                     </TButton>
                   </>
                 )}
-                {hasYouMayAlsoLike && (
+                {(panelInfo?.patnrId !== 21 || panelInfo?.patnrId !== "21") && hasYouMayAlsoLike && (
                   <TButton
                     className={classNames(
                       css.youMayLikeButton,
@@ -2064,7 +2067,7 @@ export default function ProductAllSection({
               </div>
               <div ref={youMayAlsoLikelRef}>
                 <div id="scroll-marker-you-may-also-like" className={css.scrollMarker}></div>
-                {hasYouMayAlsoLike && (
+                {(panelInfo?.patnrId !== 21 || panelInfo?.patnrId !== "21") && hasYouMayAlsoLike && (
                   <div id="you-may-also-like-section">
                     {/* {(() => {
                       console.log('[YouMayLike] YouMayAlsoLike 컴포넌트 렌더링:', {
@@ -2093,6 +2096,7 @@ export default function ProductAllSection({
                   <div id="see-more-products-section" data-spotlight-id="see-more-products-area">
                     <SeeMoreProducts
                       groupProducts={seeMoreProductsData}
+                      sponserImage={sponserImage}
                       panelInfo={panelInfo}
                       onFocus={() => handleButtonFocus('seemoreproducts')}
                       onBlur={handleButtonBlur}

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

@@ -1,20 +1,39 @@
-import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import React, {
+  useCallback,
+  useEffect,
+  useMemo,
+  useRef,
+  useState,
+} from 'react';
 
-import { useDispatch, useSelector } from 'react-redux';
+import {
+  useDispatch,
+  useSelector,
+} from 'react-redux';
 
 import { Job } from '@enact/core/util';
-import SpotlightContainerDecorator from '@enact/spotlight/SpotlightContainerDecorator';
+import SpotlightContainerDecorator
+  from '@enact/spotlight/SpotlightContainerDecorator';
 import Spottable from '@enact/spotlight/Spottable';
 
 import { clearThemeDetail } from '../../../../actions/homeActions';
 import { finishModalMediaForce } from '../../../../actions/mediaActions';
-import { popPanel, pushPanel, updatePanel } from '../../../../actions/panelActions';
+import {
+  popPanel,
+  pushPanel,
+  updatePanel,
+} from '../../../../actions/panelActions';
 import { finishVideoPreview } from '../../../../actions/playActions';
 import THeader from '../../../../components/THeader/THeader';
 import TItemCardNew from '../../../../components/TItemCard/TItemCard.new';
-import TVerticalPagenator from '../../../../components/TVerticalPagenator/TVerticalPagenator';
+import TVerticalPagenator
+  from '../../../../components/TVerticalPagenator/TVerticalPagenator';
 import useScrollTo from '../../../../hooks/useScrollTo';
-import { LOG_CONTEXT_NAME, LOG_MESSAGE_ID, panel_names } from '../../../../utils/Config';
+import {
+  LOG_CONTEXT_NAME,
+  LOG_MESSAGE_ID,
+  panel_names,
+} from '../../../../utils/Config';
 import { $L } from '../../../../utils/helperMethods';
 import css from './SeeMoreProducts.module.less';
 
@@ -32,6 +51,7 @@ const Container = SpotlightContainerDecorator(
 
 export default function SeeMoreProducts({
   groupProducts,
+  sponserImage,
   panelInfo,
   onFocus,
   onBlur,
@@ -106,7 +126,9 @@ export default function SeeMoreProducts({
           topMargin={36}
         >
           <Container className={css.container} onFocus={_onFocus} onBlur={_onBlur}>
-            <THeader title={$L('SEE MORE PRODUCTS')} className={css.tHeader} />
+            <THeader title={newGroupProductData[0].groupNm} className={css.tHeader} sponserImage={sponserImage} />
+                
+            
             <div className={css.renderCardContainer}>
               {newGroupProductData?.map((product, index) => {
                 const {

com.twin.app.shoptime/src/views/DetailPanel/ProductContentSection/SeeMoreProducts/SeeMoreProducts.module.less

@@ -28,13 +28,11 @@
   // }
   .tHeader {
     background: transparent;
-    .size(@w: 1144px, @h: 36px); // 마진 제외 콘텐츠 크기
-    max-width: 1144px;
+    .size(@w: 100%, @h: 36px); // 마진 제외 콘텐츠 크기    
     margin-bottom: 20px;
-
-    > div {
-      .size(@w:100%,@h:100%);
-      padding: 0;
+    position:relative;
+    > div{
+      padding:0;
     }
     .averageOverallRating {
       .size(@w: 176px,@h:30px);
@@ -46,6 +44,7 @@
       height: 36px;
       color: rgba(234, 234, 234, 1);
     }
+    
   }
 
   .container {