next-helios-fe 1.7.6 → 1.7.8

package/dist/index.js.LICENSE.txt

@@ -49,6 +49,8 @@ PERFORMANCE OF THIS SOFTWARE.
 * https://github.com/wout/svg.filter.js
 * Copyright (c) 2016 Wout Fierens; Licensed MIT */
 
+/*! xlsx.js (C) 2013-present SheetJS -- http://sheetjs.com */
+
 /**
  * @license React
  * react-jsx-runtime.production.min.js

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "next-helios-fe",
-  "version": "1.7.6",
+  "version": "1.7.8",
   "description": "",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -29,7 +29,6 @@
     "react-easy-sort": "^1.6.0",
     "react-google-recaptcha": "^3.1.0",
     "react-google-recaptcha-v3": "^1.10.1",
-    "react-json-to-excel": "^1.0.8",
     "react-leaflet": "^4.2.1",
     "react-pin-field": "^3.1.5",
     "react-syntax-highlighter": "^15.5.0",

package/src/components/table/index.tsx

@@ -1,7 +1,7 @@
 "use client";
 import React, { useState, useEffect, useRef, useMemo } from "react";
 import { Icon } from "@iconify/react";
-import { exportToExcel } from "react-json-to-excel";
+import * as xlsx from "xlsx";
 import dayjs from "dayjs";
 import { Form, Button, Dropdown } from "../../components";
 import { Action, type ActionProps } from "./action";
@@ -141,6 +141,14 @@ export const Table: TableComponentProps = ({
       });
   }, [header, data]);
 
+  const handleExportData = (dataTitle: string, data: any[]) => {
+    const fileName = `${dataTitle}-${dayjs().format("YYYY-MM-DD_HH-mm-ss")}`;
+    const worksheet = xlsx.utils.json_to_sheet(data);
+    const workbook = xlsx.utils.book_new();
+    xlsx.utils.book_append_sheet(workbook, worksheet, "Data");
+    xlsx.writeFile(workbook, fileName + ".xlsx");
+  };
+
   const handleOnPreviousClick = () => {
     if (page - 1 === 1) {
       paginationRef.current?.scrollTo({
@@ -435,7 +443,7 @@ export const Table: TableComponentProps = ({
                   key={headerItem.key}
                   className="px-4 py-1.5 bg-secondary-bg whitespace-nowrap"
                 >
-                  {headerItem.render(item)}
+                  {headerItem.render(item) || "-"}
                 </td>
               );
             } else {
@@ -444,7 +452,7 @@ export const Table: TableComponentProps = ({
                   key={headerItem.key}
                   className="px-4 py-1.5 bg-secondary-bg whitespace-nowrap"
                 >
-                  {item[headerItem.key as keyof typeof item]}
+                  {item[headerItem.key as keyof typeof item] || "-"}
                 </td>
               );
             }
@@ -564,10 +572,27 @@ export const Table: TableComponentProps = ({
                 type="button"
                 options={{ variant: "primary", width: "fit" }}
                 onClick={() => {
-                  exportToExcel(
-                    filteredData,
-                    `${title}-data_${dayjs().format("YYYY-MM-DD_HH-mm-ss")}`
-                  );
+                  const exportData = filteredData?.map((item) => {
+                    return header
+                      ?.filter(
+                        (headerItem) =>
+                          !excludedColumn?.includes(headerItem.key)
+                      )
+                      ?.reduce((acc, headerItem) => {
+                        return {
+                          ...acc,
+                          "No.": (
+                            (page - 1) * maxRow +
+                            filteredData?.indexOf(item) +
+                            1
+                          ).toString(),
+                          [headerItem.title]:
+                            item[headerItem.key as keyof typeof item],
+                        };
+                      }, {});
+                  });
+
+                  handleExportData(title || "HMS Data", exportData);
                 }}
               >
                 Export