@extends('vendor.installer.layouts.master')

@section('template_title', 'Health Check')

@section('title')
    <span class="inline-flex items-center gap-3"><i class="fa-solid fa-stethoscope text-brand-600"></i> System Health Check</span>
@endsection

@section('subtitle', 'Running background tests against your server. This validates everything the app needs at runtime.')

@section('container')
    <div class="space-y-6">
        <div id="health-summary" class="rounded-xl p-4 border bg-brand-50 border-brand-100 text-brand-900 dark:bg-brand-900/20 dark:border-brand-800/40 dark:text-brand-100">
            <div class="flex items-center gap-3"><i class="fa-solid fa-spinner fa-spin"></i><strong>Running tests…</strong></div>
        </div>

        <div class="overflow-hidden rounded-xl border border-gray-200 dark:border-white/10">
            <table class="w-full text-sm">
                <thead class="bg-gray-50 dark:bg-white/5 text-gray-600 dark:text-gray-300 uppercase text-[11px] tracking-wide">
                    <tr>
                        <th class="text-left px-4 py-2.5 font-semibold">Check</th>
                        <th class="text-left px-4 py-2.5 font-semibold w-28">Status</th>
                        <th class="text-left px-4 py-2.5 font-semibold">Detail</th>
                    </tr>
                </thead>
                <tbody id="health-body" class="divide-y divide-gray-100 dark:divide-white/5">
                    <tr><td colspan="3" class="px-4 py-6 text-center text-gray-400"><i class="fa-solid fa-spinner fa-spin mr-2"></i>Loading…</td></tr>
                </tbody>
            </table>
        </div>

        <div class="flex flex-wrap items-center justify-between gap-2">
            <button type="button" id="rerun" class="btn-ghost"><i class="fa-solid fa-rotate"></i> Re-run checks</button>
            <a href="{{ route('LaravelInstaller::final') }}" id="finish-btn" class="btn-primary">Finish installation <i class="fa-solid fa-arrow-right"></i></a>
        </div>
    </div>

    <script>
        const labels = {
            php_version: 'PHP version',
            extensions: 'PHP extensions',
            database: 'Database connection',
            migrations: 'Migrations run',
            storage_write: 'Storage writable',
            storage_link: 'public/storage symlink',
            cache: 'Cache driver',
            queue: 'Queue driver',
            mail: 'Mail config',
            webpush: 'Web Push (VAPID)',
            jwt: 'JWT secret',
            cron: 'Cron / scheduler',
            app_key: 'APP_KEY',
            admin_user: 'Admin user',
        };
        const icons = {
            php_version:'fa-php', extensions:'fa-puzzle-piece', database:'fa-database', migrations:'fa-layer-group',
            storage_write:'fa-folder-open', storage_link:'fa-link', cache:'fa-bolt', queue:'fa-list-check',
            mail:'fa-envelope', webpush:'fa-bell', jwt:'fa-key', cron:'fa-clock', app_key:'fa-lock', admin_user:'fa-user-shield'
        };

        function badge(c) {
            if (c.ok && !c.warn) return '<span class="pill bg-emerald-100 text-emerald-700 dark:bg-emerald-500/20 dark:text-emerald-300"><i class="fa-solid fa-check"></i> Pass</span>';
            if (c.warn)          return '<span class="pill bg-amber-100 text-amber-800 dark:bg-amber-500/20 dark:text-amber-300"><i class="fa-solid fa-triangle-exclamation"></i> Warn</span>';
            return '<span class="pill bg-red-100 text-red-700 dark:bg-red-500/20 dark:text-red-300"><i class="fa-solid fa-xmark"></i> Fail</span>';
        }

        async function run() {
            document.getElementById('health-body').innerHTML = '<tr><td colspan="3" class="px-4 py-6 text-center text-gray-400"><i class="fa-solid fa-spinner fa-spin mr-2"></i>Running…</td></tr>';
            const sum = document.getElementById('health-summary');
            sum.className = 'rounded-xl p-4 border bg-brand-50 border-brand-100 text-brand-900 dark:bg-brand-900/20 dark:border-brand-800/40 dark:text-brand-100';
            sum.innerHTML = '<div class="flex items-center gap-3"><i class="fa-solid fa-spinner fa-spin"></i><strong>Running tests…</strong></div>';
            try {
                const r = await fetch('{{ route('LaravelInstaller::health.run') }}', { headers: { 'Accept': 'application/json' } });
                const j = await r.json();
                const rows = Object.keys(j.checks).map(k => {
                    const c = j.checks[k];
                    const ic = icons[k] ? '<i class="fa-solid '+icons[k]+' text-gray-400 mr-2"></i>' : '';
                    return '<tr><td class="px-4 py-2.5 font-medium text-ink-900 dark:text-white">'+ic+(labels[k] || k)+'</td><td class="px-4 py-2.5">'+badge(c)+'</td><td class="px-4 py-2.5 text-gray-600 dark:text-gray-300 font-mono text-xs">'+(c.detail || '')+'</td></tr>';
                }).join('');
                document.getElementById('health-body').innerHTML = rows;
                if (j.overall === 'pass') {
                    sum.className = 'rounded-xl p-4 border bg-emerald-50 border-emerald-200 text-emerald-900 dark:bg-emerald-500/10 dark:border-emerald-500/30 dark:text-emerald-200';
                    sum.innerHTML = '<div class="flex items-center gap-3"><i class="fa-solid fa-circle-check text-lg"></i><strong>All checks passed (or non-blocking warnings).</strong></div>';
                } else {
                    sum.className = 'rounded-xl p-4 border bg-red-50 border-red-200 text-red-900 dark:bg-red-500/10 dark:border-red-500/30 dark:text-red-200';
                    sum.innerHTML = '<div class="flex items-center gap-3"><i class="fa-solid fa-triangle-exclamation text-lg"></i><strong>Some checks failed.</strong> Review the table below before going live.</div>';
                }
            } catch (e) {
                document.getElementById('health-body').innerHTML = '<tr><td colspan="3" class="px-4 py-4 text-red-700 dark:text-red-300">Error: ' + e.message + '</td></tr>';
            }
        }
        document.getElementById('rerun').addEventListener('click', run);
        run();
    </script>
@endsection