The external guest link icon was fading in/out on every WebSocket update,
creating a distracting visual effect. Now the fade-in animation only plays
when the URL first becomes available (initial load or when saving a new URL),
rather than re-triggering on every state update.
- Add fadeIn keyframe animation to Tailwind config
- Track animation state with shouldAnimateIcon signal
- Only animate on transition from no URL to having a URL
- Clear animation flag after 200ms to prevent re-triggering
- 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.
Critical fixes to prevent the inline URL editor from closing during API updates:
1. Implement stable guest store with reconcile:
- Use createStore with reconcile() to maintain stable object references
- Key function ensures each guest keeps same proxy instance across updates
- Prevents <For> loop from remounting rows during websocket updates
2. Allow switching between guest editors:
- Mark guest name spans with data-guest-name-editable attribute
- Click handler allows clicking another guest name to switch editors
- Prevents click consumption when opening a different guest's editor
This ensures the inline editor stays open and preserves user input even when
websocket updates arrive, while still allowing seamless switching between
editing different guests.
Redesigned guest URL management from a bulky settings table to streamlined
inline editing directly on the dashboard:
Features:
- Single-click guest name to edit custom URL
- Text cursor indicates editability
- Inline editor with save (✓) and delete (✕) buttons
- Auto-focus and text selection on edit start
- Tag badges hidden during editing to maximize input space
- Click-away closes editor without activating underlying elements
Technical improvements:
- Global editing state prevents multiple simultaneous edits
- Smart click capture intercepts mousedown/click events when editor is open
- Prevents accidental row expansion or other actions during editing
- Delete button (✕) removes URL and icon entirely
- Escape key closes without saving
- Enter key saves and closes
