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:
parent
96a58ef0ea
commit
681c094b0c
4 changed files with 13 additions and 3 deletions
|
|
@ -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
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -29,7 +29,8 @@ type DiscussionMessageView struct {
|
|||
}
|
||||
|
||||
type DiscussionTabData struct {
|
||||
Messages []DiscussionMessageView
|
||||
Messages []DiscussionMessageView
|
||||
CurrentUserID uuid.UUID
|
||||
}
|
||||
|
||||
type TabloCardView struct {
|
||||
|
|
|
|||
Loading…
Reference in a new issue