import { state } from '../core/state';
import { renderHwDashboard } from './Dashboard/HwDashboard';
import { renderSwDashboard } from './Dashboard/SwDashboard';
import './Dashboard/dashboard.css';

/**
 * 대시보드 렌더링 통합 허브 (Vercel Style Normalized)
 */
export function renderDashboard(mainContent: HTMLElement) {
  if (!mainContent) return;
  
  // 기존 차트 리소스 해제
  if (state.activeCharts) {
    state.activeCharts.forEach((c: any) => {
      if (c && typeof c.destroy === 'function') c.destroy();
    });
  }
  state.activeCharts = [];

  mainContent.innerHTML = `
    <div class="view-content-wrapper">
      <div id="dashboard-scroll-container" class="table-container" style="padding: 0;">
        <div id="dashboard-inner-content"></div>
      </div>
    </div>
  `;

  const innerContent = document.getElementById('dashboard-inner-content')!;

  if (state.activeCategory === 'hw') {
    renderHwDashboard(innerContent);
  } else if (state.activeCategory === 'sw') {
    renderSwDashboard(innerContent);
  } else {
    innerContent.innerHTML = `<div class="dashboard-section-title" style="padding:2rem;">해당 카테고리의 대시보드는 준비 중입니다.</div>`;
  }
}