From db6b63d87c04fbed4b13b1f6f35fa2163258c23d Mon Sep 17 00:00:00 2001
From: Jicheng Lu <103353@smsassist.com>
Date: Mon, 7 Oct 2024 16:49:05 -0500
Subject: [PATCH 1/2] clear timeout

---
 .../chat/[agentId]/[conversationId]/chat-box.svelte    | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/routes/chat/[agentId]/[conversationId]/chat-box.svelte b/src/routes/chat/[agentId]/[conversationId]/chat-box.svelte
index 6fc77820..236fed40 100644
--- a/src/routes/chat/[agentId]/[conversationId]/chat-box.svelte
+++ b/src/routes/chat/[agentId]/[conversationId]/chat-box.svelte
@@ -139,6 +139,9 @@
 	/** @type {import('$userTypes').UserModel} */
     let conversationUser;
 
+	/** @type {number} */
+	let notificationTimeout;
+
 	/** @type {boolean} */
 	let isLoadPersistLog = false;
 	let isLoadInstantLog = false;
@@ -441,7 +444,12 @@
 	function onNotificationGenerated(message) {
 		notificationText = message?.rich_content?.message?.text || message.text || '';
 		isDisplayNotification = true;
-		setTimeout(() => {
+
+		if (notificationTimeout) {
+			clearTimeout(notificationTimeout);
+		}
+
+		notificationTimeout = setTimeout(() => {
 			isDisplayNotification = false;
 			notificationText = '';
 		}, notificationText?.length > 200 ? 8000 : 3000);

From ddcbcef9d0602552868b9007511c020c090a12b0 Mon Sep 17 00:00:00 2001
From: Jicheng Lu <103353@smsassist.com>
Date: Mon, 7 Oct 2024 16:52:37 -0500
Subject: [PATCH 2/2] clear timeout

---
 src/lib/common/LiveChatEntry.svelte                    | 10 ++++++++++
 .../chat/[agentId]/[conversationId]/chat-box.svelte    |  7 +++----
 2 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/src/lib/common/LiveChatEntry.svelte b/src/lib/common/LiveChatEntry.svelte
index 1c4ddf13..ae93efba 100644
--- a/src/lib/common/LiveChatEntry.svelte
+++ b/src/lib/common/LiveChatEntry.svelte
@@ -11,6 +11,8 @@
     let showChatBox = false;
     let showBubbleMsg = false;
     let receivedMsg = '';
+    /** @type {number | undefined} */
+    let timeout;
 
     onMount(async () => {
         const agentSettings = await getSettingDetail("Agent");
@@ -24,9 +26,17 @@
         } else if (e.data.action == ChatAction.Open) {
             // showChatBox = true;
         } else if (e.data.action == ChatAction.ReceiveNotification && !showChatBox) {
+            if (timeout) {
+                clearTimeout(timeout);
+            }
+
             receivedMsg = e.data?.data?.rich_content?.message?.text || e.data?.data?.text || '';
             showBubbleMsg = true;
             wave();
+            timeout = setTimeout(() => {
+                showBubbleMsg = false;
+                receivedMsg = '';
+            }, receivedMsg?.length > 200 ? 8000 : 3000);
         }
     };
 
diff --git a/src/routes/chat/[agentId]/[conversationId]/chat-box.svelte b/src/routes/chat/[agentId]/[conversationId]/chat-box.svelte
index 236fed40..f7696fc5 100644
--- a/src/routes/chat/[agentId]/[conversationId]/chat-box.svelte
+++ b/src/routes/chat/[agentId]/[conversationId]/chat-box.svelte
@@ -139,7 +139,7 @@
 	/** @type {import('$userTypes').UserModel} */
     let conversationUser;
 
-	/** @type {number} */
+	/** @type {number | undefined} */
 	let notificationTimeout;
 
 	/** @type {boolean} */
@@ -442,13 +442,12 @@
 
 	/** @param {import('$conversationTypes').ChatResponseModel} message */
 	function onNotificationGenerated(message) {
-		notificationText = message?.rich_content?.message?.text || message.text || '';
-		isDisplayNotification = true;
-
 		if (notificationTimeout) {
 			clearTimeout(notificationTimeout);
 		}
 
+		notificationText = message?.rich_content?.message?.text || message.text || '';
+		isDisplayNotification = true;
 		notificationTimeout = setTimeout(() => {
 			isDisplayNotification = false;
 			notificationText = '';