From f638d1c88b78974819191fa6d9c700d8e0dbf9b8 Mon Sep 17 00:00:00 2001
From: Ankit Kashyap <kashyap25ankit@gmail.com>
Date: Mon, 28 Oct 2024 23:04:03 +0530
Subject: [PATCH 1/3] Fix/performance (#557)

* ignored swc files

* optimized code
---
 .gitignore                                    |  6 ++++++
 public/robots.txt                             |  6 ++++++
 .../[token]/EmailVerificationLinkExpired.tsx  | 10 ++++++++--
 src/app/(auth)/verify-email/[token]/page.tsx  |  8 ++++++--
 src/app/[...404]/page.tsx                     |  1 +
 src/app/layout.tsx                            |  1 +
 src/components/ApproveJobDialog.tsx           |  1 +
 src/components/DeleteDialog.tsx               |  1 +
 src/components/Faqs.tsx                       |  1 +
 src/components/FaqsGetintouchCard.tsx         |  4 +++-
 src/components/JobManagementHeader.tsx        |  2 +-
 src/components/ShareJobDialog.tsx             |  2 ++
 src/components/ToggleApproveJobButton.tsx     |  1 +
 src/components/auth/forgot-password.tsx       |  7 ++++++-
 src/components/auth/reset-password.tsx        |  3 ++-
 src/components/auth/signin.tsx                |  1 +
 src/components/auth/signup.tsx                |  1 +
 src/components/auth/social-auth.tsx           |  1 +
 src/components/auth/welcome.tsx               |  8 +++++++-
 src/components/comboBox.tsx                   |  1 +
 src/components/hero-section.tsx               | 20 +++++++++++++------
 src/components/job-creation-success.tsx       |  2 +-
 src/components/job-form.tsx                   |  8 +++++++-
 src/components/job-landing.tsx                |  5 ++++-
 src/components/job.tsx                        |  5 ++++-
 src/components/password-input.tsx             |  1 +
 src/components/profile-menu.tsx               |  1 +
 src/components/profile/ChangePassword.tsx     |  2 ++
 .../profile/DeleteAccountDialog.tsx           |  2 ++
 src/components/profile/EditProfile.tsx        |  1 +
 src/components/profile/EditProfilePicture.tsx |  1 +
 src/components/skills-combobox.tsx            |  1 +
 src/components/toggleJobButton.tsx            |  7 ++++++-
 src/components/ui/theme-toggle.tsx            |  1 +
 .../user-multistep-form/add-project-form.tsx  |  3 ++-
 .../user-multistep-form/add-resume-form.tsx   |  3 ++-
 .../user-multistep-form/add-skills-form.tsx   |  2 +-
 .../addExperience-form.tsx                    |  2 +-
 .../user-multistep-form.tsx                   |  8 +++++++-
 src/components/userDetails.tsx                | 14 +++++++++----
 src/layouts/footer.tsx                        |  1 +
 src/layouts/header.tsx                        |  7 +++++--
 src/layouts/mobile-nav.tsx                    |  6 +++++-
 43 files changed, 137 insertions(+), 32 deletions(-)
 create mode 100644 public/robots.txt

diff --git a/.gitignore b/.gitignore
index ba44e4d0..82fc4d5c 100644
--- a/.gitignore
+++ b/.gitignore
@@ -41,3 +41,9 @@ bun.lockb
 package-lock.json
 yarn.lock
 
+**/public/sw.js
+**/public/workbox-*.js
+**/public/worker-*.js
+**/public/sw.js.map
+**/public/workbox-*.js.map
+**/public/worker-*.js.map
\ No newline at end of file
diff --git a/public/robots.txt b/public/robots.txt
new file mode 100644
index 00000000..a4fb0fd7
--- /dev/null
+++ b/public/robots.txt
@@ -0,0 +1,6 @@
+User-agent: *
+Allow: /
+Disallow: /admin/*
+Disallow: /manage/*
+
+Sitemap: https://job.vineet.tech/sitemap.xml
\ No newline at end of file
diff --git a/src/app/(auth)/verify-email/[token]/EmailVerificationLinkExpired.tsx b/src/app/(auth)/verify-email/[token]/EmailVerificationLinkExpired.tsx
index a2bf0bc9..4a39b2fa 100644
--- a/src/app/(auth)/verify-email/[token]/EmailVerificationLinkExpired.tsx
+++ b/src/app/(auth)/verify-email/[token]/EmailVerificationLinkExpired.tsx
@@ -39,13 +39,19 @@ export const EmailVerificationLinkExpired = ({ token }: { token: string }) => {
       >
         {!isEmailSent ? (
           <Link href={APP_PATHS.SIGNIN}>
-            <Button className="w-full" disabled={isLoading}>
+            <Button
+              className="w-full"
+              disabled={isLoading}
+              aria-label="login-redirect"
+            >
               Go to Login
             </Button>
           </Link>
         ) : (
           <Link href={APP_PATHS.SIGNIN} onClick={handleResendClick}>
-            <Button className="w-full">Resend Verification Email</Button>
+            <Button className="w-full" aria-label="resend">
+              Resend Verification Email
+            </Button>
           </Link>
         )}
       </FormContainer>
diff --git a/src/app/(auth)/verify-email/[token]/page.tsx b/src/app/(auth)/verify-email/[token]/page.tsx
index 0a64b44a..012eab75 100644
--- a/src/app/(auth)/verify-email/[token]/page.tsx
+++ b/src/app/(auth)/verify-email/[token]/page.tsx
@@ -29,7 +29,9 @@ const EmailVerifiedSuccess = () => {
         }
       >
         <Link href={APP_PATHS.SIGNIN}>
-          <Button className="w-full">Go to Login</Button>
+          <Button className="w-full" aria-label="login">
+            Go to Login
+          </Button>
         </Link>
       </FormContainer>
     </div>
@@ -44,7 +46,9 @@ const EmailVerificationLinkNotFound = () => {
         description={'The verification link you used is invalid or not found.'}
       >
         <Link href={APP_PATHS.SIGNUP}>
-          <Button className="w-full">Go to Signup</Button>
+          <Button className="w-full" aria-label="signip-redirect">
+            Go to Signup
+          </Button>
         </Link>
       </FormContainer>
     </div>
diff --git a/src/app/[...404]/page.tsx b/src/app/[...404]/page.tsx
index 1fec2b23..ddf9a334 100644
--- a/src/app/[...404]/page.tsx
+++ b/src/app/[...404]/page.tsx
@@ -43,6 +43,7 @@ const Custom404Page = () => {
         <Button
           asChild
           className="bg-blue-600 hover:bg-blue-700 text-white font-semibold py-2 px-6 rounded-full transition-colors duration-300"
+          aria-label="home-redirect"
         >
           <Link href="/">
             <span className="flex items-center">
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index 352bb044..da1b9ad0 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -19,6 +19,7 @@ const satoshi = localFont({
 export const metadata: Metadata = {
   title: '100xJobs',
   description: 'Get your dream job',
+  // icons: '/main.png',
 };
 
 export default async function RootLayout({
diff --git a/src/components/ApproveJobDialog.tsx b/src/components/ApproveJobDialog.tsx
index 2b2db842..611859ff 100644
--- a/src/components/ApproveJobDialog.tsx
+++ b/src/components/ApproveJobDialog.tsx
@@ -43,6 +43,7 @@ const ApproveJobDialog = ({
                 className="mt-2"
                 variant={'secondary'}
                 onClick={handleClick}
+                aria-label="approve"
               >
                 Approve
               </Button>
diff --git a/src/components/DeleteDialog.tsx b/src/components/DeleteDialog.tsx
index 86423484..873eb442 100644
--- a/src/components/DeleteDialog.tsx
+++ b/src/components/DeleteDialog.tsx
@@ -74,6 +74,7 @@ const JobDialog = ({ job }: { job: JobType }) => {
             className="mt-2"
             variant={job.deleted ? 'secondary' : 'destructive'}
             onClick={handelToggle}
+            aria-label="delete"
           >
             {job.deleted ? 'Restore' : 'Delete'}
           </Button>
diff --git a/src/components/Faqs.tsx b/src/components/Faqs.tsx
index 9958af8e..b6a5297a 100644
--- a/src/components/Faqs.tsx
+++ b/src/components/Faqs.tsx
@@ -36,6 +36,7 @@ export default function Faqs() {
                 className="flex w-full justify-between items-center cursor-pointer focus:outline-none dark:bg-[#0F172A] bg-[#F1F5F9] p-4 rounded-xl"
                 onClick={() => toggleExpand(i)}
                 aria-expanded={expandedIndex === i}
+                aria-label="toggle-expand"
               >
                 <p className="text-left font-medium dark:text-white text-gray-900">
                   {faq.question}
diff --git a/src/components/FaqsGetintouchCard.tsx b/src/components/FaqsGetintouchCard.tsx
index fbe1937c..af91f3be 100644
--- a/src/components/FaqsGetintouchCard.tsx
+++ b/src/components/FaqsGetintouchCard.tsx
@@ -6,7 +6,9 @@ export default function FaqsGetintouchCard() {
       <p className="font-semibold md:text-base text-xs">
         Can&apos;t find what you&apos;re looking for?
       </p>
-      <Button className="md:text-base text-xs">Get in touch</Button>
+      <Button className="md:text-base text-xs" aria-label="get-in-touch">
+        Get in touch
+      </Button>
     </div>
   );
 }
diff --git a/src/components/JobManagementHeader.tsx b/src/components/JobManagementHeader.tsx
index 30035d79..fec842b5 100644
--- a/src/components/JobManagementHeader.tsx
+++ b/src/components/JobManagementHeader.tsx
@@ -13,7 +13,7 @@ const JobManagementHeader = () => {
           </span>
         </div>
         <div>
-          <Button>
+          <Button aria-label="post-new-job">
             <Link href={'/create'}>Post new Job</Link>
           </Button>
         </div>
diff --git a/src/components/ShareJobDialog.tsx b/src/components/ShareJobDialog.tsx
index e718a5af..ac9de6c7 100644
--- a/src/components/ShareJobDialog.tsx
+++ b/src/components/ShareJobDialog.tsx
@@ -66,6 +66,7 @@ export const ShareJobDialog = ({ job }: { job: JobType }) => {
           variant="outline"
           size="sm"
           className="px-4 py-2 h-fit gap-2 flex items-center"
+          aria-label="share-job"
         >
           Share Job <Share2 size={16} />
         </Button>
@@ -81,6 +82,7 @@ export const ShareJobDialog = ({ job }: { job: JobType }) => {
               variant="outline"
               className="w-full justify-start gap-2"
               onClick={() => option.shareFunction(job)}
+              aria-label="share-on-social"
             >
               {option.icon}
               Share on {option.name}
diff --git a/src/components/ToggleApproveJobButton.tsx b/src/components/ToggleApproveJobButton.tsx
index 78af648c..5f964b78 100644
--- a/src/components/ToggleApproveJobButton.tsx
+++ b/src/components/ToggleApproveJobButton.tsx
@@ -66,6 +66,7 @@ const ToggleApproveJobButton = ({ job }: { job: JobType }) => {
               className="mt-2"
               variant={'secondary'}
               onClick={handleToggleJob}
+              aria-label="approve"
             >
               {isApproved ? 'Unapprove' : 'Approve'}
             </Button>
diff --git a/src/components/auth/forgot-password.tsx b/src/components/auth/forgot-password.tsx
index ad4b8f8b..838a06cb 100644
--- a/src/components/auth/forgot-password.tsx
+++ b/src/components/auth/forgot-password.tsx
@@ -52,7 +52,12 @@ export const ForgotPassword = () => {
         }}
       />
 
-      <Button type="submit" className="mt-4" disabled={isLoading}>
+      <Button
+        type="submit"
+        className="mt-4"
+        disabled={isLoading}
+        aria-label="submit"
+      >
         Submit
       </Button>
     </form>
diff --git a/src/components/auth/reset-password.tsx b/src/components/auth/reset-password.tsx
index 7ffa25f0..0b79f786 100644
--- a/src/components/auth/reset-password.tsx
+++ b/src/components/auth/reset-password.tsx
@@ -78,7 +78,7 @@ export const ResetPassword = () => {
       {errorMessage ? (
         <p className="text-sm font-medium text-destructive">{errorMessage}</p>
       ) : null}
-      <Button type="submit" disabled={isLoading}>
+      <Button type="submit" disabled={isLoading} aria-label="submit">
         Submit
       </Button>
     </form>
@@ -114,6 +114,7 @@ export const PasswordInput = ({
         type="button"
         onClick={togglePasswordVisibility}
         className="absolute right-2 top-1/2 transform -translate-y-1/2 focus:outline-none"
+        aria-label="toggle-password"
       >
         {showPassword ? <EyeOffIcon /> : <EyeIcon />}
       </button>
diff --git a/src/components/auth/signin.tsx b/src/components/auth/signin.tsx
index 76d6f7f1..a164f3dc 100644
--- a/src/components/auth/signin.tsx
+++ b/src/components/auth/signin.tsx
@@ -107,6 +107,7 @@ export const Signin = () => {
             type="submit"
             disabled={form.formState.isSubmitting}
             className="w-full h-10"
+            aria-label="submit"
           >
             {form.formState.isSubmitting ? 'Please wait...' : 'Sign In'}
           </Button>
diff --git a/src/components/auth/signup.tsx b/src/components/auth/signup.tsx
index 7f66aa73..5319d393 100644
--- a/src/components/auth/signup.tsx
+++ b/src/components/auth/signup.tsx
@@ -119,6 +119,7 @@ export const Signup = () => {
             type="submit"
             disabled={form.formState.isSubmitting}
             className="w-full h-10"
+            aria-label="submit"
           >
             {form.formState.isSubmitting ? 'Please wait...' : 'Create Account'}
           </Button>
diff --git a/src/components/auth/social-auth.tsx b/src/components/auth/social-auth.tsx
index 7b7a8b09..8a7d5392 100644
--- a/src/components/auth/social-auth.tsx
+++ b/src/components/auth/social-auth.tsx
@@ -19,6 +19,7 @@ export const GoogleOauthButton = ({ label }: { label: string }) => (
       signIn('google');
     }}
     className="w-full h-10 bg-white border border-gray-300 text-gray-700 font-medium hover:bg-gray-50"
+    aria-label="google-oauth-button"
   >
     <svg
       className="w-4 h-4 mr-2"
diff --git a/src/components/auth/welcome.tsx b/src/components/auth/welcome.tsx
index 6967564a..259bf615 100644
--- a/src/components/auth/welcome.tsx
+++ b/src/components/auth/welcome.tsx
@@ -18,6 +18,7 @@ export const Welcome = () => {
         variant="link"
         className="mt-4 text-primary underline"
         onClick={() => router.push(APP_PATHS.SIGNIN)}
+        aria-label="go-to-login"
       >
         Go to Login
       </Button>
@@ -56,7 +57,12 @@ const CountdownButton = () => {
   }, [isDisabled, secondsRemaining]);
 
   return (
-    <Button onClick={handleClick} disabled={isDisabled} className="w-full">
+    <Button
+      onClick={handleClick}
+      disabled={isDisabled}
+      className="w-full"
+      aria-label="wait"
+    >
       {isDisabled
         ? `Wait ${secondsRemaining} second${secondsRemaining !== 1 ? 's' : ''}...`
         : 'Click Me'}
diff --git a/src/components/comboBox.tsx b/src/components/comboBox.tsx
index d236430f..aed07fae 100644
--- a/src/components/comboBox.tsx
+++ b/src/components/comboBox.tsx
@@ -44,6 +44,7 @@ export function Combobox({
           role="combobox"
           aria-expanded={open}
           className="w-full justify-between dark:bg-gray-800 border-none dark:text-white"
+          aria-label="skillset"
         >
           Search skillset ...
           <ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
diff --git a/src/components/hero-section.tsx b/src/components/hero-section.tsx
index 088a4aea..4fb9e3e9 100644
--- a/src/components/hero-section.tsx
+++ b/src/components/hero-section.tsx
@@ -25,12 +25,20 @@ const HeroSection = () => {
               </p>
             </div>
             <div className="md:w-4/6 w-full flex md:flex-row flex-col  items-center justify-center my-4">
-              <button className="md:w-fit w-full rounded-lg py-2 px-3 bg-[#3259E8] text-sm text-[#FFFF] font-medium hover:bg-[#3e63e9] ">
-                <Link href={'/jobs'}>Explore Jobs </Link>
-              </button>
-              <button className="md:w-fit w-full rounded-lg py-2 px-3 border text-sm md:ml-3 md:my-0 my-3 dark:text-[#94A3B8] text-[#64748B] font-medium dark:hover:bg-slate-900 hover:bg-slate-100">
-                <Link href={'#testimonials'}>View Testimonials</Link>
-              </button>
+              <Link
+                href={'/jobs'}
+                aria-label="explore-jobs"
+                className="md:w-fit w-full rounded-lg py-2 px-3 bg-[#3259E8] text-sm text-[#FFFF] font-medium hover:bg-[#3e63e9] text-center"
+              >
+                Explore Jobs
+              </Link>
+              <Link
+                href={'#testimonials'}
+                className="md:w-fit w-full rounded-lg py-2 px-3 border text-sm md:ml-3 md:my-0 my-3 bg-transparent dark:bg-slate-900 dark:text-[#94A3B8] text-[#64748B] font-medium   dark:hover:bg-slate-900 hover:bg-slate-100 text-center"
+                aria-label="view-testimonals"
+              >
+                View Testimonials
+              </Link>
             </div>
           </div>
           <div className="flex flex-col items-center my-5">
diff --git a/src/components/job-creation-success.tsx b/src/components/job-creation-success.tsx
index cab36a59..90c3a9a9 100644
--- a/src/components/job-creation-success.tsx
+++ b/src/components/job-creation-success.tsx
@@ -9,7 +9,7 @@ const JobCreateSuccess = ({ isVerifiedJob }: { isVerifiedJob: boolean }) => {
     <div>
       <h1>Job created successfully!</h1>
       <p>{message}</p>
-      <Button>Post another job</Button>
+      <Button aria-label="post-another-job">Post another job</Button>
     </div>
   );
 };
diff --git a/src/components/job-form.tsx b/src/components/job-form.tsx
index 0bb247fa..2a6c2959 100644
--- a/src/components/job-form.tsx
+++ b/src/components/job-form.tsx
@@ -566,6 +566,7 @@ const PostJobForm = () => {
                               <PopoverTrigger asChild>
                                 <Button
                                   variant="outline"
+                                  aria-label="pick-date"
                                   className={`w-[240px] pl-3 text-left font-normal dark:bg-gray-800 
                                       `} // No color change on hover
                                 >
@@ -675,6 +676,7 @@ const PostJobForm = () => {
                     <button
                       type="button"
                       onClick={clearLogoImage}
+                      aria-label="x"
                       className="absolute top-0 right-0 w-5 h-5 bg-red-500 rounded-full items-center flex justify-center cursor-pointer translate-x-1/2 -translate-y-1/2"
                     >
                       <X size="16" />
@@ -751,7 +753,11 @@ const PostJobForm = () => {
               </div>
             </div>
             <div className="w-full flex justify-end items-center my-4 ">
-              <Button type="submit" disabled={form.formState.isSubmitting}>
+              <Button
+                type="submit"
+                disabled={form.formState.isSubmitting}
+                aria-label="submit-job"
+              >
                 {form.formState.isSubmitting ? 'Please wait...' : 'Create Job'}
               </Button>
             </div>
diff --git a/src/components/job-landing.tsx b/src/components/job-landing.tsx
index c87df6f8..c931bfb8 100644
--- a/src/components/job-landing.tsx
+++ b/src/components/job-landing.tsx
@@ -27,7 +27,10 @@ export const JobLanding = () => {
       </div>
       <RecentJobs />
       <div className="w-full flex justify-center items-center my-5">
-        <button className="flex items-center text-[#4E7AFF] border-none outline-none text-lg font-medium group">
+        <button
+          className="flex items-center text-[#4E7AFF] border-none outline-none text-lg font-medium group"
+          aria-label="view-all-jobs"
+        >
           <Link href={'/jobs'} className="flex items-center">
             View all jobs
             <ChevronRight className="w-4 h-4 mx-2 group-hover:translate-x-1 duration-200 ease-in-out transition" />
diff --git a/src/components/job.tsx b/src/components/job.tsx
index 5c720c85..31f6153b 100644
--- a/src/components/job.tsx
+++ b/src/components/job.tsx
@@ -84,7 +84,10 @@ export const Job = ({ job }: { job: JobType }) => {
 
         <div className="mt-4 flex gap-2">
           <Link href={job.application ? job.application : ''}>
-            <Button className="justify-self-start px-6 dark:text-white py-2 w-fit h-fit">
+            <Button
+              className="justify-self-start px-6 dark:text-white py-2 w-fit h-fit"
+              aria-label="apply-now"
+            >
               Apply Now
             </Button>
           </Link>
diff --git a/src/components/password-input.tsx b/src/components/password-input.tsx
index 2099ef12..2d0b0721 100644
--- a/src/components/password-input.tsx
+++ b/src/components/password-input.tsx
@@ -25,6 +25,7 @@ export const PasswordInput = ({ placeholder, field }: PasswordInputProps) => {
         type="button"
         onClick={togglePasswordVisibility}
         className="absolute right-2 top-1/2 transform -translate-y-1/2"
+        aria-label="password"
       >
         {showPassword ? <EyeOffIcon /> : <EyeIcon />}
       </button>
diff --git a/src/components/profile-menu.tsx b/src/components/profile-menu.tsx
index eb34a405..e5dc52a3 100644
--- a/src/components/profile-menu.tsx
+++ b/src/components/profile-menu.tsx
@@ -59,6 +59,7 @@ export function ProfileMenu() {
           variant="ghost"
           size="icon"
           className="focus-visible:outline-0 focus-visible:ring-0 focus-visible:ring-offset-0 py-2 h-8 w-8 px-0"
+          aria-label="profile"
         >
           <Icon icon="profile" className="h-[1.2rem] w-[1.2rem]" />
           <span className="sr-only">Profile</span>
diff --git a/src/components/profile/ChangePassword.tsx b/src/components/profile/ChangePassword.tsx
index 21edafd1..4b253568 100644
--- a/src/components/profile/ChangePassword.tsx
+++ b/src/components/profile/ChangePassword.tsx
@@ -158,6 +158,7 @@ export const ChangePassword = () => {
                     type="button"
                     onClick={togglePasswordVisibility}
                     className="absolute right-2 top-1/2 transform -translate-y-1/2"
+                    aria-label="password"
                   >
                     {showPassword ? <EyeOffIcon /> : <EyeIcon />}
                   </button>
@@ -172,6 +173,7 @@ export const ChangePassword = () => {
           <Button
             disabled={isPending}
             className="bg-slate-950 text-white dark:text-slate-950 dark:bg-white rounded-md py-2 px-4 md:w-56 w-full"
+            aria-label="save"
           >
             {isPending ? <Loader /> : 'Save'}
           </Button>
diff --git a/src/components/profile/DeleteAccountDialog.tsx b/src/components/profile/DeleteAccountDialog.tsx
index fee934ef..4b3950f1 100644
--- a/src/components/profile/DeleteAccountDialog.tsx
+++ b/src/components/profile/DeleteAccountDialog.tsx
@@ -83,6 +83,7 @@ export const DeleteAccountDialog = () => {
           className="w-40 flex gap-2 text-red-500"
           variant={'ghost'}
           onClick={() => setModalOpen(true)}
+          aria-label="delete-account"
         >
           <Trash size={15} />
           Delete Account
@@ -128,6 +129,7 @@ export const DeleteAccountDialog = () => {
                 <Button
                   disabled={disabled}
                   className="mt-4 bg-red-500 hover:bg-red-500 text-white"
+                  aria-label="submit"
                 >
                   {isPending ? <FaSpinner className="animate-spin" /> : 'Yes'}
                 </Button>
diff --git a/src/components/profile/EditProfile.tsx b/src/components/profile/EditProfile.tsx
index bdaffb90..9be75b5d 100644
--- a/src/components/profile/EditProfile.tsx
+++ b/src/components/profile/EditProfile.tsx
@@ -174,6 +174,7 @@ export const EditProfile = ({ name, email }: Props) => {
             <Button
               disabled={isPending}
               className="bg-slate-950 text-white dark:text-slate-950 dark:bg-white rounded-md py-2 px-4 md:w-56 w-full"
+              aria-label="submit"
             >
               {isPending ? <Loader /> : 'Save'}
             </Button>
diff --git a/src/components/profile/EditProfilePicture.tsx b/src/components/profile/EditProfilePicture.tsx
index 1f277256..f8653ea5 100644
--- a/src/components/profile/EditProfilePicture.tsx
+++ b/src/components/profile/EditProfilePicture.tsx
@@ -138,6 +138,7 @@ export const EditProfilePicture = () => {
           disabled={isPending}
           onClick={removeImage}
           className="flex items-center justify-center gap-3 text-xs text-red-400 bg-none border-none bg-transparent hover:bg-transparent"
+          aria-label="remove"
         >
           <Trash className="w-4 h-4" />
           Remove
diff --git a/src/components/skills-combobox.tsx b/src/components/skills-combobox.tsx
index 1a90f6ef..6977dfb8 100644
--- a/src/components/skills-combobox.tsx
+++ b/src/components/skills-combobox.tsx
@@ -105,6 +105,7 @@ export function SkillsCombobox({
                       return prev;
                     });
                   }}
+                  aria-label="x"
                 >
                   <X className="text-white" size={15} />
                 </Button>
diff --git a/src/components/toggleJobButton.tsx b/src/components/toggleJobButton.tsx
index e7b9f7b4..f7e48cba 100644
--- a/src/components/toggleJobButton.tsx
+++ b/src/components/toggleJobButton.tsx
@@ -22,7 +22,12 @@ const ToggleDelete = ({ job }: { job: JobType }) => {
   };
   return (
     <>
-      <Button className="mt-2" variant={'destructive'} onClick={handelToggle}>
+      <Button
+        className="mt-2"
+        variant={'destructive'}
+        onClick={handelToggle}
+        aria-label="delete"
+      >
         Delete
       </Button>
     </>
diff --git a/src/components/ui/theme-toggle.tsx b/src/components/ui/theme-toggle.tsx
index 2a5b7385..202f72c3 100644
--- a/src/components/ui/theme-toggle.tsx
+++ b/src/components/ui/theme-toggle.tsx
@@ -21,6 +21,7 @@ export function ModeToggle() {
           variant="ghost"
           size="icon"
           className="text-slate-500 dark:text-slate-400 focus-visible:outline-0 focus-visible:ring-0 focus-visible:ring-offset-0 py-2 h-10 w-10 px-0 border rounded-sm text-center"
+          aria-label="toggle-theme"
         >
           <Icon
             icon="sun"
diff --git a/src/components/user-multistep-form/add-project-form.tsx b/src/components/user-multistep-form/add-project-form.tsx
index 3a555e60..53da5533 100644
--- a/src/components/user-multistep-form/add-project-form.tsx
+++ b/src/components/user-multistep-form/add-project-form.tsx
@@ -188,6 +188,7 @@ export const AddProject = () => {
               type="button"
               onClick={clearImage}
               className="absolute top-0 right-0 w-5 h-5 bg-red-500 rounded-full items-center flex justify-center cursor-pointer translate-x-1/2 -translate-y-1/2"
+              aria-label="x"
             >
               <X size="16" />
             </button>
@@ -290,7 +291,7 @@ export const AddProject = () => {
             <LoadingSpinner />
           </div>
         ) : (
-          <Button type="submit" className="mt-4">
+          <Button type="submit" className="mt-4" aria-label="submit">
             Submit
           </Button>
         )}
diff --git a/src/components/user-multistep-form/add-resume-form.tsx b/src/components/user-multistep-form/add-resume-form.tsx
index 648faba8..45359a03 100644
--- a/src/components/user-multistep-form/add-resume-form.tsx
+++ b/src/components/user-multistep-form/add-resume-form.tsx
@@ -125,6 +125,7 @@ export const AddResume = () => {
             type="button"
             onClick={clearResumeFile}
             className="w-6 h-6 bg-red-500 rounded-full flex items-center justify-center cursor-pointer translate-x-1/2 -translate-y-1/2"
+            aria-label="x"
           >
             <X size="16" />
           </button>
@@ -144,7 +145,7 @@ export const AddResume = () => {
       {isLoading ? (
         <LoadingSpinner />
       ) : (
-        <Button className="mt-4 w-full" onClick={onSubmit}>
+        <Button className="mt-4 w-full" onClick={onSubmit} aria-label="submit">
           Submit
         </Button>
       )}
diff --git a/src/components/user-multistep-form/add-skills-form.tsx b/src/components/user-multistep-form/add-skills-form.tsx
index 417f320e..fe57859c 100644
--- a/src/components/user-multistep-form/add-skills-form.tsx
+++ b/src/components/user-multistep-form/add-skills-form.tsx
@@ -66,7 +66,7 @@ export const AddSkills = () => {
             <LoadingSpinner />{' '}
           </div>
         ) : (
-          <Button type="submit" className="mt-4">
+          <Button type="submit" className="mt-4" aria-label="submit">
             Submit
           </Button>
         )}
diff --git a/src/components/user-multistep-form/addExperience-form.tsx b/src/components/user-multistep-form/addExperience-form.tsx
index 5444579f..c9e3f97b 100644
--- a/src/components/user-multistep-form/addExperience-form.tsx
+++ b/src/components/user-multistep-form/addExperience-form.tsx
@@ -270,7 +270,7 @@ export const AddExperience = () => {
               <LoadingSpinner />{' '}
             </div>
           ) : (
-            <Button type="submit" className="w-full">
+            <Button type="submit" className="w-full" aria-label="submit">
               Submit
             </Button>
           )}
diff --git a/src/components/user-multistep-form/user-multistep-form.tsx b/src/components/user-multistep-form/user-multistep-form.tsx
index 0535585a..e4e60dc8 100644
--- a/src/components/user-multistep-form/user-multistep-form.tsx
+++ b/src/components/user-multistep-form/user-multistep-form.tsx
@@ -113,7 +113,11 @@ export default function VerticalLinearStepper() {
               <Box sx={{ mb: 2 }}>
                 <Dialog>
                   <DialogTrigger asChild>
-                    <Button variant="contained" sx={{ mt: 1, mr: 1 }}>
+                    <Button
+                      variant="contained"
+                      sx={{ mt: 1, mr: 1 }}
+                      aria-label="add"
+                    >
                       Add
                     </Button>
                   </DialogTrigger>
@@ -132,6 +136,7 @@ export default function VerticalLinearStepper() {
                     index === forms.length - 1 ? handleFinish : handleNext
                   }
                   sx={{ mt: 1, mr: 1 }}
+                  aria-label="next/finish"
                 >
                   {index === forms.length - 1 ? 'Finish' : 'Next'}
                 </Button>
@@ -139,6 +144,7 @@ export default function VerticalLinearStepper() {
                   disabled={index === 0}
                   onClick={handleBack}
                   sx={{ mt: 1, mr: 1 }}
+                  aria-label="back"
                 >
                   Back
                 </Button>
diff --git a/src/components/userDetails.tsx b/src/components/userDetails.tsx
index 88470d92..c29409f1 100644
--- a/src/components/userDetails.tsx
+++ b/src/components/userDetails.tsx
@@ -7,10 +7,14 @@ const UserDetails = () => {
     <div className="h-[100vh] flex mt-14 items-center md:items-start flex-col md:flex-row  md:justify-center ">
       <div className="max-w-[300px] w-[350px] flex flex-col gap-4 items-center p-4">
         <div>
-          <Button className="w-[200px] m-auto">Applied to</Button>
+          <Button className="w-[200px] m-auto" aria-label="applied-to">
+            Applied to
+          </Button>
         </div>
         <div>
-          <Button className="w-[200px] m-auto">Update Details</Button>
+          <Button className="w-[200px] m-auto" aria-label="update-details">
+            Update Details
+          </Button>
         </div>
       </div>
       <div>
@@ -35,14 +39,16 @@ const UserDetails = () => {
             <Input placeholder="Twitter" />
           </div>
           <div>
-            <Button value={'Upload Resume'}>Upload Resume </Button>
+            <Button value={'Upload Resume'} aria-label="upload-resume">
+              Upload Resume{' '}
+            </Button>
           </div>
           <div className="flex justify-between">
             <div>
               <Input placeholder="LPA" className="max-w-[135px]" />
             </div>
             <div>
-              <Button>Submit</Button>
+              <Button aria-label="submit">Submit</Button>
             </div>
           </div>
         </div>
diff --git a/src/layouts/footer.tsx b/src/layouts/footer.tsx
index d4b37c23..eaf3f7af 100644
--- a/src/layouts/footer.tsx
+++ b/src/layouts/footer.tsx
@@ -20,6 +20,7 @@ const Footer = () => {
               key={i}
               href={social.href}
               className="p-3 rounded-full border mx-2 hover:bg-slate-50 duration-150 ease-in-out transition"
+              aria-label={`${social.icon}-logo`}
             >
               <Icon icon={social.icon} className="w-4 h-4" />
             </Link>
diff --git a/src/layouts/header.tsx b/src/layouts/header.tsx
index 2f345a32..b589c7ce 100644
--- a/src/layouts/header.tsx
+++ b/src/layouts/header.tsx
@@ -36,7 +36,7 @@ export const CompanyLogo = () => {
     >
       <Image
         src={'/main.svg'}
-        alt="100xJobs"
+        alt="100xJobs logo"
         width={30}
         height={30}
         className="rounded"
@@ -64,7 +64,7 @@ const Header = () => {
 
   return (
     <>
-      <nav className="fixed w-full z-50 backdrop-blur-md border">
+      <nav className="fixed w-full z-50 backdrop-blur-lg border">
         <div className="flex h-[72px] w-full items-center justify-between lg:px-20 px-3 shadow-sm">
           <Link href="/" className="p-2.5">
             <CompanyLogo />
@@ -93,6 +93,7 @@ const Header = () => {
                 <button
                   className="border p-2.5 rounded-lg text-foreground/60 hover:dark:bg-[#191919] hover:bg-gray-100 md:mx-4 outline-none"
                   onClick={toggleTheme}
+                  aria-label="theme"
                 >
                   {theme === 'dark' ? (
                     <Moon className="w-4 h-4" />
@@ -112,6 +113,7 @@ const Header = () => {
                       <Button
                         variant="ghost"
                         className="relative h-8 w-8 rounded-full"
+                        aria-label="avatar"
                       >
                         <Avatar className="h-8 w-8">
                           <AvatarImage
@@ -167,6 +169,7 @@ const Header = () => {
                     onClick={() => {
                       router.push('/signin');
                     }}
+                    aria-label="login"
                   >
                     Login
                   </Button>
diff --git a/src/layouts/mobile-nav.tsx b/src/layouts/mobile-nav.tsx
index 31b4b663..1653a0e9 100644
--- a/src/layouts/mobile-nav.tsx
+++ b/src/layouts/mobile-nav.tsx
@@ -63,7 +63,10 @@ export function MobileNav() {
 
   return (
     <Sheet>
-      <SheetTrigger className="border p-2.5 rounded-lg text-foreground/60 hover:dark:bg-[#191919] hover:bg-gray-100">
+      <SheetTrigger
+        className="border p-2.5 rounded-lg text-foreground/60 hover:dark:bg-[#191919] hover:bg-gray-100"
+        aria-label="mob-nav-menu"
+      >
         <Menu className="w-4 h-4" />
       </SheetTrigger>
       <SheetContent className="w-full">
@@ -151,6 +154,7 @@ export function MobileNav() {
               <button
                 onClick={handleSignout}
                 className="text-[#DD503F] flex items-center justify-start font-medium text-lg"
+                aria-label="logout"
               >
                 <LogOut className="w-4 h-4" />
                 <p className="mx-1">Logout</p>

From 5e66c62bee8b187a633f5e0c759ae108f39af0be Mon Sep 17 00:00:00 2001
From: Subhanshu jha <138554397+subhanahujha007@users.noreply.github.com>
Date: Wed, 30 Oct 2024 23:53:53 +0530
Subject: [PATCH 2/3] added apt. toast message (#562)

---
 src/components/auth/signin.tsx | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

diff --git a/src/components/auth/signin.tsx b/src/components/auth/signin.tsx
index a164f3dc..a5bc47e0 100644
--- a/src/components/auth/signin.tsx
+++ b/src/components/auth/signin.tsx
@@ -39,8 +39,13 @@ export const Signin = () => {
     try {
       const response = await signIn('signin', { ...data, redirect: false });
       if (!response?.ok) {
+        const errorMessage =
+          response?.error?.includes('User') && response?.error?.includes('does not exist')
+            ? 'User does not exist'
+            : response?.error || 'Internal server error';
+  
         return toast({
-          title: response?.error || 'Internal server error',
+          title: errorMessage,
           variant: 'destructive',
         });
       }
@@ -48,7 +53,7 @@ export const Signin = () => {
         title: 'Login successful! Welcome back!',
         variant: 'success',
       });
-      // const redirect = searchParams.get('next') || APP_PATHS.HOME;
+  
       const searchParams = new URLSearchParams(window.location.search);
       const redirect = searchParams.get('next') || APP_PATHS.HOME;
       router.push(redirect);
@@ -60,7 +65,7 @@ export const Signin = () => {
       });
     }
   }
-
+  
   return (
     <div className="">
       <Form {...form}>

From 139175f9c78c4b953a47c09ccf2f8b565cc94ab0 Mon Sep 17 00:00:00 2001
From: Paribesh Nepal <100255987+Paribesh01@users.noreply.github.com>
Date: Thu, 31 Oct 2024 12:08:44 +0530
Subject: [PATCH 3/3] Feat/admin UI (#553)

* fix: deleted jobs were showing

* feat: jobs management page done

* feat: added new ui for the payment and recruiters

* fix: minor changes

* fix:fixed responsiveness

* fix:minor fix

* feat:removed payment

* fix:removed payments

* feat:added filters

* feat:added recruiters

* fix:minor change

* fix:minor changes

* fix:filter fixed

* fix: fixed responsiveness

* fix:minor change
---
 prisma/schema.prisma                      |  19 +-
 prisma/seed.ts                            |  38 ++-
 src/actions/job.action.ts                 |   6 +
 src/actions/user.profile.actions.ts       |  36 +++
 src/app/manage/{ => jobs}/page.tsx        |   6 +-
 src/app/manage/recruiters/page.tsx        |  22 ++
 src/components/DeleteDialog.tsx           |  10 +-
 src/components/JobManagement.tsx          |   7 +-
 src/components/JobManagementTable.tsx     | 282 +++++++++++++++-------
 src/components/ManageRecruiters.tsx       | 181 ++++++++++++++
 src/components/ToggleApproveJobButton.tsx |  10 +-
 src/components/pagination-client.tsx      |   4 +-
 src/components/ui/pagination.tsx          |   2 -
 src/components/ui/paginator.tsx           |  32 ++-
 src/config/path.config.ts                 |   3 +-
 src/lib/constant/app.constant.ts          |  11 +-
 src/lib/icons.ts                          |   4 +
 src/types/jobs.types.ts                   |   1 +
 src/types/recruiters.types.ts             |  17 ++
 19 files changed, 561 insertions(+), 130 deletions(-)
 rename src/app/manage/{ => jobs}/page.tsx (87%)
 create mode 100644 src/app/manage/recruiters/page.tsx
 create mode 100644 src/components/ManageRecruiters.tsx
 create mode 100644 src/types/recruiters.types.ts

diff --git a/prisma/schema.prisma b/prisma/schema.prisma
index d7350ec2..9a420bdb 100644
--- a/prisma/schema.prisma
+++ b/prisma/schema.prisma
@@ -25,12 +25,23 @@ model User {
   project    Project[]
   resume     String?
 
-  oauthProvider OauthProvider? // Tracks OAuth provider (e.g., 'google')
-  oauthId       String?
-
+  oauthProvider  OauthProvider? // Tracks OAuth provider (e.g., 'google')
+  oauthId        String?
+  createdAt      DateTime       @default(now())
   blockedByAdmin DateTime?
-  onBoard        Boolean    @default(false)
+  onBoard        Boolean        @default(false)
   bookmark       Bookmark[]
+  companyId      String?        @unique
+  company        Company?       @relation(fields: [companyId], references: [id])
+}
+
+model Company {
+  id           String  @id @default(cuid())
+  companyName  String
+  companyLogo  String?
+  companyEmail String
+  companyBio   String
+  user         User?
 }
 
 enum OauthProvider {
diff --git a/prisma/seed.ts b/prisma/seed.ts
index 5aa0b4a8..e2ba7cdb 100644
--- a/prisma/seed.ts
+++ b/prisma/seed.ts
@@ -14,9 +14,21 @@ const prisma = new PrismaClient();
 const users = [
   { id: '1', name: 'Jack', email: 'user@gmail.com' },
   { id: '2', name: 'Admin', email: 'admin@gmail.com', role: Role.ADMIN, onBoard: true },
-  { id: '3', name: 'Hr', email: 'hr@gmail.com', role: Role.HR },
+  { id: '3', companyId: '1', name: 'Hr', email: 'hr@gmail.com', role: Role.HR, onBoard: true },
+  { id: '4', companyId: '2', name: 'John', email: 'john@gmail.com', role: Role.HR, onBoard: true },
+  { id: '5', companyId: '3', name: 'Jane', email: 'jane@gmail.com', role: Role.HR, onBoard: true },
+
+
 ];
 
+
+const companies = [
+  { id: '1', compnayEmail: "careers@techcorps.com", companyName: 'Tech Corp', companyBio: 'Leading tech solutions provider specializing in innovative web development.', companyLogo: '/main.svg' },
+  { id: '2', companyEmail: "careers@globalsolutions.com", companyName: 'Global Solutions', companyBio: 'Global Solutions offers comprehensive IT services for businesses worldwide.', companyLogo: '/main.svg' },
+  { id: '3', companyEmail: 'careers@innovatech.com', companyName: 'Innovatech', companyBio: 'Innovatech specializes in backend systems and cloud-based solutions.', companyLogo: '/main.svg' },
+]
+
+
 let jobs = [
   {
     id: '1',
@@ -328,6 +340,7 @@ async function seedUsers() {
             password: hashedPassword,
             role: u.role || Role.USER,
             emailVerified: new Date(),
+            companyId: u.companyId
           },
         });
         console.log(`User created or updated: ${u.email}`);
@@ -340,6 +353,28 @@ async function seedUsers() {
     console.error('Error seeding users:', error);
   }
 }
+async function seedCompanies() {
+  try {
+    await Promise.all(
+      companies.map(async (c) =>
+        prisma.company.upsert({
+          where: { id: c.id },
+          create: {
+            id: c.id,
+            companyName: c.companyName,
+            companyEmail: c.companyEmail ?? "default@example.com",
+            companyBio: c.companyBio,
+            companyLogo: c.companyLogo,
+          },
+          update: {},
+        })
+      )
+    );
+    console.log('✅ Company seed completed successfully');
+  } catch (error) {
+    console.error('Error seeding companies:', error);
+  }
+}
 
 async function seedJobs() {
   try {
@@ -401,6 +436,7 @@ async function seedJobs() {
 }
 
 async function main() {
+  await seedCompanies();
   await seedUsers();
   await seedJobs();
 }
diff --git a/src/actions/job.action.ts b/src/actions/job.action.ts
index 659edb3e..b3b15ade 100644
--- a/src/actions/job.action.ts
+++ b/src/actions/job.action.ts
@@ -156,6 +156,7 @@ export const getAllJobs = withSession<
       skills: true,
       address: true,
       workMode: true,
+      expired: true,
       category: true,
       minSalary: true,
       maxSalary: true,
@@ -219,6 +220,7 @@ export const getRecommendedJobs = withServerActionAsyncCatcher<
       maxSalary: true,
       postedAt: true,
       skills: true,
+      expired: true,
       isVerifiedJob: true,
       companyLogo: true,
     },
@@ -252,6 +254,7 @@ export const getRecommendedJobs = withServerActionAsyncCatcher<
         companyLogo: true,
         minExperience: true,
         maxExperience: true,
+        expired: true,
         isVerifiedJob: true,
         category: true,
       },
@@ -294,6 +297,7 @@ export const getJobById = withServerActionAsyncCatcher<
       minExperience: true,
       maxExperience: true,
       skills: true,
+      expired: true,
       address: true,
       workMode: true,
       hasSalaryRange: true,
@@ -352,6 +356,7 @@ export const getRecentJobs = async () => {
         minExperience: true,
         maxExperience: true,
         skills: true,
+        expired: true,
         postedAt: true,
         companyLogo: true,
         type: true,
@@ -601,6 +606,7 @@ export async function GetBookmarkByUserId() {
             minSalary: true,
             maxSalary: true,
             postedAt: true,
+            expired: true,
             companyLogo: true,
           },
         },
diff --git a/src/actions/user.profile.actions.ts b/src/actions/user.profile.actions.ts
index 51128cda..d68e0857 100644
--- a/src/actions/user.profile.actions.ts
+++ b/src/actions/user.profile.actions.ts
@@ -317,3 +317,39 @@ export const getUserDetails = async () => {
     return new ErrorHandler('Internal server error', 'DATABASE_ERROR');
   }
 };
+
+export const getUserRecruiters = async () => {
+  const auth = await getServerSession(authOptions);
+
+  if (!auth || !auth?.user?.id || auth?.user?.role !== 'ADMIN')
+    throw new ErrorHandler('Not Authorized', 'UNAUTHORIZED');
+  try {
+    const res = await prisma.user.findMany({
+      where: {
+        role: 'HR',
+      },
+      select: {
+        id: true,
+        email: true,
+        name: true,
+        createdAt: true,
+        _count: {
+          select: {
+            jobs: true,
+          },
+        },
+        company: {
+          select: {
+            companyName: true,
+            companyEmail: true,
+          },
+        },
+      },
+    });
+    return new SuccessResponse('Recruiter SuccessFully Fetched', 200, {
+      recruiters: res,
+    }).serialize();
+  } catch (_error) {
+    return new ErrorHandler('Internal server error', 'DATABASE_ERROR');
+  }
+};
diff --git a/src/app/manage/page.tsx b/src/app/manage/jobs/page.tsx
similarity index 87%
rename from src/app/manage/page.tsx
rename to src/app/manage/jobs/page.tsx
index afcddb1d..65d3819f 100644
--- a/src/app/manage/page.tsx
+++ b/src/app/manage/jobs/page.tsx
@@ -25,11 +25,7 @@ const ManageJob = async ({
     redirect('/jobs');
   }
   const searchParamss = parsedData.data;
-  return (
-    <div className="container">
-      <JobManagement searchParams={searchParamss} />
-    </div>
-  );
+  return <JobManagement searchParams={searchParamss} />;
 };
 
 export default ManageJob;
diff --git a/src/app/manage/recruiters/page.tsx b/src/app/manage/recruiters/page.tsx
new file mode 100644
index 00000000..160cefbf
--- /dev/null
+++ b/src/app/manage/recruiters/page.tsx
@@ -0,0 +1,22 @@
+import { getUserRecruiters } from '@/actions/user.profile.actions';
+import ManageRecruiters from '@/components/ManageRecruiters';
+
+import { options } from '@/lib/auth';
+import { getServerSession } from 'next-auth';
+import { redirect } from 'next/navigation';
+import React from 'react';
+
+const RecruitersPage = async () => {
+  const server = await getServerSession(options);
+  if (!server?.user) {
+    redirect('/api/auth/signin');
+  } else if (server.user.role !== 'ADMIN') {
+    redirect('/jobs');
+  }
+
+  const Recruiters = await getUserRecruiters();
+
+  return <ManageRecruiters recruiters={Recruiters} />;
+};
+
+export default RecruitersPage;
diff --git a/src/components/DeleteDialog.tsx b/src/components/DeleteDialog.tsx
index 873eb442..ff5713b6 100644
--- a/src/components/DeleteDialog.tsx
+++ b/src/components/DeleteDialog.tsx
@@ -4,6 +4,7 @@ import { Button } from './ui/button';
 import { useToast } from './ui/use-toast';
 import { toggleDeleteJobById } from '@/actions/job.action';
 import { JobType } from '@/types/jobs.types';
+import icons from '@/lib/icons';
 import {
   Dialog,
   DialogTrigger,
@@ -13,7 +14,6 @@ import {
   DialogDescription,
   DialogFooter,
 } from './ui/dialog';
-import { ArchiveRestore, Trash } from 'lucide-react';
 
 const JobDialog = ({ job }: { job: JobType }) => {
   const [dialogOpen, setDialogOpen] = useState(false); // State to manage dialog visibility
@@ -42,7 +42,9 @@ const JobDialog = ({ job }: { job: JobType }) => {
             role="button"
             onClick={() => setDialogOpen(true)}
           >
-            <ArchiveRestore /> {/* Icon for restoring the job */}
+            <Button variant="ghost" size="icon">
+              <icons.ArchiveRestore className="h-7 w-5 text-green-500" />
+            </Button>
           </span>
         ) : (
           <span
@@ -50,7 +52,9 @@ const JobDialog = ({ job }: { job: JobType }) => {
             role="button"
             onClick={() => setDialogOpen(true)}
           >
-            <Trash /> {/* Icon for deleting the job */}
+            <Button variant="ghost" size="icon">
+              <icons.trash className="h-7 w-5 text-red-500" />
+            </Button>
           </span>
         )}
       </DialogTrigger>
