PROYEK TailwindCSS dan shadcn/ui V1

import React, { useState } from 'react'; import * as XLSX from 'xlsx'; import { Button } from "@/components/ui/button"; export default function CsvTableExport() { const [rows, setRows] = useState([]); const [headers, setHeaders] = useState([]); const handleFileUpload = (e) => { const file = e.target.files[0]; const reader = new FileReader(); reader.onload = (evt) => { const data = evt.target.result; const workbook = XLSX.read(data, { type: 'binary' }); const sheetName = workbook.SheetNames[0]; const sheet = XLSX.utils.sheet_to_json(workbook.Sheets[sheetName], { header: 1 }); setHeaders(sheet[0]); setRows(sheet.slice(1)); }; reader.readAsBinaryString(file); }; const exportToXLSX = () => { const ws = XLSX.utils.aoa_to_sheet([headers, ...rows]); const wb = XLSX.utils.book_new(); XLSX.utils.book_append_sheet(wb, ws, 'Sheet1'); XLSX.writeFile(wb, 'exported_data.xlsx'); }; return (

{headers.length > 0 && (

{headers.map((h, i) => ( ))} {rows.map((row, ri) => ( {headers.map((_, ci) => ( ))} ))}

{h}
{row[ci] || ''}

)}

); }