diff --git a/components/dashboard/ExportModal.tsx b/components/dashboard/ExportModal.tsx index 002dab3..679e5db 100644 --- a/components/dashboard/ExportModal.tsx +++ b/components/dashboard/ExportModal.tsx @@ -2,6 +2,7 @@ import { useState } from 'react' import { Modal, Button, Checkbox, Input, Select } from '@ciphera-net/ui' +import * as XLSX from 'xlsx' import type { DailyStat } from './Chart' interface ExportModalProps { @@ -10,7 +11,7 @@ interface ExportModalProps { data: DailyStat[] } -type ExportFormat = 'csv' | 'json' +type ExportFormat = 'csv' | 'json' | 'xlsx' export default function ExportModal({ isOpen, onClose, data }: ExportModalProps) { const [format, setFormat] = useState('csv') @@ -59,6 +60,22 @@ export default function ExportModal({ isOpen, onClose, data }: ExportModalProps) content = (includeHeader ? header + '\n' : '') + rows.join('\n') mimeType = 'text/csv;charset=utf-8;' extension = 'csv' + } else if (format === 'xlsx') { + const ws = XLSX.utils.json_to_sheet(exportData) + const wb = XLSX.utils.book_new() + XLSX.utils.book_append_sheet(wb, ws, "Data") + const wbout = XLSX.write(wb, { bookType: 'xlsx', type: 'array' }) + const blob = new Blob([wbout], { type: 'application/octet-stream' }) + + const url = URL.createObjectURL(blob) + const link = document.createElement('a') + link.setAttribute('href', url) + link.setAttribute('download', `${filename || 'export'}.${extension || 'xlsx'}`) + document.body.appendChild(link) + link.click() + document.body.removeChild(link) + onClose() + return } else { content = JSON.stringify(exportData, null, 2) mimeType = 'application/json;charset=utf-8;' @@ -104,6 +121,7 @@ export default function ExportModal({ isOpen, onClose, data }: ExportModalProps) options={[ { value: 'csv', label: 'CSV' }, { value: 'json', label: 'JSON' }, + { value: 'xlsx', label: 'Excel' }, ]} variant="input" fullWidth diff --git a/package-lock.json b/package-lock.json index 4bf61b1..2b69ab3 100644 --- a/package-lock.json +++ b/package-lock.json @@ -21,7 +21,8 @@ "react-icons": "^5.5.0", "react-simple-maps": "^3.0.0", "recharts": "^2.15.0", - "sonner": "^2.0.7" + "sonner": "^2.0.7", + "xlsx": "^0.18.5" }, "devDependencies": { "@tailwindcss/typography": "^0.5.19", @@ -1883,6 +1884,15 @@ "acorn": "^6.0.0 || ^7.0.0 || ^8.0.0" } }, + "node_modules/adler-32": { + "version": "1.3.1", + "resolved": "https://registry.npmjs.org/adler-32/-/adler-32-1.3.1.tgz", + "integrity": "sha512-ynZ4w/nUUv5rrsR8UUGoe1VC9hZj6V5hU9Qw1HlMDJGEJw5S7TfTErWTjMys6M7vr0YWcPqs3qAr4ss0nDfP+A==", + "license": "Apache-2.0", + "engines": { + "node": ">=0.8" + } + }, "node_modules/ajv": { "version": "6.12.6", "dev": true, @@ -2335,6 +2345,19 @@ ], "license": "CC-BY-4.0" }, + "node_modules/cfb": { + "version": "1.2.2", + "resolved": "https://registry.npmjs.org/cfb/-/cfb-1.2.2.tgz", + "integrity": "sha512-KfdUZsSOw19/ObEWasvBP/Ac4reZvAGauZhs6S/gqNhXhI7cKwvlH7ulj+dOEYnca4bm4SGo8C1bTAQvnTjgQA==", + "license": "Apache-2.0", + "dependencies": { + "adler-32": "~1.3.0", + "crc-32": "~1.2.0" + }, + "engines": { + "node": ">=0.8" + } + }, "node_modules/chalk": { "version": "4.1.2", "dev": true, @@ -2395,6 +2418,15 @@ "node": ">=6" } }, + "node_modules/codepage": { + "version": "1.15.0", + "resolved": "https://registry.npmjs.org/codepage/-/codepage-1.15.0.tgz", + "integrity": "sha512-3g6NUTPd/YtuuGrhMnOMRjFc+LJw/bnMp3+0r/Wcz3IXUuCosKRJvMphm5+Q+bvTVGcJJuRvVLuYba+WojaFaA==", + "license": "Apache-2.0", + "engines": { + "node": ">=0.8" + } + }, "node_modules/color-convert": { "version": "2.0.1", "dev": true, @@ -2443,6 +2475,18 @@ "version": "1.6.4", "license": "MIT" }, + "node_modules/crc-32": { + "version": "1.2.2", + "resolved": "https://registry.npmjs.org/crc-32/-/crc-32-1.2.2.tgz", + "integrity": "sha512-ROmzCKrTnOwybPcJApAA6WBWij23HVfGVNKqqrZpuyZOHqK2CwHSvpGuyt/UNNvaIjEd8X5IFGp4Mh+Ie1IHJQ==", + "license": "Apache-2.0", + "bin": { + "crc32": "bin/crc32.njs" + }, + "engines": { + "node": ">=0.8" + } + }, "node_modules/cross-spawn": { "version": "7.0.6", "dev": true, @@ -3560,6 +3604,15 @@ "node": ">= 6" } }, + "node_modules/frac": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/frac/-/frac-1.1.2.tgz", + "integrity": "sha512-w/XBfkibaTl3YDqASwfDUqkna4Z2p9cFSr1aHDt0WoMTECnRfBOv2WArlZILlqgWlmdIlALXGpM2AOhEk5W3IA==", + "license": "Apache-2.0", + "engines": { + "node": ">=0.8" + } + }, "node_modules/fraction.js": { "version": "5.3.4", "dev": true, @@ -5645,6 +5698,18 @@ "node": ">=0.10.0" } }, + "node_modules/ssf": { + "version": "0.11.2", + "resolved": "https://registry.npmjs.org/ssf/-/ssf-0.11.2.tgz", + "integrity": "sha512-+idbmIXoYET47hH+d7dfm2epdOMUDjqcB4648sTZ+t2JwoyBFL/insLfB/racrDmsKB3diwsDA696pZMieAC5g==", + "license": "Apache-2.0", + "dependencies": { + "frac": "~1.1.2" + }, + "engines": { + "node": ">=0.8" + } + }, "node_modules/stable-hash": { "version": "0.0.5", "dev": true, @@ -6392,6 +6457,24 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/wmf": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/wmf/-/wmf-1.0.2.tgz", + "integrity": "sha512-/p9K7bEh0Dj6WbXg4JG0xvLQmIadrner1bi45VMJTfnbVHsc7yIajZyoSoK60/dtVBs12Fm6WkUI5/3WAVsNMw==", + "license": "Apache-2.0", + "engines": { + "node": ">=0.8" + } + }, + "node_modules/word": { + "version": "0.3.0", + "resolved": "https://registry.npmjs.org/word/-/word-0.3.0.tgz", + "integrity": "sha512-OELeY0Q61OXpdUfTp+oweA/vtLVg5VDOXh+3he3PNzLGG/y0oylSOC1xRVj0+l4vQ3tj/bB1HVHv1ocXkQceFA==", + "license": "Apache-2.0", + "engines": { + "node": ">=0.8" + } + }, "node_modules/word-wrap": { "version": "1.2.5", "dev": true, @@ -6400,6 +6483,27 @@ "node": ">=0.10.0" } }, + "node_modules/xlsx": { + "version": "0.18.5", + "resolved": "https://registry.npmjs.org/xlsx/-/xlsx-0.18.5.tgz", + "integrity": "sha512-dmg3LCjBPHZnQp5/F/+nnTa+miPJxUXB6vtk42YjBBKayDNagxGEeIdWApkYPOf3Z3pm3k62Knjzp7lMeTEtFQ==", + "license": "Apache-2.0", + "dependencies": { + "adler-32": "~1.3.0", + "cfb": "~1.2.1", + "codepage": "~1.15.0", + "crc-32": "~1.2.1", + "ssf": "~0.11.2", + "wmf": "~1.0.1", + "word": "~0.3.0" + }, + "bin": { + "xlsx": "bin/xlsx.njs" + }, + "engines": { + "node": ">=0.8" + } + }, "node_modules/yallist": { "version": "3.1.1", "dev": true, diff --git a/package.json b/package.json index 47646a1..4e4050f 100644 --- a/package.json +++ b/package.json @@ -23,7 +23,8 @@ "react-icons": "^5.5.0", "react-simple-maps": "^3.0.0", "recharts": "^2.15.0", - "sonner": "^2.0.7" + "sonner": "^2.0.7", + "xlsx": "^0.18.5" }, "overrides": { "react-simple-maps": {