|
1 | | -// Copyright (c) 2025 Raj |
| 1 | +// Copyright (c) 2025-2026 Raj |
2 | 2 | // See LICENSE for details. |
3 | 3 | "use client" |
4 | 4 | import React from 'react' |
@@ -31,137 +31,137 @@ function HistoryFilter({ |
31 | 31 | const project = useAppSelector(state => state.fs); |
32 | 32 |
|
33 | 33 | const handleExportPDF = async () => { |
34 | | - const history = mode === 'user' ? await getAllUserHistory() : projectId && await getAllProjectHistory(projectId); |
35 | | - |
36 | | - if (!history || history.length === 0) { |
37 | | - alert("No history found to export."); |
38 | | - return; |
39 | | - } |
40 | | - |
41 | | - const doc = new jsPDF("p", "mm", "a4"); |
42 | | - const pageWidth = doc.internal.pageSize.width; |
43 | | - const pageHeight = doc.internal.pageSize.height; |
44 | | - |
45 | | - const colors = { |
46 | | - dark: "#1a1a1a", |
47 | | - primary: "#FF5733", |
48 | | - text: "#2C3E50", |
49 | | - lightText: "#7F8C8D", |
50 | | - }; |
| 34 | + const history = mode === 'user' ? await getAllUserHistory() : projectId && await getAllProjectHistory(projectId); |
51 | 35 |
|
52 | | - doc.setFillColor(colors.dark); |
53 | | - doc.rect(0, 0, pageWidth, 25, "F"); |
54 | | - |
55 | | - doc.setTextColor(255, 255, 255); |
56 | | - doc.setFontSize(20); |
57 | | - doc.setFont("helvetica", "bold"); |
58 | | - doc.text("History Report", 14, 16); |
59 | | - |
60 | | - doc.setFontSize(10); |
61 | | - doc.setTextColor(200, 200, 200); |
62 | | - doc.setFont("helvetica", "normal"); |
63 | | - |
64 | | - const contextTitle = mode === 'user' ? "User Activity Log" : `Project ID: ${projectId}`; |
65 | | - doc.text(contextTitle, 14, 22); |
66 | | - |
67 | | - doc.text(`Generated: ${new Date().toLocaleDateString()}`, pageWidth - 14, 16, { align: "right" }); |
68 | | - |
69 | | - doc.setTextColor(60, 60, 60); |
70 | | - doc.setFontSize(10); |
71 | | - |
72 | | - let metaText = `Total Records: ${history.length}`; |
73 | | - if (mode === 'project' && project) { |
74 | | - metaText = `Project: ${project.projectName} | ${metaText}`; |
75 | | - } else if (mode === 'user') { |
76 | | - metaText = `User Report | ${metaText}`; |
77 | | - } |
78 | | - |
79 | | - doc.text(metaText, 14, 32); |
80 | | - |
81 | | - const tableBody = history.map((item) => [ |
82 | | - item.type.toUpperCase(), |
83 | | - item.description, |
84 | | - new Date(item.createdAt).toLocaleDateString() + " " + new Date(item.createdAt).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' }) |
85 | | - ]); |
86 | | - |
87 | | - autoTable(doc, { |
88 | | - head: [["Action Type", "Description", "Timestamp"]], |
89 | | - body: tableBody, |
90 | | - startY: 38, |
91 | | - theme: 'grid', |
92 | | - |
93 | | - headStyles: { |
94 | | - fillColor: colors.dark, |
95 | | - textColor: [255, 255, 255], |
96 | | - fontStyle: 'bold', |
97 | | - halign: 'left', |
98 | | - cellPadding: 4 |
99 | | - }, |
100 | | - |
101 | | - styles: { |
102 | | - fontSize: 10, |
103 | | - cellPadding: 5, |
104 | | - lineColor: [230, 230, 230], |
105 | | - lineWidth: 0.1, |
106 | | - valign: 'middle', |
107 | | - font: "helvetica", |
108 | | - textColor: [50, 50, 50] |
109 | | - }, |
110 | | - |
111 | | - columnStyles: { |
112 | | - 0: { fontStyle: 'bold', cellWidth: 35 }, |
113 | | - 1: { textColor: [50, 50, 50] }, |
114 | | - 2: { halign: 'right', cellWidth: 40, fontSize: 9, textColor: [100, 100, 100], fontStyle: 'italic' } // Date |
115 | | - }, |
116 | | - |
117 | | - alternateRowStyles: { |
118 | | - fillColor: [250, 250, 250] |
119 | | - }, |
120 | | - |
121 | | - didDrawCell: (data) => { |
122 | | - if (data.section === 'body' && data.column.index === 0) { |
123 | | - const { x, y, height } = data.cell; |
124 | | - |
125 | | - const rawType = (data.cell.raw ? String(data.cell.raw) : '').toLowerCase(); |
126 | | - |
127 | | - |
128 | | - let indicatorColor: [number, number, number] = [149, 165, 166]; |
129 | | - |
130 | | - if (rawType.includes('create') || rawType.includes('add')) { |
131 | | - indicatorColor = [46, 204, 113]; |
132 | | - } else if (rawType.includes('delete') || rawType.includes('remove')) { |
133 | | - indicatorColor = [231, 76, 60]; |
134 | | - } else if (rawType.includes('update') || rawType.includes('edit')) { |
135 | | - indicatorColor = [52, 152, 219]; |
136 | | - } |
| 36 | + if (!history || history.length === 0) { |
| 37 | + alert("No history found to export."); |
| 38 | + return; |
| 39 | + } |
137 | 40 |
|
138 | | - doc.setFillColor(...indicatorColor); |
139 | | - doc.rect(x, y, 1.5, height, 'F'); |
140 | | - } |
141 | | - }, |
142 | | - |
143 | | - didDrawPage: (data) => { |
144 | | - const footerY = pageHeight - 15; |
145 | | - doc.setFontSize(10); |
146 | | - doc.setTextColor(colors.primary); |
147 | | - doc.setFont("helvetica", "bold"); |
148 | | - doc.text("Bricks AI", 14, footerY); |
149 | | - |
150 | | - doc.setTextColor(100, 100, 100); |
151 | | - doc.setFont("helvetica", "normal"); |
152 | | - doc.setFontSize(9); |
153 | | - doc.setTextColor(150, 150, 150); |
154 | | - doc.text( |
155 | | - `Page ${data.pageNumber}`, |
156 | | - pageWidth - 14, |
157 | | - footerY, |
158 | | - { align: "right" } |
159 | | - ); |
| 41 | + const doc = new jsPDF("p", "mm", "a4"); |
| 42 | + const pageWidth = doc.internal.pageSize.width; |
| 43 | + const pageHeight = doc.internal.pageSize.height; |
| 44 | + |
| 45 | + const colors = { |
| 46 | + dark: "#1a1a1a", |
| 47 | + primary: "#FF5733", |
| 48 | + text: "#2C3E50", |
| 49 | + lightText: "#7F8C8D", |
| 50 | + }; |
| 51 | + |
| 52 | + doc.setFillColor(colors.dark); |
| 53 | + doc.rect(0, 0, pageWidth, 25, "F"); |
| 54 | + |
| 55 | + doc.setTextColor(255, 255, 255); |
| 56 | + doc.setFontSize(20); |
| 57 | + doc.setFont("helvetica", "bold"); |
| 58 | + doc.text("History Report", 14, 16); |
| 59 | + |
| 60 | + doc.setFontSize(10); |
| 61 | + doc.setTextColor(200, 200, 200); |
| 62 | + doc.setFont("helvetica", "normal"); |
| 63 | + |
| 64 | + const contextTitle = mode === 'user' ? "User Activity Log" : `Project ID: ${projectId}`; |
| 65 | + doc.text(contextTitle, 14, 22); |
| 66 | + |
| 67 | + doc.text(`Generated: ${new Date().toLocaleDateString()}`, pageWidth - 14, 16, { align: "right" }); |
| 68 | + |
| 69 | + doc.setTextColor(60, 60, 60); |
| 70 | + doc.setFontSize(10); |
| 71 | + |
| 72 | + let metaText = `Total Records: ${history.length}`; |
| 73 | + if (mode === 'project' && project) { |
| 74 | + metaText = `Project: ${project.projectName} | ${metaText}`; |
| 75 | + } else if (mode === 'user') { |
| 76 | + metaText = `User Report | ${metaText}`; |
160 | 77 | } |
161 | | - }); |
162 | 78 |
|
163 | | - doc.save(`Bricks_History_${new Date().toISOString().split("T")[0]}.pdf`); |
164 | | -}; |
| 79 | + doc.text(metaText, 14, 32); |
| 80 | + |
| 81 | + const tableBody = history.map((item) => [ |
| 82 | + item.type.toUpperCase(), |
| 83 | + item.description, |
| 84 | + new Date(item.createdAt).toLocaleDateString() + " " + new Date(item.createdAt).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' }) |
| 85 | + ]); |
| 86 | + |
| 87 | + autoTable(doc, { |
| 88 | + head: [["Action Type", "Description", "Timestamp"]], |
| 89 | + body: tableBody, |
| 90 | + startY: 38, |
| 91 | + theme: 'grid', |
| 92 | + |
| 93 | + headStyles: { |
| 94 | + fillColor: colors.dark, |
| 95 | + textColor: [255, 255, 255], |
| 96 | + fontStyle: 'bold', |
| 97 | + halign: 'left', |
| 98 | + cellPadding: 4 |
| 99 | + }, |
| 100 | + |
| 101 | + styles: { |
| 102 | + fontSize: 10, |
| 103 | + cellPadding: 5, |
| 104 | + lineColor: [230, 230, 230], |
| 105 | + lineWidth: 0.1, |
| 106 | + valign: 'middle', |
| 107 | + font: "helvetica", |
| 108 | + textColor: [50, 50, 50] |
| 109 | + }, |
| 110 | + |
| 111 | + columnStyles: { |
| 112 | + 0: { fontStyle: 'bold', cellWidth: 35 }, |
| 113 | + 1: { textColor: [50, 50, 50] }, |
| 114 | + 2: { halign: 'right', cellWidth: 40, fontSize: 9, textColor: [100, 100, 100], fontStyle: 'italic' } // Date |
| 115 | + }, |
| 116 | + |
| 117 | + alternateRowStyles: { |
| 118 | + fillColor: [250, 250, 250] |
| 119 | + }, |
| 120 | + |
| 121 | + didDrawCell: (data) => { |
| 122 | + if (data.section === 'body' && data.column.index === 0) { |
| 123 | + const { x, y, height } = data.cell; |
| 124 | + |
| 125 | + const rawType = (data.cell.raw ? String(data.cell.raw) : '').toLowerCase(); |
| 126 | + |
| 127 | + |
| 128 | + let indicatorColor: [number, number, number] = [149, 165, 166]; |
| 129 | + |
| 130 | + if (rawType.includes('create') || rawType.includes('add')) { |
| 131 | + indicatorColor = [46, 204, 113]; |
| 132 | + } else if (rawType.includes('delete') || rawType.includes('remove')) { |
| 133 | + indicatorColor = [231, 76, 60]; |
| 134 | + } else if (rawType.includes('update') || rawType.includes('edit')) { |
| 135 | + indicatorColor = [52, 152, 219]; |
| 136 | + } |
| 137 | + |
| 138 | + doc.setFillColor(...indicatorColor); |
| 139 | + doc.rect(x, y, 1.5, height, 'F'); |
| 140 | + } |
| 141 | + }, |
| 142 | + |
| 143 | + didDrawPage: (data) => { |
| 144 | + const footerY = pageHeight - 15; |
| 145 | + doc.setFontSize(10); |
| 146 | + doc.setTextColor(colors.primary); |
| 147 | + doc.setFont("helvetica", "bold"); |
| 148 | + doc.text("Bricks AI", 14, footerY); |
| 149 | + |
| 150 | + doc.setTextColor(100, 100, 100); |
| 151 | + doc.setFont("helvetica", "normal"); |
| 152 | + doc.setFontSize(9); |
| 153 | + doc.setTextColor(150, 150, 150); |
| 154 | + doc.text( |
| 155 | + `Page ${data.pageNumber}`, |
| 156 | + pageWidth - 14, |
| 157 | + footerY, |
| 158 | + { align: "right" } |
| 159 | + ); |
| 160 | + } |
| 161 | + }); |
| 162 | + |
| 163 | + doc.save(`Bricks_History_${new Date().toISOString().split("T")[0]}.pdf`); |
| 164 | + }; |
165 | 165 | const handleSearch = (): void => setFilter(prev => ({ ...prev, q: textQ })); |
166 | 166 | React.useEffect(handleSearch, [textDebounce]) |
167 | 167 |
|
|
0 commit comments