From 30b78784e08739497b7eaec44df3139e9c975714 Mon Sep 17 00:00:00 2001
From: rcourtman <courtmanr@gmail.com>
Date: Thu, 23 Oct 2025 17:56:58 +0000
Subject: [PATCH] Refine inline URL editor event handling

- Add double-checks in global click handlers to prevent race conditions
- Add isCurrentlyMounted flag to prevent cleanup during re-renders
- Remove onBlur handler that was causing premature editor closure
- Simplify conditional logic in click handlers

These changes improve the robustness of the inline editor when
websocket updates occur during editing sessions.
---
 .../src/components/Dashboard/GuestRow.tsx     | 22 ++++++++++---------
 1 file changed, 12 insertions(+), 10 deletions(-)

diff --git a/frontend-modern/src/components/Dashboard/GuestRow.tsx b/frontend-modern/src/components/Dashboard/GuestRow.tsx
index fd19a02..e8ce814 100644
--- a/frontend-modern/src/components/Dashboard/GuestRow.tsx
+++ b/frontend-modern/src/components/Dashboard/GuestRow.tsx
@@ -187,16 +187,22 @@ export function GuestRow(props: GuestRowProps) {
     }
   });
 
+  // Track if we're currently editing to prevent cleanup during re-renders
+  let isCurrentlyMounted = true;
+
   // Add global click handler to close editor and prevent clicks while editing
   createEffect(() => {
-    if (isEditingUrl()) {
+    if (isEditingUrl() && isCurrentlyMounted) {
       const handleGlobalClick = (e: MouseEvent) => {
+        // Double-check we're still the editing guest
+        if (currentlyEditingGuestId() !== guestId()) return;
+
         const target = e.target as HTMLElement;
         // Allow clicking another guest name to switch editing
         const isClickingGuestName = target.closest('[data-guest-name-editable]');
 
         // If clicking outside the editor (and not another guest name), close it and prevent the click
-        if (!target.closest('[data-url-editor]') && !isClickingGuestName && currentlyEditingGuestId() === guestId()) {
+        if (!target.closest('[data-url-editor]') && !isClickingGuestName) {
           e.preventDefault();
           e.stopPropagation();
           e.stopImmediatePropagation();
@@ -205,10 +211,13 @@ export function GuestRow(props: GuestRowProps) {
       };
 
       const handleGlobalMouseDown = (e: MouseEvent) => {
+        // Double-check we're still the editing guest
+        if (currentlyEditingGuestId() !== guestId()) return;
+
         const target = e.target as HTMLElement;
         const isClickingGuestName = target.closest('[data-guest-name-editable]');
 
-        if (!target.closest('[data-url-editor]') && !isClickingGuestName && currentlyEditingGuestId() === guestId()) {
+        if (!target.closest('[data-url-editor]') && !isClickingGuestName) {
           e.preventDefault();
           e.stopPropagation();
           e.stopImmediatePropagation();
@@ -453,13 +462,6 @@ export function GuestRow(props: GuestRowProps) {
                   editingValues.set(guestId(), e.currentTarget.value);
                   setEditingValuesVersion(v => v + 1);
                 }}
-                onBlur={(e) => {
-                  // Close editor when clicking away, but not if clicking the save/delete buttons
-                  const relatedTarget = e.relatedTarget as HTMLElement;
-                  if (!relatedTarget || !relatedTarget.closest('[data-url-editor-button]')) {
-                    cancelEditingUrl();
-                  }
-                }}
                 onKeyDown={(e) => {
                   if (e.key === 'Enter') {
                     e.preventDefault();