diff --git a/src/components/JobManagement.tsx b/src/components/JobManagement.tsx
index a0e6918d..53aaa29d 100644
--- a/src/components/JobManagement.tsx
+++ b/src/components/JobManagement.tsx
@@ -1,6 +1,5 @@
 import React from 'react';
 import { getAllJobs } from '@/actions/job.action';
-import JobManagementHeader from './JobManagementHeader';
 import JobManagementTable from './JobManagementTable';
 import { JobQuerySchemaType } from '@/lib/validators/jobs.validator';
 
@@ -13,10 +12,10 @@ const JobManagement = async ({
   if (!jobs.status) {
     return <div>Error {jobs.message}</div>;
   }
+
   return (
-    <div className="pt-2 px-6 mt-10">
-      <JobManagementHeader />
-      <JobManagementTable jobs={jobs} searchParams={searchParams} />
+    <div>
+      <JobManagementTable jobs={jobs.additional} searchParams={searchParams} />
     </div>
   );
 };
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<getAllJobsAdditonalType>;
+  jobs: getAllJobsAdditonalType | undefined;
 };
 
 const JobManagementTable = ({ jobs, searchParams }: props) => {
-  if (!jobs.status) {
-    return <div>Error {jobs.message}</div>;
-  }
+  const [filteredJobs, setFilteredJobs] = useState<JobType[]>([]);
+  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 (
-    <>
-      <div className="flex flex-col items-center justify-center gap-12">
-        <Table className="mt-7">
-          <TableHeader>
-            <TableRow>
-              <TableHead className="w-[200px]">Job Title</TableHead>
-              <TableHead className="w-[150px]">JobType</TableHead>
-              <TableHead className="w-[200px]">Location</TableHead>
-              <TableHead className="w-[200px]">isVerified</TableHead>
-              <TableHead className="text-right">Actions</TableHead>
-            </TableRow>
-          </TableHeader>
-          <TableBody>
-            {jobs.additional?.jobs?.map((job) => (
-              <TableRow key={job?.id}>
-                <TableCell className="font-medium">{job?.title}</TableCell>
-                <TableCell>{job?.workMode}</TableCell>
-                <TableCell>{job?.city}</TableCell>
-                <TableCell>
-                  {job.deleted ? (
-                    <Badge className="bg-red-600 text-white">Deleted</Badge>
-                  ) : (
+    <div className="min-h-screen sm:max-w-7xl max-w-full   mx-auto p-2 sm:p-8 text-gray-900 dark:text-gray-100">
+      <div className="flex flex-col sm:flex-row justify-between mb-6">
+        <h1 className="text-2xl font-bold mb-4 sm:mb-0">Manage Jobs</h1>
+        <Link href={'/create'}>
+          <Button className="flex items-center">
+            <Plus className="mr-2" /> Post New Job
+          </Button>
+        </Link>
+      </div>
+
+      <div className="flex flex-col sm:flex-row justify-between mb-6">
+        <div className="relative w-full sm:w-1/3 mb-4 sm:mb-0">
+          <Search className="absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-400 dark:text-gray-400" />
+          <Input
+            className="pl-10 border-gray-800 dark:border-gray-600 text-gray-900 dark:bg-gray-800 dark:text-gray-100 placeholder-gray-400"
+            placeholder="Search jobs by company or title...."
+            value={searchTerm}
+            onChange={(e) => setSearchTerm(e.target.value)}
+          />
+        </div>
+
+        <div className="flex  sm:flex-row gap-4">
+          <Select onValueChange={setStatusFilter}>
+            <SelectTrigger className="border-gray-800 dark:border-gray-600 text-gray-900 dark:bg-gray-800 dark:text-gray-100">
+              <SelectValue placeholder="Status" />
+            </SelectTrigger>
+            <SelectContent>
+              <SelectItem value="All">All</SelectItem>
+              <SelectItem value="active">Active</SelectItem>
+              <SelectItem value="closed">Closed</SelectItem>
+              <SelectItem value="deleted">Deleted</SelectItem>
+            </SelectContent>
+          </Select>
+
+          <Select onValueChange={setOrderFilter}>
+            <SelectTrigger className="dark:bg-gray-800 dark:text-gray-100 border-gray-800 dark:border-gray-600 text-gray-900">
+              <SelectValue placeholder="Latest Jobs" />
+            </SelectTrigger>
+            <SelectContent>
+              <SelectItem value="latest">Latest Jobs</SelectItem>
+              <SelectItem value="oldest">Oldest Jobs</SelectItem>
+            </SelectContent>
+          </Select>
+        </div>
+      </div>
+
+      <div className="rounded-md border  overflow-hidden dark:border-gray-600 w-full  sm:max-w-7xl  max-w-96">
+        <div className="overflow-x-auto">
+          <Table>
+            <TableHeader className="bg-gray-100 dark:bg-gray-800 border-b border-gray-800 dark:border-gray-600">
+              <TableRow>
+                <TableHead>Job Title</TableHead>
+                <TableHead>Company Name</TableHead>
+                <TableHead>Job Category</TableHead>
+                <TableHead>Job Type</TableHead>
+                <TableHead>Posted Date</TableHead>
+                <TableHead>Status</TableHead>
+                <TableHead>Verified</TableHead>
+                <TableHead>Action</TableHead>
+              </TableRow>
+            </TableHeader>
+            <TableBody>
+              {currentJobs.map((job) => (
+                <TableRow key={job.id}>
+                  <TableCell className="px-2 py-2">{job.title}</TableCell>
+                  <TableCell className="px-2 py-2">{job.companyName}</TableCell>
+                  <TableCell className="px-2 py-2">{job.category}</TableCell>
+                  <TableCell className="px-2 py-2">{job.type}</TableCell>
+                  <TableCell className="px-2 py-2">
+                    {new Date(job.postedAt).toLocaleDateString()}
+                  </TableCell>
+                  <TableCell className="px-2 py-2">
+                    <span
+                      className={`px-2 py-2 rounded-full text-xs font-bold 
+                              ${
+                                job.deleted
+                                  ? 'bg-red-300 dark:bg-red-600 dark:bg-opacity-30 bg-opacity-30 text-red-700 dark:text-red-200'
+                                  : job.expired || !job.isVerifiedJob
+                                    ? 'bg-yellow-100 dark:bg-yellow-600 bg-opacity-50 dark:bg-opacity-30 text-yellow-700 dark:text-yellow-200'
+                                    : 'bg-green-100 dark:bg-green-600 bg-opacity-50 dark:bg-opacity-30 text-green-700 dark:text-green-200'
+                              }`}
+                    >
+                      {job.deleted
+                        ? 'Deleted'
+                        : job.expired || !job.isVerifiedJob
+                          ? 'Closed'
+                          : 'Active'}
+                    </span>
+                  </TableCell>
+                  <TableCell className="px-2 py-2">
                     <ToggleApproveJobButton job={job} />
-                  )}
-                </TableCell>
-                <TableCell className="text-right w-full flex justify-end">
-                  <span className="mr-5" role="button">
-                    <Edit />
-                  </span>
-                  <span role="button">
+                  </TableCell>
+                  <TableCell className="px-2 py-2">
                     <DeleteDialog job={job} />
-                  </span>
-                </TableCell>
-              </TableRow>
-            ))}
-          </TableBody>
-        </Table>
-        <Pagination>
-          <PaginationContent>
-            {totalPages ? (
-              <PaginationItem>
-                <PaginationPreviousButton
-                  searchParams={searchParams}
-                  currentPage={currentPage}
-                  baseUrl={APP_PATHS.JOBS}
-                />
+                  </TableCell>
+                </TableRow>
+              ))}
+            </TableBody>
+          </Table>
+        </div>
+      </div>
+
+      <div className="mt-6">
+        <div className="flex justify-center sm:justify-start">
+          <Pagination>
+            <PaginationContent>
+              <PaginationItem onClick={() => handlePageChange(currentPage - 1)}>
+                <PaginationPrevious />
               </PaginationItem>
-            ) : null}
-            <PaginationPages
-              searchParams={searchParams}
-              currentPage={currentPage}
-              totalPages={totalPages}
-              baseUrl={APP_PATHS.JOBS}
-            />
-            {totalPages ? (
-              <PaginationItem>
-                <PaginationNextButton
-                  searchParams={searchParams}
-                  currentPage={currentPage}
-                  totalPages={totalPages}
-                  baseUrl={APP_PATHS.JOBS}
-                />
+              {[...Array(totalPages)].map((_, index) => (
+                <PaginationItem
+                  key={index}
+                  onClick={() => handlePageChange(index + 1)}
+                >
+                  <PaginationLink>{index + 1}</PaginationLink>
+                </PaginationItem>
+              ))}
+              <PaginationItem onClick={() => handlePageChange(currentPage + 1)}>
+                <PaginationNext />
               </PaginationItem>
-            ) : null}
-          </PaginationContent>
-        </Pagination>
+            </PaginationContent>
+          </Pagination>
+        </div>
       </div>
-    </>
+    </div>
   );
 };
 
