Add visitor read receipts

public/widget.js

@@ -76,6 +76,7 @@
       if (panel.classList.contains("open")) {
         launcher.classList.remove("mf-notify");
         scrollMessagesToBottom(messages);
+        markConversationSeen();
       }
     });
     close.addEventListener("click", () => panel.classList.remove("open"));
@@ -175,7 +176,7 @@
       }
     });
     if (session.conversationId) {
-      loadExistingConversation(messages).finally(() => connectEvents(messages, typing, panel, launcher, settings));
+      loadExistingConversation(messages, panel).finally(() => connectEvents(messages, typing, panel, launcher, settings));
     }
   }
 
@@ -199,6 +200,7 @@
       }
       if (data.type === "message:new") {
         renderConversation(messages, data.payload);
+        if (panel.classList.contains("open")) markConversationSeen();
         const eventMessages = data.payload?.messages || [];
         const lastMessage = eventMessages[eventMessages.length - 1];
         if (settings.notifications?.pulseOnAdminReply !== false && lastMessage?.senderType === "admin" && !panel.classList.contains("open")) {
@@ -267,10 +269,11 @@
     setTimeout(() => audio.close().catch(() => {}), 420);
   }
 
-  async function loadExistingConversation(messages) {
+  async function loadExistingConversation(messages, panel) {
     try {
       const data = await fetchJson(`${apiBase}/api/widget/conversations/${session.conversationId}?visitorToken=${encodeURIComponent(session.visitorToken)}`);
       renderConversation(messages, data);
+      if (panel.classList.contains("open")) markConversationSeen();
     } catch {
       session.conversationId = null;
       saveSession();
@@ -288,6 +291,14 @@
     scrollMessagesToBottom(messages);
   }
 
+  function markConversationSeen() {
+    if (!session.conversationId) return;
+    clearTimeout(markConversationSeen.timer);
+    markConversationSeen.timer = setTimeout(() => {
+      postJson(`${apiBase}/api/widget/conversations/${session.conversationId}/seen`, { visitorToken: session.visitorToken }).catch(() => {});
+    }, 250);
+  }
+
   function addMessage(messages, sender, senderName, body, attachments, lastAdminName) {
     if (sender === "admin" && (senderName || "Operator") !== lastAdminName) {
       const label = document.createElement("div");