✨ Feature: 채팅방 인기 뉴스 추가

Author: HaechangLee

src/app/api/news/newsListApi.js

@@ -30,3 +30,13 @@ export async function getSimilarNews(newsId) {
   const response = await refreshAxios.get(`/api/public/news/similar?newsId=${newsId}&page=0&size=4`);
   return response.data;
 }
+
+export async function getChatHotNews(category) {
+  const response = await refreshAxios.get(`/api/public/chat/top-news/${category}`);
+  return response.data;
+}
+
+export async function getChatHotNewsAll() {
+  const response = await refreshAxios.get(`/api/public/chat/top-news`);
+  return response.data;
+}

src/app/news/category/[categoryId]/page.js

@@ -2,7 +2,7 @@
 
 import { useEffect, useState } from 'react';
 import { useParams } from 'next/navigation';
-import { getLatestNewsByCategory, getTopViewedNews, getSimilarNews } from '@/app/api/news/newsListApi';
+import { getLatestNewsByCategory, getTopViewedNews, getSimilarNews, getChatHotNews } from '@/app/api/news/newsListApi';
 import NewsList from '@/components/news/NewsList';
 import NewsCarousel from '@/components/news/NewsCarousel';
 import Header from '@/components/Header';
@@ -29,20 +29,22 @@ export default function CategoryNewsPage() {
 
       // 해당 카테고리의 Top Viewed News 가져오기
       const topNews = await getTopViewedNews(categoryId);
+      // 해당 카테고리의 Chat Hot News 가져오기
+      const chatHotNewsData = await getChatHotNews(categoryId);
       const carouselGroups = [];
-      if (topNews.data) {
+
+
+      // Top Viewed News가 있고 데이터가 있을 때만 추가
+      if (topNews?.data && Object.keys(topNews.data).length > 0) {
         const mainNews = topNews.data;
-        console.log(mainNews);
         try {
           const similarNewsData = await getSimilarNews(mainNews.guid);
-          console.log(similarNewsData);
 
           carouselGroups.push({
             mainNews,
             relatedNews: similarNewsData.data?.newsSearchResponseList.slice(1, 4) || []
           });
         } catch (similarError) {
-          // similar news 에러가 발생해도 main news는 표시
           carouselGroups.push({
             mainNews,
             relatedNews: []
@@ -51,6 +53,25 @@ export default function CategoryNewsPage() {
         }
       }
 
+      // Chat Hot News가 있고 데이터가 있을 때만 추가
+      if (chatHotNewsData && Object.keys(chatHotNewsData).length > 0) {
+        const chatHotMainNews = chatHotNewsData;
+        try {
+          const similarNewsData = await getSimilarNews(chatHotMainNews.guid);
+          
+          carouselGroups.push({
+            mainNews: chatHotMainNews,
+            relatedNews: similarNewsData.data?.newsSearchResponseList.slice(1, 4) || []
+          });
+        } catch (similarError) {
+          carouselGroups.push({
+            mainNews: chatHotMainNews,
+            relatedNews: []
+          });
+          console.error('Similar news fetch error for chat hot news:', similarError);
+        }
+      }
+
       setCarouselNews(carouselGroups);
     } catch (err) {
       setError(err.message);

src/app/page.js

@@ -2,7 +2,7 @@
 
 import { useEffect, useState } from 'react';
 import { useRouter } from 'next/navigation';
-import { getLatestNews, getTopViewedNews, getSimilarNews } from '@/app/api/news/newsListApi';
+import { getLatestNews, getTopViewedNews, getSimilarNews, getChatHotNewsAll } from '@/app/api/news/newsListApi';
 import NewsList from '@/components/news/NewsList';
 import NewsCarousel from '@/components/news/NewsCarousel';
 import Header from '@/components/Header';
@@ -25,32 +25,49 @@ export default function HomePage() {
     try {
       setCarouselLoading(true);
 
-      // 1. Top Viewed News 가져오기 (나중에는 Hot News도 추가)
+      // 1. Top Viewed News 가져오기
       const topNews = await getTopViewedNews("all");
+      // 2. Chat Hot News 가져오기
+      const chatHotNewsData = await getChatHotNewsAll();
       const carouselGroups = [];
-
+      
       if (topNews.data) {
         const mainNews = topNews.data;
-        console.log(mainNews);
         try {
           const similarNewsData = await getSimilarNews(mainNews.guid);
-          console.log(similarNewsData);
 
           carouselGroups.push({
             mainNews,
             relatedNews: similarNewsData.data?.newsSearchResponseList.slice(1, 4) || []
           });
         } catch (similarError) {
-          // similar news 에러가 발생해도 main news는 표시
           carouselGroups.push({
             mainNews,
             relatedNews: []
           });
           console.error('Similar news fetch error:', similarError);
         }
       }
-      console.log(carouselGroups);
 
+      // Chat Hot News 추가
+      if (chatHotNewsData) {
+        const chatHotMainNews = chatHotNewsData;
+        try {
+          const similarNewsData = await getSimilarNews(chatHotMainNews.guid);
+          
+          carouselGroups.push({
+            mainNews: chatHotMainNews,
+            relatedNews: similarNewsData.data?.newsSearchResponseList.slice(1, 4) || []
+          });
+        } catch (similarError) {
+          carouselGroups.push({
+            mainNews: chatHotMainNews,
+            relatedNews: []
+          });
+          console.error('Similar news fetch error for chat hot news:', similarError);
+        }
+      }
+      console.log(carouselGroups);
       setCarouselNews(carouselGroups);
     } catch (err) {
       setError(err.message);

src/components/news/NewsCarousel.js

@@ -75,7 +75,10 @@ export default function NewsCarousel({ carouselGroups = [], loading = false }) {
             {/* 메인 뉴스 */}
             <div className="w-full md:w-1/2 p-4">
               <h2 className="text-2xl font-bold mb-4 text-gray-900 flex items-center gap-1">
-                <span className="text-blue-500 text-3xl"># </span>인기뉴스
+                <span className="text-blue-500 text-3xl"># </span>
+                {carouselGroups.length === 2 ? (
+                  index === 0 ? 'Hot 뉴스' : 'TalkPeak 뉴스'
+                ) : '인기뉴스'}
               </h2>
               <Link href={`/news/detail/${group.mainNews.guid}`} className="block relative h-[250px] md:h-[calc(100%-3rem)] rounded-lg overflow-hidden hover:ring-2 hover:ring-[#0E74F9] transition-all">
                 {group.mainNews.imageUrl ? (