From dc6217b14eabe74c073175a622ecb9b23a5b809d Mon Sep 17 00:00:00 2001
From: Subham Ray <self.programmed@gmail.com>
Date: Mon, 24 Apr 2023 19:16:56 +0530
Subject: [PATCH] feat(Documents Filter): Keep the URL and UI state in sync
 when status filter changes

---
 apps/web/pages/documents.tsx | 16 +++++++++++++++-
 1 file changed, 15 insertions(+), 1 deletion(-)

diff --git a/apps/web/pages/documents.tsx b/apps/web/pages/documents.tsx
index eaad896a5..eea36a846 100644
--- a/apps/web/pages/documents.tsx
+++ b/apps/web/pages/documents.tsx
@@ -83,6 +83,20 @@ const DocumentsPage: NextPageWithLayout = (props: any) => {
     return filteredDocuments;
   }
 
+  function handleSetSelectedStatusFilter(status: any) {
+    router.replace(
+      {
+        pathname: router.pathname,
+        query: { filter: status.value },
+      },
+      undefined,
+      {
+        shallow: true, // Perform a shallow update, without reloading the page
+      }
+    );
+    setSelectedStatusFilter(status);
+  }
+
   function wasXDaysAgoOrLess(documentDate: Date, lastXDays: number): boolean {
     if (lastXDays < 0) return true;
 
@@ -138,7 +152,7 @@ const DocumentsPage: NextPageWithLayout = (props: any) => {
             label="Status"
             options={statusFilters}
             value={selectedStatusFilter}
-            onChange={setSelectedStatusFilter}
+            onChange={handleSetSelectedStatusFilter}
           />
         </div>
         <div className="mt-20 max-w-[1100px]" hidden={!loading}>