diff --git a/src/components/ManageRecruiters.tsx b/src/components/ManageRecruiters.tsx
new file mode 100644
index 00000000..7bf6251b
--- /dev/null
+++ b/src/components/ManageRecruiters.tsx
@@ -0,0 +1,181 @@
+'use client';
+import React, { useState } from 'react';
+import {
+  Table,
+  TableBody,
+  TableCell,
+  TableHead,
+  TableHeader,
+  TableRow,
+} from './ui/table';
+import { Search, Trash2 } from 'lucide-react';
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from './ui/select';
+import { Input } from './ui/input';
+import { getAllRecruiters } from '@/types/recruiters.types';
+import { Button } from './ui/button';
+import {
+  Pagination,
+  PaginationContent,
+  PaginationItem,
+  PaginationLink,
+  PaginationNext,
+  PaginationPrevious,
+} from './ui/pagination';
+import { ServerActionReturnType } from '@/types/api.types';
+
+type props = {
+  recruiters: ServerActionReturnType<getAllRecruiters>;
+};
+
+const ManageRecruiters = ({ recruiters }: props) => {
+  const [currentPage, setCurrentPage] = useState(1);
+  const [searchTerm, setSearchTerm] = useState('');
+  const itemsPerPage = 10;
+
+  if (!recruiters.status) {
+    return <div>Error {recruiters.message}</div>;
+  }
+
+  const recruiterList = recruiters.additional?.recruiters ?? [];
+
+  const filteredRecruiters = recruiterList.filter(
+    (recruiter) =>
+      recruiter.company?.companyName
+        .toLowerCase()
+        .includes(searchTerm.toLowerCase()) ||
+      recruiter.company?.companyEmail
+        .toLowerCase()
+        .includes(searchTerm.toLowerCase())
+  );
+
+  const totalPages = Math.ceil(filteredRecruiters.length / itemsPerPage);
+
+  const currentRecruiters = filteredRecruiters.slice(
+    (currentPage - 1) * itemsPerPage,
+    currentPage * itemsPerPage
+  );
+
+  const handlePageChange = (page: number) => {
+    if (page > 0 && page <= totalPages) {
+      setCurrentPage(page);
+    }
+  };
+  return (
+    <div className="min-h-screen w-full max-w-6xl mx-auto p-2 md:p-8 text-gray-900 dark:text-gray-100">
+      <div className="flex flex-col md:flex-row justify-between mb-6">
+        <h1 className="text-2xl font-bold mb-4 md:mb-0">Manage Recruiters</h1>
+      </div>
+
+      <div className="flex flex-col md:flex-row justify-between mb-6">
+        <div className="relative w-full md:w-1/3 flex items-center mb-4 md:mb-0">
+          <Search className="absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-600 dark:text-gray-400" />
+          <Input
+            className="pl-10 border-gray-300 text-gray-900 placeholder-gray-500 dark:border-gray-700 dark:bg-gray-800 dark:text-gray-100 dark:placeholder-white"
+            placeholder="Search recruiters...."
+            value={searchTerm}
+            onChange={(e) => setSearchTerm(e.target.value)}
+          />
+        </div>
+        <div className="flex gap-4 items-center">
+          <Select>
+            <SelectTrigger className="w-[180px] border-gray-300 text-gray-900 dark:border-gray-700 dark:bg-gray-800 dark:text-gray-100">
+              <SelectValue placeholder="Sort Order" />
+            </SelectTrigger>
+            <SelectContent>
+              <SelectItem value="latest">Latest Recruiter</SelectItem>
+              <SelectItem value="oldest">Oldest Recruiter</SelectItem>
+            </SelectContent>
+          </Select>
+        </div>
+      </div>
+
+      <div className="rounded-md border overflow-hidden dark:border-gray-700">
+        <div className="overflow-x-auto">
+          <Table>
+            <TableHeader className="bg-gray-200 border-b border-gray-300 dark:bg-gray-800 dark:border-gray-700">
+              <TableRow>
+                <TableHead className="px-2 py-4">Company Name</TableHead>
+                <TableHead className="px-2 py-4">Company Email</TableHead>
+                <TableHead className="px-2 py-4">Jobs Posted</TableHead>
+                <TableHead className="px-2 py-4">Created At</TableHead>
+                <TableHead className="px-2 py-4">Action</TableHead>
+              </TableRow>
+            </TableHeader>
+            <TableBody>
+              {currentRecruiters.length ? (
+                currentRecruiters.map((recruiter) => (
+                  <TableRow key={recruiter.id}>
+                    <TableCell className="px-2 py-2">
+                      {recruiter.company?.companyName}
+                    </TableCell>
+                    <TableCell className="px-2 py-2">
+                      {recruiter.company?.companyEmail}
+                    </TableCell>
+                    <TableCell className="px-2 py-2">
+                      {recruiter._count.jobs}
+                    </TableCell>
+                    <TableCell className="px-2 py-2">
+                      {new Date(recruiter.createdAt).toLocaleDateString()}
+                    </TableCell>
+                    <TableCell className="px-2 py-2">
+                      <Button variant="ghost" size="icon">
+                        <Trash2 className="h-7 w-5 text-red-500" />
+                      </Button>
+                    </TableCell>
+                  </TableRow>
+                ))
+              ) : (
+                <TableRow>
+                  <TableCell colSpan={5} className="text-center py-4">
+                    No Recruiters
+                  </TableCell>
+                </TableRow>
+              )}
+            </TableBody>
+          </Table>
+        </div>
+      </div>
+
+      <div className="mt-6 flex justify-start">
+        <Pagination>
+          <PaginationContent>
+            <PaginationItem>
+              <PaginationPrevious
+                onClick={() => handlePageChange(currentPage - 1)}
+                className="border hover:border-blue-600 dark:bg-slate-400 dark:bg-opacity-5 dark:text-white text-black bg-slate-600 bg-opacity-15"
+              />
+            </PaginationItem>
+            {[...Array(totalPages)].map((_, index) => (
+              <PaginationItem key={index}>
+                <PaginationLink
+                  onClick={() => handlePageChange(index + 1)}
+                  className={`border hover:border-blue-600 dark:bg-slate-400 dark:bg-opacity-5 ${
+                    currentPage === index + 1
+                      ? 'bg-blue-600 text-white'
+                      : 'text-black dark:text-white'
+                  }`}
+                >
+                  {index + 1}
+                </PaginationLink>
+              </PaginationItem>
+            ))}
+            <PaginationItem>
+              <PaginationNext
+                onClick={() => handlePageChange(currentPage + 1)}
+                className="border hover:border-blue-600 dark:bg-slate-400 dark:bg-opacity-5 dark:text-white text-black bg-slate-600 bg-opacity-15"
+              />
+            </PaginationItem>
+          </PaginationContent>
+        </Pagination>
+      </div>
+    </div>
+  );
+};
+
+export default ManageRecruiters;
diff --git a/src/components/ToggleApproveJobButton.tsx b/src/components/ToggleApproveJobButton.tsx
index 5f964b78..d12ef494 100644
--- a/src/components/ToggleApproveJobButton.tsx
+++ b/src/components/ToggleApproveJobButton.tsx
@@ -14,7 +14,7 @@ import { Button } from './ui/button';
 import { useToast } from './ui/use-toast';
 import { toggleApproveJob } from '@/actions/job.action';
 import { JobType } from '@/types/jobs.types';
