Andreas/LibreChat
1
0
Fork 0
mirror of https://github.com/danny-avila/LibreChat.git synced 2026-01-22 02:06:12 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 3

adds dark mode and logs errors in message response

Browse source
This commit is contained in:
Danny Avila 2023-02-08 09:15:47 -05:00
parent 58498ed951
commit b5042a738e
13 changed files with 13873 additions and 536 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/components/main/Message.jsx
View file

@ -5,12 +5,12 @@ export default function Message({ sender, text, last = false, error = false }) {
const { isSubmitting } = useSelector((state) => state.submit);
const props = {
className:
'group w-full border-b border-black/10 text-gray-800 dark:border-gray-900/50 dark:bg-gray-800 dark:text-gray-100'
'w-full border-b border-black/10 dark:border-gray-900/50 text-gray-800 dark:text-gray-100 group dark:bg-gray-800'
};
if (sender === 'GPT') {
props.className =
'group w-full border-b border-black/10 bg-gray-100 text-gray-800 dark:border-gray-900/50 dark:bg-[#444654] dark:text-gray-100';
'w-full border-b border-black/10 dark:border-gray-900/50 text-gray-800 dark:text-gray-100 group bg-gray-50 dark:bg-[#444654]';
}
return (

32
src/components/main/Messages.jsx
View file

@ -3,10 +3,9 @@ import Message from './Message';
import Landing from './Landing';
export default function Messages({ messages }) {
if (messages.length === 0) {
return <Landing />
};
return <Landing />;
}
const messagesEndRef = useRef(null);
@ -25,17 +24,22 @@ export default function Messages({ messages }) {
// </div>
// <div className="flex h-full text-sm dark:bg-gray-800"></div>;
return (
<div className="flex-1 overflow-y-auto ">
{messages.map((message, i) => (
<Message
key={i}
sender={message.sender}
text={message.text}
last={i === messages.length - 1}
error={!!message.error ? true : false}
/>
))}
<div ref={messagesEndRef} />
// <div className="flex-1 overflow-y-auto ">
<div className="flex-1 overflow-hidden">
<div className="h-full dark:bg-gray-800">
<div className="flex h-full flex-col items-center text-sm dark:bg-gray-800">
{messages.map((message, i) => (
<Message
key={i}
sender={message.sender}
text={message.text}
last={i === messages.length - 1}
error={!!message.error ? true : false}
/>
))}
<div ref={messagesEndRef} />
</div>
</div>
</div>
);
}

8
src/components/main/TextChat.jsx
View file

@ -36,11 +36,11 @@ export default function TextChat({ messages, reloadConvos }) {
dispatch(setSubmitState(false));
};
const errorHandler = (data) => {
console.log('Error:', data);
const errorHandler = (event) => {
console.log('Error:', event);
const errorResponse = {
...initialResponse,
text: 'An error occurred. Please try again in a few moments.',
text: `An error occurred. Please try again in a few moments.\n\nError message: ${event.data}`,
error: true
};
dispatch(setSubmitState(false));
@ -80,7 +80,7 @@ export default function TextChat({ messages, reloadConvos }) {
};
return (
<div className="md:bg-vert-light-gradient dark:md:bg-vert-dark-gradient w-full border-t bg-white dark:border-white/20 dark:bg-gray-800 md:border-t-0 md:border-transparent md:!bg-transparent md:dark:border-transparent">
<div className="md:bg-vert-light-gradient dark:md:bg-vert-dark-gradient absolute bottom-0 left-0 w-full border-t bg-white dark:border-white/20 dark:bg-gray-800 md:border-t-0 md:border-transparent md:!bg-transparent md:dark:border-transparent">
<form className="stretch mx-2 flex flex-row gap-3 pt-2 last:mb-2 md:last:mb-6 lg:mx-auto lg:max-w-3xl lg:pt-6">
<div className="relative flex h-full flex-1 md:flex-col">
<div className="ml-1 mt-1.5 flex justify-center gap-0 md:m-auto md:mb-2 md:w-full md:gap-2" />