Update chatbot

app/templates/base.html

@@ -628,13 +628,18 @@ async function sendChat(){
     typing.remove();
     const reply = d.reply || 'Sorry, I encountered an error.';
     appendBubble(reply,'bot');
-    chatHistory.push({role:'assistant',content:reply});
     if(d.ticket){
+      // Clear history after ticket creation — keeping the prior conversation
+      // (which contains the AI's JSON action block) causes the model to
+      // re-trigger ticket creation on every subsequent message.
+      chatHistory = [];
       const notif=document.createElement('div');
       notif.className='chat-bubble bot';
       notif.style.cssText='background:rgba(45,212,191,.1);border:1px solid rgba(45,212,191,.3);';
       notif.innerHTML=`🎫 <strong>${d.ticket.ticket_number}</strong> — <a href="${d.ticket.url}">View Ticket</a>`;
       document.getElementById('chat-messages').appendChild(notif);
+    } else {
+      chatHistory.push({role:'assistant',content:reply});
     }
   }catch(e){typing.remove();appendBubble('Sorry, something went wrong.','bot');}
   scrollChat();

app/templates/tickets/notifications.html

@@ -19,11 +19,14 @@
         {% if notifs.items %}
           {% for n in notifs.items %}
           <a href="{{ n.link or '#' }}"
+             data-notif-id="{{ n.id }}"
+             data-is-read="{{ 'true' if n.is_read else 'false' }}"
+             class="notif-list-item"
              style="display:flex;gap:14px;padding:16px 20px;border-bottom:1px solid var(--border);color:var(--text);
                     {% if not n.is_read %}border-left:3px solid var(--accent3);background:rgba(0,180,216,.03);{% endif %}">
             <div style="margin-top:2px;flex-shrink:0;">
               {% if not n.is_read %}
-                <div style="width:8px;height:8px;border-radius:50%;background:var(--accent3);margin-top:3px;"></div>
+                <div class="notif-unread-dot" style="width:8px;height:8px;border-radius:50%;background:var(--accent3);margin-top:3px;"></div>
               {% else %}
                 <i class="bi bi-check2" style="color:var(--muted);font-size:14px;"></i>
               {% endif %}
@@ -78,4 +81,45 @@
     </div>
   </div>
 </div>
-{% endblock %}
+
+<script>
+(function(){
+  // On page load, fetch the live unread count and sync the bell badge.
+  // The server-rendered {{ unread_notifications }} is only accurate at render
+  // time — if the user has been clicking around, it can be stale.
+  fetch('/api/notifications/unread-count')
+    .then(r => r.json())
+    .then(d => { if(typeof updateBadge === 'function') updateBadge(d.count); })
+    .catch(() => {});
+
+  // Intercept every notification link click:
+  // 1. If the notification is unread, call the mark-read API.
+  // 2. Decrement the bell badge immediately (optimistic update).
+  // 3. Navigate to the destination.
+  document.querySelectorAll('a.notif-list-item').forEach(function(link){
+    link.addEventListener('click', async function(e){
+      const id     = this.dataset.notifId;
+      const isRead = this.dataset.isRead === 'true';
+      const dest   = this.getAttribute('href');
+
+      if(!isRead && id){
+        e.preventDefault();
+        try {
+          await csrfPost('/api/notifications/' + id + '/read');
+        } catch(_){}
+        // Update badge — decrement by 1
+        if(typeof updateBadge === 'function') updateBadge(-1, true);
+        // Mark the row as visually read
+        this.dataset.isRead = 'true';
+        this.style.borderLeft = '';
+        this.style.background = '';
+        const dot = this.querySelector('.notif-unread-dot');
+        if(dot) dot.remove();
+      }
+
+      if(dest && dest !== '#') window.location.href = dest;
+    });
+  });
+})();
+</script>
+{% endblock %}