♾️ style: Infinite Scroll Nav and Sort Convos by Date/Usage (#1708)

* Style: Infinite Scroll and Group convos by date

* Style: Infinite Scroll and Group convos by date- Redesign NavBar

* Style: Infinite Scroll and Group convos by date- Redesign NavBar - Clean code

* Style: Infinite Scroll and Group convos by date- Redesign NavBar - Redesign NewChat Component

* Style: Infinite Scroll and Group convos by date- Redesign NavBar - Redesign NewChat Component

* Style: Infinite Scroll and Group convos by date- Redesign NavBar - Redesign NewChat Component

* Including OpenRouter and Mistral icon

* refactor(Conversations): cleanup use of utility functions and typing

* refactor(Nav/NewChat): use localStorage `lastConversationSetup` to determine the endpoint to use, as well as icons -> JSX components, remove use of `endpointSelected`

* refactor: remove use of `isFirstToday`

* refactor(Nav): remove use of `endpointSelected`, consolidate scrolling logic to its own hook `useNavScrolling`, remove use of recoil `conversation`

* refactor: Add spinner to bottom of list, throttle fetching, move query hooks to client workspace

* chore: sort by `updatedAt` field

* refactor: optimize conversation infinite query, use optimistic updates, add conversation helpers for managing pagination, remove unnecessary operations

* feat: gen_title route for generating the title for the conversation

* style(Convo): change hover bg-color

* refactor: memoize groupedConversations and return as array of tuples, correctly update convos pre/post message stream, only call genTitle if conversation is new, make `addConversation` dynamically either add/update depending if convo exists in pages already, reorganize type definitions

* style: rename Header NewChat Button -> HeaderNewChat, add NewChatIcon, closely match main Nav New Chat button to ChatGPT

* style(NewChat): add hover bg color

* style: cleanup comments, match ChatGPT nav styling, redesign search bar, make part of new chat sticky header, move Nav under same parent as outlet/mobilenav, remove legacy code, search only if searchQuery is not empty

* feat: add tests for conversation helpers and ensure no duplicate conversations are ever grouped

* style: hover bg-color

* feat: alt-click on convo item to open conversation in new tab

* chore: send error message when `gen_title` fails

---------

Co-authored-by: Walber Cardoso <walbercardoso@gmail.com>
This commit is contained in:
Danny Avila 2024-02-03 20:25:35 -05:00 committed by GitHub
parent 13b2d6e34a
commit 74459d6261
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
48 changed files with 1788 additions and 391 deletions

View file

@ -8,9 +8,7 @@ import type {
TMessage,
TSubmission,
TEndpointOption,
TConversation,
TEndpointsConfig,
TGetConversationsResponse,
} from 'librechat-data-provider';
import type { TAskFunction } from '~/common';
import useSetFilesToDelete from './useSetFilesToDelete';
@ -60,42 +58,6 @@ export default function useChatHelpers(index = 0, paramId: string | undefined) {
[queryParam, queryClient],
);
const addConvo = useCallback(
(convo: TConversation) => {
const convoData = queryClient.getQueryData<TGetConversationsResponse>([
QueryKeys.allConversations,
{ pageNumber: '1', active: true },
]) ?? { conversations: [] as TConversation[], pageNumber: '1', pages: 1, pageSize: 14 };
let { conversations: convos, pageSize = 14 } = convoData;
pageSize = Number(pageSize);
convos = convos.filter((c) => c.conversationId !== convo.conversationId);
convos = convos.length < pageSize ? convos : convos.slice(0, -1);
const conversations = [
{
...convo,
createdAt: new Date().toISOString(),
updatedAt: new Date().toISOString(),
},
...convos,
];
queryClient.setQueryData<TGetConversationsResponse>(
[QueryKeys.allConversations, { pageNumber: '1', active: true }],
{
...convoData,
conversations,
},
);
},
[queryClient],
);
const invalidateConvos = useCallback(() => {
queryClient.invalidateQueries([QueryKeys.allConversations, { active: true }]);
}, [queryClient]);
const getMessages = useCallback(() => {
return queryClient.getQueryData<TMessage[]>([QueryKeys.messages, queryParam]);
}, [queryParam, queryClient]);
@ -341,7 +303,6 @@ export default function useChatHelpers(index = 0, paramId: string | undefined) {
newConversation,
conversation,
setConversation,
addConvo,
// getConvos,
// setConvos,
isSubmitting,
@ -373,7 +334,6 @@ export default function useChatHelpers(index = 0, paramId: string | undefined) {
setShowAgentSettings,
files,
setFiles,
invalidateConvos,
filesLoading,
setFilesLoading,
showStopButton,