2023-06-04 04:28:07 +02:00
|
|
|
import HistoricalMessage from "./HistoricalMessage";
|
|
|
|
import PromptReply from "./PromptReply";
|
2023-08-22 00:46:31 +02:00
|
|
|
import { useEffect, useRef } from "react";
|
2023-10-23 22:10:34 +02:00
|
|
|
import { useManageWorkspaceModal } from "../../../Modals/MangeWorkspace";
|
|
|
|
import ManageWorkspace from "../../../Modals/MangeWorkspace";
|
2023-06-04 04:28:07 +02:00
|
|
|
|
|
|
|
export default function ChatHistory({ history = [], workspace }) {
|
2023-08-22 00:46:31 +02:00
|
|
|
const replyRef = useRef(null);
|
2023-10-23 22:10:34 +02:00
|
|
|
const { showing, showModal, hideModal } = useManageWorkspaceModal();
|
2023-08-22 00:46:31 +02:00
|
|
|
|
|
|
|
useEffect(() => {
|
|
|
|
if (replyRef.current) {
|
|
|
|
setTimeout(() => {
|
|
|
|
replyRef.current.scrollIntoView({ behavior: "smooth", block: "end" });
|
|
|
|
}, 700);
|
|
|
|
}
|
|
|
|
}, [history]);
|
|
|
|
|
2023-06-04 04:28:07 +02:00
|
|
|
if (history.length === 0) {
|
|
|
|
return (
|
2023-10-23 22:10:34 +02:00
|
|
|
<div className="flex flex-col h-full md:mt-0 pb-48 w-full justify-end items-center">
|
|
|
|
<div className="flex flex-col items-start">
|
|
|
|
<p className="text-white/60 text-lg font-base -ml-6 py-4">
|
|
|
|
Welcome to your new workspace.
|
|
|
|
</p>
|
|
|
|
<div className="w-full text-center">
|
|
|
|
<p className="text-white/60 text-lg font-base inline-flex items-center gap-x-2">
|
|
|
|
To get started either{" "}
|
|
|
|
<span
|
|
|
|
className="underline font-medium cursor-pointer"
|
|
|
|
onClick={showModal}
|
|
|
|
>
|
|
|
|
upload a document
|
|
|
|
</span>
|
|
|
|
or <b className="font-medium italic">send a chat.</b>
|
|
|
|
</p>
|
|
|
|
</div>
|
2023-06-04 04:28:07 +02:00
|
|
|
</div>
|
2023-10-23 22:10:34 +02:00
|
|
|
{showing && (
|
|
|
|
<ManageWorkspace
|
|
|
|
hideModal={hideModal}
|
|
|
|
providedSlug={workspace.slug}
|
|
|
|
/>
|
|
|
|
)}
|
2023-06-04 04:28:07 +02:00
|
|
|
</div>
|
|
|
|
);
|
|
|
|
}
|
|
|
|
|
|
|
|
return (
|
|
|
|
<div
|
2023-10-23 22:10:34 +02:00
|
|
|
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"
|
2023-06-04 04:28:07 +02:00
|
|
|
id="chat-history"
|
|
|
|
>
|
2023-08-22 00:46:31 +02:00
|
|
|
{history.map((props, index) => {
|
|
|
|
const isLastMessage = index === history.length - 1;
|
|
|
|
|
|
|
|
if (props.role === "assistant" && props.animate) {
|
2023-06-04 04:28:07 +02:00
|
|
|
return (
|
2023-08-22 00:46:31 +02:00
|
|
|
<PromptReply
|
|
|
|
key={props.uuid}
|
|
|
|
ref={isLastMessage ? replyRef : null}
|
|
|
|
uuid={props.uuid}
|
|
|
|
reply={props.content}
|
|
|
|
pending={props.pending}
|
|
|
|
sources={props.sources}
|
|
|
|
error={props.error}
|
2023-06-04 04:28:07 +02:00
|
|
|
workspace={workspace}
|
2023-08-22 00:46:31 +02:00
|
|
|
closed={props.closed}
|
2023-06-04 04:28:07 +02:00
|
|
|
/>
|
|
|
|
);
|
|
|
|
}
|
2023-08-22 00:46:31 +02:00
|
|
|
|
|
|
|
return (
|
|
|
|
<HistoricalMessage
|
|
|
|
key={index}
|
|
|
|
ref={isLastMessage ? replyRef : null}
|
|
|
|
message={props.content}
|
|
|
|
role={props.role}
|
|
|
|
workspace={workspace}
|
|
|
|
sources={props.sources}
|
|
|
|
error={props.error}
|
|
|
|
/>
|
|
|
|
);
|
|
|
|
})}
|
2023-10-23 22:10:34 +02:00
|
|
|
|
|
|
|
{showing && (
|
|
|
|
<ManageWorkspace hideModal={hideModal} providedSlug={workspace.slug} />
|
|
|
|
)}
|
2023-06-04 04:28:07 +02:00
|
|
|
</div>
|
|
|
|
);
|
|
|
|
}
|