-import { Badge } from './ui/badge';
+import { Switch } from './ui/switch';
 
 const ToggleApproveJobButton = ({ job }: { job: JobType }) => {
   const { toast } = useToast();
@@ -41,13 +41,7 @@ const ToggleApproveJobButton = ({ job }: { job: JobType }) => {
   return (
     <Dialog open={dialogOpen} onOpenChange={setDialogOpen}>
       <DialogTrigger>
-        <Badge
-          className={`cursor-pointer tracking-wide ${
-            !isApproved ? 'bg-zinc-700 text-white' : 'bg-green-500 text-white'
-          }`}
-        >
-          {isApproved ? 'Approved' : 'Unapproved'}
-        </Badge>
+        <Switch checked={job.isVerifiedJob ? true : false} />
       </DialogTrigger>
       <DialogContent>
         <DialogHeader>
diff --git a/src/components/pagination-client.tsx b/src/components/pagination-client.tsx
index 69d0e0d1..26881fa9 100644
--- a/src/components/pagination-client.tsx
+++ b/src/components/pagination-client.tsx
@@ -19,9 +19,9 @@ const PaginationPreviousButton = ({
           page: (currentPage - PAGE_INCREMENT).toString(),
         })
       }
+      className=" border dark:bg-slate-400 dark:bg-opacity-5 dark:text-white text-black bg-slate-600 bg-opacity-15   "
       aria-disabled={currentPage - PAGE_INCREMENT < PAGE_INCREMENT}
       role="button"
-      className="aria-disabled:pointer-events-none aria-disabled:text-gray-400 dark:bg-neutral-900 rounded-full bg-neutral-100"
     />
   );
 };
