105 lines
3.8 KiB
TypeScript
105 lines
3.8 KiB
TypeScript
"use client";
|
|
import { useState } from "react";
|
|
import { useAuth } from "@/contexts/AuthContext";
|
|
import { Card, CardHeader, CardTitle, CardContent } from "@/components/ui/Card";
|
|
import Button from "@/components/Button";
|
|
import { API_ENDPOINTS, API_BASE_URL } from "@/utils/constants";
|
|
|
|
export default function DebugTicketsPage() {
|
|
const { user, isAuthenticated } = useAuth();
|
|
const [response, setResponse] = useState<any>(null);
|
|
const [loading, setLoading] = useState(false);
|
|
|
|
const testAPI = async () => {
|
|
setLoading(true);
|
|
try {
|
|
const token = localStorage.getItem('auth_token');
|
|
|
|
console.log('🔍 Test de l\'API /game/my-tickets');
|
|
console.log('📍 URL:', `${API_BASE_URL}${API_ENDPOINTS.GAME.MY_TICKETS}`);
|
|
console.log('🔑 Token:', token ? 'Présent' : 'Absent');
|
|
console.log('👤 User:', user);
|
|
|
|
const res = await fetch(`${API_BASE_URL}${API_ENDPOINTS.GAME.MY_TICKETS}?page=1&limit=10`, {
|
|
method: 'GET',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
...(token && { 'Authorization': `Bearer ${token}` }),
|
|
},
|
|
});
|
|
|
|
console.log('📡 Status:', res.status);
|
|
|
|
const data = await res.json();
|
|
console.log('📦 Données reçues:', data);
|
|
|
|
setResponse({
|
|
status: res.status,
|
|
statusText: res.statusText,
|
|
data: data,
|
|
token: token ? 'Présent ✅' : 'Absent ❌',
|
|
user: user,
|
|
url: `${API_BASE_URL}${API_ENDPOINTS.GAME.MY_TICKETS}`,
|
|
});
|
|
} catch (error: any) {
|
|
console.error('❌ Erreur:', error);
|
|
setResponse({
|
|
error: error.message,
|
|
token: localStorage.getItem('auth_token') ? 'Présent ✅' : 'Absent ❌',
|
|
user: user,
|
|
});
|
|
} finally {
|
|
setLoading(false);
|
|
}
|
|
};
|
|
|
|
return (
|
|
<div className="py-8">
|
|
<div className="max-w-4xl mx-auto">
|
|
<Card>
|
|
<CardHeader>
|
|
<CardTitle>🔧 Debug - Chargement des tickets</CardTitle>
|
|
</CardHeader>
|
|
<CardContent>
|
|
<div className="space-y-4">
|
|
<div className="p-4 bg-gray-50 rounded">
|
|
<h3 className="font-semibold mb-2">État actuel :</h3>
|
|
<ul className="text-sm space-y-1">
|
|
<li>✅ Authentifié : {isAuthenticated ? 'Oui' : 'Non'}</li>
|
|
<li>👤 Utilisateur : {user?.firstName} {user?.lastName}</li>
|
|
<li>📧 Email : {user?.email}</li>
|
|
<li>🎭 Rôle : {user?.role}</li>
|
|
<li>🔑 Token : {localStorage.getItem('auth_token') ? 'Présent' : 'Absent'}</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<Button onClick={testAPI} disabled={loading} className="w-full">
|
|
{loading ? 'Test en cours...' : '🧪 Tester l\'API /game/my-tickets'}
|
|
</Button>
|
|
|
|
{response && (
|
|
<div className="p-4 bg-blue-50 rounded border border-blue-200">
|
|
<h3 className="font-semibold mb-2">Résultat du test :</h3>
|
|
<pre className="text-xs overflow-auto max-h-96 bg-white p-3 rounded">
|
|
{JSON.stringify(response, null, 2)}
|
|
</pre>
|
|
</div>
|
|
)}
|
|
|
|
<div className="p-4 bg-yellow-50 rounded border border-yellow-200">
|
|
<h3 className="font-semibold mb-2">💡 Instructions :</h3>
|
|
<ol className="text-sm space-y-2 list-decimal list-inside">
|
|
<li>Cliquez sur le bouton "Tester l'API"</li>
|
|
<li>Vérifiez le statut de la réponse (devrait être 200)</li>
|
|
<li>Vérifiez que des tickets sont retournés</li>
|
|
<li>Ouvrez la console (F12) pour voir les logs détaillés</li>
|
|
</ol>
|
|
</div>
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|