fix: Disconnection banner preserves original disconnect time

This commit is contained in:
jamesread 2026-03-09 08:47:26 +00:00
parent a5c102dbf1
commit caf5a4b025
8 changed files with 31 additions and 3 deletions

View File

@ -21,7 +21,9 @@ async function reconnectWebsocket () {
connectionState.reconnecting = true
connectionState.connected = false
if (connectionState.disconnectedAt == null) {
connectionState.disconnectedAt = Date.now()
}
connectionState.nextReconnectAt = null
try {
@ -29,9 +31,9 @@ async function reconnectWebsocket () {
const stream = window.client.eventStream()
connectionState.connected = true
connectionState.reconnecting = false
connectionState.disconnectedAt = null
connectionState.nextReconnectAt = null
for await (const e of stream) {
connectionState.disconnectedAt = null
handleEvent(e)
}
} catch (err) {

View File

@ -1,5 +1,8 @@
<template>
<span id="connection-banner" v-if="!connectionState.connected" class="inline-notification critical user-info-connection" role="status">{{ bannerText }}</span>
<span id="connection-banner" v-if="!connectionState.connected" class="inline-notification critical user-info-connection">
<span class="connection-banner-sr-only" role="status">{{ staticAnnouncement }}</span>
<span aria-hidden="true">{{ bannerText }}</span>
</span>
</template>
<script setup>
@ -44,6 +47,8 @@ onUnmounted(() => {
}
})
const staticAnnouncement = computed(() => t('disconnected-banner-announcement'))
const bannerText = computed(() => {
const at = connectionState.disconnectedAt
const next = connectionState.nextReconnectAt
@ -65,4 +70,15 @@ const bannerText = computed(() => {
border: 0;
margin: 0;
}
.connection-banner-sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}
</style>

View File

@ -22,6 +22,7 @@
"diagnostics.where-to-find-help": "Wo Sie Hilfe finden",
"disconnected": "Getrennt",
"disconnected-banner": "Events-Websocket getrennt seit {disconnectedSince}. Erneuter Verbindungsversuch in {reconnectIn}.",
"disconnected-banner-announcement": "Events-Websocket getrennt.",
"disconnected-banner-reconnecting": "Events-Websocket getrennt seit {disconnectedSince}. Verbindungsversuch…",
"docs": "Dokumentation",
"language-dialog.browser-languages": "Browser-Sprachen",
@ -79,6 +80,7 @@
"diagnostics.where-to-find-help": "Where to find help",
"disconnected": "Disconnected",
"disconnected-banner": "Events websocket disconnected since {disconnectedSince}. Trying reconnect in {reconnectIn}.",
"disconnected-banner-announcement": "Events websocket disconnected.",
"disconnected-banner-reconnecting": "Events websocket disconnected since {disconnectedSince}. Trying reconnect…",
"docs": "Documentation",
"language-dialog.browser-languages": "Browser languages",
@ -136,6 +138,7 @@
"diagnostics.where-to-find-help": "Dónde encontrar ayuda",
"disconnected": "Desconectado",
"disconnected-banner": "Websocket de eventos desconectado desde {disconnectedSince}. Reintentando conexión en {reconnectIn}.",
"disconnected-banner-announcement": "Websocket de eventos desconectado.",
"disconnected-banner-reconnecting": "Websocket de eventos desconectado desde {disconnectedSince}. Reintentando conexión…",
"docs": "Documentación",
"language-dialog.browser-languages": "Idiomas del navegador",
@ -193,6 +196,7 @@
"diagnostics.where-to-find-help": "Dove trovare aiuto",
"disconnected": "Disconnesso",
"disconnected-banner": "Websocket eventi disconnesso dalle {disconnectedSince}. Nuovo tentativo tra {reconnectIn}.",
"disconnected-banner-announcement": "Websocket eventi disconnesso.",
"disconnected-banner-reconnecting": "Websocket eventi disconnesso dalle {disconnectedSince}. Tentativo di connessione…",
"docs": "Documentazione",
"language-dialog.browser-languages": "Lingue del browser",
@ -250,6 +254,7 @@
"diagnostics.where-to-find-help": "在哪里找到帮助",
"disconnected": "已断开连接",
"disconnected-banner": "事件 WebSocket 自 {disconnectedSince} 已断开。{reconnectIn} 后尝试重连。",
"disconnected-banner-announcement": "事件 WebSocket 已断开。",
"disconnected-banner-reconnecting": "事件 WebSocket 自 {disconnectedSince} 已断开。正在尝试重连…",
"docs": "文档",
"language-dialog.browser-languages": "浏览器语言",

View File

@ -10,6 +10,7 @@ translations:
reconnecting: Verbinde erneut…
disconnected-banner: "Events-Websocket getrennt seit {disconnectedSince}. Erneuter Verbindungsversuch in {reconnectIn}."
disconnected-banner-reconnecting: "Events-Websocket getrennt seit {disconnectedSince}. Verbindungsversuch…"
disconnected-banner-announcement: Events-Websocket getrennt.
login-button: Login
raise-issue: Ein Problem melden auf GitHub
docs: Dokumentation

View File

@ -12,6 +12,7 @@ translations:
reconnecting: Reconnecting…
disconnected-banner: "Events websocket disconnected since {disconnectedSince}. Trying reconnect in {reconnectIn}."
disconnected-banner-reconnecting: "Events websocket disconnected since {disconnectedSince}. Trying reconnect…"
disconnected-banner-announcement: Events websocket disconnected.
login-button: Login
logs.title: Logs
logs.page-description: This is a list of logs from actions that have been executed. You can filter the list by action title.

View File

@ -10,6 +10,7 @@ translations:
reconnecting: Reconectando…
disconnected-banner: "Websocket de eventos desconectado desde {disconnectedSince}. Reintentando conexión en {reconnectIn}."
disconnected-banner-reconnecting: "Websocket de eventos desconectado desde {disconnectedSince}. Reintentando conexión…"
disconnected-banner-announcement: Websocket de eventos desconectado.
login-button: Iniciar sesión
raise-issue: Reportar un problema en GitHub
docs: Documentación

View File

@ -11,6 +11,7 @@ translations:
reconnecting: Riconnessione…
disconnected-banner: "Websocket eventi disconnesso dalle {disconnectedSince}. Nuovo tentativo tra {reconnectIn}."
disconnected-banner-reconnecting: "Websocket eventi disconnesso dalle {disconnectedSince}. Tentativo di connessione…"
disconnected-banner-announcement: Websocket eventi disconnesso.
login-button: Login
raise-issue: Segnala un problema su GitHub
logs.title: Registri

View File

@ -10,6 +10,7 @@ translations:
reconnecting: 正在重新连接…
disconnected-banner: "事件 WebSocket 自 {disconnectedSince} 已断开。{reconnectIn} 后尝试重连。"
disconnected-banner-reconnecting: "事件 WebSocket 自 {disconnectedSince} 已断开。正在尝试重连…"
disconnected-banner-announcement: 事件 WebSocket 已断开。
login-button: 登录
raise-issue: 在 GitHub 上报告问题
docs: 文档