@@ -43,8 +43,8 @@ const PaginationNextButton = ({
           page: (currentPage + PAGE_INCREMENT).toString(),
         })
       }
+      className=" border dark:bg-slate-400 dark:bg-opacity-5 dark:text-white text-black bg-slate-600 bg-opacity-15"
       aria-disabled={currentPage > totalPages - PAGE_INCREMENT}
-      className="aria-disabled:pointer-events-none aria-disabled:text-gray-400 dark:bg-neutral-900 rounded-full bg-neutral-100"
     />
   );
 };
diff --git a/src/components/ui/pagination.tsx b/src/components/ui/pagination.tsx
index b39745d0..2031e564 100644
--- a/src/components/ui/pagination.tsx
+++ b/src/components/ui/pagination.tsx
@@ -71,7 +71,6 @@ const PaginationPrevious = ({
     {...props}
   >
     <ChevronLeft className="h-4 w-4" />
-    <span>Previous</span>
   </PaginationLink>
 );
 PaginationPrevious.displayName = 'PaginationPrevious';
@@ -86,7 +85,6 @@ const PaginationNext = ({
     className={cn('gap-1 pr-2.5', className)}
     {...props}
   >
-    <span>Next</span>
     <ChevronRight className="h-4 w-4" />
   </PaginationLink>
 );
diff --git a/src/components/ui/paginator.tsx b/src/components/ui/paginator.tsx
index f780318e..ffac24a7 100644
--- a/src/components/ui/paginator.tsx
+++ b/src/components/ui/paginator.tsx
@@ -34,10 +34,12 @@ export const PaginationPages = ({
           <PaginationLink
             onClick={() => paginationHandler(i)}
             role="button"
-            className={cn('rounded-full dark:bg-neutral-900 bg-neutral-100', {
-              'bg-neutral-900 text-white dark:bg-neutral-100 dark:text-black ':
-                i === currentPage,
-            })}
+            className={cn(
+              ' border dark:bg-slate-400 dark:bg-opacity-5 dark:text-white',
+              {
+                ' text-black bg-slate-600 bg-opacity-15   ': i === currentPage,
+              }
+            )}
           >
             {i}
           </PaginationLink>
@@ -52,10 +54,12 @@ export const PaginationPages = ({
             onClick={() => paginationHandler(i)}
             // isActive={i === currentPage}
             role="button"
-            className={cn('rounded-full dark:bg-neutral-900 bg-neutral-100', {
-              'bg-neutral-900 text-white dark:bg-neutral-100 dark:text-black ':
-                i === currentPage,
-            })}
+            className={cn(
+              ' border dark:bg-slate-400 dark:bg-opacity-5 dark:text-white',
+              {
+                ' text-black bg-slate-600 bg-opacity-15   ': i === currentPage,
+              }
+            )}
           >
             {i}
           </PaginationLink>
@@ -77,11 +81,13 @@ export const PaginationPages = ({
           <PaginationLink
             role="button"
             onClick={() => paginationHandler(i)}
-            // isActive={i === currentPage}
-            className={cn('rounded-full dark:bg-neutral-900 bg-neutral-100', {
-              'bg-neutral-900 text-white dark:bg-neutral-100 dark:text-black ':
-                i === currentPage,
-            })}
+            isActive={i === currentPage}
+            className={cn(
+              ' border dark:bg-slate-400 dark:bg-opacity-5 dark:text-white',
+              {
+                ' text-black bg-slate-600 bg-opacity-15   ': i === currentPage,
+              }
+            )}
           >
             {i}
           </PaginationLink>
diff --git a/src/config/path.config.ts b/src/config/path.config.ts
index c8efde2a..31ebd971 100644
--- a/src/config/path.config.ts
+++ b/src/config/path.config.ts
@@ -5,7 +5,8 @@ const APP_PATHS = {
   SIGNUP: '/signup',
   RESET_PASSWORD: '/reset-password',
   JOBS: '/jobs',
-  MANAGE_JOBS: '/manage',
+  MANAGE_RECRUITERS: '/manage/recruiters',
+  MANAGE_JOBS: '/manage/jobs',
   CONTACT_US: 'mailto:vineetagarwal.now@gmail.com',
   TESTIMONIALS: '#testimonials',
   FAQS: '#faq',
diff --git a/src/lib/constant/app.constant.ts b/src/lib/constant/app.constant.ts
index f854f9a5..8c500b92 100644
--- a/src/lib/constant/app.constant.ts
+++ b/src/lib/constant/app.constant.ts
@@ -20,19 +20,18 @@ export const userNavbar = [
   { id: 2, label: 'Contact us', path: APP_PATHS.CONTACT_US },
 ];
 export const adminNavbar = [
-  { id: 1, label: 'Explore jobs', path: APP_PATHS.JOBS },
   {
-    id: 2,
+    id: 1,
     label: 'Manage Jobs',
     path: APP_PATHS.MANAGE_JOBS,
     roleRequired: ['ADMIN', 'HR'],
     icon: PackageSearch,
   },
   {
-    id: 3,
-    label: 'Post a job',
-    path: APP_PATHS.POST_JOB,
-    roleRequired: ['ADMIN', 'HR'],
+    id: 2,
+    label: 'Manage Recruiters',
+    path: APP_PATHS.MANAGE_RECRUITERS,
+    roleRequired: ['ADMIN'],
     icon: PackageSearch,
   },
 ];
diff --git a/src/lib/icons.ts b/src/lib/icons.ts
index 8cb54c36..d14aebf5 100644
--- a/src/lib/icons.ts
+++ b/src/lib/icons.ts
@@ -13,6 +13,7 @@ import {
   Menu,
   Sparkles,
   Copyright,
+  ArchiveRestore,
   Sun,
   Moon,
   type Icon as LucideIconType,
@@ -23,6 +24,7 @@ import {
   DollarSign,
   BookText,
   User,
+  Trash2,
   LogOut,
   SlidersHorizontal,
   AlertCircle,
@@ -41,6 +43,8 @@ const icons = {
   loading: FaSpinner,
   copyright: Copyright,
   sun: Sun,
+  ArchiveRestore: ArchiveRestore,
+  trash: Trash2,
   moon: Moon,
   check: Check,
   'chevron-right': ChevronRight,
diff --git a/src/types/jobs.types.ts b/src/types/jobs.types.ts
index 265f2ae8..ae34c5e0 100644
--- a/src/types/jobs.types.ts
+++ b/src/types/jobs.types.ts
@@ -13,6 +13,7 @@ export type JobType = {
   skills: string[];
   id: string;
   title: string;
+  expired: Boolean;
   description: string | null;
   companyName: string;
   postedAt: Date;
diff --git a/src/types/recruiters.types.ts b/src/types/recruiters.types.ts
new file mode 100644
index 00000000..a4152150
--- /dev/null
+++ b/src/types/recruiters.types.ts
@@ -0,0 +1,17 @@
+export type RecruitersTypes = {
+  id: string;
+  email: string;
+  name: string;
+  createdAt: Date;
+  _count: {
+    jobs: number;
+  };
+  company: {
+    companyName: string;
+    companyEmail: string;
+  } | null;
+};
+
+export type getAllRecruiters = {
+  recruiters: RecruitersTypes[];
+};