feat: add connection status indicator with SSE heartbeat
- Add ConnectionIndicator component showing green/red dot - Send lastPing signal every 15 seconds via SSE - Indicator turns red if no ping received in 20 seconds - Gives users confidence the live connection is active
This commit is contained in:
@@ -4,6 +4,7 @@ import (
|
||||
"fmt"
|
||||
"net/http"
|
||||
"strconv"
|
||||
"time"
|
||||
|
||||
"github.com/alexedwards/scs/v2"
|
||||
"github.com/go-chi/chi/v5"
|
||||
@@ -15,6 +16,7 @@ import (
|
||||
"github.com/ryanhamamura/games/features/snakegame/pages"
|
||||
"github.com/ryanhamamura/games/sessions"
|
||||
"github.com/ryanhamamura/games/snake"
|
||||
appsse "github.com/ryanhamamura/games/sse"
|
||||
)
|
||||
|
||||
func snakeChatColor(slot int) string {
|
||||
@@ -123,11 +125,21 @@ func HandleSnakeEvents(snakeStore *snake.SnakeStore, nc *nats.Conn, sm *scs.Sess
|
||||
return sse.PatchElementTempl(pages.GameContent(sg, mySlot, chatMessages(), chatCfg, gameID))
|
||||
}
|
||||
|
||||
// Send initial render
|
||||
sendPing := func() error {
|
||||
return appsse.SendPing(sse)
|
||||
}
|
||||
|
||||
// Send initial render and ping
|
||||
if err := sendPing(); err != nil {
|
||||
return
|
||||
}
|
||||
if err := patchAll(); err != nil {
|
||||
return
|
||||
}
|
||||
|
||||
heartbeat := time.NewTicker(15 * time.Second)
|
||||
defer heartbeat.Stop()
|
||||
|
||||
// Subscribe to game updates via NATS
|
||||
gameCh := make(chan *nats.Msg, 64)
|
||||
gameSub, err := nc.ChanSubscribe(snake.GameSubject(gameID), gameCh)
|
||||
@@ -151,6 +163,11 @@ func HandleSnakeEvents(snakeStore *snake.SnakeStore, nc *nats.Conn, sm *scs.Sess
|
||||
case <-ctx.Done():
|
||||
return
|
||||
|
||||
case <-heartbeat.C:
|
||||
if err := sendPing(); err != nil {
|
||||
return
|
||||
}
|
||||
|
||||
case <-gameCh:
|
||||
// Drain backed-up game updates
|
||||
for {
|
||||
|
||||
Reference in New Issue
Block a user