82 lines
2.7 KiB
TypeScript
82 lines
2.7 KiB
TypeScript
|
import { Link, Navigate, NavLink, Outlet, useNavigate } from "react-router-dom";
|
||
|
|
import { useAdminT } from "../admin/useAdminT";
|
||
|
|
import { clearToken, getToken } from "../admin/token";
|
||
|
|
import { adminUiPrefix } from "../adminPaths";
|
||
|
|
import { useAdminRouterMode } from "../adminRouterMode";
|
||
|
|
|
||
|
|
export function AdminLayout() {
|
||
|
|
const t = useAdminT();
|
||
|
|
const mode = useAdminRouterMode();
|
||
|
|
const nav = useNavigate();
|
||
|
|
const token = getToken();
|
||
|
|
const loginTo = mode === "basename" ? "login" : `${adminUiPrefix}/login`;
|
||
|
|
if (!token) return <Navigate to={loginTo} replace />;
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div className="min-h-full bg-ark-bg">
|
||
|
|
<div className="border-b border-ark-line">
|
||
|
|
<div className="mx-auto max-w-6xl px-4 py-3 flex items-center justify-between gap-3">
|
||
|
|
<div className="flex items-center gap-4">
|
||
|
|
{mode === "absolute" ? (
|
||
|
|
<Link
|
||
|
|
to="/"
|
||
|
|
className="text-sm text-neutral-400 hover:text-white"
|
||
|
|
>
|
||
|
|
← {t("home")}
|
||
|
|
</Link>
|
||
|
|
) : null}
|
||
|
|
<NavLink
|
||
|
|
to={mode === "basename" ? "." : adminUiPrefix}
|
||
|
|
end
|
||
|
|
className={({ isActive }) =>
|
||
|
|
`text-sm ${isActive ? "text-ark-gold2" : "text-neutral-300 hover:text-white"}`
|
||
|
|
}
|
||
|
|
>
|
||
|
|
{t("dashboard")}
|
||
|
|
</NavLink>
|
||
|
|
<NavLink
|
||
|
|
to={
|
||
|
|
mode === "basename" ? "resources" : `${adminUiPrefix}/resources`
|
||
|
|
}
|
||
|
|
className={({ isActive }) =>
|
||
|
|
`text-sm ${isActive ? "text-ark-gold2" : "text-neutral-300 hover:text-white"}`
|
||
|
|
}
|
||
|
|
>
|
||
|
|
{t("resources")}
|
||
|
|
</NavLink>
|
||
|
|
<NavLink
|
||
|
|
to={
|
||
|
|
mode === "basename"
|
||
|
|
? "search-logs"
|
||
|
|
: `${adminUiPrefix}/search-logs`
|
||
|
|
}
|
||
|
|
className={({ isActive }) =>
|
||
|
|
`text-sm ${isActive ? "text-ark-gold2" : "text-neutral-300 hover:text-white"}`
|
||
|
|
}
|
||
|
|
>
|
||
|
|
{t("adminSearchLogs")}
|
||
|
|
</NavLink>
|
||
|
|
</div>
|
||
|
|
<button
|
||
|
|
type="button"
|
||
|
|
className="text-sm text-neutral-400 hover:text-white"
|
||
|
|
onClick={() => {
|
||
|
|
clearToken();
|
||
|
|
if (mode === "basename") {
|
||
|
|
nav("login", { replace: true });
|
||
|
|
} else {
|
||
|
|
window.location.href = `${adminUiPrefix}/login`;
|
||
|
|
}
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
{t("logout")}
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div className="mx-auto max-w-6xl px-4 py-6">
|
||
|
|
<Outlet />
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|