Adding login admin, fix ipv6 Vienamese version, add env example

This commit is contained in:
2026-05-15 19:52:34 +07:00
parent 31aebc40f0
commit c7f09d941e
15 changed files with 334 additions and 66 deletions
+41 -12
View File
@@ -227,6 +227,16 @@ export default function AdminConsole({ data, view = "all" }: { data: AdminData;
const [detail, setDetail] = useState<AdminRequest | null>(null);
const { lang, setLang } = useLanguage();
const { admin: t } = useTranslation();
const [userDropdown, setUserDropdown] = useState(false);
const handleLogout = async () => {
try {
await fetch("/ipv6/api/auth/logout", { method: "POST" });
router.push("/login");
} catch (error) {
console.error("Logout failed", error);
}
};
// Merge real requests from server prop with translated UI labels
const tData = {
@@ -295,7 +305,9 @@ export default function AdminConsole({ data, view = "all" }: { data: AdminData;
{ href: "/admin/rejected", icon: "cancel", label: lang === "vi" ? "Từ chối" : "Rejected" },
] as const
).map((item) => {
const active = pathname === item.href;
const cleanPathname = pathname.endsWith("/") ? pathname.slice(0, -1) : pathname;
const cleanHref = item.href.endsWith("/") ? item.href.slice(0, -1) : item.href;
const active = cleanPathname === cleanHref;
return (
<Link
key={item.href}
@@ -317,13 +329,7 @@ export default function AdminConsole({ data, view = "all" }: { data: AdminData;
);
})}
</nav>
<button
type="button"
className="group flex flex-col items-center gap-1 text-on-surface-variant hover:text-primary mt-auto"
>
<span className="material-symbols-outlined text-2xl transition-all duration-300 group-hover:rotate-45">settings</span>
<span className="font-[var(--font-label-caps)] text-[8px] uppercase tracking-widest">{lang === "vi" ? "Cài đặt" : "Settings"}</span>
</button>
{/* Settings button removed as per request */}
</aside>
<div className="flex-1 ml-20 md:ml-24 flex flex-col min-w-0">
@@ -382,10 +388,33 @@ export default function AdminConsole({ data, view = "all" }: { data: AdminData;
<span>VIE</span>
</button>
</div>
<div className="flex flex-col items-end">
<span className="font-[var(--font-label-caps)] text-[10px] text-primary uppercase tracking-widest">
{t.meta.user.role}
</span>
<div className="relative">
<button
type="button"
onClick={() => setUserDropdown(!userDropdown)}
className="flex flex-col items-end group"
>
<span className="font-[var(--font-label-caps)] text-[10px] text-primary uppercase tracking-widest group-hover:text-primary/80 transition-colors">
{t.meta.user.role}
</span>
<span className="material-symbols-outlined text-outline group-hover:text-primary transition-colors text-xs">
{userDropdown ? "expand_less" : "expand_more"}
</span>
</button>
{userDropdown && (
<div className="absolute right-0 mt-2 w-48 glass-panel rounded-xl shadow-2xl border border-white/10 z-[60] overflow-hidden">
<button
onClick={handleLogout}
className="w-full px-4 py-3 flex items-center gap-3 text-left hover:bg-white/5 text-on-surface transition-colors border-b border-white/5"
>
<span className="material-symbols-outlined text-red-400 text-lg">logout</span>
<span className="text-xs font-[var(--font-label-caps)] uppercase tracking-wider">
{lang === "vi" ? "Đăng xuất" : "Log Out"}
</span>
</button>
</div>
)}
</div>
</div>
</header>