page.tsx 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596
  1. import { fetchJson } from '@/lib/utils/server';
  2. import type { BannerActiveListResponse, BannerItem } from '@/types/response/banner/active-list';
  3. import type { LiveChannelListResponse } from '@/types/response/channel/live-list';
  4. import type { WorldIndexRow } from '@/types/worldIndex';
  5. import type { MarketQuoteRow } from '@/types/marketQuote';
  6. import { fetchWorldIndices } from '@/lib/api/worldIndices';
  7. import { fetchMarketQuotes } from '@/lib/api/marketQuotes';
  8. import HomeBannerCarousel from './_components/HomeBannerCarousel';
  9. import WorldMarketMap from './_components/WorldMarketMap';
  10. import MajorQuotesGrid from './_components/MajorQuotesGrid';
  11. import LiveChannelGrid from './_components/LiveChannelGrid';
  12. import LiveChannelEmpty from './_components/LiveChannelEmpty';
  13. import { FEATURE_CHANNEL } from '@/constants/features';
  14. import './_components/home.scss';
  15. const BANNER_POSITION_CODE = 'main-top';
  16. const LIVE_PAGE_SIZE = 24;
  17. async function loadActiveBanners(): Promise<BannerItem[]> {
  18. const res = await fetchJson<BannerActiveListResponse>('/api/banner/items', {
  19. method: 'POST',
  20. body: JSON.stringify({ code: BANNER_POSITION_CODE, onlyActive: true })
  21. });
  22. if (!res.success || !res.data) {
  23. return [];
  24. }
  25. return res.data.list.filter(b => b.desktopImage !== null || b.mobileImage !== null);
  26. }
  27. async function loadLiveChannels(): Promise<{ channels: LiveChannelListResponse['channels']; total: number }> {
  28. const res = await fetchJson<LiveChannelListResponse>(`/api/channel/live-list?limit=${LIVE_PAGE_SIZE}&offset=0`, { method: 'GET' });
  29. if (!res.success || !res.data) {
  30. return { channels: [], total: 0 };
  31. }
  32. return { channels: res.data.channels, total: res.data.total };
  33. }
  34. async function loadWorldIndices(): Promise<WorldIndexRow[]> {
  35. // 백엔드 미기동/데이터 없음이어도 홈은 렌더 — 지도는 데이터 있을 때만 표시
  36. const res = await fetchWorldIndices();
  37. if (!res.success || !res.data) {
  38. return [];
  39. }
  40. return res.data.list;
  41. }
  42. async function loadMarketQuotes(): Promise<MarketQuoteRow[]> {
  43. // 백엔드 미기동/데이터 없음이어도 홈은 렌더 — 그리드는 데이터 있을 때만 표시
  44. const res = await fetchMarketQuotes();
  45. if (!res.success || !res.data) {
  46. return [];
  47. }
  48. return res.data.list;
  49. }
  50. export default async function Home() {
  51. // 채널 기능 OFF: 라이브 채널 섹션 미노출이므로 조회 생략
  52. const [banners, live, worldIndices, marketQuotes] = await Promise.all([
  53. loadActiveBanners(),
  54. FEATURE_CHANNEL ? loadLiveChannels() : Promise.resolve({ channels: [], total: 0 }),
  55. loadWorldIndices(),
  56. loadMarketQuotes()
  57. ]);
  58. return (
  59. <div className="home">
  60. <div className="home__inner">
  61. {worldIndices.length > 0 && <WorldMarketMap rows={worldIndices} />}
  62. {marketQuotes.length > 0 && <MajorQuotesGrid rows={marketQuotes} />}
  63. <HomeBannerCarousel items={banners} />
  64. {FEATURE_CHANNEL && (
  65. live.channels.length === 0 ? (
  66. <LiveChannelEmpty />
  67. ) : (
  68. <LiveChannelGrid
  69. initialChannels={live.channels}
  70. initialTotal={live.total}
  71. pageSize={LIVE_PAGE_SIZE}
  72. />
  73. )
  74. )}
  75. </div>
  76. </div>
  77. );
  78. }