From 73681948d361e6dc95ba99b3ea85c6a0b73d6f73 Mon Sep 17 00:00:00 2001
From: abdou6666 <sfayhi.abderrahmen@esprit.tn>
Date: Fri, 4 Apr 2025 11:01:57 +0100
Subject: [PATCH] fix: keep query params state when navigating to different
 conversation

---
 .../components/inbox/components/ConversationsList.tsx |  6 +++++-
 frontend/src/utils/URL.ts                             | 11 +++++++++++
 2 files changed, 16 insertions(+), 1 deletion(-)

diff --git a/frontend/src/components/inbox/components/ConversationsList.tsx b/frontend/src/components/inbox/components/ConversationsList.tsx
index 66409f85..f9ac6704 100644
--- a/frontend/src/components/inbox/components/ConversationsList.tsx
+++ b/frontend/src/components/inbox/components/ConversationsList.tsx
@@ -20,6 +20,7 @@ import { useConfig } from "@/hooks/useConfig";
 import { useTranslate } from "@/hooks/useTranslate";
 import { Title } from "@/layout/content/Title";
 import { EntityType, RouterType } from "@/services/types";
+import { extractQueryParamsUrl } from "@/utils/URL";
 
 import { getAvatarSrc } from "../helpers/mapMessages";
 import { useChat } from "../hooks/ChatContext";
@@ -64,7 +65,10 @@ export const SubscribersList = (props: {
             <Conversation
               onClick={() => {
                 chat.setSubscriberId(subscriber.id);
-                push(`/${RouterType.INBOX}/subscribers/${subscriber.id}`);
+                push({
+                  pathname: `/${RouterType.INBOX}/subscribers/${subscriber.id}`,
+                  query: extractQueryParamsUrl(window.location.href),
+                });
               }}
               className="changeColor"
               key={subscriber.id}
diff --git a/frontend/src/utils/URL.ts b/frontend/src/utils/URL.ts
index 0c85749d..e169dbe2 100644
--- a/frontend/src/utils/URL.ts
+++ b/frontend/src/utils/URL.ts
@@ -6,6 +6,8 @@
  * 2. All derivative works must include clear attribution to the original creator and software, Hexastack and Hexabot, in a prominent location (e.g., in the software's "About" section, documentation, and README file).
  */
 
+import qs from "qs";
+
 export const getFromQuery = ({
   key,
   search,
@@ -57,3 +59,12 @@ export const isAbsoluteUrl = (value: string = ""): boolean => {
     return false;
   }
 };
+
+// todo: in the future we might need to extract this logic into a hook
+export const extractQueryParamsUrl = (fullUrl: string): string => {
+  const extractedQueryParams = qs.parse(new URL(fullUrl).search, {
+    ignoreQueryPrefix: true,
+  });
+
+  return qs.stringify(extractedQueryParams);
+};