feat: add XLSX export functionality to ExportModal and update dependencies in package.json and package-lock.json

2026-01-29 23:45:34 +01:00
parent bdba3dec58
commit 8d197fa3e0
3 changed files with 126 additions and 3 deletions
--- 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<ExportFormat>('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
--- 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,
--- 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": {