1
0
forked from baron/baron-sso

ory용 MCP 제작, devfront/adminfront 백엔드 연결

This commit is contained in:
Lectom C Han
2026-01-28 10:57:22 +09:00
parent 1aaa772907
commit 93cab064fc
75 changed files with 7327 additions and 454 deletions

View File

@@ -1,4 +1,6 @@
import { useQuery } from "@tanstack/react-query";
import { Filter, ListChecks, Search, Terminal } from "lucide-react";
import { fetchAuditLogs } from "../../lib/adminApi";
const auditFilters = [
"Actor role = admin",
@@ -6,31 +8,28 @@ const auditFilters = [
"Tenant = selected header",
];
const auditRows = [
{
action: "client.create",
tenant: "TENANT-12",
actor: "ops.jane@baron",
result: "ok",
ts: "2026-01-26 15:21 KST",
},
{
action: "client.rotate_secret",
tenant: "TENANT-12",
actor: "ops.jane@baron",
result: "ok",
ts: "2026-01-26 15:22 KST",
},
{
action: "audit.export",
tenant: "TENANT-07",
actor: "auditor.lee@baron",
result: "rate_limited",
ts: "2026-01-26 15:30 KST",
},
];
function AuditLogsPage() {
const { data, isLoading, error } = useQuery({
queryKey: ["audit-logs"],
queryFn: () => fetchAuditLogs(),
});
const logs = data?.items || [];
if (isLoading) {
return <div className="p-8 text-center">Loading audit logs...</div>;
}
if (error) {
const errMsg =
(error as any).response?.data?.error || (error as Error).message;
return (
<div className="p-8 text-center text-red-500">
Error loading logs: {errMsg}
</div>
);
}
return (
<div className="space-y-8">
<div className="flex flex-col gap-3 md:flex-row md:items-center md:justify-between">
@@ -84,28 +83,42 @@ function AuditLogsPage() {
))}
</div>
<div className="mt-5 divide-y divide-[var(--color-border)]">
{auditRows.map((row) => (
<div
key={`${row.action}-${row.ts}`}
className="grid grid-cols-[1.2fr,1fr,1fr,1fr] items-center gap-2 py-3 text-sm"
>
<div className="font-semibold">{row.action}</div>
<div className="text-[var(--color-muted)]">{row.tenant}</div>
<div className="text-[var(--color-muted)]">{row.actor}</div>
<div className="inline-flex items-center gap-2">
<span
className={`rounded-full px-2 py-1 text-xs ${
row.result === "ok"
? "bg-[rgba(54,211,153,0.16)] text-[var(--color-accent)]"
: "bg-[rgba(249,168,38,0.16)] text-[var(--color-accent-strong)]"
}`}
>
{row.result}
</span>
<span className="text-[var(--color-muted)]">{row.ts}</span>
</div>
{logs.length === 0 ? (
<div className="py-8 text-center text-sm text-[var(--color-muted)]">
No audit logs found.
</div>
))}
) : (
logs.map((row, idx) => (
<div
// biome-ignore lint/suspicious/noArrayIndexKey: simple list
key={`${row.event_type}-${idx}`}
className="grid grid-cols-[1.2fr,1fr,1fr,1fr] items-center gap-2 py-3 text-sm"
>
<div className="font-semibold">{row.event_type}</div>
<div className="text-[var(--color-muted)]">
{/* Tenant info not yet in basic schema, show generic or details snippet */}
Tenant-?
</div>
<div className="text-[var(--color-muted)] overflow-hidden text-ellipsis whitespace-nowrap">
{row.user_id}
</div>
<div className="inline-flex items-center gap-2">
<span
className={`rounded-full px-2 py-1 text-xs ${
row.status === "success" || row.status === "ok"
? "bg-[rgba(54,211,153,0.16)] text-[var(--color-accent)]"
: "bg-[rgba(249,168,38,0.16)] text-[var(--color-accent-strong)]"
}`}
>
{row.status}
</span>
<span className="text-[var(--color-muted)] text-xs">
{new Date(row.timestamp).toLocaleString()}
</span>
</div>
</div>
))
)}
</div>
</div>