From 9f7b0c837a5dc657085dd42dc7e1332e04e56121 Mon Sep 17 00:00:00 2001
From: Timothy Carambat <rambat1010@gmail.com>
Date: Wed, 25 Oct 2023 15:23:55 -0700
Subject: [PATCH] Fix prompt overlaying on chats (#288)
resolves #287
---
frontend/src/components/DefaultChat/index.jsx | 32 +++++++++----------
.../ChatHistory/HistoricalMessage/index.jsx | 7 +++-
.../ChatContainer/ChatHistory/index.jsx | 2 +-
3 files changed, 23 insertions(+), 18 deletions(-)
diff --git a/frontend/src/components/DefaultChat/index.jsx b/frontend/src/components/DefaultChat/index.jsx
index 36a27c18b..bfd0fbdc6 100644
--- a/frontend/src/components/DefaultChat/index.jsx
+++ b/frontend/src/components/DefaultChat/index.jsx
@@ -334,23 +334,23 @@ export default function DefaultChatContainer() {
{isMobile && <SidebarMobileHeader />}
{fetchedMessages.length === 0
? mockMsgs.map((content, i) => {
- return <React.Fragment key={i}>{content}</React.Fragment>;
- })
+ return <React.Fragment key={i}>{content}</React.Fragment>;
+ })
: fetchedMessages.map((fetchedMessage, i) => {
- return (
- <React.Fragment key={i}>
- <ChatBubble
- message={
- fetchedMessage.user === ""
- ? fetchedMessage.response
- : fetchedMessage.user
- }
- type={fetchedMessage.user === "" ? "response" : "user"}
- popMsg={popMsg}
- />
- </React.Fragment>
- );
- })}
+ return (
+ <React.Fragment key={i}>
+ <ChatBubble
+ message={
+ fetchedMessage.user === ""
+ ? fetchedMessage.response
+ : fetchedMessage.user
+ }
+ type={fetchedMessage.user === "" ? "response" : "user"}
+ popMsg={popMsg}
+ />
+ </React.Fragment>
+ );
+ })}
{showingNewWsModal && <NewWorkspaceModal hideModal={hideNewWsModal} />}
</div>
);
diff --git a/frontend/src/components/WorkspaceChat/ChatContainer/ChatHistory/HistoricalMessage/index.jsx b/frontend/src/components/WorkspaceChat/ChatContainer/ChatHistory/HistoricalMessage/index.jsx
index 8759a2ce7..02e31e399 100644
--- a/frontend/src/components/WorkspaceChat/ChatContainer/ChatHistory/HistoricalMessage/index.jsx
+++ b/frontend/src/components/WorkspaceChat/ChatContainer/ChatHistory/HistoricalMessage/index.jsx
@@ -8,11 +8,16 @@ import {
AI_BACKGROUND_COLOR,
USER_BACKGROUND_COLOR,
} from "../../../../../utils/constants";
+import { v4 } from "uuid";
const HistoricalMessage = forwardRef(
- ({ message, role, workspace, sources = [], error = false }, ref) => {
+ (
+ { uuid = v4(), message, role, workspace, sources = [], error = false },
+ ref
+ ) => {
return (
<div
+ key={uuid}
ref={ref}
className={`flex justify-center items-end w-full ${
role === "user" ? USER_BACKGROUND_COLOR : AI_BACKGROUND_COLOR
diff --git a/frontend/src/components/WorkspaceChat/ChatContainer/ChatHistory/index.jsx b/frontend/src/components/WorkspaceChat/ChatContainer/ChatHistory/index.jsx
index e420fb313..e684d237a 100644
--- a/frontend/src/components/WorkspaceChat/ChatContainer/ChatHistory/index.jsx
+++ b/frontend/src/components/WorkspaceChat/ChatContainer/ChatHistory/index.jsx
@@ -48,7 +48,7 @@ export default function ChatHistory({ history = [], workspace }) {
return (
<div
- className="h-[89%] pb-[100px] pt-6 md:pt-0 md:pb-20 md:mx-0 overflow-y-scroll flex flex-col justify-start no-scroll"
+ className="h-full md:h-[83%] pb-[100px] pt-6 md:pt-0 md:pb-20 md:mx-0 overflow-y-scroll flex flex-col justify-start no-scroll"
id="chat-history"
>
{history.map((props, index) => {
--
GitLab