1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
|
import { DriveLogEntry } from "@/lib/drive_types"
import { DriveHeader } from "@/components/drive/DriveHeader"
import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/components/ui/table"
import { Button } from "@/components/ui/button"
import { ChevronLeft, ChevronRight } from "lucide-react"
import Link from "next/link"
interface HistoryViewProps {
entries: DriveLogEntry[]
currentPage: number
hasNextPage: boolean
hasPrevPage: boolean
totalEntries: number
}
function formatFileSize(bytes: number): string {
if (bytes === 0) return "0 Bytes"
const k = 1024
const sizes = ["Bytes", "KB", "MB", "GB"]
const i = Math.floor(Math.log(bytes) / Math.log(k))
return Number.parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + " " + sizes[i]
}
function formatDateTime(timestamp: number): string {
return new Date(timestamp * 1000).toLocaleString()
}
function PaginationControls({ currentPage, hasNextPage, hasPrevPage }: {
currentPage: number
hasNextPage: boolean
hasPrevPage: boolean
}) {
return (
<div className="flex items-center justify-center gap-2">
<Link href={`/history?page=${currentPage - 1}`}>
<Button
variant="outline"
size="sm"
disabled={!hasPrevPage}
className={!hasPrevPage ? "opacity-50 cursor-not-allowed" : ""}
>
<ChevronLeft className="h-4 w-4 mr-1" />
Previous
</Button>
</Link>
<span className="text-sm text-muted-foreground px-4">
Page {currentPage + 1}
</span>
<Link href={`/history?page=${currentPage + 1}`}>
<Button
variant="outline"
size="sm"
disabled={!hasNextPage}
className={!hasNextPage ? "opacity-50 cursor-not-allowed" : ""}
>
Next
<ChevronRight className="h-4 w-4 ml-1" />
</Button>
</Link>
</div>
)
}
export function HistoryView({ entries, currentPage, hasNextPage, hasPrevPage, totalEntries }: HistoryViewProps) {
return (
<div className="container mx-auto p-6 space-y-6">
<DriveHeader />
<div className="space-y-4">
<div className="flex items-center justify-between">
<h1 className="text-2xl font-bold">Activity History</h1>
<div className="text-sm text-muted-foreground">
Showing {entries.length} of {totalEntries} entries
</div>
</div>
<PaginationControls
currentPage={currentPage}
hasNextPage={hasNextPage}
hasPrevPage={hasPrevPage}
/>
<div className="border rounded-lg">
<Table>
<TableHeader>
<TableRow>
<TableHead>Timestamp</TableHead>
<TableHead>Action</TableHead>
<TableHead>User</TableHead>
<TableHead>Path</TableHead>
<TableHead>Size</TableHead>
</TableRow>
</TableHeader>
<TableBody>
{entries.length === 0 ? (
<TableRow>
<TableCell colSpan={5} className="text-center py-8 text-muted-foreground">
No activity history found
</TableCell>
</TableRow>
) : (
entries.map((entry) => (
<TableRow key={entry.log_id} className="hover:bg-muted/50">
<TableCell className="font-mono text-sm">
{formatDateTime(entry.timestamp)}
</TableCell>
<TableCell>
<span className="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-blue-100 text-blue-800">
{entry.action}
</span>
</TableCell>
<TableCell className="font-medium">
{entry.email}
</TableCell>
<TableCell className="font-mono text-sm max-w-md truncate">
{entry.action === "create_file" && entry.blob_id !== "-" ? (
<Link
href={`/blob/${entry.blob_id}?filename=${encodeURIComponent(entry.path.split('/').pop() || 'download')}`}
className="text-blue-600 hover:text-blue-800 hover:underline"
>
{entry.path}
</Link>
) : (
entry.path
)}
</TableCell>
<TableCell>
{formatFileSize(entry.size)}
</TableCell>
</TableRow>
))
)}
</TableBody>
</Table>
</div>
<PaginationControls
currentPage={currentPage}
hasNextPage={hasNextPage}
hasPrevPage={hasPrevPage}
/>
</div>
</div>
)
}
|
