import { state, DEFAULT_COLOR } from '../state.js';
import { renderWorkoutCard } from './workout-card.js';

export function renderMainScreen() {
    const app = document.getElementById('app');
    if (!app) return;
    app.innerHTML = '';

    // В режиме тренера — подсказка сверху
    if (state.mode === 'trainer') {
        const hint = document.createElement('div');
        hint.className = 'card mb-10';
        hint.style.background = 'rgba(187, 134, 252, 0.1)';
        hint.style.borderColor = 'var(--primary)';
        hint.innerHTML = `
            <div style="display:flex; justify-content:space-between; align-items:center;">
                <div>
                    <div style="font-weight:600;">👨‍🏫 Режим тренера</div>
                    <div class="text-small text-muted">При создании тренировки выберите клиента</div>
                </div>
                <button class="btn btn-small" onclick="WL.startWorkout()">▶ Новая тренировка</button>
            </div>
        `;
        app.appendChild(hint);
    }

    // Все тренировки (в обоих режимах)
    const workoutsToShow = state.workouts;

    if (workoutsToShow.length === 0) {
        app.innerHTML = `
            <div class="empty-state">
                <h3>🏋️ Нет тренировок</h3>
                <p>${state.mode === 'trainer' ? 'Создайте первую тренировку для клиента' : 'Начните первую тренировку'}</p>
                <button class="btn" onclick="WL.startWorkout()">▶ Начать тренировку</button>
            </div>
        `;
        return;
    }

    const sorted = [...workoutsToShow].sort((a, b) => {
        if (!a.endTime && b.endTime) return -1;
        if (a.endTime && !b.endTime) return 1;
        return new Date(b.startTime) - new Date(a.startTime);
    });

    const hasActive = sorted.some(w => !w.endTime);
    if (!hasActive) {
        const btn = document.createElement('button');
        btn.className = 'btn mb-10';
        btn.textContent = '▶ Начать новую тренировку';
        btn.onclick = () => window.WL.startWorkout();
        app.appendChild(btn);
    }

    sorted.forEach(w => {
        app.appendChild(renderWorkoutCard(w));
    });
}