-
-
+
+
);
};
diff --git a/src/components/JobManagementTable.tsx b/src/components/JobManagementTable.tsx
index 564a4035..e92a69a4 100644
--- a/src/components/JobManagementTable.tsx
+++ b/src/components/JobManagementTable.tsx
@@ -1,3 +1,4 @@
+'use client';
import {
Table,
TableBody,
@@ -6,107 +7,226 @@ import {
TableHeader,
TableRow,
} from './ui/table';
-import { Edit } from 'lucide-react';
-import { Badge } from '@/components/ui/badge';
+import { Plus, Search } from 'lucide-react';
-import { getAllJobsAdditonalType } from '@/types/jobs.types';
-import { ServerActionReturnType } from '@/types/api.types';
+import { JobType, getAllJobsAdditonalType } from '@/types/jobs.types';
import { JobQuerySchemaType } from '@/lib/validators/jobs.validator';
import { DEFAULT_PAGE, JOBS_PER_PAGE } from '@/config/app.config';
-import { Pagination, PaginationContent, PaginationItem } from './ui/pagination';
-import {
- PaginationNextButton,
- PaginationPreviousButton,
-} from './pagination-client';
-import APP_PATHS from '@/config/path.config';
-import { PaginationPages } from './ui/paginator';
+
import DeleteDialog from './DeleteDialog';
import ToggleApproveJobButton from './ToggleApproveJobButton';
+import { Input } from './ui/input';
+import {
+ Select,
+ SelectContent,
+ SelectItem,
+ SelectTrigger,
+ SelectValue,
+} from './ui/select';
+import { Button } from './ui/button';
+import Link from 'next/link';
+import { useState, useEffect } from 'react';
+import {
+ Pagination,
+ PaginationContent,
+ PaginationItem,
+ PaginationLink,
+ PaginationNext,
+ PaginationPrevious,
+} from './ui/pagination';
type props = {
searchParams: JobQuerySchemaType;
- jobs: ServerActionReturnType
;
+ jobs: getAllJobsAdditonalType | undefined;
};
const JobManagementTable = ({ jobs, searchParams }: props) => {
- if (!jobs.status) {
- return Error {jobs.message}
;
- }
+ const [filteredJobs, setFilteredJobs] = useState([]);
+ const [statusFilter, setStatusFilter] = useState('All');
+ const [orderFilter, setOrderFilter] = useState('latest');
+ const [currentPage, setCurrentPage] = useState(
+ searchParams.page || DEFAULT_PAGE
+ );
+ const [searchTerm, setSearchTerm] = useState('');
+
+ useEffect(() => {
+ if (jobs?.jobs) {
+ const filtered = jobs?.jobs.filter((job) => {
+ if (statusFilter === 'All') return true;
+ if (statusFilter === 'active')
+ return !job.deleted && !job.expired && job.isVerifiedJob;
+ if (statusFilter === 'deleted') return job.deleted;
+ if (statusFilter === 'closed')
+ return (job.expired || !job.isVerifiedJob) && !job.deleted;
+ return true;
+ });
+
+ const searched = filtered.filter((job) => {
+ const lowerCaseTitle = job.title.toLowerCase();
+ const lowerCaseCompanyName = job.companyName.toLowerCase();
+ return (
+ lowerCaseTitle.includes(searchTerm.toLowerCase()) ||
+ lowerCaseCompanyName.includes(searchTerm.toLowerCase())
+ );
+ });
+
+ const sorted = searched.sort((a, b) => a.title.localeCompare(b.title));
+
+ if (orderFilter === 'latest') {
+ sorted.sort(
+ (a, b) =>
+ new Date(b.postedAt).getTime() - new Date(a.postedAt).getTime()
+ );
+ } else {
+ sorted.sort(
+ (a, b) =>
+ new Date(a.postedAt).getTime() - new Date(b.postedAt).getTime()
+ );
+ }
+
+ setFilteredJobs(sorted);
+ }
+ }, [jobs?.jobs, statusFilter, orderFilter, searchTerm]);
const totalPages =
- Math.ceil((jobs.additional?.totalJobs || 0) / JOBS_PER_PAGE) ||
- DEFAULT_PAGE;
- const currentPage = searchParams.page || DEFAULT_PAGE;
+ Math.ceil(filteredJobs.length / JOBS_PER_PAGE) || DEFAULT_PAGE;
+ const startIndex = (currentPage - 1) * JOBS_PER_PAGE;
+ const currentJobs = filteredJobs.slice(
+ startIndex,
+ startIndex + JOBS_PER_PAGE
+ );
+
+ const handlePageChange = (pageNumber: number) => {
+ setCurrentPage(Math.min(Math.max(pageNumber, 1), totalPages));
+ };
+
return (
- <>
-
-
-
-
- Job Title
- JobType
- Location
- isVerified
- Actions
-
-
-
- {jobs.additional?.jobs?.map((job) => (
-
- {job?.title}
- {job?.workMode}
- {job?.city}
-
- {job.deleted ? (
- Deleted
- ) : (
+
+
+
Manage Jobs
+
+
+
+
+
+
+
+
+ setSearchTerm(e.target.value)}
+ />
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Job Title
+ Company Name
+ Job Category
+ Job Type
+ Posted Date
+ Status
+ Verified
+ Action
+
+
+
+ {currentJobs.map((job) => (
+
+ {job.title}
+ {job.companyName}
+ {job.category}
+ {job.type}
+
+ {new Date(job.postedAt).toLocaleDateString()}
+
+
+
+ {job.deleted
+ ? 'Deleted'
+ : job.expired || !job.isVerifiedJob
+ ? 'Closed'
+ : 'Active'}
+
+
+
- )}
-
-
-
-
-
-
+
+
-
-
-
- ))}
-
-
-
-
- {totalPages ? (
-
-
+
+
+ ))}
+
+
+