fix: prevent localStorage access during SSR in debug page

Add useEffect hook to check for auth token in localStorage only on client-side, preventing "localStorage is not defined" error during static page generation. Use state variable hasToken to display token presence in the UI.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
soufiane 2025-11-18 02:07:10 +01:00
parent 636780870d
commit 1e6a4a0f6e

View File

@ -1,5 +1,5 @@
"use client";
import { useState } from "react";
import { useState, useEffect } from "react";
import { useAuth } from "@/contexts/AuthContext";
import { Card, CardHeader, CardTitle, CardContent } from "@/components/ui/Card";
import Button from "@/components/Button";
@ -9,6 +9,11 @@ export default function DebugTicketsPage() {
const { user, isAuthenticated } = useAuth();
const [response, setResponse] = useState<any>(null);
const [loading, setLoading] = useState(false);
const [hasToken, setHasToken] = useState(false);
useEffect(() => {
setHasToken(!!localStorage.getItem('auth_token'));
}, []);
const testAPI = async () => {
setLoading(true);
@ -69,7 +74,7 @@ export default function DebugTicketsPage() {
<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>
<li>🔑 Token : {hasToken ? 'Présent' : 'Absent'}</li>
</ul>
</div>