From 373ca87142507486b2f82a3e6abb9433021a8403 Mon Sep 17 00:00:00 2001
From: Ashutoshpadhi629 <padhiashutosh106@gmail.com>
Date: Wed, 21 Aug 2024 13:19:26 +0530
Subject: [PATCH 1/5] filtersheet-update

---
 src/app/jobs/page.tsx          | 17 +++++++++++++++--
 src/components/FilterSheet.tsx | 23 +++++++++++++++++++++++
 2 files changed, 38 insertions(+), 2 deletions(-)
 create mode 100644 src/components/FilterSheet.tsx

diff --git a/src/app/jobs/page.tsx b/src/app/jobs/page.tsx
index 3d2cd097..e94ca35d 100644
--- a/src/app/jobs/page.tsx
+++ b/src/app/jobs/page.tsx
@@ -1,5 +1,7 @@
 import AllJobs from '@/components/all-jobs';
+import { FilterSheet } from '@/components/FilterSheet';
 import Loader from '@/components/loader';
+import { Button } from '@/components/ui/button';
 import JobFilters from '@/layouts/job-filters';
 import JobsHeader from '@/layouts/jobs-header';
 import { JobQuerySchemaType } from '@/lib/validators/jobs.validator';
@@ -7,9 +9,20 @@ import { Suspense } from 'react';
 const page = async ({ searchParams }: { searchParams: JobQuerySchemaType }) => {
   return (
     <div className="container flex gap-5 pt-5">
-      <JobFilters searchParams={searchParams} />
+      <div className="max-md:hidden">
+        <JobFilters searchParams={searchParams} />
+      </div>
       <div className="grow">
-        <JobsHeader searchParams={searchParams} />
+        <div className="flex space-x-2">
+          <div className="md:hidden">
+            <FilterSheet searchParams={searchParams}>
+              <Button>Filters</Button>
+            </FilterSheet>
+          </div>
+          <div className="flex-grow">
+            <JobsHeader searchParams={searchParams} />
+          </div>
+        </div>
         <Suspense
           fallback={
             <div className="flex justify-center items-center h-full gap-5 ">
diff --git a/src/components/FilterSheet.tsx b/src/components/FilterSheet.tsx
new file mode 100644
index 00000000..54270174
--- /dev/null
+++ b/src/components/FilterSheet.tsx
@@ -0,0 +1,23 @@
+import React from 'react';
+import { Sheet, SheetContent, SheetHeader, SheetTrigger } from './ui/sheet';
+import JobFilters from '@/layouts/job-filters';
+import { JobQuerySchemaType } from '@/lib/validators/jobs.validator';
+
+export function FilterSheet({
+  children,
+  searchParams,
+}: {
+  children: React.ReactNode;
+  searchParams: JobQuerySchemaType;
+}) {
+  return (
+    <Sheet>
+      <SheetTrigger>{children}</SheetTrigger>
+      <SheetContent side={'left'} className="h-full w-80">
+        <SheetHeader className="mt-2 h-full w-full">
+          <JobFilters searchParams={searchParams}></JobFilters>
+        </SheetHeader>
+      </SheetContent>
+    </Sheet>
+  );
+}

From ccfee7fe7a865dd75f5c81cbae20967111946776 Mon Sep 17 00:00:00 2001
From: Ashutoshpadhi629 <padhiashutosh106@gmail.com>
Date: Mon, 26 Aug 2024 20:45:00 +0530
Subject: [PATCH 2/5] resolved-conflicts

---
 src/app/jobs/page.tsx          | 50 +++++++++++++++++++---------------
 src/components/FilterSheet.tsx |  7 ++++-
 2 files changed, 34 insertions(+), 23 deletions(-)

diff --git a/src/app/jobs/page.tsx b/src/app/jobs/page.tsx
index e94ca35d..85e8114a 100644
--- a/src/app/jobs/page.tsx
+++ b/src/app/jobs/page.tsx
@@ -1,6 +1,7 @@
 import AllJobs from '@/components/all-jobs';
 import { FilterSheet } from '@/components/FilterSheet';
 import Loader from '@/components/loader';
+import APP_PATHS from '@/config/path.config';
 import { Button } from '@/components/ui/button';
 import JobFilters from '@/layouts/job-filters';
 import JobsHeader from '@/layouts/jobs-header';
@@ -8,30 +9,35 @@ import { JobQuerySchemaType } from '@/lib/validators/jobs.validator';
 import { Suspense } from 'react';
 const page = async ({ searchParams }: { searchParams: JobQuerySchemaType }) => {
   return (
-    <div className="container flex gap-5 pt-5">
-      <div className="max-md:hidden">
-        <JobFilters searchParams={searchParams} />
-      </div>
-      <div className="grow">
-        <div className="flex space-x-2">
-          <div className="md:hidden">
-            <FilterSheet searchParams={searchParams}>
-              <Button>Filters</Button>
-            </FilterSheet>
-          </div>
-          <div className="flex-grow">
-            <JobsHeader searchParams={searchParams} />
-          </div>
+    <div className="container flex gap-5 pt-10">
+      <div className="container flex gap-5 pt-5">
+        <div className="max-md:hidden">
+          <JobFilters searchParams={searchParams} baseUrl={APP_PATHS.JOBS} />
         </div>
-        <Suspense
-          fallback={
-            <div className="flex justify-center items-center h-full gap-5 ">
-              <Loader />
+        <div className="grow">
+          <div className="flex space-x-2">
+            <div className="md:hidden">
+              <FilterSheet searchParams={searchParams} baseUrl={APP_PATHS.JOBS}>
+                <Button>Filters</Button>
+              </FilterSheet>
             </div>
-          }
-        >
-          <AllJobs searchParams={searchParams} />
-        </Suspense>
+            <div className="flex-grow">
+              <JobsHeader
+                searchParams={searchParams}
+                baseUrl={APP_PATHS.JOBS}
+              />
+            </div>
+          </div>
+          <Suspense
+            fallback={
+              <div className="flex justify-center items-center h-full gap-5 ">
+                <Loader />
+              </div>
+            }
+          >
+            <AllJobs searchParams={searchParams} />
+          </Suspense>
+        </div>
       </div>
     </div>
   );
diff --git a/src/components/FilterSheet.tsx b/src/components/FilterSheet.tsx
index 54270174..8ac63836 100644
--- a/src/components/FilterSheet.tsx
+++ b/src/components/FilterSheet.tsx
@@ -6,16 +6,21 @@ import { JobQuerySchemaType } from '@/lib/validators/jobs.validator';
 export function FilterSheet({
   children,
   searchParams,
+  baseUrl,
 }: {
   children: React.ReactNode;
   searchParams: JobQuerySchemaType;
+  baseUrl: string;
 }) {
   return (
     <Sheet>
       <SheetTrigger>{children}</SheetTrigger>
       <SheetContent side={'left'} className="h-full w-80">
         <SheetHeader className="mt-2 h-full w-full">
-          <JobFilters searchParams={searchParams}></JobFilters>
+          <JobFilters
+            searchParams={searchParams}
+            baseUrl={baseUrl}
+          ></JobFilters>
         </SheetHeader>
       </SheetContent>
     </Sheet>

From 9fd4a80d0e51d0ff4ed4f45621d070de4860596c Mon Sep 17 00:00:00 2001
From: Ashutoshpadhi629 <padhiashutosh106@gmail.com>
Date: Tue, 17 Sep 2024 00:53:04 +0530
Subject: [PATCH 3/5] fixed/type-errors

---
 src/app/jobs/page.tsx          | 10 +++-------
 src/components/FilterSheet.tsx |  7 +------
 2 files changed, 4 insertions(+), 13 deletions(-)

diff --git a/src/app/jobs/page.tsx b/src/app/jobs/page.tsx
index 64ce34f4..a31975a8 100644
--- a/src/app/jobs/page.tsx
+++ b/src/app/jobs/page.tsx
@@ -2,7 +2,6 @@ import AllJobs from '@/components/all-jobs';
 import { FilterSheet } from '@/components/FilterSheet';
 import Loader from '@/components/loader';
 import { Button } from '@/components/ui/button';
-import APP_PATHS from '@/config/path.config';
 import JobFilters from '@/layouts/job-filters';
 import JobsHeader from '@/layouts/jobs-header';
 import {
@@ -23,20 +22,17 @@ const page = async ({ searchParams }: { searchParams: JobQuerySchemaType }) => {
     <div className="container flex gap-5 pt-10">
       <div className="container flex gap-5 pt-5">
         <div className="max-md:hidden">
-          <JobFilters searchParams={searchParams} baseUrl={APP_PATHS.JOBS} />
+          <JobFilters searchParams={parsedSearchParams} />
         </div>
         <div className="grow">
           <div className="flex space-x-2">
             <div className="md:hidden">
-              <FilterSheet searchParams={searchParams} baseUrl={APP_PATHS.JOBS}>
+              <FilterSheet searchParams={parsedSearchParams}>
                 <Button>Filters</Button>
               </FilterSheet>
             </div>
             <div className="flex-grow">
-              <JobsHeader
-                searchParams={searchParams}
-                baseUrl={APP_PATHS.JOBS}
-              />
+              <JobsHeader searchParams={searchParams} />
             </div>
           </div>
           <Suspense
diff --git a/src/components/FilterSheet.tsx b/src/components/FilterSheet.tsx
index 8ac63836..54270174 100644
--- a/src/components/FilterSheet.tsx
+++ b/src/components/FilterSheet.tsx
@@ -6,21 +6,16 @@ import { JobQuerySchemaType } from '@/lib/validators/jobs.validator';
 export function FilterSheet({
   children,
   searchParams,
-  baseUrl,
 }: {
   children: React.ReactNode;
   searchParams: JobQuerySchemaType;
-  baseUrl: string;
 }) {
   return (
     <Sheet>
       <SheetTrigger>{children}</SheetTrigger>
       <SheetContent side={'left'} className="h-full w-80">
         <SheetHeader className="mt-2 h-full w-full">
-          <JobFilters
-            searchParams={searchParams}
-            baseUrl={baseUrl}
-          ></JobFilters>
+          <JobFilters searchParams={searchParams}></JobFilters>
         </SheetHeader>
       </SheetContent>
     </Sheet>

From f89910a47ada97d2def22f0f1693845798cb477f Mon Sep 17 00:00:00 2001
From: Ashutoshpadhi629 <padhiashutosh106@gmail.com>
Date: Tue, 17 Sep 2024 01:43:18 +0530
Subject: [PATCH 4/5] fixed/ui-updates

---
 src/app/jobs/page.tsx          | 42 ++++++++++++----------------------
 src/components/FilterSheet.tsx | 23 -------------------
 src/layouts/jobs-header.tsx    | 27 ++++++++++++----------
 3 files changed, 30 insertions(+), 62 deletions(-)
 delete mode 100644 src/components/FilterSheet.tsx

diff --git a/src/app/jobs/page.tsx b/src/app/jobs/page.tsx
index a31975a8..1df14016 100644
--- a/src/app/jobs/page.tsx
+++ b/src/app/jobs/page.tsx
@@ -1,7 +1,5 @@
 import AllJobs from '@/components/all-jobs';
-import { FilterSheet } from '@/components/FilterSheet';
 import Loader from '@/components/loader';
-import { Button } from '@/components/ui/button';
 import JobFilters from '@/layouts/job-filters';
 import JobsHeader from '@/layouts/jobs-header';
 import {
@@ -19,32 +17,22 @@ const page = async ({ searchParams }: { searchParams: JobQuerySchemaType }) => {
   }
   const parsedSearchParams = parsedData.data;
   return (
-    <div className="container flex gap-5 pt-10">
-      <div className="container flex gap-5 pt-5">
-        <div className="max-md:hidden">
-          <JobFilters searchParams={parsedSearchParams} />
-        </div>
-        <div className="grow">
-          <div className="flex space-x-2">
-            <div className="md:hidden">
-              <FilterSheet searchParams={parsedSearchParams}>
-                <Button>Filters</Button>
-              </FilterSheet>
-            </div>
-            <div className="flex-grow">
-              <JobsHeader searchParams={searchParams} />
+    <div className="container flex gap-5 pt-5 mt-10">
+      <div className="hidden sm:block border  h-fit rounded-lg w-[310px] ">
+        <JobFilters searchParams={parsedSearchParams} />
+      </div>
+      <div className="grow">
+        <JobsHeader searchParams={parsedSearchParams} />
+        <Suspense
+          key={JSON.stringify(parsedSearchParams)}
+          fallback={
+            <div className="flex justify-center items-center h-full gap-5 ">
+              <Loader />
             </div>
-          </div>
-          <Suspense
-            fallback={
-              <div className="flex justify-center items-center h-full gap-5 ">
-                <Loader />
-              </div>
-            }
-          >
-            <AllJobs searchParams={searchParams} />
-          </Suspense>
-        </div>
+          }
+        >
+          <AllJobs searchParams={parsedSearchParams} />
+        </Suspense>
       </div>
     </div>
   );
diff --git a/src/components/FilterSheet.tsx b/src/components/FilterSheet.tsx
deleted file mode 100644
index 54270174..00000000
--- a/src/components/FilterSheet.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import React from 'react';
-import { Sheet, SheetContent, SheetHeader, SheetTrigger } from './ui/sheet';
-import JobFilters from '@/layouts/job-filters';
-import { JobQuerySchemaType } from '@/lib/validators/jobs.validator';
-
-export function FilterSheet({
-  children,
-  searchParams,
-}: {
-  children: React.ReactNode;
-  searchParams: JobQuerySchemaType;
-}) {
-  return (
-    <Sheet>
-      <SheetTrigger>{children}</SheetTrigger>
-      <SheetContent side={'left'} className="h-full w-80">
-        <SheetHeader className="mt-2 h-full w-full">
-          <JobFilters searchParams={searchParams}></JobFilters>
-        </SheetHeader>
-      </SheetContent>
-    </Sheet>
-  );
-}
diff --git a/src/layouts/jobs-header.tsx b/src/layouts/jobs-header.tsx
index 213ee13e..6fe83197 100644
--- a/src/layouts/jobs-header.tsx
+++ b/src/layouts/jobs-header.tsx
@@ -23,7 +23,6 @@ import {
   FormItem,
   FormMessage,
 } from '@/components/ui/form';
-import { Drawer, DrawerContent, DrawerTrigger } from '@/components/ui/drawer';
 import { Input } from '@/components/ui/input';
 import useSetQueryParams from '@/hooks/useSetQueryParams';
 import { usePathname } from 'next/navigation';
@@ -32,6 +31,12 @@ import APP_PATHS from '@/config/path.config';
 import { useEffect } from 'react';
 import JobFilters from './job-filters';
 import { cn } from '@/lib/utils';
+import {
+  Sheet,
+  SheetContent,
+  SheetHeader,
+  SheetTrigger,
+} from '@/components/ui/sheet';
 const FormSchema = z.object({
   search: z.string().optional(),
 });
@@ -97,18 +102,16 @@ const JobsHeader = ({ searchParams }: { searchParams: JobQuerySchemaType }) => {
         )}
 
         {(isJobs || isHome) && (
-          <Drawer>
-            <DrawerTrigger className="max-sm:block hidden bg-neutral-100 dark:bg-neutral-900 rounded-full p-3 cursor-pointer">
-              {' '}
+          <Sheet>
+            <SheetTrigger className="sm:hidden">
               <Icon icon="filter" className="cursor-pointer" size="20" />
-            </DrawerTrigger>
-            <DrawerContent
-              className="flex justify-center items-center gap-5"
-              aria-describedby={undefined}
-            >
-              <JobFilters searchParams={searchParams} />
-            </DrawerContent>
-          </Drawer>
+            </SheetTrigger>
+            <SheetContent side={'left'} className="h-full w-80">
+              <SheetHeader className="mt-2 h-full w-full">
+                <JobFilters searchParams={searchParams}></JobFilters>
+              </SheetHeader>
+            </SheetContent>
+          </Sheet>
         )}
 
         <Select

From 86aa22d3348b6455ba088a3a989a4daa2e6287f4 Mon Sep 17 00:00:00 2001
From: Ashutoshpadhi629 <padhiashutosh106@gmail.com>
Date: Tue, 17 Sep 2024 01:54:18 +0530
Subject: [PATCH 5/5] fixed/minor-bug

---
 src/layouts/jobs-header.tsx | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/layouts/jobs-header.tsx b/src/layouts/jobs-header.tsx
index 6fe83197..13839d3f 100644
--- a/src/layouts/jobs-header.tsx
+++ b/src/layouts/jobs-header.tsx
@@ -37,6 +37,7 @@ import {
   SheetHeader,
   SheetTrigger,
 } from '@/components/ui/sheet';
+import { ScrollArea } from '@/components/ui/scroll-area';
 const FormSchema = z.object({
   search: z.string().optional(),
 });
@@ -108,7 +109,9 @@ const JobsHeader = ({ searchParams }: { searchParams: JobQuerySchemaType }) => {
             </SheetTrigger>
             <SheetContent side={'left'} className="h-full w-80">
               <SheetHeader className="mt-2 h-full w-full">
-                <JobFilters searchParams={searchParams}></JobFilters>
+                <ScrollArea>
+                  <JobFilters searchParams={searchParams}></JobFilters>
+                </ScrollArea>
               </SheetHeader>
             </SheetContent>
           </Sheet>