React-Group/interstellar_ai
1
1
Fork 2
Code Issues 8 Pull requests Projects Releases Packages Wiki Activity Actions

copy feedback

Browse source
This commit is contained in:
YasinOnm08 2024-09-26 13:42:22 +02:00
parent 1752a5745f
commit 990d2b05a6
2 changed files with 26 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

13
app/components/ConversationFrontend.tsx
View file

@ -10,10 +10,11 @@ interface ConversationProps {
onResendClick: () => void;
onEditClick: () => void;
onCopyClick: () => void;
isClicked:boolean
}
const ConversationFrontend = React.forwardRef<HTMLDivElement, ConversationProps>(
({ messages, onResendClick, onEditClick, onCopyClick }, ref: ForwardedRef<HTMLDivElement>) => {
({ messages, onResendClick, onEditClick, onCopyClick, isClicked}, ref: ForwardedRef<HTMLDivElement>) => {
const endOfMessagesRef = useRef<HTMLDivElement>(null);
// Auto-scroll to the bottom of the conversation whenever a new message is added
@ -23,6 +24,11 @@ const ConversationFrontend = React.forwardRef<HTMLDivElement, ConversationProps>
}
}, [messages]); // Triggers the effect whenever the 'messages' array changes
useEffect(() => {
console.log(isClicked);
},[isClicked])
return (
<div className="output">
<div className="conversation resize" id="conversation" ref={ref}>
@ -33,8 +39,8 @@ const ConversationFrontend = React.forwardRef<HTMLDivElement, ConversationProps>
}
return (
<div
key={index}
className={isUserMessage ? 'user-message' : 'ai-message'}
key={index}
className={isUserMessage ? 'user-message' : 'ai-message'}
>
<p> {message.content}</p>
</div>
@ -52,6 +58,7 @@ const ConversationFrontend = React.forwardRef<HTMLDivElement, ConversationProps>
<button type="button" onClick={onCopyClick}>
<img src="/img/copy.svg" alt="copy" />
</button>
<p style={{opacity:isClicked?"1":"0", transition:"all 0.3s ease-in-out"}}>Copied!</p>
</div>
</div>
</div>