YasinOnm08/interstellar_ai
0
0
Fork 0
forked from React-Group/interstellar_ai
Code Pull requests Activity

Compare commits

base: YasinOnm08:e6ce45b9c40c66fef8bb9f5571960c55e0b02810
Branches Tags
YasinOnm08:main
React-Group:main
..
compare: YasinOnm08:aba98174900412ba7548abab147ef7713b60acc5
Branches Tags
YasinOnm08:main
React-Group:main

No commits in common. "e6ce45b9c40c66fef8bb9f5571960c55e0b02810" and "aba98174900412ba7548abab147ef7713b60acc5" have entirely different histories.
e6ce45b9c4 ... aba9817490

1 changed files with 7 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

14
app/components/ConversationFrontend.tsx
View file

@ -16,23 +16,23 @@ interface ConversationProps {
const ConversationFrontend = React.forwardRef<HTMLDivElement, ConversationProps>( const ConversationFrontend = React.forwardRef<HTMLDivElement, ConversationProps>(
({ messages, onResendClick, onEditClick, onCopyClick, isClicked }, ref: ForwardedRef<HTMLDivElement>) => { ({ messages, onResendClick, onEditClick, onCopyClick, isClicked }, ref: ForwardedRef<HTMLDivElement>) => {
const messagesEndRef = useRef<HTMLDivElement | null>(null) const messagesEndRef = useRef<HTMLDivElement|null>(null)
useEffect(() => { useEffect(() => {
messagesEndRef.current?.scrollIntoView() messagesEndRef.current?.scrollIntoView()
}, [messages]) },[messages])
return ( return (
<div className="output" ref={ref}> <div className="output" ref={ref}>
<div className="conversation resize" id="conversation"> <div className="conversation resize" id="conversation">
{messages.map((message, index) => { {messages.map((message, index) => {
if (index >= 1) { if (index >= 1){
return ( return (
<div <div
key={index} key={index}
className={message.role === "user" ? 'user-message' : 'ai-message'} className={message.role === "user" ? 'user-message' : 'ai-message'}
> >
<p> {message.content}</p> <p> {message.content}</p>
</div> </div>
); );
@ -49,10 +49,10 @@ const ConversationFrontend = React.forwardRef<HTMLDivElement, ConversationProps>
<button type="button" onClick={onCopyClick}> <button type="button" onClick={onCopyClick}>
<img src="/img/copy.svg" alt="copy" /> <img src="/img/copy.svg" alt="copy" />
</button> </button>
<p id="copiedText" style={{ opacity: isClicked ? "1" : "0", transition: "all 0.3s ease-in-out" }}>Copied!</p> <p id="copiedText" style={{opacity:isClicked?"1":"0", transition:"all 0.3s ease-in-out"}}>Copied!</p>
</div> </div>
<div ref={messagesEndRef} />
</div> </div>
<div ref={messagesEndRef} />
</div> </div>
); );
} }