43 lines
1.5 KiB
TypeScript
43 lines
1.5 KiB
TypeScript
"use client";
|
|
|
|
import { useEffect, useState } from "react";
|
|
import { useRouter } from "next/navigation";
|
|
import type { AuthUser } from "@duoc-thu/shared-types";
|
|
import { logout, me } from "@duoc-thu/api-client";
|
|
|
|
export default function AdminPage() {
|
|
const router = useRouter();
|
|
const [user, setUser] = useState<AuthUser | null>(null);
|
|
|
|
useEffect(() => {
|
|
// The middleware guard already redirected anyone without a valid
|
|
// admin session before this component ever rendered — this fetch is
|
|
// for display, not the access-control decision itself.
|
|
me().then(setUser);
|
|
}, []);
|
|
|
|
return (
|
|
<div className="flex flex-1 flex-col gap-4 p-6">
|
|
<h1 className="text-lg font-bold text-txt-primary">Khu vực quản trị</h1>
|
|
<p className="text-sm text-txt-secondary">
|
|
Đăng nhập với: <strong>{user?.username ?? "..."}</strong> (
|
|
{user?.role ?? "..."})
|
|
</p>
|
|
<p className="max-w-xl text-xs text-txt-muted">
|
|
Đây là bằng chứng cơ chế phân quyền hoạt động đúng — chưa có tính
|
|
năng quản trị cụ thể nào ở đây, vì chưa có yêu cầu nào được nêu ra.
|
|
</p>
|
|
<button
|
|
onClick={async () => {
|
|
await logout();
|
|
router.push("/admin/login");
|
|
router.refresh();
|
|
}}
|
|
className="w-fit rounded-lg border border-border-subtle px-4 py-2 text-sm font-semibold text-txt-primary hover:bg-surface-hover"
|
|
>
|
|
Đăng xuất
|
|
</button>
|
|
</div>
|
|
);
|
|
}
|