[251211] feat: FeaturedBrandsPanel , See More Products - 2

🕐 커밋 시간: 2025. 12. 11. 09:07:19

📊 변경 통계:
  • 총 파일: 1개
  • 추가: +93줄
  • 삭제: -4줄

📝 수정된 파일:
  ~ com.twin.app.shoptime/src/views/DetailPanel/ProductAllSection/ProductAllSection.jsx

🔧 주요 변경 내용:
  • 소규모 기능 개선

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

@@ -267,6 +267,10 @@ export default function ProductAllSection({
   const { userNumber } = useSelector((state) => state.common.appStatus.loginUserData);
   const { popupVisible, activePopup } = useSelector((state) => state.common.popup);
   const cursorVisible = useSelector((state) => state.common.appStatus.cursorVisible);
+  // 🆕 [251210] patnrId=21 카테고리 그룹 데이터
+  const brandShopByShowCategoryGroups = useSelector(
+    (state) => state.brand.brandShopByShowCategoryGroups
+  );
   // ProductVideo 버전 관리 (1: 기존 modal 방식, 2: 내장 방식 , 3: 비디오 생략)
   const [productVideoVersion, setProductVideoVersion] = useState(1);
   // 비디오 재생 여부 flag (재생 전에는 minimize/restore 로직 비활성화)
@@ -999,6 +1003,8 @@ export default function ProductAllSection({
 
   const [mobileSendPopupOpen, setMobileSendPopupOpen] = useState(false);
   const [isShowUserReviewsFocused, setIsShowUserReviewsFocused] = useState(false);
+  // 🆕 [251210] patnrId=21 SEE MORE PRODUCTS 버튼 표시 여부
+  const [hasSeeMoreProducts, setHasSeeMoreProducts] = useState(false);
 
   const reviewTotalCount = stats.totalReviews;
 
@@ -1267,13 +1273,96 @@ export default function ProductAllSection({
   }, [scrollToSection, dispatch]);
 
   const handleSeeMoreProductsClick = useCallback(() => {
-    console.log('[SEE MORE PRODUCTS] Button clicked - currently no action');
+    console.log('[SEE MORE PRODUCTS] Button clicked - just scroll to section');
-    // TODO: 나중에 그룹 상품 표시 로직 추가
+    // 버튼 클릭 시 스크롤만 처리 (데이터는 useEffect에서 처리)
     scrollToSection('scroll-marker-see-more-products');
     setTimeout(() => {
       Spotlight.focus("see-more-products-area");
     }, 100);
   }, [scrollToSection]);
+
+  // 🆕 [251210] patnrId=21인 경우 그룹 상품 데이터 미리 처리
+  useEffect(() => {
+    if (panelInfo?.patnrId === 21 || panelInfo?.patnrId === "21") {
+      console.log('[SEE MORE PRODUCTS] patnrId=21 detected - processing group data on panel mount');
+      console.log('[SEE MORE PRODUCTS] panelInfo:', panelInfo);
+      console.log('[SEE MORE PRODUCTS] brandShopByShowCategoryGroups:', brandShopByShowCategoryGroups);
+
+      const patnrIdString = String(panelInfo.patnrId);
+      const currentPrdtId = panelInfo.prdtId;
+      const categoryGroups = brandShopByShowCategoryGroups[patnrIdString];
+
+      console.log('[SEE MORE PRODUCTS] patnrIdString:', patnrIdString);
+      console.log('[SEE MORE PRODUCTS] currentPrdtId:', currentPrdtId);
+      console.log('[SEE MORE PRODUCTS] categoryGroups:', categoryGroups);
+
+      let shouldShowButton = false; // 버튼 표시 여부
+
+      if (categoryGroups) {
+        let foundGroup = null;
+        let foundConts = null;
+
+        // 모든 contsId에서 현재 상품이 속한 그룹 찾기
+        for (const contsId in categoryGroups) {
+          const contsInfo = categoryGroups[contsId];
+          console.log(`[SEE MORE PRODUCTS] Checking contsId: ${contsId}, contsNm: ${contsInfo.contsNm}`);
+
+          if (contsInfo.brandShopByShowClctInfos) {
+            for (const group of contsInfo.brandShopByShowClctInfos) {
+              console.log(`[SEE MORE PRODUCTS] Checking group: ${group.clctNm} (${group.clctId})`);
+
+              if (group.brandProductInfos) {
+                const foundProduct = group.brandProductInfos.find(p => p.prdtId === currentPrdtId);
+                if (foundProduct) {
+                  console.log('[SEE MORE PRODUCTS] 🎯 Found current product:', foundProduct);
+                  foundGroup = group;
+                  foundConts = contsInfo;
+                  break;
+                }
+              }
+            }
+
+            if (foundGroup) break;
+          }
+        }
+
+        if (foundGroup && foundConts) {
+          console.log('[SEE MORE PRODUCTS] ✅ Found group info:');
+          console.log('  - Category:', foundConts.contsNm);
+          console.log('  - Group:', foundGroup.clctNm);
+          console.log('  - Group ID:', foundGroup.clctId);
+
+          // 현재 상품을 제외한 다른 상품들 확인
+          const otherProducts = foundGroup.brandProductInfos.filter(p => p.prdtId !== currentPrdtId);
+          console.log('  - Other products count:', otherProducts.length);
+
+          if (otherProducts.length > 0) {
+            // 다른 상품이 있을 때만 버튼 표시
+            shouldShowButton = true;
+
+            console.log('[SEE MORE PRODUCTS] 📦 Showing button - group has other products:');
+            otherProducts.forEach((product, index) => {
+              console.log(`    ${index + 1}. ${product.prdtNm} (${product.prdtId})`);
+              console.log(`       - Price: ${product.priceInfo}`);
+              console.log(`       - Brand: ${product.brndNm || 'N/A'}`);
+            });
+          } else {
+            console.log('[SEE MORE PRODUCTS] ❌ No other products in group - hiding button');
+          }
+        } else {
+          console.log('[SEE MORE PRODUCTS] ❌ No group found for current product - hiding button');
+        }
+      } else {
+        console.log('[SEE MORE PRODUCTS] ❌ No category groups found for patnrId 21 - hiding button');
+      }
+
+      // 버튼 표시 여부 상태 설정
+      setHasSeeMoreProducts(shouldShowButton);
+    } else {
+      // patnrId=21이 아닌 경우 버튼 숨김
+      setHasSeeMoreProducts(false);
+    }
+  }, [panelInfo, brandShopByShowCategoryGroups]);
   // 헤더 Back 아이콘에서 아래로 내려올 때 첫 번째 버튼을 바라보도록 설정
   useEffect(() => {
     const firstId = stackOrder[0];
@@ -1768,7 +1857,7 @@ export default function ProductAllSection({
                   </TButton>
                 )}
                 {/* 🆕 [251210] patnrId=21인 경우 SEE MORE PRODUCTS 버튼 */}
-                {(panelInfo?.patnrId === 21 || panelInfo?.patnrId === "21") && (
+                {(panelInfo?.patnrId === 21 || panelInfo?.patnrId === "21") && hasSeeMoreProducts && (
                   <TButton
                     className={classNames(
                       css.youMayLikeButton,
@@ -1967,7 +2056,7 @@ export default function ProductAllSection({
               </div>
 
               {/* 🆕 [251210] patnrId=21인 경우 SEE MORE PRODUCTS 섹션 */}
-              {(panelInfo?.patnrId === 21 || panelInfo?.patnrId === "21") && (
+              {(panelInfo?.patnrId === 21 || panelInfo?.patnrId === "21") && hasSeeMoreProducts && (
                 <div ref={seeMoreProductsRef}>
                   <div id="scroll-marker-see-more-products" className={css.scrollMarker}></div>
                   <div id="see-more-products-section" data-spotlight-id="see-more-products-area">