<?php


$pageTitle = 'System Check';
$pageDesc = 'Let\'s make sure your server is ready for TubePress';

$warnCount = count(array_filter($checks, fn($c) => !$c['passed'] && !$c['required']));
ob_start();
?>

<?php if ($allPassed && $warnCount === 0): ?>
    <div class="alert alert-success" style="margin-bottom: 24px;">
        <strong>Everything looks great!</strong> Your server meets all the requirements to run TubePress.
    </div>
<?php elseif ($allPassed && $warnCount > 0): ?>
    <div class="alert alert-success" style="margin-bottom: 24px;">
        <strong>Ready to install!</strong> Your server meets all required checks.
        <?= $warnCount ?> optional extension<?= $warnCount > 1 ? 's are' : ' is' ?> missing but you can install them later.
    </div>
<?php else: ?>
    <div class="alert alert-error" style="margin-bottom: 24px;">
        <strong><?= $failedCount ?> issue<?= $failedCount > 1 ? 's' : '' ?> found.</strong>
        Please fix the items marked in red below before continuing. Click on any failed item to see how to fix it.
    </div>
<?php endif; ?>

<div style="display: flex; gap: 12px; margin-bottom: 24px; font-size: 13px; color: var(--color-gray-500);">
    <span>Web server: <strong><?= htmlspecialchars($webServer) ?></strong></span>
    <span>&middot;</span>
    <span>PHP: <strong><?= htmlspecialchars($phpVersion) ?></strong></span>
</div>

<?php
$categories = [
    'php' => ['label' => 'PHP Extensions', 'icon' => '&#9881;', 'desc' => 'PHP features needed for TubePress'],
    'server' => ['label' => 'Web Server', 'icon' => '&#127760;', 'desc' => 'Server configuration for clean URLs'],
    'permissions' => ['label' => 'File Permissions', 'icon' => '&#128193;', 'desc' => 'Folders that TubePress needs to write to'],
];
$warnCount = count(array_filter($checks, fn($c) => !$c['passed'] && !$c['required']));

foreach ($categories as $catKey => $catInfo):
    $catChecks = array_filter($checks, fn($c) => $c['category'] === $catKey);
    if (empty($catChecks)) continue;
?>
    <div style="margin-bottom: 24px;">
        <div style="display: flex; align-items: center; gap: 8px; margin-bottom: 12px; padding-bottom: 8px; border-bottom: 1px solid var(--color-gray-200);">
            <span style="font-size: 18px;"><?= $catInfo['icon'] ?></span>
            <div>
                <div style="font-weight: 600; font-size: 15px; color: var(--color-gray-800);"><?= $catInfo['label'] ?></div>
                <div style="font-size: 12px; color: var(--color-gray-400);"><?= $catInfo['desc'] ?></div>
            </div>
        </div>

        <?php foreach ($catChecks as $check): ?>
        <div style="display: flex; align-items: flex-start; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid var(--color-gray-100); <?= !$check['passed'] ? 'cursor: pointer;' : '' ?>"
             <?php if (!$check['passed']): ?>onclick="this.querySelector('.fix-help').style.display = this.querySelector('.fix-help').style.display === 'none' ? 'block' : 'none'"<?php endif; ?>>
            <div style="flex: 1;">
                <div style="font-weight: 500; font-size: 14px; color: var(--color-gray-700);">
                    <?= htmlspecialchars($check['name']) ?>
                    <?php if (!$check['passed']): ?>
                        <span style="font-size: 11px; color: var(--color-gray-400); margin-left: 4px;">&#9660; click for help</span>
                    <?php endif; ?>
                </div>
                <div style="font-size: 13px; color: var(--color-gray-400); margin-top: 2px;">
                    <?= $check['description'] ?>
                </div>
                <?php if (!$check['passed']): ?>
                <div class="fix-help" style="display: none; margin-top: 10px; padding: 12px; background: <?= $check['required'] ? 'var(--color-danger-light)' : '#fef9e7' ?>; border-radius: var(--radius); font-size: 13px; color: <?= $check['required'] ? '#991b1b' : '#78350f' ?>; line-height: 1.6;">
                    <strong>How to fix:</strong><br>
                    <?= $check['fix'] ?>
                </div>
                <?php endif; ?>
            </div>
            <div style="flex-shrink: 0; margin-left: 16px;">
                <?php if ($check['passed']): ?>
                    <span class="badge badge-pass">&#10003; OK</span>
                <?php elseif ($check['required']): ?>
                    <span class="badge badge-fail">&#10007; Required</span>
                <?php else: ?>
                    <span class="badge" style="background: #fef3c7; color: #92400e; padding: 2px 10px; border-radius: 12px; font-size: 12px; font-weight: 600;">&#9888; Recommended</span>
                <?php endif; ?>
            </div>
        </div>
        <?php endforeach; ?>
    </div>
<?php endforeach; ?>

<div style="margin-top: 8px; display: flex; justify-content: space-between; align-items: center;">
    <a href="/install" class="btn btn-secondary">Back</a>

    <?php if ($allPassed): ?>
        <a href="/install/database" class="btn btn-primary">Continue &rarr;</a>
    <?php else: ?>
        <a href="/install/requirements" class="btn btn-secondary">Re-check</a>
    <?php endif; ?>
</div>

<?php
$content = ob_get_clean();
require APP_ROOT . '/templates/install/layout.php';
