From 4889c2f9e6570719115bd23590c0433e4c66db98 Mon Sep 17 00:00:00 2001
From: Prince Kumar <x.prince.x@outlook.com>
Date: Tue, 3 Sep 2024 19:32:58 +0530
Subject: [PATCH] Table component multiselect (#157)

---
 src/components/Admin/JobEvents.tsx         | 138 +++++------
 src/components/NewTableComponent/Table.jsx | 209 -----------------
 src/components/NewTableComponent/Table.tsx | 259 +++++++++++++++++++++
 src/dto/JobDto.ts                          |   2 +-
 src/dto/ResumeDto.ts                       |   2 +-
 src/dto/SalaryDto.ts                       |  12 +
 src/dto/StudentDto.ts                      |   1 +
 src/dto/events.ts                          |  78 +++++++
 src/helpers/recruiter/types.ts             |   2 +
 tsconfig.json                              |   2 +-
 10 files changed, 410 insertions(+), 295 deletions(-)
 delete mode 100644 src/components/NewTableComponent/Table.jsx
 create mode 100644 src/components/NewTableComponent/Table.tsx
 create mode 100644 src/dto/events.ts

diff --git a/src/components/Admin/JobEvents.tsx b/src/components/Admin/JobEvents.tsx
index f8cea203..36d4e4e7 100644
--- a/src/components/Admin/JobEvents.tsx
+++ b/src/components/Admin/JobEvents.tsx
@@ -213,6 +213,7 @@ const PromoteStudent = ({
   }, [roundNumber]);
 
   const updateEvent = async () => {
+    console.log(studentIds);
     await promoteStudent({ studentIds }, eventId);
     toast.success("Successfully promoted!");
     onClose();
@@ -227,7 +228,7 @@ const PromoteStudent = ({
       <div className="bg-white p-8 rounded-xl">
         <div>
           Promote / Demote students :{" "}
-          {students.map((student) => `${student.name}, `)} to <br />
+          {students.map((student) => `${student.user.name}, `)} to <br />
           <label
             htmlFor="number-input"
             className="block mb-2 text-sm font-medium text-gray-900 dark:text-white"
@@ -269,13 +270,11 @@ const MakeJobOfferModal = ({
   open,
   students,
   onClose,
-  events,
   lastEvent,
 }: {
   open: boolean;
   students: any[];
   onClose: () => void;
-  events: EventFC[];
   lastEvent: EventFC;
 }) => {
   const studentIds = students.map((student) => student.id);
@@ -351,7 +350,12 @@ const MakeJobOfferModal = ({
           </Typography>
           {salaries ? (
             <div className="max-w-full">
-              <Table data={salaries} columns={columns} type={"salary"} />
+              <Table
+                data={salaries}
+                columns={columns}
+                type={"salary"}
+                buttonText="Make Offer"
+              />
             </div>
           ) : (
             <div className="w-full flex justify-center">
@@ -445,7 +449,7 @@ export const Applications = ({
   eventId: string;
   events: EventFC[];
 }) => {
-  const [applications, setApplications] = useState<[ApplicationFC]>(null);
+  const [applications, setApplications] = useState<ApplicationFC[]>(null);
   var lastEvent: EventFC;
   events.forEach((event) => {
     if (lastEvent) {
@@ -460,13 +464,48 @@ export const Applications = ({
   const [promoteStudents, setPromoteStudents] = useState<any[]>([]);
   const [seed, setSeed] = useState(0);
 
+  const columns = generateColumns([
+    {
+      student: {
+        rollNo: "string",
+        user: {
+          name: "string",
+          email: "string",
+        },
+      },
+      resume: {
+        resumeFile: "string",
+      },
+    },
+  ]);
+
   useEffect(() => {
     setLoading(true);
     setApplications(null);
     const fetchData = async () => {
       try {
         const jsonData: EventFC = await fetchEventById(eventId);
-        setApplications(jsonData.applications);
+        const applications = jsonData.applications.map((application) => ({
+          ...application,
+          resume: {
+            ...application.resume,
+            resumeFile: (
+              <Button
+                onClick={async () => {
+                  const resume = await getResumeFile(
+                    application.resume.filepath,
+                  );
+                }}
+              >
+                View Resume{" "}
+                {application.resume.verified && (
+                  <VerifiedIcon sx={{ marginLeft: "1rem" }} />
+                )}
+              </Button>
+            ),
+          },
+        }));
+        setApplications(applications);
       } catch (error) {
         toast.error("Some error occured");
       } finally {
@@ -487,7 +526,6 @@ export const Applications = ({
             setPromoteStudents([]);
             setSeed(seed + 1);
           }}
-          events={events}
           lastEvent={lastEvent}
         />
       ) : (
@@ -507,82 +545,16 @@ export const Applications = ({
         </div>
       )}
       {applications && (
-        <table className="w-full text-sm text-left rtl:text-right text-gray-500 dark:text-gray-400">
-          <thead className="text-xs text-gray-700 uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400">
-            <tr>
-              <th scope="col" className="px-6 py-3">
-                Roll Number
-              </th>
-              <th scope="col" className="px-6 py-3">
-                Name
-              </th>
-              <th scope="col" className="px-6 py-3">
-                Email
-              </th>
-              <th scope="col" className="px-6 py-3">
-                Resume
-              </th>
-              <th scope="col" className="px-6 py-3">
-                Promote
-              </th>
-            </tr>
-          </thead>
-          <tbody>
-            {applications.map((application, index) => (
-              <tr
-                key={index}
-                className={`bg-white border-b cursor-pointer dark:bg-gray-800 dark:border-gray-700 hover:bg-gray-50 dark:hover:bg-gray-600`}
-              >
-                <th
-                  scope="row"
-                  className="px-6 py-4 font-medium text-gray-900 whitespace-nowrap dark:text-white"
-                >
-                  {application.student.rollNo}
-                </th>
-                <td className="px-6 py-4">{application.student.user.name}</td>
-                <td className="px-6 py-4">{application.student.user.email}</td>
-                <td
-                  className="px-6 py-4"
-                  onClick={() => getResumeFile(application.resume.filepath)}
-                >
-                  {application.resume.filepath}{" "}
-                  {application.resume.verified && <VerifiedIcon />}
-                </td>
-                <td className="px-6 py-4">
-                  {lastEvent.id == eventId ? (
-                    <Button
-                      onClick={() => {
-                        setPromoteStudents([
-                          ...promoteStudents,
-                          {
-                            id: application.student.id,
-                            name: application.student.user.name,
-                          },
-                        ]);
-                      }}
-                    >
-                      Make Offer
-                    </Button>
-                  ) : (
-                    <Button
-                      onClick={() => {
-                        setPromoteStudents([
-                          ...promoteStudents,
-                          {
-                            id: application.student.id,
-                            name: application.student.user.name,
-                          },
-                        ]);
-                      }}
-                    >
-                      Promote / Demote
-                    </Button>
-                  )}
-                </td>
-              </tr>
-            ))}
-          </tbody>
-        </table>
+        <Table
+          data={applications}
+          columns={columns}
+          type={"application"}
+          buttonText={lastEvent.id == eventId ? "Make Offer" : "Promote"}
+          buttonAction={(students) => {
+            console.log(students);
+            setPromoteStudents(students.map((student) => student.student));
+          }}
+        />
       )}
     </div>
   );
diff --git a/src/components/NewTableComponent/Table.jsx b/src/components/NewTableComponent/Table.jsx
deleted file mode 100644
index a6e57273..00000000
--- a/src/components/NewTableComponent/Table.jsx
+++ /dev/null
@@ -1,209 +0,0 @@
-"use client";
-import {
-  MaterialReactTable,
-  useMaterialReactTable,
-  createMRTColumnHelper,
-} from "material-react-table";
-import { useState } from "react";
-import FileDownloadIcon from "@mui/icons-material/FileDownload";
-import { mkConfig, generateCsv, download } from "export-to-csv";
-import ContentCopyIcon from '@mui/icons-material/ContentCopy';
-import copy from 'copy-to-clipboard';
-import { Box, Button } from "@mui/material";
-import { MenuItem } from "@mui/material";
-import StudentModal from "./StudentModal";
-import JobModal from "./NewJobModal";
-import PenaltyModal from "./PenaltyModal";
-import RecruiterModal from "./RecruiterModal";
-import SeasonModal from "./SeasonModal";
-import Link from "next/link";
-import toast from "react-hot-toast";
-const csvConfig = mkConfig({
-  fieldSeparator: ",",
-  decimalSeparator: ".",
-  useKeysAsHeaders: true,
-});
-
-const Table = ({ data, columns, type }) => {
-  const [validationErrors, setValidationErrors] = useState({});
-  const flattenObject = (obj, prefix = "") => {
-    return Object.keys(obj).reduce((acc, key) => {
-      const pre = prefix.length ? prefix + " " : "";
-      if (typeof obj[key] === "object" && obj[key] !== null) {
-        Object.assign(acc, flattenObject(obj[key], pre + key));
-      } else {
-        acc[pre + key] = obj[key];
-      }
-      return acc;
-    }, {});
-  };
-  const flattenData = (data) => {
-    return data.map((item) => flattenObject(item));
-  };
-  const handleExportRows = (rows) => {
-    const rowData = rows.map((row) => row.original);
-    console.log(rowData);
-    const csv = generateCsv(csvConfig)(flattenData(rowData));
-    download(csvConfig)(csv);
-  };
-
-  const handleExportData = () => {
-    console.log(flattenData);
-    const csv = generateCsv(csvConfig)(flattenData(data));
-    download(csvConfig)(csv);
-  };
-
-  const handleCopyIds = (rows) => {
-    const ids = rows.map((row) => row.original.id).join(', ');
-    copy(ids);
-    toast.success(`Copied IDs`);
-  };
-
-  const [isModalOpen, setIsModalOpen] = useState(false);
-  const [open, setOpen] = useState(false);
-  const [id, setId] = useState(null);
-  const [seasontype, setSeasonType] = useState(null);
-  const [year, setYear] = useState(null);
-
-  const handleOpenModal = () => setIsModalOpen(true);
-  const handleCloseModal = () => setIsModalOpen(false);
-
-  const table = useMaterialReactTable({
-    columns,
-    data,
-    createDisplayMode: "modal",
-    editDisplayMode: "modal",
-    enableRowActions: true,
-    enableRowSelection: true,
-    columnFilterDisplayMode: "popover",
-    paginationDisplayMode: "pages",
-    enableGlobalFilterModes: true,
-    positionToolbarAlertBanner: "bottom",
-    renderRowActionMenuItems: ({ row, table }) => (
-      <Box>
-        {type === "student" && (
-            <MenuItem
-            key="edit"
-            onClick={() => {
-              setId(row.original.id);
-              handleOpenModal();
-            }}
-          > Add Penalty</MenuItem>
-        )}
-        
-        {type == "job" ? (
-          <Link href={`/admin/jobs/${row.original.id}`}>
-            <MenuItem key="view">View {type}</MenuItem>
-          </Link>
-        ) : (
-          type == "season" ? (
-            <MenuItem
-            key="view"
-            onClick={() => {
-              setId(row.original.student.id);
-              setSeasonType(row.original.season.type);
-              setYear(row.original.season.year);
-              setOpen(true);
-            }}
-          >
-            View Season
-          </MenuItem>
-          
-          ) : (
-          <MenuItem
-            key="view"
-            onClick={() => {
-              setId(row.original.id);
-              setOpen(true);
-            }}
-          >
-            View {type}
-          </MenuItem>
-          )
-        )}
-      </Box>
-    ),
-    renderTopToolbarCustomActions: ({ table }) => (
-      <Box
-        sx={{
-          display: "flex",
-          gap: "16px",
-          padding: "8px",
-          flexWrap: "wrap",
-        }}
-      >
-        <Button onClick={handleExportData} startIcon={<FileDownloadIcon />}>
-          Export All Data
-        </Button>
-        <Button
-          disabled={table.getPrePaginationRowModel().rows.length === 0}
-          onClick={() =>
-            handleExportRows(table.getPrePaginationRowModel().rows)
-          }
-          startIcon={<FileDownloadIcon />}
-        >
-          Export All Rows
-        </Button>
-        <Button
-          disabled={table.getRowModel().rows.length === 0}
-          onClick={() => handleExportRows(table.getRowModel().rows)}
-          startIcon={<FileDownloadIcon />}
-        >
-          Export Page Rows
-        </Button>
-        <Button
-          disabled={
-            !table.getIsSomeRowsSelected() && !table.getIsAllRowsSelected()
-          }
-          onClick={() => handleExportRows(table.getSelectedRowModel().rows)}
-          startIcon={<FileDownloadIcon />}
-        >
-          Export Selected Rows
-        </Button>
-        <Button
-          disabled={
-            !table.getIsSomeRowsSelected() && !table.getIsAllRowsSelected()
-          }
-          onClick={() => handleCopyIds(table.getSelectedRowModel().rows)}
-          startIcon={<ContentCopyIcon />}
-        >
-          Copy Selected IDs
-        </Button>
-      </Box>
-    ),
-    renderEditRowDialogContent: ({ table, row, internalEditComponents }) => (
-      <div className="my-5 mx-5">
-        <div>Penalty</div>
-        <input placeholde="Add Penalty" />
-        <button>Submit</button>
-      </div>
-    ),
-  });
-
-  return (
-    <>
-      {type === "student" && (
-        <StudentModal open={open} setOpen={setOpen} id={id} />
-      )}
-      {/* {type == "job" && <JobModal open={open} setOpen={setOpen} jobID={id} />} */}
-      {type == "recruiter" && (
-        <RecruiterModal open={open} setOpen={setOpen} id={id} />
-      )}
-      <div className="my-2">
-        <MaterialReactTable table={table} />
-      </div>
-      {type === "student" && (
-        <PenaltyModal
-          isOpen={isModalOpen}
-          onClose={handleCloseModal}
-          studentId={id}
-        />
-      )}
-      {type === "season" && (
-        <SeasonModal open={open} setOpen={setOpen} id={id} type={seasontype} year={year} />
-      )}
-
-    </>
-  );
-};
-export default Table;
diff --git a/src/components/NewTableComponent/Table.tsx b/src/components/NewTableComponent/Table.tsx
new file mode 100644
index 00000000..bc594e40
--- /dev/null
+++ b/src/components/NewTableComponent/Table.tsx
@@ -0,0 +1,259 @@
+"use client";
+import {
+  MaterialReactTable,
+  useMaterialReactTable,
+  createMRTColumnHelper,
+  MRT_Row,
+  MRT_TableInstance,
+  MRT_RowSelectionState,
+} from "material-react-table";
+import React, { useState } from "react";
+import FileDownloadIcon from "@mui/icons-material/FileDownload";
+import { mkConfig, generateCsv, download } from "export-to-csv";
+import ContentCopyIcon from "@mui/icons-material/ContentCopy";
+import copy from "copy-to-clipboard";
+import { Box, Button, MenuItem } from "@mui/material";
+import { Button as UIButton } from "@/components/ui/button";
+import StudentModal from "./StudentModal";
+import PenaltyModal from "./PenaltyModal";
+import RecruiterModal from "./RecruiterModal";
+import SeasonModal from "./SeasonModal";
+import Link from "next/link";
+import toast from "react-hot-toast";
+
+type TableProps = {
+  data: any[];
+  columns: any[];
+  type: string;
+  showExport?: boolean;
+  buttonText?: string;
+  buttonAction?: (rows: any) => void;
+};
+
+const csvConfig = mkConfig({
+  fieldSeparator: ",",
+  decimalSeparator: ".",
+  useKeysAsHeaders: true,
+});
+
+const Table: React.FC<TableProps> = ({
+  data,
+  columns,
+  type,
+  showExport = true,
+  buttonText,
+  buttonAction,
+}) => {
+  const [validationErrors, setValidationErrors] = useState<Record<string, any>>(
+    {},
+  );
+  const [isModalOpen, setIsModalOpen] = useState<boolean>(false);
+  const [open, setOpen] = useState<boolean>(false);
+  const [id, setId] = useState<string | null>(null);
+  const [seasontype, setSeasonType] = useState<string | null>(null);
+  const [year, setYear] = useState<string | null>(null);
+  const [rowSelection, setRowSelection] = useState<MRT_RowSelectionState>({});
+
+  const flattenObject = (obj: any, prefix = ""): Record<string, any> => {
+    return Object.keys(obj).reduce((acc, key) => {
+      const pre = prefix.length ? prefix + " " : "";
+      if (typeof obj[key] === "object" && obj[key] !== null) {
+        Object.assign(acc, flattenObject(obj[key], pre + key));
+      } else {
+        acc[pre + key] = obj[key];
+      }
+      return acc;
+    }, {});
+  };
+
+  const flattenData = (data: any[]): any[] => {
+    return data.map((item) => flattenObject(item));
+  };
+
+  const handleExportRows = (rows: MRT_Row<any>[]) => {
+    const rowData = rows.map((row) => row.original);
+    const csv = generateCsv(csvConfig)(flattenData(rowData));
+    download(csvConfig)(csv);
+  };
+
+  const handleExportData = () => {
+    const csv = generateCsv(csvConfig)(flattenData(data));
+    download(csvConfig)(csv);
+  };
+
+  const handleCopyIds = (rows: MRT_Row<any>[]) => {
+    const ids = rows.map((row) => row.original.id).join(", ");
+    copy(ids);
+    toast.success(`Copied IDs`);
+  };
+
+  const handleOpenModal = () => setIsModalOpen(true);
+  const handleCloseModal = () => setIsModalOpen(false);
+
+  const table = useMaterialReactTable({
+    columns,
+    data,
+    createDisplayMode: "modal",
+    editDisplayMode: "modal",
+    enableRowActions: true,
+    enableRowSelection: true,
+    columnFilterDisplayMode: "popover",
+    paginationDisplayMode: "pages",
+    enableGlobalFilterModes: true,
+    positionToolbarAlertBanner: "bottom",
+    getRowId: (row: any) => row.id,
+    enableMultiRowSelection: true,
+    onRowSelectionChange: setRowSelection,
+    state: { rowSelection },
+    renderRowActionMenuItems: ({
+      row,
+      table,
+    }: {
+      row: MRT_Row<any>;
+      table: MRT_TableInstance<any>;
+    }): React.ReactNode[] => [
+      ...(type === "student"
+        ? [
+            <MenuItem
+              key="edit"
+              onClick={() => {
+                setId(row.original.id);
+                handleOpenModal();
+              }}
+            >
+              Add Penalty
+            </MenuItem>,
+          ]
+        : []),
+      ...(type === "job"
+        ? [
+            <Link href={`/admin/jobs/${row.original.id}`} key="view">
+              <MenuItem>View {type}</MenuItem>
+            </Link>,
+          ]
+        : type === "season"
+          ? [
+              <MenuItem
+                key="view"
+                onClick={() => {
+                  setId(row.original.student.id);
+                  setSeasonType(row.original.season.type);
+                  setYear(row.original.season.year);
+                  setOpen(true);
+                }}
+              >
+                View Season
+              </MenuItem>,
+            ]
+          : [
+              <MenuItem
+                key="view"
+                onClick={() => {
+                  setId(row.original.id);
+                  setOpen(true);
+                }}
+              >
+                View {type}
+              </MenuItem>,
+            ]),
+    ],
+    renderTopToolbarCustomActions: ({ table }) => (
+      <Box
+        sx={{
+          display: "flex",
+          gap: "16px",
+          padding: "8px",
+          flexWrap: "wrap",
+        }}
+      >
+        {showExport && (
+          <>
+            <Button onClick={handleExportData} startIcon={<FileDownloadIcon />}>
+              Export All Data
+            </Button>
+            <Button
+              disabled={table.getPrePaginationRowModel().rows.length === 0}
+              onClick={() =>
+                handleExportRows(table.getPrePaginationRowModel().rows)
+              }
+              startIcon={<FileDownloadIcon />}
+            >
+              Export All Rows
+            </Button>
+            <Button
+              disabled={table.getRowModel().rows.length === 0}
+              onClick={() => handleExportRows(table.getRowModel().rows)}
+              startIcon={<FileDownloadIcon />}
+            >
+              Export Page Rows
+            </Button>
+            <Button
+              disabled={
+                !table.getIsSomeRowsSelected() && !table.getIsAllRowsSelected()
+              }
+              onClick={() => handleExportRows(table.getSelectedRowModel().rows)}
+              startIcon={<FileDownloadIcon />}
+            >
+              Export Selected Rows
+            </Button>
+            <Button
+              disabled={
+                !table.getIsSomeRowsSelected() && !table.getIsAllRowsSelected()
+              }
+              onClick={() => handleCopyIds(table.getSelectedRowModel().rows)}
+              startIcon={<ContentCopyIcon />}
+            >
+              Copy Selected IDs
+            </Button>
+          </>
+        )}
+      </Box>
+    ),
+  });
+
+  return (
+    <>
+      {type === "student" && (
+        <StudentModal open={open} setOpen={setOpen} id={id} />
+      )}
+      {type === "recruiter" && (
+        <RecruiterModal open={open} setOpen={setOpen} id={id} />
+      )}
+      <div className="my-2">
+        <MaterialReactTable table={table} />
+        {buttonText && (
+          <div className="w-full p-4 flex justify-center">
+            <UIButton
+              className="px-16 bg-gradient-to-br from-gray-400 to-gray-700"
+              onClick={() => {
+                buttonAction(
+                  table.getSelectedRowModel().rows.map((row) => row.original),
+                );
+              }}
+            >
+              {buttonText}
+            </UIButton>
+          </div>
+        )}
+      </div>
+      {type === "student" && (
+        <PenaltyModal
+          isOpen={isModalOpen}
+          onClose={handleCloseModal}
+          studentId={id}
+        />
+      )}
+      {type === "season" && (
+        <SeasonModal
+          open={open}
+          setOpen={setOpen}
+          id={id}
+          type={seasontype}
+          year={year}
+        />
+      )}
+    </>
+  );
+};
+
+export default Table;
diff --git a/src/dto/JobDto.ts b/src/dto/JobDto.ts
index 5bfcd5f5..c5d62faf 100644
--- a/src/dto/JobDto.ts
+++ b/src/dto/JobDto.ts
@@ -80,5 +80,5 @@ const recruitmentDTO = [
   },
 ];
 
-export type { RecruitmentDTO };
+export type { RecruitmentDTO, SeasonDTO, CompanyDTO, RecruiterDTO, UserDTO };
 export { recruitmentDTO };
diff --git a/src/dto/ResumeDto.ts b/src/dto/ResumeDto.ts
index e6764a73..e066fa54 100644
--- a/src/dto/ResumeDto.ts
+++ b/src/dto/ResumeDto.ts
@@ -6,7 +6,7 @@ interface Resume {
   id: string;
   filepath: string;
   verified: boolean;
-  student: DTO;
+  student?: DTO;
 }
 
 interface ResumeTableData {
diff --git a/src/dto/SalaryDto.ts b/src/dto/SalaryDto.ts
index 06b5d22d..a5c350ec 100644
--- a/src/dto/SalaryDto.ts
+++ b/src/dto/SalaryDto.ts
@@ -1,3 +1,13 @@
+interface Salary {
+  id: string;
+  totalCTC: number;
+  salaryPeriod: string;
+  genders: string[];
+  programs: string[];
+  facultyApprovals: string[];
+  categories: string[];
+}
+
 const salaryDto = {
   id: "string",
   baseSalary: 0,
@@ -35,4 +45,6 @@ const salaryDto = {
   },
 };
 
+export type { Salary };
+
 export { salaryDto };
diff --git a/src/dto/StudentDto.ts b/src/dto/StudentDto.ts
index 74c1891a..46e4a060 100644
--- a/src/dto/StudentDto.ts
+++ b/src/dto/StudentDto.ts
@@ -2,6 +2,7 @@
 
 // Define the User type
 type User = {
+  id: string;
   name: string;
   email: string;
   contact: string;
diff --git a/src/dto/events.ts b/src/dto/events.ts
new file mode 100644
index 00000000..9bff2c2a
--- /dev/null
+++ b/src/dto/events.ts
@@ -0,0 +1,78 @@
+import { Resume } from "./ResumeDto";
+import { Salary } from "./SalaryDto";
+import { CompanyDTO, SeasonDTO } from "./JobDto";
+import { User } from "./StudentDto";
+import { StudentDataType } from "@/helpers/student/types";
+
+interface EventFC {
+    id: string;
+    roundNumber: number;
+    type: string;
+    metadata: string;
+    startDateTime: string;
+    endDateTime: string;
+    visibleToRecruiter: boolean;
+    job: Job;
+}
+
+interface Job {
+    id: string;
+    role: string;
+    company: CompanyDTO;
+    season: SeasonDTO;
+    salaries: Salary[];
+}
+
+interface Application {
+    id: string;
+    student: StudentDataType;
+    resume: Resume;
+  }
+
+const eventDto = [{
+    "id": "string",
+    "roundNumber": 0,
+    "type": "POLL",
+    "metadata": "string",
+    "startDateTime": "2024-08-31T18:18:22.490Z",
+    "endDateTime": "2024-08-31T18:18:22.490Z",
+    "visibleToRecruiter": true,
+    "job": {
+      "id": "string",
+      "role": "string",
+      "company": {
+        "id": "string",
+        "name": "string"
+      },
+      "season": {
+        "id": "string",
+        "year": "string",
+        "type": "INTERN"
+      },
+      "salaries": [
+        {
+          "id": "string",
+          "totalCTC": 0,
+          "salaryPeriod": "string",
+          "genders": [
+            "MALE"
+          ],
+          "programs": [
+            "string"
+          ],
+          "facultyApprovals": [
+            "Astronomy, Astrophysics and Space Engineering"
+          ],
+          "categories": [
+            "GENERAL"
+          ],
+          "minCPI": 0,
+          "tenthMarks": 0,
+          "twelthMarks": 0
+        }
+      ]
+    }
+  }];
+
+export type { EventFC, Job, Application };
+export { eventDto };
diff --git a/src/helpers/recruiter/types.ts b/src/helpers/recruiter/types.ts
index b349ba04..3c323e90 100644
--- a/src/helpers/recruiter/types.ts
+++ b/src/helpers/recruiter/types.ts
@@ -1,4 +1,5 @@
 import { TPCMember } from "@/components/Admin/types";
+import { ReactNode } from "react";
 
 export interface ApplicationFC {
   id: string;
@@ -23,6 +24,7 @@ export interface ApplicationFC {
     id: string;
     filepath: string;
     verified: boolean;
+    resumeFile?: ReactNode;
   };
 }
 
diff --git a/tsconfig.json b/tsconfig.json
index 5c90e6a6..b364df04 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -31,7 +31,7 @@
     "src/components/Students/StudentsTable/StudentTable.tsx",
     "src/middleware.ts",
     "src/components/JAF/JAF.tsx",
-    "src/components/NewTableComponent/Table.jsx",
+    "src/components/NewTableComponent/Table.tsx",
     "src/components/NewTableComponent/PenaltyModal.jsx"
   ],
   "exclude": ["node_modules"]