- Source:{' '}
+ Source:{" "}
- Location:{' '}
+ Location:{" "}
- Contact Email:{' '}
+ Contact Email:{" "}
- Contact Phone:{' '}
+ Contact Phone:{" "}
- Interview Dates:{' '}
+ Interview Dates:{" "}
{formData.interviewDates
.map((date) => date.substring(0, 10))
- .join(', ')}
+ .join(", ")}
-
+
{
const [isCreating, setIsCreating] = useState(false) // Show the create form
const [editingId, setEditingId] = useState(false) // Show the edit form
-
+ const [statusFilter, setStatusFilter] = useState("All")
const [deleteIds, setDeleteIds] = useState([]) // List of application IDs to delete
const [showDeleteConfirmation, setShowDeleteConfirmation] = useState(false) // Show the delete confirmation modal
+ const [sortDirection, setSortDirection] = useState("descending")
const [itemsPerPage, setItemsPerPage] = useState(10)
@@ -36,8 +37,36 @@ const JobApplicationTable = ({ applications, fetchUserData }) => {
}
}
+ const handleStatusFilterChange = (e) => {
+ setStatusFilter(e.target.value)
+ }
+
+ const toggleSortDirection = () => {
+ setSortDirection((currentDirection) =>
+ currentDirection === "ascending" ? "descending" : "ascending"
+ )
+ }
+
+ const sortedApplications = useMemo(() => {
+ return [...applications].sort((a, b) => {
+ const dateA = new Date(a.dateApplied)
+ const dateB = new Date(b.dateApplied)
+ if (dateA < dateB) {
+ return sortDirection === "ascending" ? -1 : 1
+ }
+ if (dateA > dateB) {
+ return sortDirection === "ascending" ? 1 : -1
+ }
+ return 0
+ })
+ }, [applications, sortDirection])
+
+ const filteredApplications = sortedApplications.filter((application) =>
+ statusFilter === "All" ? true : application.status === statusFilter
+ )
+
const { currentData, currentPage, totalPages, handlePageChange } =
- usePagination(applications, itemsPerPage) // Pagination logic - custom hook
+ usePagination(filteredApplications, itemsPerPage, statusFilter) // Pagination logic - custom hook
return (
@@ -94,24 +123,49 @@ const JobApplicationTable = ({ applications, fetchUserData }) => {
-
-
+
+
+
+
+
+
+
+
+
@@ -120,7 +174,12 @@ const JobApplicationTable = ({ applications, fetchUserData }) => {
|
Company Name |
Job Title |
- Date Applied |
+
+ Date Applied {sortDirection === "ascending" ? "↑" : "↓"}
+ |
Status |
|
diff --git a/client/src/features/Dashboard/utils/usePagination.jsx b/client/src/features/Dashboard/utils/usePagination.jsx
index 5c5e0ac..95b40b7 100644
--- a/client/src/features/Dashboard/utils/usePagination.jsx
+++ b/client/src/features/Dashboard/utils/usePagination.jsx
@@ -1,13 +1,13 @@
-import React, { useState, useEffect } from 'react'
+import React, { useState, useEffect } from "react"
-const usePagination = (data, itemsPerPage) => {
+const usePagination = (data, itemsPerPage, statusFilter) => {
const [currentPage, setCurrentPage] = useState(1)
useEffect(() => {
// Reset to first page if itemsPerPage changes
- setCurrentPage(1);
- }, [itemsPerPage]);
-
+ setCurrentPage(1)
+ }, [itemsPerPage, statusFilter])
+
const startIndex = (currentPage - 1) * itemsPerPage
const endIndex = startIndex + itemsPerPage
const currentData = data.slice(startIndex, endIndex)
diff --git a/server/routes/jobApplications.js b/server/routes/jobApplications.js
index bda5a9f..a6b6be3 100644
--- a/server/routes/jobApplications.js
+++ b/server/routes/jobApplications.js
@@ -37,7 +37,9 @@ router.post("/", authenticateToken, async (req, res) => {
router.get("/", authenticateToken, async (req, res) => {
try {
const userId = req.user.userId // Extracted from JWT
- const jobApplications = await JobApplication.find({ user: userId })
+ const jobApplications = await JobApplication.find({ user: userId }).sort({
+ dateApplied: -1,
+ })
res.json(jobApplications)
} catch (error) {
res.status(500).send({ message: error.message })