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

chat scroll trial 2 / css tweaks

Browse source
This commit is contained in:
YasinOnm08 2024-10-01 11:37:53 +02:00
parent 853967f8e7
commit b12eb25d78
4 changed files with 19 additions and 18 deletions
Download patch file Download diff file Expand all files Collapse all files

14
app/components/ConversationFrontend.tsx
View file

@ -16,14 +16,11 @@ interface ConversationProps {
const ConversationFrontend = React.forwardRef<HTMLDivElement, ConversationProps>(
({ messages, onResendClick, onEditClick, onCopyClick, isClicked }, ref: ForwardedRef<HTMLDivElement>) => {
useEffect(() => {
if (ref && typeof ref !== 'function') {
const element = ref as React.RefObject<HTMLDivElement>;
if (element.current) {
element.current.scrollTop = element.current.scrollHeight;
}
}
}, [messages, ref]);
const messagesEndRef = useRef<HTMLDivElement|null>(null)
useEffect(() => {
messagesEndRef.current?.scrollIntoView()
},[messages])
return (
<div className="output" ref={ref}>
@ -55,6 +52,7 @@ const ConversationFrontend = React.forwardRef<HTMLDivElement, ConversationProps>
<p id="copiedText" style={{opacity:isClicked?"1":"0", transition:"all 0.3s ease-in-out"}}>Copied!</p>
</div>
</div>
<div ref={messagesEndRef} />
</div>
);
}