feat: connection lost/reconnected banner with i18n

Adds a slim animated banner below the header that:
- Shows 'Connection lost — reconnecting…' with spinner when WS drops
- Flashes 'Reconnected!' with auto-dismiss after 3s on recovery
- Only appears after initial connection (not on first load)
- Supports EN/FR via i18n system
- Uses aria role=alert for accessibility
This commit is contained in:
Nicolas Varrot
2026-02-11 18:36:51 +00:00
parent 569dbc6d4d
commit 32a2166fd3
3 changed files with 81 additions and 0 deletions

View File

@@ -49,6 +49,10 @@ const en = {
// Tool call
'tool.result': 'Result',
// Connection banner
'connection.reconnecting': 'Connection lost — reconnecting…',
'connection.reconnected': 'Reconnected!',
// Timestamps
'time.yesterday': 'Yesterday',
} as const;
@@ -89,6 +93,9 @@ const fr: Record<keyof typeof en, string> = {
'tool.result': 'Résultat',
'connection.reconnecting': 'Connexion perdue — reconnexion…',
'connection.reconnected': 'Reconnecté !',
'time.yesterday': 'Hier',
};