Fix overlapping note_detail() calls orphaning editor instances

Clicking a note re-entered note_detail() while a previous call was
still mid-flight, so two overlapping calls both passed the teardown
check before either nulled note_split, both created a fresh
SplitEditor, and whichever resolved last silently overwrote
note_split -- orphaning the loser's instance (websocket, DOM nodes)
with no destroy() ever called. Add a per-call token checked after
every await so a superseded call detects it lost the race and tears
down what it already created. Also defensively remove any stray
collab bar/badge left behind by an orphaned instance on create().

Author: Che4ter

ui/src/pages/case.notes.js

@@ -1,6 +1,7 @@
 /* Defines the kanban board */
 
 let note_split;
+let note_detail_token = 0;
 let session_id = null ;
 let collaborator = null ;
 let collaborator_socket = null ;
@@ -611,10 +612,26 @@ function wait_for_split_editor() {
 }
 
 async function note_detail(id) {
+    // A click on a note re-enters this function while a previous call is
+    // still mid-flight (awaiting collab flush, editor creation, ...). Without
+    // a guard, two overlapping calls both pass the `if (note_split)` teardown
+    // check before either nulls it out, both create a fresh SplitEditor, and
+    // whichever resolves last silently overwrites `note_split` -- orphaning
+    // the loser's instance (its collab websocket, DOM nodes incl. the "Live
+    // view" badge, which is appended outside the pane container that gets
+    // cleared on the next create()) with no destroy() ever called on it.
+    // Bumping this token and checking it after every await lets a superseded
+    // call detect it lost the race and destroy anything it already created
+    // instead of publishing it to the shared `note_split` variable.
+    const token = ++note_detail_token;
 
     get_request_api(`/case/notes/${id}`)
     .done(async (data) => {
         if (data.status === 'success') {
+            if (token !== note_detail_token) {
+                return false;
+            }
+
             let previous_note_id = $('#currentNoteIDLabel').data('note_id');
 
             if (timer) {
@@ -629,11 +646,20 @@ async function note_detail(id) {
                 } else if (note_dirty && previous_note_id) {
                     silent_save_note(previous_note_id, previous_note_markdown);
                 }
+                if (token !== note_detail_token) {
+                    // A newer call already owns teardown/creation; don't
+                    // race destroy() on the same instance from two callers.
+                    return false;
+                }
                 await note_split.destroy();
                 note_split = null;
                 note_dirty = false;
             }
 
+            if (token !== note_detail_token) {
+                return false;
+            }
+
             if (collaborator !== null) {
                 collaborator.close(previous_note_id);
             }
@@ -642,6 +668,9 @@ async function note_detail(id) {
             collaborator = null;
 
             await wait_for_split_editor();
+            if (token !== note_detail_token) {
+                return false;
+            }
 
             $('#currentNoteTitle').text(data.data.note_title);
             previousNoteTitle = data.data.note_title;
@@ -667,18 +696,19 @@ async function note_detail(id) {
                     },
                 },
             };
+            let created_split;
             try {
-                note_split = await window.IrisSplitEditor.create(split_options);
+                created_split = await window.IrisSplitEditor.create(split_options);
             } catch (collab_error) {
                 delete split_options.collab;
-                note_split = await window.IrisSplitEditor.create(split_options);
+                created_split = await window.IrisSplitEditor.create(split_options);
             }
 
-            if (note_id !== target_note) {
-                await note_split.destroy();
-                note_split = null;
+            if (token !== note_detail_token || note_id !== target_note) {
+                await created_split.destroy();
                 return false;
             }
+            note_split = created_split;
 
             note_split.focus();
             if (!is_note_collab_active()) {

ui/src/pages/milkdown_split.js

@@ -359,6 +359,11 @@ class SplitEditor {
             return;
         }
 
+        // Defensive: an orphaned instance (e.g. a superseded note_detail()
+        // call that never got destroy()-ed) may have left its own bar behind
+        // in this same parent. Remove stragglers so they can't stack.
+        parent.querySelectorAll('.iris-collab-bar').forEach((stale) => stale.remove());
+
         this.collabBar = document.createElement('div');
         this.collabBar.className = 'iris-collab-bar';
 
@@ -400,6 +405,12 @@ class SplitEditor {
             return;
         }
 
+        // Defensive: same reasoning as installPresenceBar() above -- an
+        // orphaned instance's badge lives directly on sourcePane, which is
+        // never cleared by create() (only the child source/wysiwyg mounts
+        // are), so it survives re-creation unless removed here.
+        this.sourcePane.querySelectorAll('.iris-collab-liveview-badge').forEach((stale) => stale.remove());
+
         this.collabSourceBadge = document.createElement('div');
         this.collabSourceBadge.className = 'iris-collab-liveview-badge';
         this.collabSourceBadge.textContent = 'Live view · edit in WYSIWYG';