260218:1712 20260218 TASK-BEFE-001n
All checks were successful
Build and Deploy / deploy (push) Successful in 4m55s
All checks were successful
Build and Deploy / deploy (push) Successful in 4m55s
This commit is contained in:
admin
62
frontend/app/(admin)/admin/monitoring/audit-logs/page.tsx
Normal file
62
frontend/app/(admin)/admin/monitoring/audit-logs/page.tsx
Normal file
@@ -0,0 +1,62 @@
|
||||
"use client";
|
||||
|
||||
import { useAuditLogs } from "@/hooks/use-audit-logs";
|
||||
import { Card } from "@/components/ui/card";
|
||||
import { Badge } from "@/components/ui/badge";
|
||||
import { formatDistanceToNow } from "date-fns";
|
||||
import { Loader2 } from "lucide-react";
|
||||
|
||||
export default function AuditLogsPage() {
|
||||
const { data: logs, isLoading } = useAuditLogs();
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
<div>
|
||||
<h1 className="text-3xl font-bold">Audit Logs</h1>
|
||||
<p className="text-muted-foreground mt-1">View system activity and changes</p>
|
||||
</div>
|
||||
|
||||
{isLoading ? (
|
||||
<div className="flex justify-center p-8">
|
||||
<Loader2 className="animate-spin" />
|
||||
</div>
|
||||
) : (
|
||||
<div className="space-y-2">
|
||||
{!logs || logs.length === 0 ? (
|
||||
<div className="text-center text-muted-foreground py-10">No logs found</div>
|
||||
) : (
|
||||
logs.map((log: import("@/lib/services/audit-log.service").AuditLog) => (
|
||||
<Card key={log.auditId} className="p-4">
|
||||
<div className="flex items-start justify-between">
|
||||
<div className="flex-1">
|
||||
<div className="flex items-center gap-3 mb-2">
|
||||
<span className="font-medium text-sm">
|
||||
{log.user?.fullName || log.user?.username || `User #${log.userId || 'System'}`}
|
||||
</span>
|
||||
<Badge variant={log.severity === 'ERROR' ? 'destructive' : 'outline'} className="uppercase text-[10px]">
|
||||
{log.action}
|
||||
</Badge>
|
||||
<Badge variant="secondary" className="uppercase text-[10px]">{log.entityType || 'General'}</Badge>
|
||||
</div>
|
||||
<p className="text-sm text-foreground">
|
||||
{typeof log.detailsJson === 'string' ? log.detailsJson : JSON.stringify(log.detailsJson || {})}
|
||||
</p>
|
||||
<p className="text-xs text-muted-foreground mt-2">
|
||||
{log.createdAt && formatDistanceToNow(new Date(log.createdAt), { addSuffix: true })}
|
||||
</p>
|
||||
</div>
|
||||
{/* Only show IP if available */}
|
||||
{log.ipAddress && (
|
||||
<span className="text-xs text-muted-foreground font-mono bg-muted px-2 py-1 rounded hidden md:inline-block">
|
||||
{log.ipAddress}
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
</Card>
|
||||
))
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
119
frontend/app/(admin)/admin/monitoring/sessions/page.tsx
Normal file
119
frontend/app/(admin)/admin/monitoring/sessions/page.tsx
Normal file
@@ -0,0 +1,119 @@
|
||||
'use client';
|
||||
|
||||
import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';
|
||||
import { sessionService } from '@/lib/services/session.service';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table';
|
||||
import { toast } from 'sonner';
|
||||
import { Loader2, Trash2, Monitor, Smartphone } from 'lucide-react';
|
||||
import { format } from 'date-fns';
|
||||
|
||||
export default function SessionManagementPage() {
|
||||
const queryClient = useQueryClient();
|
||||
|
||||
const {
|
||||
data: sessions,
|
||||
isLoading,
|
||||
error,
|
||||
} = useQuery({
|
||||
queryKey: ['sessions'],
|
||||
queryFn: sessionService.getActiveSessions,
|
||||
});
|
||||
|
||||
const revokeMutation = useMutation({
|
||||
mutationFn: sessionService.revokeSession,
|
||||
onSuccess: () => {
|
||||
toast.success('Session revoked successfully');
|
||||
queryClient.invalidateQueries({ queryKey: ['sessions'] });
|
||||
},
|
||||
onError: (error) => {
|
||||
toast.error('Failed to revoke session');
|
||||
console.error(error);
|
||||
},
|
||||
});
|
||||
|
||||
const handleRevoke = (id: number) => {
|
||||
if (confirm('Are you sure you want to revoke this session?')) {
|
||||
revokeMutation.mutate(id);
|
||||
}
|
||||
};
|
||||
|
||||
if (isLoading) {
|
||||
return (
|
||||
<div className="flex h-[400px] w-full items-center justify-center">
|
||||
<Loader2 className="h-8 w-8 animate-spin text-muted-foreground" />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
if (error) {
|
||||
return <div className="p-8 text-center text-red-500">Failed to load sessions. Please try again.</div>;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="space-y-6 p-6">
|
||||
<div className="flex flex-col gap-2">
|
||||
<h1 className="text-2xl font-bold tracking-tight">Active Sessions</h1>
|
||||
<p className="text-sm text-muted-foreground">Monitor and manage active user sessions across all devices.</p>
|
||||
</div>
|
||||
|
||||
<div className="rounded-md border bg-card">
|
||||
<Table>
|
||||
<TableHeader>
|
||||
<TableRow>
|
||||
<TableHead>User</TableHead>
|
||||
<TableHead>Device Info</TableHead>
|
||||
<TableHead>Last Active</TableHead>
|
||||
<TableHead className="text-right">Actions</TableHead>
|
||||
</TableRow>
|
||||
</TableHeader>
|
||||
<TableBody>
|
||||
{sessions?.map((session: any) => (
|
||||
<TableRow key={session.id}>
|
||||
<TableCell>
|
||||
<div className="flex flex-col">
|
||||
<span className="font-medium">{session.user.username}</span>
|
||||
<span className="text-xs text-muted-foreground">
|
||||
{session.user.firstName} {session.user.lastName}
|
||||
</span>
|
||||
</div>
|
||||
</TableCell>
|
||||
<TableCell>
|
||||
<div className="flex flex-col gap-1">
|
||||
<div className="flex items-center gap-2 text-sm">
|
||||
<Monitor className="h-3 w-3" />
|
||||
{session.deviceName || 'Unknown Device'}
|
||||
</div>
|
||||
<span className="text-xs text-muted-foreground">{session.ipAddress || 'Unknown IP'}</span>
|
||||
</div>
|
||||
</TableCell>
|
||||
<TableCell className="text-sm">
|
||||
{session.lastActive ? format(new Date(session.lastActive), 'PP pp') : '-'}
|
||||
</TableCell>
|
||||
<TableCell className="text-right">
|
||||
<Button
|
||||
variant="destructive"
|
||||
size="sm"
|
||||
className="h-8"
|
||||
onClick={() => handleRevoke(Number(session.id))}
|
||||
disabled={revokeMutation.isPending}
|
||||
>
|
||||
<Trash2 className="mr-2 h-3.5 w-3.5" />
|
||||
Revoke
|
||||
</Button>
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
))}
|
||||
{(!sessions || sessions.length === 0) && (
|
||||
<TableRow>
|
||||
<TableCell colSpan={4} className="h-24 text-center text-muted-foreground">
|
||||
No active sessions found.
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
)}
|
||||
</TableBody>
|
||||
</Table>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,81 @@
|
||||
"use client";
|
||||
|
||||
import { useQuery } from "@tanstack/react-query";
|
||||
import apiClient from "@/lib/api/client";
|
||||
import { DataTable } from "@/components/common/data-table";
|
||||
import { ColumnDef } from "@tanstack/react-table";
|
||||
import { RefreshCw } from "lucide-react";
|
||||
import { format } from "date-fns";
|
||||
import { Button } from "@/components/ui/button";
|
||||
|
||||
interface NumberingError {
|
||||
id: number;
|
||||
userId?: number;
|
||||
errorMessage: string;
|
||||
stackTrace?: string;
|
||||
createdAt: string;
|
||||
context?: any;
|
||||
}
|
||||
|
||||
const logService = {
|
||||
getNumberingErrors: async () => {
|
||||
const response = await apiClient.get("/document-numbering/logs/errors");
|
||||
return response.data.data || response.data;
|
||||
},
|
||||
};
|
||||
|
||||
export default function NumberingLogsPage() {
|
||||
const { data: errors = [], isLoading, refetch } = useQuery<NumberingError[]>({
|
||||
queryKey: ["numbering-errors"],
|
||||
queryFn: logService.getNumberingErrors,
|
||||
});
|
||||
|
||||
const columns: ColumnDef<NumberingError>[] = [
|
||||
{
|
||||
accessorKey: "createdAt",
|
||||
header: "Timestamp",
|
||||
cell: ({ row }) => format(new Date(row.original.createdAt), "dd MMM yyyy, HH:mm:ss"),
|
||||
},
|
||||
{
|
||||
accessorKey: "context.projectId", // Accessing nested property
|
||||
header: "Project ID",
|
||||
cell: ({ row }) => <span className="font-mono">{row.original.context?.projectId || 'N/A'}</span>,
|
||||
},
|
||||
{
|
||||
accessorKey: "errorMessage",
|
||||
header: "Message",
|
||||
cell: ({ row }) => <span className="text-destructive font-medium">{row.original.errorMessage}</span>,
|
||||
},
|
||||
{
|
||||
accessorKey: "stackTrace",
|
||||
header: "Details",
|
||||
cell: ({ row }) => (
|
||||
<div className="max-w-[400px] truncate text-xs text-muted-foreground font-mono" title={row.original.stackTrace}>
|
||||
{row.original.stackTrace}
|
||||
</div>
|
||||
),
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<div className="p-6 space-y-6">
|
||||
<div className="flex justify-between items-center">
|
||||
<div>
|
||||
<h1 className="text-2xl font-bold">Numbering Logs</h1>
|
||||
<p className="text-muted-foreground">Diagnostics for document numbering issues</p>
|
||||
</div>
|
||||
<Button variant="outline" size="icon" onClick={() => refetch()} disabled={isLoading}>
|
||||
<RefreshCw className={`h-4 w-4 ${isLoading ? "animate-spin" : ""}`} />
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
{isLoading ? (
|
||||
<div className="flex justify-center p-12">
|
||||
<RefreshCw className="h-8 w-8 animate-spin text-muted-foreground" />
|
||||
</div>
|
||||
) : (
|
||||
<DataTable columns={columns} data={errors} />
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user