added the notification when the clipboard is updated

app/styles/base.css

@@ -902,6 +902,30 @@ html {
 #noVNC_bell {
     display: none;
 }
+/* ----------------------------------------
+ *
+ * Styles for Showing the Clipboard updated
+*/
+.notification {
+  position: fixed;
+  top: 20px;
+  right: 20px;
+  background-color: grey;
+  color: white;
+  padding: 10px 20px;
+  border-radius: 8px;
+  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
+  font-family: sans-serif;
+  font-size: 16px;
+  opacity: 1;
+  transition: opacity 0.5s ease;
+  z-index: 9999;
+}
+
+.fade-out {
+  opacity: 0;
+}
+
 
 /* ----------------------------------------
  * Media sizing

app/ui.js

@@ -993,10 +993,25 @@ const UI = {
             UI.openClipboardPanel();
         }
     },
+    showCopiedNotification() {
+        // This is responsible for showing the notification when text is updated in the clipboard.
+        const notificationBox = document.createElement("div");
+        notificationBox.className = "notification";
+        notificationBox.innerText = "Clipboard updated";
+        document.body.appendChild(notificationBox);
+
+        setTimeout(() => {
+            notificationBox.classList.add("fade-out");
+            setTimeout(() => {
+                notificationBox.remove();
+            }, 500); // Wait for fade-out transition
+        }, 3000); // Display for 3 seconds
+    },
 
     clipboardReceive(e) {
         Log.Debug(">> UI.clipboardReceive: " + e.detail.text.substr(0, 40) + "...");
         document.getElementById('noVNC_clipboard_text').value = e.detail.text;
+        UI.showCopiedNotification();
         Log.Debug("<< UI.clipboardReceive");
     },