diff --git a/com.twin.app.shoptime/src/components/THeader/THeader.jsx b/com.twin.app.shoptime/src/components/THeader/THeader.jsx
index f99e4ed4..141b3cb0 100644
--- a/com.twin.app.shoptime/src/components/THeader/THeader.jsx
+++ b/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({
{children}
+ {sponserImage &&(
+
+ )}
);
}
diff --git a/com.twin.app.shoptime/src/components/THeader/THeader.module.less b/com.twin.app.shoptime/src/components/THeader/THeader.module.less
index a20c0167..d47314f9 100644
--- a/com.twin.app.shoptime/src/components/THeader/THeader.module.less
+++ b/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;
+ }
+}
\ No newline at end of file
diff --git a/com.twin.app.shoptime/src/views/DetailPanel/ProductAllSection/ProductAllSection.jsx b/com.twin.app.shoptime/src/views/DetailPanel/ProductAllSection/ProductAllSection.jsx
index c35283d9..22195bda 100644
--- a/com.twin.app.shoptime/src/views/DetailPanel/ProductAllSection/ProductAllSection.jsx
+++ b/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({
>
)}
- {hasYouMayAlsoLike && (
+ {(panelInfo?.patnrId !== 21 || panelInfo?.patnrId !== "21") && hasYouMayAlsoLike && (
- {hasYouMayAlsoLike && (
+ {(panelInfo?.patnrId !== 21 || panelInfo?.patnrId !== "21") && hasYouMayAlsoLike && (
{/* {(() => {
console.log('[YouMayLike] YouMayAlsoLike 컴포넌트 렌더링:', {
@@ -2093,6 +2096,7 @@ export default function ProductAllSection({
handleButtonFocus('seemoreproducts')}
onBlur={handleButtonBlur}
diff --git a/com.twin.app.shoptime/src/views/DetailPanel/ProductContentSection/SeeMoreProducts/SeeMoreProducts.jsx b/com.twin.app.shoptime/src/views/DetailPanel/ProductContentSection/SeeMoreProducts/SeeMoreProducts.jsx
index ed5c7357..73c1abfa 100644
--- a/com.twin.app.shoptime/src/views/DetailPanel/ProductContentSection/SeeMoreProducts/SeeMoreProducts.jsx
+++ b/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}
>
-
+
+
+
{newGroupProductData?.map((product, index) => {
const {
diff --git a/com.twin.app.shoptime/src/views/DetailPanel/ProductContentSection/SeeMoreProducts/SeeMoreProducts.module.less b/com.twin.app.shoptime/src/views/DetailPanel/ProductContentSection/SeeMoreProducts/SeeMoreProducts.module.less
index fea0513d..5b623efc 100644
--- a/com.twin.app.shoptime/src/views/DetailPanel/ProductContentSection/SeeMoreProducts/SeeMoreProducts.module.less
+++ b/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 {