🔍 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/utils/convos.spec.ts

@@ -1,11 +1,12 @@
 import { convoData } from './convos.fakeData';
 import {
-  groupConversationsByDate,
+  dateKeys,
   addConversation,
-  updateConversation,
   updateConvoFields,
+  updateConversation,
   deleteConversation,
   findPageForConversation,
+  groupConversationsByDate,
 } from './convos';
 import type { TConversation, ConversationData } from 'librechat-data-provider';
 
@@ -20,13 +21,13 @@ describe('Conversation Utilities', () => {
         { conversationId: '5', updatedAt: new Date(Date.now() - 86400000 * 8).toISOString() }, // 8 days ago (previous 30 days)
       ];
       const grouped = groupConversationsByDate(conversations as TConversation[]);
-      expect(grouped[0][0]).toBe('Today');
+      expect(grouped[0][0]).toBe(dateKeys.today);
       expect(grouped[0][1]).toHaveLength(1);
-      expect(grouped[1][0]).toBe('Yesterday');
+      expect(grouped[1][0]).toBe(dateKeys.yesterday);
       expect(grouped[1][1]).toHaveLength(1);
-      expect(grouped[2][0]).toBe('Previous 7 days');
+      expect(grouped[2][0]).toBe(dateKeys.previous7Days);
       expect(grouped[2][1]).toHaveLength(1);
-      expect(grouped[3][0]).toBe('Previous 30 days');
+      expect(grouped[3][0]).toBe(dateKeys.previous30Days);
       expect(grouped[3][1]).toHaveLength(1);
       expect(grouped[4][0]).toBe(' 2023');
       expect(grouped[4][1]).toHaveLength(1);

client/src/utils/convos.ts

@@ -16,22 +16,42 @@ import type {
   GroupedConversations,
 } from 'librechat-data-provider';
 
+export const dateKeys = {
+  today: 'com_ui_date_today',
+  yesterday: 'com_ui_date_yesterday',
+  previous7Days: 'com_ui_date_previous_7_days',
+  previous30Days: 'com_ui_date_previous_30_days',
+  january: 'com_ui_date_january',
+  february: 'com_ui_date_february',
+  march: 'com_ui_date_march',
+  april: 'com_ui_date_april',
+  may: 'com_ui_date_may',
+  june: 'com_ui_date_june',
+  july: 'com_ui_date_july',
+  august: 'com_ui_date_august',
+  september: 'com_ui_date_september',
+  october: 'com_ui_date_october',
+  november: 'com_ui_date_november',
+  december: 'com_ui_date_december',
+};
+
 const getGroupName = (date: Date) => {
   const now = new Date();
   if (isToday(date)) {
-    return 'Today';
+    return dateKeys.today;
   }
   if (isWithinInterval(date, { start: startOfDay(subDays(now, 1)), end: now })) {
-    return 'Yesterday';
+    return dateKeys.yesterday;
   }
   if (isWithinInterval(date, { start: subDays(now, 7), end: now })) {
-    return 'Previous 7 days';
+    return dateKeys.previous7Days;
   }
   if (isWithinInterval(date, { start: subDays(now, 30), end: now })) {
-    return 'Previous 30 days';
+    return dateKeys.previous30Days;
   }
   if (isWithinInterval(date, { start: startOfYear(now), end: now })) {
-    return ' ' + format(date, 'MMMM');
+    const month = format(date, 'MMMM').toLowerCase();
+    return dateKeys[month];
   }
   return ' ' + getYear(date).toString();
 };
@@ -62,7 +82,12 @@ export const groupConversationsByDate = (conversations: TConversation[]): Groupe
   }, {});
 
   const sortedGroups = {};
-  const dateGroups = ['Today', 'Last 7 days', 'Last 30 days'];
+  const dateGroups = [
+    dateKeys.today,
+    dateKeys.yesterday,
+    dateKeys.previous7Days,
+    dateKeys.previous30Days,
+  ];
   dateGroups.forEach((group) => {
     if (groups[group]) {
       sortedGroups[group] = groups[group];