Spaces:
Sleeping
Sleeping
'use client'; | |
import { useState, useEffect } from "react"; | |
import { useRouter } from "next/router"; | |
import NexusAuthApi from "@lib/Nexus_Auth_API"; | |
export default function Home() { | |
const [username, setUsername] = useState(null); | |
const [userID, setUserID] = useState(null); | |
const [token, setToken] = useState(null); | |
const [accessLevel, setAccessLevel] = useState(null); | |
const router = useRouter(); | |
useEffect(() => { | |
setUsername(localStorage.getItem('me')); | |
setUserID(localStorage.getItem('u_id')); | |
setToken(localStorage.getItem('s_tkn')); | |
setAccessLevel(localStorage.getItem('a_l')); | |
}, []); | |
const clearLocalStorage = () => { | |
localStorage.removeItem('me'); | |
localStorage.removeItem('s_tkn'); | |
localStorage.removeItem('u_id'); | |
localStorage.removeItem('a_l'); | |
setUsername(null); | |
}; | |
const handleLogout = () => { | |
NexusAuthApi.logout(userID, token) | |
.then(() => { | |
clearLocalStorage(); | |
router.push('/'); | |
window.location.reload(); | |
}) | |
.catch((error) => { | |
console.error("Logout failed", error); | |
}); | |
}; | |
return ( | |
<div className="page-content"> | |
{username && ( | |
<div className="max-w-sm mx-auto shadow-lg rounded-lg overflow-hidden bg-gray-800 text-white"> | |
<table className="min-w-full divide-y divide-gray-700"> | |
<tbody className="divide-y divide-gray-700"> | |
<tr> | |
<td className="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-300">User ID:</td> | |
<td className="px-6 py-4 whitespace-nowrap text-sm text-gray-100"><strong>{userID}</strong></td> | |
</tr> | |
<tr> | |
<td className="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-300">Username:</td> | |
<td className="px-6 py-4 whitespace-nowrap text-sm text-gray-100"><strong>{username}</strong></td> | |
</tr> | |
<tr> | |
<td className="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-300">Access Level:</td> | |
<td className="px-6 py-4 whitespace-nowrap text-sm text-gray-100"><strong>{accessLevel}</strong></td> | |
</tr> | |
<tr> | |
<td colSpan="2" className="px-6 py-4 whitespace-nowrap text-sm text-center"> | |
<button onClick={handleLogout} className="bg-red-600 text-white px-4 py-2 rounded-md hover:bg-red-700 transition duration-300">Logout</button> | |
</td> | |
</tr> | |
</tbody> | |
</table> | |
</div> | |
)} | |
</div> | |
); | |
} | |