Andreas/LibreChat
1
0
Fork 0
mirror of https://github.com/danny-avila/LibreChat.git synced 2025-12-19 09:50:15 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 4

🔧 style: Improve UI and UX with Style Fixes and Code Refactors (#2002)

Browse source 
* refactor(useSSE): add useCallback to all event handlers

* chore: remove modelName in defaultAssistantFormValues

* fix(SidePanel): fix layout shift on chrome my removing sidenav scrollbar

* style(ChatForm): match ChatGPT textarea effect styling

* style: fix flickering of old background color on refresh
This commit is contained in:
Danny Avila 2024-03-06 17:49:53 -05:00 • committed by GitHub
parent b2ab6fd19d
commit ab66747e97
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
7 changed files with 412 additions and 375 deletions
Download patch file Download diff file Expand all files Collapse all files

79
client/src/hooks/SSE/useContentHandler.ts
View file

@ -6,6 +6,7 @@ import type {
ContentPart,
TMessageContentParts,
} from 'librechat-data-provider';
import { useCallback, useMemo } from 'react';
type TUseContentHandler = {
setMessages: (messages: TMessage[]) => void;
@ -18,49 +19,53 @@ type TContentHandler = {
};
export default function useContentHandler({ setMessages, getMessages }: TUseContentHandler) {
const messageMap = new Map<string, TMessage>();
return ({ data, submission }: TContentHandler) => {
const { type, messageId, thread_id, conversationId, index, stream } = data;
const messageMap = useMemo(() => new Map<string, TMessage>(), []);
return useCallback(
({ data, submission }: TContentHandler) => {
const { type, messageId, thread_id, conversationId, index, stream } = data;
const _messages = getMessages();
const messages =
_messages?.filter((m) => m.messageId !== messageId)?.map((msg) => ({ ...msg, thread_id })) ??
[];
const userMessage = messages[messages.length - 1];
const _messages = getMessages();
const messages =
_messages
?.filter((m) => m.messageId !== messageId)
?.map((msg) => ({ ...msg, thread_id })) ?? [];
const userMessage = messages[messages.length - 1];
const { initialResponse } = submission;
const { initialResponse } = submission;
let response = messageMap.get(messageId);
if (!response) {
response = {
...initialResponse,
parentMessageId: userMessage?.messageId,
conversationId,
messageId,
thread_id,
};
messageMap.set(messageId, response);
}
let response = messageMap.get(messageId);
if (!response) {
response = {
...initialResponse,
parentMessageId: userMessage?.messageId,
conversationId,
messageId,
thread_id,
};
messageMap.set(messageId, response);
}
// TODO: handle streaming for non-text
const part: ContentPart =
stream && data[ContentTypes.TEXT] ? { value: data[ContentTypes.TEXT] } : data[type];
// TODO: handle streaming for non-text
const part: ContentPart =
stream && data[ContentTypes.TEXT] ? { value: data[ContentTypes.TEXT] } : data[type];
/* spreading the content array to avoid mutation */
response.content = [...(response.content ?? [])];
/* spreading the content array to avoid mutation */
response.content = [...(response.content ?? [])];
response.content[index] = { type, [type]: part } as TMessageContentParts;
response.content[index] = { type, [type]: part } as TMessageContentParts;
if (
type !== ContentTypes.TEXT &&
initialResponse.content &&
((response.content[response.content.length - 1].type === ContentTypes.TOOL_CALL &&
response.content[response.content.length - 1][ContentTypes.TOOL_CALL].progress === 1) ||
response.content[response.content.length - 1].type === ContentTypes.IMAGE_FILE)
) {
response.content.push(initialResponse.content[0]);
}
if (
type !== ContentTypes.TEXT &&
initialResponse.content &&
((response.content[response.content.length - 1].type === ContentTypes.TOOL_CALL &&
response.content[response.content.length - 1][ContentTypes.TOOL_CALL].progress === 1) ||
response.content[response.content.length - 1].type === ContentTypes.IMAGE_FILE)
) {
response.content.push(initialResponse.content[0]);
}
setMessages([...messages, response]);
};
setMessages([...messages, response]);
},
[getMessages, messageMap, setMessages],
);
}