[상품 상세] 개발 진행중 - UserReviews 기능 개선 및 UI 개선

- UserReviews 컴포넌트 리팩토링 및 페이지네이션 구현
- 새로운 hooks/useReviews 훅 추가
- DetailPanel UI/UX 개선 및 스타일 업데이트
- 이미지 스켈레톤 로딩 컴포넌트 추가
- THeaderDetail 컴포넌트 신규 추가
- 유틸리티 함수 확장 (fpHelpers.js)

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

@@ -37,6 +37,7 @@ import css from "./DetailPanel.module.less";
 import ProductAllSection from "./ProductAllSection/ProductAllSection";
 import { getThemeCurationDetailInfo } from "../../actions/homeActions";
 import indicatorDefaultImage from "../../../assets/images/img-thumb-empty-144@3x.png";
+import detailPanelBg from "../../../assets/images/detailpanel/detailpanel-bg-1.png";
 import ThemeItemListOverlay from "./ThemeItemListOverlay/ThemeItemListOverlay";
 import Spinner from "@enact/sandstone/Spinner";
 
@@ -73,7 +74,7 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
 
   const containerRef = useRef(null);
 
-  // FP 파생 값 메모이제이션 (optional chaining 대체 및 deps 안정화)
+  
   const panelType = useMemo(() => fp.pipe(() => panelInfo, fp.get('type'))(), [panelInfo]);
   const panelCurationId = useMemo(() => fp.pipe(() => panelInfo, fp.get('curationId'))(), [panelInfo]);
   const panelPatnrId = useMemo(() => fp.pipe(() => panelInfo, fp.get('patnrId'))(), [panelInfo]);
@@ -83,7 +84,7 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
   const productPmtSuptYn = useMemo(() => fp.pipe(() => productData, fp.get('pmtSuptYn'))(), [productData]);
   const productGrPrdtProcYn = useMemo(() => fp.pipe(() => productData, fp.get('grPrdtProcYn'))(), [productData]);
 
-  // FP 방식으로 데이터 소스 결정 (메모이제이션 최적화)
+  
   const productDataSource = useMemo(() => 
     fp.pipe(
       () => panelType,
@@ -194,6 +195,22 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
     [scrollToSection],
   );
 
+  // ===== 고정 배경 이미지 설정 (detailPanelBg만 사용) =====
+  // 모든 DetailPanel에서 동일한 배경 이미지(detailpanel-bg-1.png) 사용
+  useEffect(() => {
+    console.log('[PartnerId] Partner background info:', {
+      panelPatnrId: panelPatnrId,
+      productDataPatnrId: productData?.patnrId,
+      productDataPatncNm: productData?.patncNm,
+      productDataThumbnailUrl960: productData?.thumbnailUrl960,
+      imageUrl: imageUrl,
+      detailPanelBg: detailPanelBg
+    });
+    
+    // 고정 배경 이미지만 설정 (파트너사별 변경 없이)
+    document.documentElement.style.setProperty('--bg-url', `url(${detailPanelBg})`);
+  }, [panelPatnrId, productData, imageUrl]);
+
   // FP 방식으로 pending scroll 처리 (메모리 누수 방지)
   useEffect(() => {
     const shouldExecutePendingScroll = fp.pipe(
@@ -547,7 +564,13 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
         : ""
   )(), [panelPrdtId, productData]);
 
+  // ===== 파트너사별 배경 이미지 설정 로직 (현재 비활성화) =====
+  // thumbnailUrl960을 사용하여 파트너사별로 다른 배경 이미지를 설정하는 기능
+  // Pink Pong 등 특정 파트너사에서만 thumbnailUrl960 데이터가 있어서 배경이 변경됨
+  // 현재는 고정 배경(detailPanelBg)만 사용하기 위해 주석 처리
+  
   // FP 방식으로 배경 이미지 설정 (메모리 누수 방지)
+  /*
   useLayoutEffect(() => {
     const shouldSetBackground = fp.pipe(
       () => ({ imageUrl, containerRef }),
@@ -559,6 +582,7 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
       containerRef.current.style.setProperty("--bg-url", `url('${imageUrl}')`);
     }
   }, [imageUrl]);
+  */
 
   console.log("productDataSource :", productDataSource);