RecentRunner/group-2-threaded-project-petshop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Chat Widget, changes in nav bar

Browse Source 
Auto Scroll chat and changes in Nav bar
This commit is contained in:
Nikitha
2026-04-15 08:12:16 -06:00
parent f57fe9e233
commit 2fa7b99966
6 changed files with 106 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
web/components/FloatingChat.js
View File

@@ -21,10 +21,20 @@ export default function FloatingChat() {
const [input, setInput] = useState("");
const messagesEndRef = useRef(null);
const prevAiLengthRef = useRef(0);
const prevLiveLengthRef = useRef(0);
useEffect(() => {
if (isOpen) messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
}, [aiMessages, liveMessages, isOpen]);
if (!isOpen) return;
const aiGrew = aiMessages.length > prevAiLengthRef.current;
const liveGrew = liveMessages.length > prevLiveLengthRef.current;
prevAiLengthRef.current = aiMessages.length;
prevLiveLengthRef.current = liveMessages.length;
if (aiGrew || liveGrew) {
messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
}
}, [aiMessages, liveMessages, isOpen]);
useEffect(() => {
if (view === "history" && token && isOpen) loadConversations(token);
@@ -137,7 +147,7 @@ export default function FloatingChat() {
</div>
)}
{conversations.filter(c => c.status === "OPEN" && c.staffId).map((conv) => (
<button key={conv.Id} style={s.convItem} onClick={() => openLiveConversation(conv.id, token)}>
<button key={conv.id} style={s.convItem} onClick={() => openLiveConversation(conv.id, token)}>
<div style={s.convTop}>
<span style={s.convSubject}>{conv.subject || `Conversation #${conv.id}`}</span>
<span style={{ ...s.statusBadge, ...s.statusOpen }}>Active</span>