@extends('clients.layouts.app')

@section('title', 'WHMCS AutoAuth Test')

@section('content')
    <div class="max-w-4xl mx-auto">
        <div class="bg-white dark:bg-slate-800 rounded-2xl shadow-sm border border-slate-200 dark:border-slate-700 p-8">
            <h1 class="text-3xl font-bold text-slate-900 dark:text-white mb-6">
                🔐 WHMCS AutoAuth Test
            </h1>

            <div class="mb-6 p-4 bg-blue-50 dark:bg-blue-900/20 border border-blue-200 dark:border-blue-800 rounded-lg">
                <h2 class="font-semibold text-blue-900 dark:text-blue-100 mb-2">Generated AutoAuth URL:</h2>
                <code
                    class="block p-3 bg-white dark:bg-slate-900 rounded text-sm break-all text-slate-700 dark:text-slate-300">{{ $url }}</code>
            </div>

            <div class="space-y-4">
                <div class="p-4 bg-green-50 dark:bg-green-900/20 border border-green-200 dark:border-green-800 rounded-lg">
                    <h3 class="font-semibold text-green-900 dark:text-green-100 mb-2">✅ Test Instructions:</h3>
                    <ol class="list-decimal list-inside space-y-2 text-slate-700 dark:text-slate-300">
                        <li>Click the button below to test AutoAuth manually</li>
                        <li>You should be logged into WHMCS automatically</li>
                        <li>If you see WHMCS login page, there's a configuration issue</li>
                    </ol>
                </div>

                <div class="flex gap-4">
                    <a href="{{ $url }}"
                   target="_blank"
                   class="inline-flex items-center px-6 py-3 bg-blue-600 hover:bg-blue-700 text-white font-semibold rounded-lg transition-colors">
                    <svg class="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"></path>
                    </svg>
                    Full Test (with Redirect)
                </a>

                @php
                    $simpleUrl = explode('&goto=', $url)[0];
                @endphp
                <a href="{{ $simpleUrl }}"
                   target="_blank"
                   class="inline-flex items-center px-6 py-3 bg-indigo-600 hover:bg-indigo-700 text-white font-semibold rounded-lg transition-colors">
                    <svg class="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 16l-4-4m0 0l4-4m-4 4h14m-5 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h7a3 3 0 013 3v1"></path>
                    </svg>
                    Simple Test (No Redirect)
                </a>

                    <button onclick="copyUrl()"
                        class="inline-flex items-center px-6 py-3 bg-slate-600 hover:bg-slate-700 text-white font-semibold rounded-lg transition-colors">
                        <svg class="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z">
                            </path>
                        </svg>
                        Copy URL
                    </button>
                </div>
            </div>

            <div class="mt-8 p-4 bg-slate-100 dark:bg-slate-900/50 border border-slate-200 dark:border-slate-800 rounded-lg font-mono text-xs">
            <h3 class="font-bold mb-2">Hash Construction Parts (Check for hidden characters):</h3>
            <div class="space-y-1">
                <p>Email: <span class="bg-white dark:bg-slate-800 px-1 border border-slate-300 dark:border-slate-700">"{{ explode('?email=', explode('&timestamp=', $url)[0])[1] ?? 'N/A' }}"</span></p>
                <p>Timestamp: <span class="bg-white dark:bg-slate-800 px-1 border border-slate-300 dark:border-slate-700">"{{ explode('&timestamp=', explode('&hash=', $url)[0])[1] ?? 'N/A' }}"</span></p>
                <p>Formula: <code>sha1(email + timestamp + key)</code></p>
            </div>
        </div>

        <div class="mt-8 p-4 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded-lg">
            <h3 class="font-semibold text-amber-900 dark:text-amber-100 mb-2">🔍 How to check WHMCS Logs (v9.0.0):</h3>
            <ol class="list-decimal list-inside space-y-2 text-sm text-slate-700 dark:text-slate-300">
                <li>Log into WHMCS Admin Dashboard.</li>
                <li>Go to <strong>Utilities</strong> (Top menu) → <strong>Logs</strong> → <strong>System Log</strong>.</li>
                <li>Look for entries with the message: <span class="font-bold text-red-600 dark:text-red-400">"AutoAuth Hash Validation Failed"</span> or similar.</li>
                <li>If you see "Link Expired", it means your web server and WHMCS server times are not synced.</li>
            </ol>
        </div>

            <div class="mt-6">
                <a href="{{ route('client.dashboard') }}" class="text-blue-600 dark:text-blue-400 hover:underline">
                    ← Back to Dashboard
                </a>
            </div>
        </div>
    </div>

    <script>
        function copyUrl() {
            const url = @json($url);
            navigator.clipboard.writeText(url).then(() => {
                alert('URL copied to clipboard!');
            });
        }
    </script>
@endsection