|
"use client";
|
|
|
|
import { useEffect, useState } from "react";
|
|
import { useRouter } from "next/navigation";
|
|
import axios from "axios";
|
|
import AdminLayout from "../../components/AdminLayout";
|
|
import AdminDashboard from "../../components/AdminDashboard";
|
|
import UserManagement from "../../components/UserManagement";
|
|
import JobManagement from "../../components/JobManagement";
|
|
import TokenManagement from "../../components/TokenManagement";
|
|
import SystemStats from "../../components/SystemStats";
|
|
import DeveloperTools from "../../components/DeveloperTools";
|
|
|
|
interface User {
|
|
id: string;
|
|
email: string;
|
|
first_name: string;
|
|
last_name: string;
|
|
role: string;
|
|
company_name?: string;
|
|
avatar_url?: string;
|
|
is_active: boolean;
|
|
last_login_at?: string;
|
|
email_verified_at?: string;
|
|
created_at: string;
|
|
updated_at: string;
|
|
}
|
|
|
|
interface SystemStatistics {
|
|
total_users: number;
|
|
active_users: number;
|
|
total_jobs: number;
|
|
total_interviews: number;
|
|
total_tokens_purchased: number;
|
|
total_tokens_used: number;
|
|
total_revenue: number;
|
|
generated_at: string;
|
|
}
|
|
|
|
export default function AdminPage() {
|
|
const [user, setUser] = useState<User | null>(null);
|
|
const [loading, setLoading] = useState(true);
|
|
const [activeTab, setActiveTab] = useState("dashboard");
|
|
const [systemStats, setSystemStats] = useState<SystemStatistics | null>(null);
|
|
const router = useRouter();
|
|
|
|
useEffect(() => {
|
|
const token = localStorage.getItem("token");
|
|
if (!token) {
|
|
router.push("/login");
|
|
return;
|
|
}
|
|
|
|
// Verify token and check if user is admin
|
|
axios.get(`${process.env.NEXT_PUBLIC_API_URL}/rest/auth/me`, {
|
|
headers: {
|
|
Authorization: `Bearer ${token}`
|
|
}
|
|
})
|
|
.then(response => {
|
|
const userData = response.data;
|
|
if (userData.role !== 'admin') {
|
|
router.push("/dashboard");
|
|
return;
|
|
}
|
|
setUser(userData);
|
|
|
|
// Fetch system statistics
|
|
fetchSystemStats();
|
|
})
|
|
.catch(() => {
|
|
localStorage.removeItem("token");
|
|
localStorage.removeItem("user");
|
|
router.push("/login");
|
|
})
|
|
.finally(() => {
|
|
setLoading(false);
|
|
});
|
|
}, [router]);
|
|
|
|
const fetchSystemStats = async () => {
|
|
try {
|
|
const token = localStorage.getItem("token");
|
|
const response = await axios.get(`${process.env.NEXT_PUBLIC_API_URL}/rest/admin/statistics`, {
|
|
headers: {
|
|
Authorization: `Bearer ${token}`
|
|
}
|
|
});
|
|
setSystemStats(response.data);
|
|
} catch (error) {
|
|
console.error("Failed to fetch system statistics:", error);
|
|
}
|
|
};
|
|
|
|
const handleLogout = () => {
|
|
localStorage.removeItem("token");
|
|
localStorage.removeItem("user");
|
|
router.push("/login");
|
|
};
|
|
|
|
const handleTabChange = (tab: string) => {
|
|
setActiveTab(tab);
|
|
};
|
|
|
|
if (loading) {
|
|
return (
|
|
<div className="min-h-screen bg-gray-50 flex items-center justify-center">
|
|
<div className="text-center">
|
|
<div className="animate-spin rounded-full h-12 w-12 border-b-2 border-blue-600 mx-auto"></div>
|
|
<p className="mt-4 text-gray-600">Loading admin dashboard...</p>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
const renderContent = () => {
|
|
switch (activeTab) {
|
|
case "dashboard":
|
|
return <AdminDashboard stats={systemStats} onRefresh={fetchSystemStats} />;
|
|
case "users":
|
|
return <UserManagement />;
|
|
case "jobs":
|
|
return <JobManagement />;
|
|
case "tokens":
|
|
return <TokenManagement />;
|
|
case "stats":
|
|
return <SystemStats stats={systemStats} onRefresh={fetchSystemStats} />;
|
|
case "devtools":
|
|
return <DeveloperTools />;
|
|
default:
|
|
return <AdminDashboard stats={systemStats} onRefresh={fetchSystemStats} />;
|
|
}
|
|
};
|
|
|
|
return (
|
|
<AdminLayout
|
|
user={user || undefined}
|
|
activeTab={activeTab}
|
|
onTabChange={handleTabChange}
|
|
onLogout={handleLogout}
|
|
>
|
|
{renderContent()}
|
|
</AdminLayout>
|
|
);
|
|
}
|