✨ feat: implement search parameter updates (danny-avila#7151)

* feat: implement search parameter updates

* Update url params when values change

reset params on new chat

move logic to families.ts

revert unchanged files

---------

Co-authored-by: Danny Avila <[email protected]>

Author: mawburn

client/src/hooks/Input/useQueryParams.ts

@@ -95,7 +95,7 @@ export default function useQueryParams({
   const settingsTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);
 
   const methods = useChatFormContext();
-  const [searchParams] = useSearchParams();
+  const [searchParams, setSearchParams] = useSearchParams();
   const getDefaultConversation = useDefaultConvo();
   const modularChat = useRecoilValue(store.modularChat);
   const availableTools = useRecoilValue(store.availableTools);
@@ -332,6 +332,12 @@ export default function useQueryParams({
 
       /** Mark processing as complete and clean up as needed */
       const success = () => {
+        const currentParams = new URLSearchParams(searchParams.toString());
+        currentParams.delete('prompt');
+        currentParams.delete('q');
+        currentParams.delete('submit');
+
+        setSearchParams(currentParams, { replace: true });
         processedRef.current = true;
         console.log('Parameters processed successfully');
         clearInterval(intervalId);
@@ -407,6 +413,7 @@ export default function useQueryParams({
     newQueryConvo,
     newConversation,
     submitMessage,
+    setSearchParams,
     queryClient,
     processSubmission,
   ]);

client/src/store/families.ts

@@ -14,7 +14,8 @@ import { LocalStorageKeys, Constants } from 'librechat-data-provider';
 import type { TMessage, TPreset, TConversation, TSubmission } from 'librechat-data-provider';
 import type { TOptionSettings, ExtendedFile } from '~/common';
 import { useSetConvoContext } from '~/Providers/SetConvoContext';
-import { storeEndpointSettings, logger } from '~/utils';
+import { storeEndpointSettings, logger, createChatSearchParams } from '~/utils';
+import { createSearchParams } from 'react-router-dom';
 
 const latestMessageKeysAtom = atom<(string | number)[]>({
   key: 'latestMessageKeys',
@@ -73,9 +74,9 @@ const conversationByIndex = atomFamily<TConversation | null, string | number>({
   default: null,
   effects: [
     ({ onSet, node }) => {
-      onSet(async (newValue) => {
+      onSet(async (newValue, oldValue) => {
         const index = Number(node.key.split('__')[1]);
-        logger.log('conversation', 'Setting conversation:', { index, newValue });
+        logger.log('conversation', 'Setting conversation:', { index, newValue, oldValue });
         if (newValue?.assistant_id != null && newValue.assistant_id) {
           localStorage.setItem(
             `${LocalStorageKeys.ASST_ID_PREFIX}${index}${newValue.endpoint}`,
@@ -104,6 +105,18 @@ const conversationByIndex = atomFamily<TConversation | null, string | number>({
           `${LocalStorageKeys.LAST_CONVO_SETUP}_${index}`,
           JSON.stringify(newValue),
         );
+
+        const shouldUpdateParams =
+          newValue.createdAt === '' &&
+          JSON.stringify(newValue) !== JSON.stringify(oldValue) &&
+          (oldValue as TConversation)?.conversationId === 'new';
+
+        if (shouldUpdateParams) {
+          const newParams = createChatSearchParams(newValue);
+          const searchParams = createSearchParams(newParams);
+          const url = `${window.location.pathname}?${searchParams.toString()}`;
+          window.history.pushState({}, '', url);
+        }
       });
     },
   ] as const,