100 lines
2.7 KiB
TypeScript
100 lines
2.7 KiB
TypeScript
"use client";
|
|
|
|
import { useState, useEffect } from "react";
|
|
import { auth } from "@/lib/firebase/config";
|
|
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
|
|
import { Button } from "@/components/ui/button";
|
|
|
|
export default function TestAuthPage() {
|
|
const [results, setResults] = useState<any>(null);
|
|
const [loading, setLoading] = useState(false);
|
|
|
|
const runDiagnostics = async () => {
|
|
setLoading(true);
|
|
try {
|
|
const user = auth.currentUser;
|
|
|
|
if (!user) {
|
|
setResults({ error: "Not authenticated. Please sign in first." });
|
|
return;
|
|
}
|
|
|
|
const token = await user.getIdToken();
|
|
|
|
// Test with token
|
|
const response = await fetch('/api/diagnose', {
|
|
headers: {
|
|
'Authorization': `Bearer ${token}`,
|
|
},
|
|
});
|
|
|
|
const data = await response.json();
|
|
setResults({
|
|
...data,
|
|
clientInfo: {
|
|
uid: user.uid,
|
|
email: user.email,
|
|
tokenLength: token.length,
|
|
}
|
|
});
|
|
} catch (error: any) {
|
|
setResults({ error: error.message });
|
|
} finally {
|
|
setLoading(false);
|
|
}
|
|
};
|
|
|
|
useEffect(() => {
|
|
const unsubscribe = auth.onAuthStateChanged((user) => {
|
|
console.log('[Test Auth] Auth state changed:', user ? user.uid : 'No user');
|
|
if (user) {
|
|
runDiagnostics();
|
|
} else {
|
|
setResults({
|
|
error: "Not authenticated. Please sign in first.",
|
|
note: "Redirecting to auth page...",
|
|
});
|
|
// Redirect to auth page after a delay
|
|
setTimeout(() => {
|
|
window.location.href = '/auth';
|
|
}, 2000);
|
|
}
|
|
});
|
|
|
|
return () => unsubscribe();
|
|
}, []);
|
|
|
|
return (
|
|
<div className="flex h-full flex-col overflow-auto p-8">
|
|
<div className="max-w-4xl space-y-6">
|
|
<div>
|
|
<h1 className="text-4xl font-bold mb-2">Auth Diagnostics</h1>
|
|
<p className="text-muted-foreground">Testing Firebase authentication and token verification</p>
|
|
</div>
|
|
|
|
<Card>
|
|
<CardHeader>
|
|
<CardTitle>Diagnostic Results</CardTitle>
|
|
</CardHeader>
|
|
<CardContent>
|
|
{loading && <p>Running diagnostics...</p>}
|
|
{results && (
|
|
<pre className="bg-muted p-4 rounded-lg overflow-auto text-xs">
|
|
{JSON.stringify(results, null, 2)}
|
|
</pre>
|
|
)}
|
|
{!loading && !results && (
|
|
<p className="text-muted-foreground">Click "Run Diagnostics" to test</p>
|
|
)}
|
|
</CardContent>
|
|
</Card>
|
|
|
|
<Button onClick={runDiagnostics} disabled={loading}>
|
|
{loading ? "Running..." : "Run Diagnostics Again"}
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|