`frontend/src/debug.html`

73 lines
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Debug - CyPresAwards</title>
    <style>
        body { font-family: Arial; padding: 20px; background: #f5f5f5; }
        .status { padding: 10px; margin: 10px 0; border-radius: 5px; }
        .success { background: #d4edda; border: 1px solid #c3e6cb; }
        .error { background: #f8d7da; border: 1px solid #f5c6cb; }
        .info { background: #d1ecf1; border: 1px solid #bee5eb; }
        pre { background: #fff; padding: 10px; border: 1px solid #ddd; overflow-x: auto; }
    </style>
</head>
<body>
    <h1>🔍 CyPresAwards Debug Page</h1>
    <div id="status"></div>
    <div id="results"></div>

    <script>
        const status = document.getElementById('status');
        const results = document.getElementById('results');
        const API_BASE_URL = window.location.origin + '/api';

        async function runTests() {
            status.innerHTML = '<div class="info status">Running tests...</div>';
            let output = '';

            try {
                // Test 1: Stats
                output += '<h2>Test 1: /api/stats</h2>';
                const statsResp = await fetch(`${API_BASE_URL}/stats`);
                output += `<div class="success status">Status: ${statsResp.status}</div>`;
                const stats = await statsResp.json();
                output += `<pre>${JSON.stringify(stats, null, 2)}</pre>`;

                // Test 2: Categories
                output += '<h2>Test 2: /api/categories</h2>';
                const catResp = await fetch(`${API_BASE_URL}/categories`);
                output += `<div class="success status">Status: ${catResp.status}</div>`;
                const cats = await catResp.json();
                output += `<pre>${JSON.stringify(cats, null, 2)}</pre>`;

                // Test 3: Legal Topics
                output += '<h2>Test 3: /api/legal-topics</h2>';
                const topicsResp = await fetch(`${API_BASE_URL}/legal-topics`);
                output += `<div class="success status">Status: ${topicsResp.status}</div>`;
                const topics = await topicsResp.json();
                output += `<pre>${JSON.stringify(topics, null, 2)}</pre>`;

                // Test 4: Organizations
                output += '<h2>Test 4: /api/organizations?limit=5</h2>';
                const orgsResp = await fetch(`${API_BASE_URL}/organizations?limit=5&offset=0`);
                output += `<div class="success status">Status: ${orgsResp.status}</div>`;
                const orgs = await orgsResp.json();
                output += `<pre>${JSON.stringify(orgs, null, 2)}</pre>`;

                status.innerHTML = '<div class="success status">✅ All tests passed!</div>';
                results.innerHTML = output;

            } catch (error) {
                status.innerHTML = `<div class="error status">❌ Error: ${error.message}</div>`;
                results.innerHTML = output + `<pre>Error: ${error.stack}</pre>`;
            }
        }

        // Run tests on load
        runTests();
    </script>
</body>
</html>