🔍 feat: Show Messages from Search Result (#2699)

* refactor(Nav): delegate Search-specific variables/hooks to SearchContext

* fix: safely determine firstTodayConvoId if convo is undefined

* chore: remove empty line

* feat: initial render of search messages

* feat: SearchButtons

* update Ko.ts

* update localizations with new key phrases

* chore: localization comparisons

* fix: clear conversation state on searchQuery navigation

* style: search messages view styling

* refactor(Convo): consolidate logic to navigateWithLastTools from useNavigateToConvo

* fix(SearchButtons): styling and correct navigation logic

* fix(SearchBar): invalidate all message queries and invoke `clearText` if onChange value is empty

* refactor(NewChat): consolidate new chat button logic to NewChatButtonIcon

* chore: localizations for Nav date groups

* chore: update comparisons

* fix: early return from sendRequest to avoid quick searchQuery reset

* style: Link Icon

* chore: bump tiktoken, use o200k_base for gpt-4o

client/src/hooks/Conversations/index.ts

@@ -1,3 +1,4 @@
+export { default as useSearch } from './useSearch';
 export { default as usePresets } from './usePresets';
 export { default as useGetSender } from './useGetSender';
 export { default as useDefaultConvo } from './useDefaultConvo';

client/src/hooks/Conversations/useNavigateToConvo.tsx

@@ -1,6 +1,6 @@
 import { useQueryClient } from '@tanstack/react-query';
 import { useSetRecoilState, useResetRecoilState } from 'recoil';
-import { QueryKeys } from 'librechat-data-provider';
+import { QueryKeys, EModelEndpoint, LocalStorageKeys } from 'librechat-data-provider';
 import type { TConversation, TEndpointsConfig, TModelsConfig } from 'librechat-data-provider';
 import { buildDefaultConvo, getDefaultEndpoint, getEndpointField } from '~/utils';
 import useOriginNavigate from '../useOriginNavigate';
@@ -51,8 +51,28 @@ const useNavigateToConvo = (index = 0) => {
     navigate(convo?.conversationId);
   };
 
+  const navigateWithLastTools = (conversation: TConversation) => {
+    // set conversation to the new conversation
+    if (conversation?.endpoint === EModelEndpoint.gptPlugins) {
+      let lastSelectedTools = [];
+      try {
+        lastSelectedTools =
+          JSON.parse(localStorage.getItem(LocalStorageKeys.LAST_TOOLS) ?? '') ?? [];
+      } catch (e) {
+        // console.error(e);
+      }
+      navigateToConvo({
+        ...conversation,
+        tools: conversation?.tools?.length ? conversation?.tools : lastSelectedTools,
+      });
+    } else {
+      navigateToConvo(conversation);
+    }
+  };
+
   return {
     navigateToConvo,
+    navigateWithLastTools,
   };
 };
 

client/src/hooks/Conversations/useSearch.ts

@@ -0,0 +1,69 @@
+import { useEffect, useState, useCallback } from 'react';
+import { useRecoilValue, useSetRecoilState } from 'recoil';
+import { useNavigate, useLocation } from 'react-router-dom';
+import { useGetSearchEnabledQuery } from 'librechat-data-provider/react-query';
+import { useSearchInfiniteQuery } from '~/data-provider';
+import useConversation from './useConversation';
+import store from '~/store';
+
+export default function useSearchMessages({ isAuthenticated }: { isAuthenticated: boolean }) {
+  const navigate = useNavigate();
+  const location = useLocation();
+  const [pageNumber, setPageNumber] = useState(1);
+  const { searchPlaceholderConversation } = useConversation();
+
+  const searchQuery = useRecoilValue(store.searchQuery);
+  const setIsSearchEnabled = useSetRecoilState(store.isSearchEnabled);
+
+  const searchEnabledQuery = useGetSearchEnabledQuery({ enabled: isAuthenticated });
+  const searchQueryRes = useSearchInfiniteQuery(
+    { pageNumber: pageNumber.toString(), searchQuery: searchQuery, isArchived: false },
+    { enabled: isAuthenticated && !!searchQuery.length },
+  );
+
+  useEffect(() => {
+    if (searchQuery && searchQuery.length > 0) {
+      navigate('/search', { replace: true });
+      return;
+    }
+
+    if (location.pathname && location.pathname.includes('/c/')) {
+      return;
+    }
+    navigate('/c/new', { replace: true });
+    /* Disabled eslint rule because we don't want to run this effect when location changes */
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [navigate, searchQuery]);
+
+  useEffect(() => {
+    if (searchEnabledQuery.data) {
+      setIsSearchEnabled(searchEnabledQuery.data);
+    } else if (searchEnabledQuery.isError) {
+      console.error('Failed to get search enabled', searchEnabledQuery.error);
+    }
+  }, [
+    searchEnabledQuery.data,
+    searchEnabledQuery.error,
+    searchEnabledQuery.isError,
+    setIsSearchEnabled,
+  ]);
+
+  const onSearchSuccess = useCallback(
+    () => searchPlaceholderConversation(),
+    [searchPlaceholderConversation],
+  );
+
+  useEffect(() => {
+    //we use isInitialLoading here instead of isLoading because query is disabled by default
+    if (searchQueryRes.data) {
+      onSearchSuccess();
+    }
+  }, [searchQueryRes.data, searchQueryRes.isInitialLoading, onSearchSuccess]);
+
+  return {
+    pageNumber,
+    searchQuery,
+    setPageNumber,
+    searchQueryRes,
+  };
+}