fix(17): skip own-user SSE messages in JS to eliminate left-then-right flash

The server-side flush didn't eliminate the race because browser HTMX and SSE
event processing are inherently async.

Real fix: embed data-current-user-id on #discussion-tab (from DiscussionTabData.
CurrentUserID). The SSE handler now skips any event whose authorUserId matches
the current user — those messages are always delivered via HTMX (IsOwn=true,
right-aligned). SSE only appends messages from other users.

Co-Authored-By: Claude Sonnet 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Arthur Belleville 2026-05-17 12:47:21 +02:00
parent 96a58ef0ea
commit 681c094b0c
No known key found for this signature in database
4 changed files with 13 additions and 3 deletions

View file

@ -29,7 +29,10 @@ func loadDiscussionTabData(w http.ResponseWriter, r *http.Request, q *sqlc.Queri
http.Error(w, "internal server error", http.StatusInternalServerError)
return templates.DiscussionTabData{}, false
}
data := templates.DiscussionTabData{Messages: templates.DiscussionMessagesFromRows(rows, currentUserID)}
data := templates.DiscussionTabData{
Messages: templates.DiscussionMessagesFromRows(rows, currentUserID),
CurrentUserID: currentUserID,
}
return data, true
}

View file

@ -42,6 +42,12 @@
if (!event || !event.messageId || !event.messageHtml || messageExists(event.messageId)) {
return;
}
// Skip messages authored by the current user — HTMX already appended them
// with IsOwn=true. Let SSE handle only messages from other users.
var currentUserId = container.dataset.currentUserId;
if (currentUserId && event.authorUserId === currentUserId) {
return;
}
var list = ensureMessageList(container);
if (!list) return;

View file

@ -8,7 +8,7 @@ import (
)
templ DiscussionTabFragment(tablo sqlc.Tablo, data DiscussionTabData, form DiscussionForm, errs DiscussionErrors, csrfToken string) {
<div id="discussion-tab" class="space-y-6" data-discussion-stream-url={ DiscussionStreamURL(tablo.ID) }>
<div id="discussion-tab" class="space-y-6" data-discussion-stream-url={ DiscussionStreamURL(tablo.ID) } data-current-user-id={ data.CurrentUserID.String() }>
<div class="flex flex-wrap items-start justify-between gap-3">
<div>
<h2 class="text-2xl font-semibold leading-tight text-slate-900">Discussion</h2>

View file

@ -29,7 +29,8 @@ type DiscussionMessageView struct {
}
type DiscussionTabData struct {
Messages []DiscussionMessageView
Messages []DiscussionMessageView
CurrentUserID uuid.UUID
}
type TabloCardView struct {