Add export button

ChangePlusPlusVandy · Feb 3, 2024 · e238d24 · e238d24
1 parent 02d70ac
commit e238d24
Show file tree

Hide file tree

Showing 4 changed files with 16 additions and 6 deletions.
diff --git a/components/table/event-table/EventTableImpl.tsx b/components/table/event-table/EventTableImpl.tsx
@@ -139,7 +139,6 @@ const EventTableImpl = ({
         showPopup={showPopup}
         setShowPopupTag={setShowPopupTag}
         showPopupTag={showPopup}
-        handleExport={handleExport}
       />
       <TableContainer>
         <div id="table-container">

diff --git a/components/table/event-table/TableHeader.tsx b/components/table/event-table/TableHeader.tsx
@@ -2,19 +2,18 @@ import { SearchContainter, TableButton } from '@/styles/table.styles';
 import React from 'react';
 import Image from 'next/image';
 import { Button } from 'antd';
+import { handleExport } from '@/utils/utils';
 
 const TableHeader = ({
   setShowPopup,
   showPopup,
   setShowPopupTag,
   showPopupTag,
-  handleExport,
 }: {
   setShowPopup: (a: boolean) => void;
   showPopup: boolean;
   setShowPopupTag: (a: boolean) => void;
   showPopupTag: boolean;
-  handleExport: () => void;
 }) => {
   return (
     <>
@@ -43,7 +42,7 @@ const TableHeader = ({
             />
           </TableButton>
           <Button
-            onClick={handleExport}
+            onClick={() => handleExport('events')}
             style={{
               width: 250,
               marginLeft: 90,

diff --git a/components/table/program-table/TableHeader.tsx b/components/table/program-table/TableHeader.tsx
@@ -1,6 +1,8 @@
 import { SearchContainter, TableButton } from '@/styles/table.styles';
 import React from 'react';
 import Image from 'next/image';
+import { Button } from 'antd';
+import { handleExport } from '@/utils/utils';
 
 const TableHeader = ({
   setShowPopUp,
@@ -21,6 +23,16 @@ const TableHeader = ({
             style={{ marginLeft: 150 }}
           />
         </TableButton>
+        <Button
+          onClick={() => handleExport('programs')}
+          style={{
+            width: 250,
+            marginLeft: 90,
+            backgroundColor: 'darkgray',
+            color: 'whitesmoke',
+          }}>
+          Export
+        </Button>
       </SearchContainter>
     </>
   );

diff --git a/utils/utils.ts b/utils/utils.ts
@@ -43,7 +43,7 @@ export const fetchData = async (route: string) => {
 export const fetcher = (url: string) => fetch(url).then(res => res.json());
 
 // function to export what is on the table at the time to an excel file
-export const handleExport = () => {
+export const handleExport = (fileName: string) => {
   const workbook = XLSX.utils.table_to_book(
     document.querySelector('#table-container')
   );
@@ -54,5 +54,5 @@ export const handleExport = () => {
   const blob = new Blob([excelBuffer], {
     type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
   });
-  saveAs(blob, 'events.xlsx');
+  saveAs(blob, fileName + '.xlsx');
 };