[상품 상세 노출 변경에 따른 처리]

- 상품명 노출추가.
 - theadercustom부분에 themetitle부분 처리.
 - qr 크기 조절.(240px -> 190px)
 - 금액 노출부분 하단으로 떨구도록

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

@@ -1,25 +1,46 @@
 // src/views/DetailPanel/DetailPanel.new.jsx
-import React, { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';
+import React, {
+  useCallback,
+  useEffect,
+  useLayoutEffect,
+  useMemo,
+  useRef,
+  useState,
+} from 'react';
 
-import { useDispatch, useSelector } from 'react-redux';
+import {
+  useDispatch,
+  useSelector,
+} from 'react-redux';
 
 import Spotlight from '@enact/spotlight';
 import { setContainerLastFocusedElement } from '@enact/spotlight/src/container';
 
 import { getDeviceAdditionInfo } from '../../actions/deviceActions';
-import { getThemeCurationDetailInfo, updateHomeInfo } from '../../actions/homeActions';
-import { getMainCategoryDetail, getMainYouMayLike } from '../../actions/mainActions';
-import { finishModalMediaForce } from '../../actions/mediaActions';
-import { popPanel, updatePanel } from '../../actions/panelActions';
 import {
-// <<<<<<< HEAD
+  getThemeCurationDetailInfo,
+  updateHomeInfo,
+} from '../../actions/homeActions';
+import {
+  getMainCategoryDetail,
+  getMainYouMayLike,
+} from '../../actions/mainActions';
+import { finishModalMediaForce } from '../../actions/mediaActions';
+import {
+  popPanel,
+  updatePanel,
+} from '../../actions/panelActions';
+import {
   finishVideoPreview,
   pauseFullscreenVideo,
-  resumeFullscreenVideo,
   pauseModalVideo,
+  resumeFullscreenVideo,
   resumeModalVideo,
 } from '../../actions/playActions';
-import { clearProductDetail, getProductOptionId } from '../../actions/productActions';
+import {
+  clearProductDetail,
+  getProductOptionId,
+} from '../../actions/productActions';
 import { clearAllToasts } from '../../actions/toastActions';
 import TBody from '../../components/TBody/TBody';
 import TPanel from '../../components/TPanel/TPanel';
@@ -31,6 +52,7 @@ import THeaderCustom from './components/THeaderCustom';
 import css from './DetailPanel.module.less';
 import ProductAllSection from './ProductAllSection/ProductAllSection';
 import ThemeItemListOverlay from './ThemeItemListOverlay/ThemeItemListOverlay';
+
 // =======
 //   changeAppStatus,
 //   changeLocalSettings,
@@ -929,12 +951,12 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
     }
   }, [themeData, selectedIndex]);
 
-  // 타이틀과 aria-label 메모이제이션 (성능 최적화)
+  // 타이틀과 aria-label 메모이제이션 (성능 최적화 // themeTitle과 haederTitle 분리.)
   const headerTitle = useMemo(
     () =>
       fp.pipe(
-        () => ({ panelPrdtId, productData, panelType, themeData }),
-        ({ panelPrdtId, productData, panelType, themeData }) => {
+        () => ({ panelPrdtId, productData }),
+        ({ panelPrdtId, productData }) => {
           const productTitle = fp.pipe(
             () => ({ panelPrdtId, productData }),
             ({ panelPrdtId, productData }) =>
@@ -943,7 +965,17 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
                 ? fp.pipe(() => productData, fp.get('prdtNm'))()
                 : null
           )();
+          return productTitle || '';
+        }
+      )(),
+    [panelPrdtId, productData]
+  );
 
+  const themeHeaderTitle = useMemo(
+    () =>
+      fp.pipe(
+        () => ({ panelType, themeData }),
+        ({ panelType, themeData }) => {
           const themeTitle = fp.pipe(
             () => ({ panelType, themeData }),
             ({ panelType, themeData }) =>
@@ -952,12 +984,14 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
                 : null
           )();
 
-          return productTitle || themeTitle || '';
+          return themeTitle || '';
         }
       )(),
-    [panelPrdtId, productData, panelType, themeData]
+    [panelType, themeData]
   );
 
+
+
   const ariaLabel = useMemo(
     () =>
       fp.pipe(
@@ -1071,6 +1105,9 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
           className={css.header}
           prdtId={productData?.prdtId}
           title={headerTitle}
+          themeTitle={themeHeaderTitle}
+          selectedIndex={selectedIndex}
+          type={panelInfo?.type === "theme" ? "theme" : null}
           onBackButton
           onClick={onBackClick(false)}
           onBackButtonFocus={onBackButtonFocus}
@@ -1079,8 +1116,9 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
           onSpotlightLeft={onSpotlightUpTButton}
           marqueeDisabled={false}
           ariaLabel={ariaLabel}
-          logoImg={productData?.patncLogoPath}
+          logoImg={productData?.patncLogoPath ? productData?.patncLogoPath : themeData?.productInfos[0]?.patncLogoPath}
           patnrId={panelPatnrId}
+          themeData={themeData}
         />
         <TBody
           className={css.tbody}