Two-digit code per color tag, shown as badges on matching log lines

Each tag gets a stable code (01-99) assigned by the server and stored in
tags.json; existing tags get one when the file is loaded. A fixed-width
Filters column shows the codes of the active tags found in each message
(room for 3, then 2 + "+N", all listed in the tooltip).

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>

.env.example

@@ -4,11 +4,16 @@ HTTP_PORT=8080
 TZ=Europe/Paris
 # How long logs are kept (e.g. 7d, 30d, 12w, 1y)
 RETENTION=30d
-# Web UI authentication: local (HTTP Basic below, or none) or oidc (OpenID Connect provider)
+# Web UI authentication: local (login page with the account below, or none) or oidc (OpenID Connect provider)
 AUTH_MODE=local
 # local mode: user and password (empty = no authentication)
 AUTH_USER=
 AUTH_PASS=
+# local mode: PNG logo shown on the login page, path inside the container (empty = no logo).
+# Mount the file in docker-compose.yml, e.g. ./logo.png:/config/logo.png:ro, then LOGIN_LOGO=/config/logo.png
+LOGIN_LOGO=
+# Session lifetime, both modes (e.g. 8h, 24h)
+SESSION_TTL=12h
 # oidc mode: issuer URL exactly as the provider announces it
 # (Keycloak: https://sso.example.org/realms/<realm>, Authentik: https://auth.example.org/application/o/<slug>/)
 OIDC_ISSUER=
@@ -16,9 +21,8 @@ OIDC_CLIENT_ID=
 OIDC_CLIENT_SECRET=
 # Callback URL of logstream, to register in the provider (path free, /auth/callback recommended)
 OIDC_REDIRECT_URL=https://logs.example.org/auth/callback
-# Requested scopes (openid is always added) and session lifetime (e.g. 8h, 24h)
+# Requested scopes (openid is always added)
 OIDC_SCOPES=openid profile email
-OIDC_SESSION_TTL=12h
 # Reverse DNS: show host names instead of IP addresses (on/off)
 RDNS=on
 # DNS server used for reverse lookups (e.g. your router: 192.168.1.1). Empty = system resolver

README.fr.md

@@ -78,8 +78,8 @@ par exemple `error AND host:web-01`, `app:~"ssh|nginx"` ou `* | stats by (host)
 Le direct est désactivé dans ce mode.
 
 Chaque ligne affiche, de gauche à droite : l'**heure de réception** (horloge du serveur),
-l'horodatage trouvé dans le message lui-même (`msg_time`), la sévérité, l'hôte, l'application
+l'horodatage trouvé dans le message lui-même (`msg_time`), la sévérité, l'hôte, l'application,
-et le message. Un clic sur un hôte ou une application filtre dessus.
+les codes des tags trouvés et le message. Un clic sur un hôte ou une application filtre dessus.
 
 Les logs sont indexés, recherchés et triés par **heure de réception** : les équipements dont
 l'horloge est fausse (par exemple des points d'accès dont le NTP échoue) apparaissent quand même
@@ -228,6 +228,18 @@ couleur, est mémorisé par navigateur.
   Tags par défaut (pastel) : `warning` (orange), `error` (rouge), `ok` (vert). Les tags par
   défaut qui utilisent encore les couleurs des versions précédentes passent automatiquement aux
   couleurs pastel.
+  Le menu *+ Préréglage…* ajoute des tags tout faits pour les logs d'accès HTTP/HTTPS (nginx et
+  Apache common/combined, Traefik CLF et JSON, Caddy JSON, HAProxy httplog) : codes de statut
+  (2xx vert, 3xx bleu, 4xx orange, 5xx rouge), méthodes, sondes et attaques (`wp-login.php`,
+  `/.env`, `../`…), robots et scripts, erreurs TLS et proxy. Les tags déjà présents ne sont pas
+  ajoutés en double, et les tags ajoutés se modifient comme les autres. Dans une expression
+  régulière, un groupe nommé `hl` (`(?<hl>…)`) ne colore que cette partie de la correspondance :
+  les préréglages s'en servent pour colorer le code de statut ou la méthode, pas le texte autour.
+  Chaque tag reçoit un code à deux chiffres (`01`, `02`…) attribué par le serveur : il reste
+  attaché au tag jusqu'à sa suppression (les tags créés par les versions précédentes en reçoivent
+  un aussi). La colonne *Filtres* de la liste affiche, en badges gris, les codes des tags actifs
+  trouvés dans chaque message ; elle a la place pour 3, au-delà elle en affiche 2 et `+N`, et
+  l'infobulle les liste tous.
 - **Interface**
   - *Thème* : Système (suit la préférence de l'ordinateur ou du téléphone), Clair ou Sombre. Le
     bouton soleil/lune de l'en-tête bascule entre clair et sombre.
@@ -250,11 +262,31 @@ couleur, est mémorisé par navigateur.
 
 `AUTH_MODE` choisit comment l'interface et l'API sont protégées (`/healthz` reste toujours ouvert) :
 
-- **`local`** (par défaut) : authentification HTTP Basic avec `AUTH_USER` / `AUTH_PASS` ; laissez-les
+- **`local`** (par défaut) : une page de connexion avec le compte `AUTH_USER` / `AUTH_PASS` ; laissez-les
   vides pour n'avoir aucune authentification (par exemple derrière un reverse proxy qui contrôle déjà).
 - **`oidc`** : connexion par un fournisseur OpenID Connect (Keycloak, Authentik, Authelia, Zitadel…),
   flux « authorization code » avec PKCE.
 
+En mode `local`, la page de connexion suit le thème et la langue de l'interface. La session dure
+`SESSION_TTL` (12 h par défaut), survit aux redémarrages (sa clé de signature est dans
+`/data/session.key`) et se termine quand `AUTH_USER` ou `AUTH_PASS` change ; le bouton de
+déconnexion (en haut à droite) y met fin. Les échecs de connexion sont écrits dans les logs avec
+l'adresse du client (`auth: failed login for "bob" from 192.0.2.7`). Les scripts peuvent toujours
+appeler l'API avec des identifiants HTTP Basic (`curl -u utilisateur:motdepasse`).
+
+Pour afficher votre logo sur la page de connexion, montez un PNG dans le conteneur et indiquez
+son chemin dans `LOGIN_LOGO` :
+
+```yaml
+# docker-compose.yml, service logstream
+    volumes:
+      - ./logo.png:/config/logo.png:ro
+```
+```bash
+# .env
+LOGIN_LOGO=/config/logo.png
+```
+
 Pour utiliser OIDC :
 
 1. Dans le fournisseur, créez un client **confidentiel** (avec secret) pour logstream et déclarez
@@ -271,7 +303,7 @@ Pour utiliser OIDC :
    laquelle le fournisseur n'a pas pu être lu (issuer incorrect, injoignable…).
 
 Ouvrir l'interface renvoie vers la page de connexion du fournisseur, puis revient sur logstream.
-La session dure `OIDC_SESSION_TTL` (12 h par défaut) et survit aux redémarrages (sa clé de
+La session dure `SESSION_TTL` (12 h par défaut) et survit aux redémarrages (sa clé de
 signature est dans `/data/session.key`) ; à son expiration, la page repasse par la connexion. Le
 bouton de déconnexion (en haut à droite) termine la session logstream, puis ouvre la page de
 déconnexion du fournisseur s'il en a une.
@@ -302,13 +334,14 @@ résolutions.
 | `SYSLOG_PORT` | `514` | port syslog publié sur l'hôte |
 | `HTTP_PORT` | `8080` | port de l'interface web |
 | `RETENTION` | `30d` | durée de conservation des logs dans VictoriaLogs |
-| `AUTH_MODE` | `local` | `local` (HTTP Basic) ou `oidc`, voir [Authentification](#authentification) |
+| `AUTH_MODE` | `local` | `local` (page de connexion) ou `oidc`, voir [Authentification](#authentification) |
-| `AUTH_USER` / `AUTH_PASS` | vide | authentification HTTP Basic pour l'interface (mode `local`) |
+| `AUTH_USER` / `AUTH_PASS` | vide | compte de la page de connexion (mode `local`) ; vide = pas d'authentification |
+| `LOGIN_LOGO` | vide | PNG affiché sur la page de connexion, chemin dans le conteneur (mode `local`) |
+| `SESSION_TTL` | `12h` | durée de la session (les deux modes ; `OIDC_SESSION_TTL` fonctionne toujours) |
 | `OIDC_ISSUER` | vide | URL de l'issuer du fournisseur OpenID Connect (mode `oidc`) |
 | `OIDC_CLIENT_ID` / `OIDC_CLIENT_SECRET` | vide | client déclaré dans le fournisseur |
 | `OIDC_REDIRECT_URL` | vide | URL de retour de logstream, ex. `https://logs.example.org/auth/callback` |
 | `OIDC_SCOPES` | `openid profile email` | scopes demandés |
-| `OIDC_SESSION_TTL` | `12h` | durée de la session |
 | `RDNS` | `on` | résoudre les hôtes donnés par leur IP en noms DNS |
 | `DNS_SERVER` | vide | serveur DNS pour les résolutions inverses (`ip` ou `ip:port`) |
 | `ALLOW_PURGE` | `true` | autoriser « Supprimer tous les logs » dans les Paramètres |
@@ -366,7 +399,8 @@ Pour mettre à jour l'une d'elles :
 | Fichier | Contenu |
 |---|---|
 | `main.go` | configuration, démarrage |
-| `auth.go` | authentification : HTTP Basic ou OpenID Connect (découverte, PKCE, contrôle de l'ID token, cookie de session) |
+| `auth.go` | authentification : OpenID Connect (découverte, PKCE, contrôle de l'ID token) et cookie de session signé |
+| `auth_local.go` | mode `local` : page de connexion (`web/login.html`), cookie de session, `LOGIN_LOGO` |
 | `syslog.go` | écoute UDP/TCP et analyse RFC 3164 / 5424 |
 | `store.go` | insertions par lots dans VictoriaLogs et requêtes LogsQL |
 | `query.go` | traduit les filtres de l'interface en LogsQL ; filtre du direct |
@@ -379,7 +413,7 @@ Pour mettre à jour l'une d'elles :
 | `hostlogs.go`, `journal.go` | logs système de l'hôte : lecteur du journal systemd (sans `journalctl`) et suivi de `/var/log` |
 | `tags.go` | stockage des tags de couleur |
 | `api.go` | routes HTTP `/api/*` |
-| `web/` | interface (HTML, CSS, JavaScript simple, sans étape de build), embarquée dans le binaire ; les traductions sont dans `web/app.js` (`I18N`) |
+| `web/` | interface (HTML, CSS, JavaScript simple, sans étape de build), embarquée dans le binaire ; les traductions sont dans `web/app.js` (`I18N`), et dans `web/login.html` pour la page de connexion |
 
 ## Remarque
 

README.md

@@ -72,7 +72,7 @@ message, host and app. Words are combined with AND.
 The live view is disabled in this mode.
 
 Each row shows, from left to right: the **reception time** (server clock), the timestamp
-found in the message itself (`msg_time`), severity, host, app and message. Click a host or an
+found in the message itself (`msg_time`), severity, host, app, codes of the tags found and message. Click a host or an
 app to filter on it.
 
 Logs are indexed, searched and sorted by **reception time**: devices with a wrong clock
@@ -207,6 +207,18 @@ remembered per browser.
   (`logstream-data` volume), so they are shared by every browser. Default tags (pastel):
   `warning` (orange), `error` (red), `ok` (green). Default tags still using the colors of
   earlier versions are switched to the pastel ones automatically.
+  The *+ Preset…* menu adds ready-made tags for HTTP/HTTPS access logs (nginx and Apache
+  common/combined, Traefik CLF and JSON, Caddy JSON, HAProxy httplog): status codes (2xx green,
+  3xx blue, 4xx orange, 5xx red), methods, probes and attacks (`wp-login.php`, `/.env`,
+  `../`…), bots and scripts, TLS and proxy errors. Tags already in the list are skipped, and the
+  added tags can be edited like any other. In a regular expression, a group named `hl`
+  (`(?<hl>…)`) colors only that part of the match: the presets use it to color the status code
+  or the method, not the text around it.
+  Each tag gets a two-digit code (`01`, `02`…) assigned by the server: it stays with the tag
+  until the tag is deleted (codes are also given to tags created by earlier versions). The
+  *Filters* column of the log list shows, as grey badges, the codes of the active tags found in
+  each message; it has room for 3, beyond that it shows 2 and `+N`, and the tooltip lists them
+  all.
 - **Interface**
   - *Theme*: System (follows the computer/phone preference), Light or Dark. The sun/moon
     button in the header switches between light and dark.
@@ -226,11 +238,29 @@ remembered per browser.
 
 `AUTH_MODE` picks how the UI and the API are protected (`/healthz` always stays open):
 
-- **`local`** (default): HTTP Basic authentication with `AUTH_USER` / `AUTH_PASS`; leave them
+- **`local`** (default): a login page with the account `AUTH_USER` / `AUTH_PASS`; leave them
   empty to have no authentication (for instance behind a reverse proxy that already checks).
 - **`oidc`**: login through an OpenID Connect provider (Keycloak, Authentik, Authelia, Zitadel…),
   authorization code flow with PKCE.
 
+In `local` mode the login page follows the theme and language of the UI. The session lasts
+`SESSION_TTL` (12 h by default), survives restarts (its signing key is in `/data/session.key`) and
+ends when `AUTH_USER` or `AUTH_PASS` changes; the log out button (top right) ends it. Failed logins
+are written in the logs with the client address (`auth: failed login for "bob" from 192.0.2.7`).
+Scripts can still call the API with HTTP Basic credentials (`curl -u user:pass`).
+
+To show your logo on the login page, mount a PNG in the container and point `LOGIN_LOGO` to it:
+
+```yaml
+# docker-compose.yml, logstream service
+    volumes:
+      - ./logo.png:/config/logo.png:ro
+```
+```bash
+# .env
+LOGIN_LOGO=/config/logo.png
+```
+
 To use OIDC:
 
 1. In the provider, create a **confidential** client (with a secret) for logstream and register
@@ -247,7 +277,7 @@ To use OIDC:
    provider could not be read (wrong issuer, unreachable…).
 
 Opening the UI sends you to the provider's login page, then back to logstream. The session
-lasts `OIDC_SESSION_TTL` (12 h by default) and survives restarts (its signing key is in
+lasts `SESSION_TTL` (12 h by default) and survives restarts (its signing key is in
 `/data/session.key`); when it ends, the page goes through the login again. The log out button
 (top right) ends the logstream session, then opens the provider's log out page if it has one.
 
@@ -274,13 +304,14 @@ are only known by your router or a local DNS (Pi-hole, AdGuard, Unbound…), set
 | `SYSLOG_PORT` | `514` | syslog port published on the host |
 | `HTTP_PORT` | `8080` | web UI port |
 | `RETENTION` | `30d` | how long VictoriaLogs keeps logs |
-| `AUTH_MODE` | `local` | `local` (HTTP Basic) or `oidc`, see [Authentication](#authentication) |
+| `AUTH_MODE` | `local` | `local` (login page) or `oidc`, see [Authentication](#authentication) |
-| `AUTH_USER` / `AUTH_PASS` | empty | HTTP Basic authentication for the UI (`local` mode) |
+| `AUTH_USER` / `AUTH_PASS` | empty | account of the login page (`local` mode); empty = no authentication |
+| `LOGIN_LOGO` | empty | PNG shown on the login page, path inside the container (`local` mode) |
+| `SESSION_TTL` | `12h` | session lifetime (both modes; `OIDC_SESSION_TTL` still works) |
 | `OIDC_ISSUER` | empty | issuer URL of the OpenID Connect provider (`oidc` mode) |
 | `OIDC_CLIENT_ID` / `OIDC_CLIENT_SECRET` | empty | client registered in the provider |
 | `OIDC_REDIRECT_URL` | empty | callback URL of logstream, e.g. `https://logs.example.org/auth/callback` |
 | `OIDC_SCOPES` | `openid profile email` | requested scopes |
-| `OIDC_SESSION_TTL` | `12h` | session lifetime |
 | `RDNS` | `on` | resolve IP hosts to DNS names |
 | `DNS_SERVER` | empty | DNS server for reverse lookups (`ip` or `ip:port`) |
 | `ALLOW_PURGE` | `true` | allow "Delete all logs" in Settings |
@@ -335,7 +366,8 @@ To update one of them:
 | File | Contents |
 |---|---|
 | `main.go` | configuration, startup |
-| `auth.go` | authentication: HTTP Basic or OpenID Connect (discovery, PKCE, ID token checks, session cookie) |
+| `auth.go` | authentication: OpenID Connect (discovery, PKCE, ID token checks) and the signed session cookie |
+| `auth_local.go` | `local` mode: login page (`web/login.html`), session cookie, `LOGIN_LOGO` |
 | `syslog.go` | UDP/TCP listeners and RFC 3164 / 5424 parsing |
 | `store.go` | batched inserts into VictoriaLogs and LogsQL queries |
 | `query.go` | turns UI filters into LogsQL; live-view filter |
@@ -348,7 +380,7 @@ To update one of them:
 | `hostlogs.go`, `journal.go` | host system logs: systemd journal reader (no `journalctl`) and `/var/log` follower |
 | `tags.go` | color tag storage |
 | `api.go` | `/api/*` HTTP routes |
-| `web/` | UI (HTML, CSS, plain JavaScript, no build step), embedded in the binary; translations live in `web/app.js` (`I18N`) |
+| `web/` | UI (HTML, CSS, plain JavaScript, no build step), embedded in the binary; translations live in `web/app.js` (`I18N`), and in `web/login.html` for the login page |
 
 ## Note
 

auth.go

@@ -27,8 +27,8 @@ import (
 	"time"
 )
 
-// Web UI authentication. AUTH_MODE=local (default) keeps the optional HTTP Basic
+// Web UI authentication. AUTH_MODE=local (default) shows a login page when AUTH_USER /
-// authentication (AUTH_USER / AUTH_PASS); AUTH_MODE=oidc delegates the login to an
+// AUTH_PASS are set (auth_local.go); AUTH_MODE=oidc delegates the login to an
 // OpenID Connect provider (Keycloak, Authentik, Authelia…) with the authorization code
 // flow and PKCE. Only the standard library is used.
 
@@ -49,13 +49,23 @@ type authConfig struct {
 	scopes       string
 	sessionTTL   time.Duration
 	dataDir      string
+	loginLogo    string // local mode: PNG shown on the login page
+
 }
 
 // newAuth returns the middleware that protects the UI and the API (except /healthz).
 func newAuth(c authConfig, next http.Handler) (http.Handler, error) {
+	if c.sessionTTL <= 0 {
+		c.sessionTTL = 12 * time.Hour
+	}
 	switch strings.ToLower(c.mode) {
 	case "", "local":
-		return basicAuth(c.user, c.pass, next), nil
+		if c.user == "" {
+			return next, nil
+		}
+		l := newLocal(c)
+		l.next = next
+		return l, nil
 	case "oidc":
 		o, err := newOIDC(c)
 		if err != nil {
@@ -68,28 +78,6 @@ func newAuth(c authConfig, next http.Handler) (http.Handler, error) {
 	return nil, fmt.Errorf("AUTH_MODE=%q: expected local or oidc", c.mode)
 }
 
-// basicAuth protects the UI when AUTH_USER is set (except /healthz).
-func basicAuth(user, pass string, next http.Handler) http.Handler {
-	if user == "" {
-		return next
-	}
-	return http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) {
-		if r.URL.Path == "/healthz" {
-			next.ServeHTTP(w, r)
-			return
-		}
-		u, p, ok := r.BasicAuth()
-		if !ok ||
-			subtle.ConstantTimeCompare([]byte(u), []byte(user)) != 1 ||
-			subtle.ConstantTimeCompare([]byte(p), []byte(pass)) != 1 {
-			w.Header().Set("WWW-Authenticate", `Basic realm="logstream"`)
-			http.Error(w, "authentication required", http.StatusUnauthorized)
-			return
-		}
-		next.ServeHTTP(w, r)
-	})
-}
-
 type oidcMeta struct {
 	Issuer           string   `json:"issuer"`
 	AuthEndpoint     string   `json:"authorization_endpoint"`
@@ -136,9 +124,6 @@ func newOIDC(c authConfig) (*OIDC, error) {
 	if !strings.Contains(" "+c.scopes+" ", " openid ") {
 		c.scopes = "openid " + c.scopes
 	}
-	if c.sessionTTL <= 0 {
-		c.sessionTTL = 12 * time.Hour
-	}
 	return &OIDC{
 		cfg:      c,
 		callback: ru.Path,
@@ -166,7 +151,7 @@ func sessionKey(dir string) []byte {
 		log.Fatalf("session key: %v", err)
 	}
 	if err := os.WriteFile(path, k, 0o600); err != nil {
-		log.Printf("oidc: cannot save %s (%v): sessions end when logstream restarts", path, err)
+		log.Printf("auth: cannot save %s (%v): sessions end when logstream restarts", path, err)
 	}
 	return k
 }
@@ -176,6 +161,14 @@ type session struct {
 	Exp  int64  `json:"e"`
 }
 
+// writeAuthRequired answers API calls without a session; the UI turns it into a reload
+// (and so into a new login).
+func writeAuthRequired(w http.ResponseWriter) {
+	w.Header().Set("Content-Type", "application/json")
+	w.WriteHeader(http.StatusUnauthorized)
+	_, _ = w.Write([]byte(`{"error":"authentication required","code":"auth"}` + "\n"))
+}
+
 type loginState struct {
 	Nonce    string `json:"n"`
 	Verifier string `json:"v"`
@@ -196,7 +189,7 @@ func (o *OIDC) ServeHTTP(w http.ResponseWriter, r *http.Request) {
 		return
 	}
 	var s session
-	if c, err := r.Cookie(sessionCookie); err == nil && o.verifyCookie(c.Value, &s) && time.Now().Unix() < s.Exp {
+	if c, err := r.Cookie(sessionCookie); err == nil && verifyCookie(o.key, c.Value, &s) && time.Now().Unix() < s.Exp {
 		if r.URL.Path == "/auth/me" {
 			writeJSON(w, http.StatusOK, map[string]string{"mode": "oidc", "user": s.User})
 			return
@@ -210,9 +203,7 @@ func (o *OIDC) ServeHTTP(w http.ResponseWriter, r *http.Request) {
 		o.startLogin(w, r)
 		return
 	}
-	w.Header().Set("Content-Type", "application/json")
+	writeAuthRequired(w)
-	w.WriteHeader(http.StatusUnauthorized)
-	_, _ = w.Write([]byte(`{"error":"authentication required","code":"auth"}` + "\n"))
 }
 
 func (o *OIDC) startLogin(w http.ResponseWriter, r *http.Request) {
@@ -229,7 +220,7 @@ func (o *OIDC) startLogin(w http.ResponseWriter, r *http.Request) {
 	}
 	http.SetCookie(w, &http.Cookie{
 		Name:     loginCookie + state,
-		Value:    o.signCookie(loginState{Nonce: nonce, Verifier: verifier, Return: ret, Exp: time.Now().Add(loginTTL).Unix()}),
+		Value:    signCookie(o.key, loginState{Nonce: nonce, Verifier: verifier, Return: ret, Exp: time.Now().Add(loginTTL).Unix()}),
 		Path:     "/",
 		MaxAge:   int(loginTTL.Seconds()),
 		HttpOnly: true,
@@ -260,8 +251,8 @@ func (o *OIDC) handleCallback(w http.ResponseWriter, r *http.Request) {
 	state := q.Get("state")
 	var ls loginState
 	c, err := r.Cookie(loginCookie + state)
-	if state == "" || err != nil || !o.verifyCookie(c.Value, &ls) || time.Now().Unix() > ls.Exp {
+	if state == "" || err != nil || !verifyCookie(o.key, c.Value, &ls) || time.Now().Unix() > ls.Exp {
-		http.Error(w, "login expired or started in another browser: open logstream again", http.StatusBadRequest)
+		http.Error(w, "login expired or started in another browser: open LogStream again", http.StatusBadRequest)
 		return
 	}
 	http.SetCookie(w, &http.Cookie{Name: loginCookie + state, Path: "/", MaxAge: -1, HttpOnly: true, Secure: o.secure})
@@ -269,13 +260,13 @@ func (o *OIDC) handleCallback(w http.ResponseWriter, r *http.Request) {
 	user, err := o.exchange(r, q.Get("code"), ls)
 	if err != nil {
 		log.Printf("oidc: login failed: %v", err)
-		http.Error(w, "login failed, see the logstream logs", http.StatusForbidden)
+		http.Error(w, "login failed, see the LogStream logs", http.StatusForbidden)
 		return
 	}
 	log.Printf("oidc: %s logged in", user)
 	http.SetCookie(w, &http.Cookie{
 		Name:     sessionCookie,
-		Value:    o.signCookie(session{User: user, Exp: time.Now().Add(o.cfg.sessionTTL).Unix()}),
+		Value:    signCookie(o.key, session{User: user, Exp: time.Now().Add(o.cfg.sessionTTL).Unix()}),
 		Path:     "/",
 		MaxAge:   int(o.cfg.sessionTTL.Seconds()),
 		HttpOnly: true,
@@ -564,15 +555,15 @@ func (o *OIDC) getJSON(u string, v any) error {
 }
 
 // Cookies are base64url(JSON) + "." + base64url(HMAC-SHA256).
-func (o *OIDC) signCookie(v any) string {
+func signCookie(key []byte, v any) string {
 	b, _ := json.Marshal(v)
 	p := base64.RawURLEncoding.EncodeToString(b)
-	m := hmac.New(sha256.New, o.key)
+	m := hmac.New(sha256.New, key)
 	m.Write([]byte(p))
 	return p + "." + base64.RawURLEncoding.EncodeToString(m.Sum(nil))
 }
 
-func (o *OIDC) verifyCookie(s string, v any) bool {
+func verifyCookie(key []byte, s string, v any) bool {
 	p, sig, ok := strings.Cut(s, ".")
 	if !ok {
 		return false
@@ -581,7 +572,7 @@ func (o *OIDC) verifyCookie(s string, v any) bool {
 	if err != nil {
 		return false
 	}
-	m := hmac.New(sha256.New, o.key)
+	m := hmac.New(sha256.New, key)
 	m.Write([]byte(p))
 	if !hmac.Equal(got, m.Sum(nil)) {
 		return false

auth_local.go

@@ -0,0 +1,167 @@
+package main
+
+import (
+	"crypto/hmac"
+	"crypto/sha256"
+	"crypto/subtle"
+	"log"
+	"net"
+	"net/http"
+	"net/url"
+	"os"
+	"strings"
+	"time"
+)
+
+// Local mode with AUTH_USER set: a login page (web/login.html) in the colors of the UI and a
+// session kept in a signed cookie, like the OIDC mode. HTTP Basic credentials are still
+// accepted so scripts calling the API keep working, but the browser popup is gone.
+
+const loginPage = "/login.html"
+
+var loginFailDelay = time.Second // slows down password guessing
+
+type Local struct {
+	user, pass string
+	ttl        time.Duration
+	logo       string // LOGIN_LOGO, served at /auth/logo
+	key        []byte
+	next       http.Handler
+}
+
+func newLocal(c authConfig) *Local {
+	// The key depends on the credentials: changing AUTH_USER or AUTH_PASS ends every session.
+	m := hmac.New(sha256.New, sessionKey(c.dataDir))
+	m.Write([]byte("local\x00" + c.user + "\x00" + c.pass))
+	if c.loginLogo != "" {
+		if _, err := os.Stat(c.loginLogo); err != nil {
+			log.Printf("auth: LOGIN_LOGO: %v", err)
+		}
+	}
+	log.Printf("local authentication enabled (user %s)", c.user)
+	return &Local{user: c.user, pass: c.pass, ttl: c.sessionTTL, logo: c.loginLogo, key: m.Sum(nil)}
+}
+
+func (l *Local) ServeHTTP(w http.ResponseWriter, r *http.Request) {
+	switch r.URL.Path {
+	case "/healthz", "/style.css":
+		l.next.ServeHTTP(w, r)
+		return
+	case "/auth/logo":
+		l.serveLogo(w, r)
+		return
+	case "/auth/login":
+		l.handleLogin(w, r)
+		return
+	case "/auth/logout":
+		http.SetCookie(w, &http.Cookie{Name: sessionCookie, Path: "/", MaxAge: -1, HttpOnly: true, Secure: isHTTPS(r)})
+		http.Redirect(w, r, loginPage, http.StatusFound)
+		return
+	}
+	user, ok := l.sessionUser(r)
+	if !ok {
+		if u, p, basic := r.BasicAuth(); basic && l.check(u, p) {
+			user, ok = u, true
+		}
+	}
+	switch {
+	case r.URL.Path == loginPage:
+		if ok {
+			http.Redirect(w, r, safeReturn(r.URL.Query().Get("r")), http.StatusFound)
+			return
+		}
+		w.Header().Set("Cache-Control", "no-store")
+		l.next.ServeHTTP(w, r)
+	case ok && r.URL.Path == "/auth/me":
+		writeJSON(w, http.StatusOK, map[string]string{"mode": "local", "user": user})
+	case ok:
+		l.next.ServeHTTP(w, r)
+	case r.Method == http.MethodGet && !strings.HasPrefix(r.URL.Path, "/api/") && r.URL.Path != "/auth/me":
+		target := loginPage
+		if ret := r.URL.RequestURI(); ret != "/" {
+			target += "?" + url.Values{"r": {ret}}.Encode()
+		}
+		http.Redirect(w, r, target, http.StatusFound)
+	default:
+		writeAuthRequired(w)
+	}
+}
+
+func (l *Local) handleLogin(w http.ResponseWriter, r *http.Request) {
+	if r.Method != http.MethodPost {
+		http.Redirect(w, r, loginPage, http.StatusFound)
+		return
+	}
+	user, pass := r.PostFormValue("user"), r.PostFormValue("pass")
+	ret := safeReturn(r.PostFormValue("r"))
+	if !l.check(user, pass) {
+		log.Printf("auth: failed login for %q from %s", user, clientIP(r))
+		time.Sleep(loginFailDelay)
+		q := url.Values{"e": {"1"}}
+		if ret != "/" {
+			q.Set("r", ret)
+		}
+		http.Redirect(w, r, loginPage+"?"+q.Encode(), http.StatusSeeOther)
+		return
+	}
+	log.Printf("auth: %s logged in from %s", user, clientIP(r))
+	http.SetCookie(w, &http.Cookie{
+		Name:     sessionCookie,
+		Value:    signCookie(l.key, session{User: user, Exp: time.Now().Add(l.ttl).Unix()}),
+		Path:     "/",
+		MaxAge:   int(l.ttl.Seconds()),
+		HttpOnly: true,
+		Secure:   isHTTPS(r),
+		SameSite: http.SameSiteLaxMode,
+	})
+	http.Redirect(w, r, ret, http.StatusSeeOther)
+}
+
+func (l *Local) sessionUser(r *http.Request) (string, bool) {
+	var s session
+	c, err := r.Cookie(sessionCookie)
+	if err != nil || !verifyCookie(l.key, c.Value, &s) || time.Now().Unix() >= s.Exp {
+		return "", false
+	}
+	return s.User, true
+}
+
+func (l *Local) check(user, pass string) bool {
+	u := subtle.ConstantTimeCompare([]byte(user), []byte(l.user))
+	p := subtle.ConstantTimeCompare([]byte(pass), []byte(l.pass))
+	return u&p == 1
+}
+
+// serveLogo sends LOGIN_LOGO; without it the login page hides the image.
+func (l *Local) serveLogo(w http.ResponseWriter, r *http.Request) {
+	if l.logo == "" {
+		http.NotFound(w, r)
+		return
+	}
+	w.Header().Set("Cache-Control", "no-cache")
+	http.ServeFile(w, r, l.logo)
+}
+
+// safeReturn keeps the page to open after login inside logstream.
+func safeReturn(ret string) string {
+	if !strings.HasPrefix(ret, "/") || strings.HasPrefix(ret, "//") || strings.HasPrefix(ret, "/\\") || ret == loginPage {
+		return "/"
+	}
+	return ret
+}
+
+// isHTTPS is true when the browser talks HTTPS, directly or through a reverse proxy.
+func isHTTPS(r *http.Request) bool {
+	return r.TLS != nil || strings.EqualFold(r.Header.Get("X-Forwarded-Proto"), "https")
+}
+
+func clientIP(r *http.Request) string {
+	if f := r.Header.Get("X-Forwarded-For"); f != "" {
+		return strings.TrimSpace(strings.Split(f, ",")[0])
+	}
+	host, _, err := net.SplitHostPort(r.RemoteAddr)
+	if err != nil {
+		return r.RemoteAddr
+	}
+	return host
+}

auth_local_test.go

@@ -0,0 +1,142 @@
+package main
+
+import (
+	"net/http"
+	"net/http/cookiejar"
+	"net/url"
+	"os"
+	"path/filepath"
+	"strings"
+	"testing"
+)
+
+// newLocalApp puts the local login in front of a handler that echoes "app" and returns a
+// browser (client with cookies) that does not follow redirects.
+func newLocalApp(t *testing.T, c authConfig) (string, *http.Client) {
+	t.Helper()
+	loginFailDelay = 0
+	c.mode, c.dataDir = "local", t.TempDir()
+	h, err := newAuth(c, http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) { _, _ = w.Write([]byte("app " + r.URL.Path)) }))
+	if err != nil {
+		t.Fatal(err)
+	}
+	jar, _ := cookiejar.New(nil)
+	return "http://app.test", &http.Client{
+		Jar:           jar,
+		Transport:     hosts{"app.test": h},
+		CheckRedirect: func(*http.Request, []*http.Request) error { return http.ErrUseLastResponse },
+	}
+}
+
+func login(t *testing.T, c *http.Client, app, user, pass, ret string) *http.Response {
+	t.Helper()
+	res, err := c.PostForm(app+"/auth/login", url.Values{"user": {user}, "pass": {pass}, "r": {ret}})
+	if err != nil {
+		t.Fatal(err)
+	}
+	res.Body.Close()
+	return res
+}
+
+func TestLocalLoginFlow(t *testing.T) {
+	app, c := newLocalApp(t, authConfig{user: "admin", pass: "pw"})
+
+	res, _ := c.Get(app + "/api/logs?q=x")
+	if res.StatusCode != http.StatusUnauthorized || res.Header.Get("WWW-Authenticate") != "" {
+		t.Fatalf("API without session: %d %q", res.StatusCode, res.Header.Get("WWW-Authenticate"))
+	}
+	res, _ = c.Get(app + "/?q=disk")
+	if loc := res.Header.Get("Location"); res.StatusCode != http.StatusFound || loc != "/login.html?r=%2F%3Fq%3Ddisk" {
+		t.Fatalf("page without session: %d %q", res.StatusCode, loc)
+	}
+	for _, p := range []string{"/login.html", "/style.css", "/healthz"} {
+		if code, body := get(t, c, app+p); code != http.StatusOK || body != "app "+p {
+			t.Errorf("%s without session: %d %q", p, code, body)
+		}
+	}
+
+	res = login(t, c, app, "admin", "wrong", "/?q=disk")
+	if loc := res.Header.Get("Location"); res.StatusCode != http.StatusSeeOther || !strings.Contains(loc, "e=1") {
+		t.Fatalf("wrong password: %d %q", res.StatusCode, loc)
+	}
+	if code, _ := get(t, c, app+"/api/logs"); code != http.StatusUnauthorized {
+		t.Fatal("session created by a wrong password")
+	}
+
+	res = login(t, c, app, "admin", "pw", "//evil.example/")
+	if loc := res.Header.Get("Location"); loc != "/" {
+		t.Fatalf("open redirect: %q", loc)
+	}
+	res = login(t, c, app, "admin", "pw", "/?q=disk")
+	if loc := res.Header.Get("Location"); res.StatusCode != http.StatusSeeOther || loc != "/?q=disk" {
+		t.Fatalf("login: %d %q", res.StatusCode, loc)
+	}
+	if code, body := get(t, c, app+"/api/logs"); code != http.StatusOK || body != "app /api/logs" {
+		t.Fatalf("API with session: %d %q", code, body)
+	}
+	if code, body := get(t, c, app+"/auth/me"); code != http.StatusOK || !strings.Contains(body, `"user":"admin"`) || !strings.Contains(body, `"mode":"local"`) {
+		t.Fatalf("/auth/me: %d %s", code, body)
+	}
+	if res, _ := c.Get(app + "/login.html"); res.StatusCode != http.StatusFound {
+		t.Errorf("login page while logged in: %d", res.StatusCode)
+	}
+
+	if res, _ := c.Get(app + "/auth/logout"); res.Header.Get("Location") != "/login.html" {
+		t.Fatalf("logout: %q", res.Header.Get("Location"))
+	}
+	if code, _ := get(t, c, app+"/api/logs"); code != http.StatusUnauthorized {
+		t.Fatal("session still valid after logout")
+	}
+}
+
+func TestLocalBasicAuthForScripts(t *testing.T) {
+	app, c := newLocalApp(t, authConfig{user: "admin", pass: "pw"})
+	req, _ := http.NewRequest(http.MethodGet, app+"/api/logs", nil)
+	req.SetBasicAuth("admin", "pw")
+	if res, _ := c.Do(req); res.StatusCode != http.StatusOK {
+		t.Fatalf("basic auth: %d", res.StatusCode)
+	}
+	req.SetBasicAuth("admin", "nope")
+	if res, _ := c.Do(req); res.StatusCode != http.StatusUnauthorized {
+		t.Fatalf("wrong basic auth: %d", res.StatusCode)
+	}
+}
+
+func TestLocalPasswordChangeEndsSessions(t *testing.T) {
+	dir := t.TempDir()
+	loginFailDelay = 0
+	echo := http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) {})
+	h1, _ := newAuth(authConfig{mode: "local", user: "admin", pass: "old", dataDir: dir}, echo)
+	h2, _ := newAuth(authConfig{mode: "local", user: "admin", pass: "new", dataDir: dir}, echo)
+	cookie := signCookie(h1.(*Local).key, session{User: "admin", Exp: 9999999999})
+	r, _ := http.NewRequest(http.MethodGet, "/", nil)
+	r.AddCookie(&http.Cookie{Name: sessionCookie, Value: cookie})
+	if _, ok := h1.(*Local).sessionUser(r); !ok {
+		t.Fatal("session refused with the same password")
+	}
+	if _, ok := h2.(*Local).sessionUser(r); ok {
+		t.Fatal("session kept after a password change")
+	}
+}
+
+func TestLocalLogo(t *testing.T) {
+	app, c := newLocalApp(t, authConfig{user: "admin", pass: "pw"})
+	if code, _ := get(t, c, app+"/auth/logo"); code != http.StatusNotFound {
+		t.Errorf("no LOGIN_LOGO: %d", code)
+	}
+	png := filepath.Join(t.TempDir(), "logo.png")
+	_ = os.WriteFile(png, []byte("\x89PNG\r\n\x1a\nfake"), 0o644)
+	app, c = newLocalApp(t, authConfig{user: "admin", pass: "pw", loginLogo: png})
+	res, _ := c.Get(app + "/auth/logo")
+	if res.StatusCode != http.StatusOK || res.Header.Get("Content-Type") != "image/png" {
+		t.Errorf("LOGIN_LOGO: %d %q", res.StatusCode, res.Header.Get("Content-Type"))
+	}
+}
+
+func TestLocalWithoutUserIsOpen(t *testing.T) {
+	if h, _ := newAuth(authConfig{mode: "local"}, http.NotFoundHandler()); h == nil || isLocal(h) {
+		t.Error("local mode without AUTH_USER should not protect anything")
+	}
+}
+
+func isLocal(h http.Handler) bool { _, ok := h.(*Local); return ok }

docker-compose.yml

@@ -14,15 +14,16 @@ services:
       VLOGS_URL: http://victorialogs:9428
       SYSLOG_PUBLIC_PORT: ${SYSLOG_PORT:-514}     # le port d'ecoute syslog par defaut (attention aux ports <1024)
       TZ: ${TZ:-Europe/Paris}
-      AUTH_MODE: ${AUTH_MODE:-local}   # local (Basic Auth ci-dessous) ou oidc
+      AUTH_MODE: ${AUTH_MODE:-local}   # local (page de connexion, compte ci-dessous) ou oidc
       AUTH_USER: ${AUTH_USER:-}   # vide = pas d'authentification, on delegue ca au reverse proxy traefik
       AUTH_PASS: ${AUTH_PASS:-}
+      LOGIN_LOGO: ${LOGIN_LOGO:-}     # PNG affiche sur la page de connexion (chemin dans le conteneur, voir volumes)
       OIDC_ISSUER: ${OIDC_ISSUER:-}
       OIDC_CLIENT_ID: ${OIDC_CLIENT_ID:-}
       OIDC_CLIENT_SECRET: ${OIDC_CLIENT_SECRET:-}
       OIDC_REDIRECT_URL: ${OIDC_REDIRECT_URL:-}
       OIDC_SCOPES: ${OIDC_SCOPES:-openid profile email}
-      OIDC_SESSION_TTL: ${OIDC_SESSION_TTL:-12h}
+      SESSION_TTL: ${SESSION_TTL:-${OIDC_SESSION_TTL:-12h}}   # duree de la session (local et oidc)
       RDNS: ${RDNS:-on}               # resol dns
       DNS_SERVER: ${DNS_SERVER:-}     # si resolv directe
       ALLOW_PURGE: ${ALLOW_PURGE:-true}
@@ -38,6 +39,8 @@ services:
       # logs systeme de l'hote, en lecture seule (source a activer dans Reglages > Sources)
       - /var/log:/host/var/log:ro                     # journal systemd persistant et fichiers texte
       - /run/log/journal:/host/run/log/journal:ro     # journal systemd volatile
+      # logo de la page de connexion, avec LOGIN_LOGO=/config/logo.png dans .env
+      # - ./logo.png:/config/logo.png:ro
     labels:
       logstream.exclude: "true"      # pas de collect des logs logstream
 

main.go

@@ -89,7 +89,9 @@ func main() {
 			clientSecret: os.Getenv("OIDC_CLIENT_SECRET"),
 			redirectURL:  os.Getenv("OIDC_REDIRECT_URL"),
 			scopes:       os.Getenv("OIDC_SCOPES"),
-			sessionTTL:   getenvDuration("OIDC_SESSION_TTL", 12*time.Hour),
+			// SESSION_TTL applies to both modes; OIDC_SESSION_TTL is its former name.
+			sessionTTL: getenvDuration("SESSION_TTL", getenvDuration("OIDC_SESSION_TTL", 12*time.Hour)),
+			loginLogo:  os.Getenv("LOGIN_LOGO"),
 		},
 		rdns:       getenvBool("RDNS", true),
 		dnsServer:  os.Getenv("DNS_SERVER"),

tags.go

@@ -16,7 +16,9 @@ import (
 // Tag highlights a keyword in displayed messages.
 type Tag struct {
 	ID            string `json:"id"`
+	Code          string `json:"code"` // two digits, shown on matching log lines
 	Pattern       string `json:"pattern"`
+	Label         string `json:"label,omitempty"` // shown instead of the pattern (presets)
 	Color         string `json:"color"`
 	WholeWord     bool   `json:"wholeWord"`
 	CaseSensitive bool   `json:"caseSensitive"`
@@ -26,12 +28,47 @@ type Tag struct {
 
 func defaultTags() []Tag {
 	return []Tag{
-		{ID: "warning", Pattern: "warning", Color: "#fdba74", WholeWord: true, Enabled: true},
+		{ID: "warning", Code: "01", Pattern: "warning", Color: "#fdba74", WholeWord: true, Enabled: true},
-		{ID: "error", Pattern: "error", Color: "#fca5a5", WholeWord: true, Enabled: true},
+		{ID: "error", Code: "02", Pattern: "error", Color: "#fca5a5", WholeWord: true, Enabled: true},
-		{ID: "ok", Pattern: "ok", Color: "#86efac", WholeWord: true, Enabled: true},
+		{ID: "ok", Code: "03", Pattern: "ok", Color: "#86efac", WholeWord: true, Enabled: true},
 	}
 }
 
+var codeRe = regexp.MustCompile(`^[0-9]{2}$`)
+
+// freeCode returns the lowest code from 01 to 99 not used by tags, or "" when
+// all are taken. A code stays with its tag until the tag is deleted.
+func freeCode(tags []Tag) string {
+	used := map[string]bool{}
+	for _, t := range tags {
+		used[t.Code] = true
+	}
+	for n := 1; n <= 99; n++ {
+		if c := fmt.Sprintf("%02d", n); !used[c] {
+			return c
+		}
+	}
+	return ""
+}
+
+// assignCodes gives a code to the tags that have none (files written before
+// codes existed) or share one with an earlier tag.
+func assignCodes(tags []Tag) bool {
+	changed := false
+	seen := map[string]bool{}
+	for i := range tags {
+		if codeRe.MatchString(tags[i].Code) && !seen[tags[i].Code] {
+			seen[tags[i].Code] = true
+			continue
+		}
+		tags[i].Code = ""
+		tags[i].Code = freeCode(tags)
+		seen[tags[i].Code] = true
+		changed = true
+	}
+	return changed
+}
+
 // Colors of the default tags in earlier versions: still unchanged, they are
 // switched to the new pastel defaults when the file is loaded.
 var oldDefaultColors = map[string]string{"warning": "#f59e0b", "error": "#ef4444", "ok": "#22c55e"}
@@ -67,11 +104,13 @@ func (e *codedError) Error() string {
 
 var (
 	errTagNotFound = &codedError{code: "tag_not_found", msg: "tag not found"}
+	errTooManyTags = &codedError{code: "too_many_tags", msg: "too many tags (99 at most)"}
 	colorRe        = regexp.MustCompile(`^#[0-9a-fA-F]{6}$`)
 )
 
 func (t *Tag) validate() error {
 	t.Pattern = strings.TrimSpace(t.Pattern)
+	t.Label = strings.TrimSpace(t.Label)
 	if t.Pattern == "" {
 		return &codedError{code: "pattern_required", msg: "the keyword is required"}
 	}
@@ -106,7 +145,7 @@ func LoadTagStore(path string) (*TagStore, error) {
 	if err := json.Unmarshal(b, &s.tags); err != nil {
 		return nil, fmt.Errorf("%s: %w", path, err)
 	}
-	if migrateDefaultColors(s.tags) {
+	if c1, c2 := migrateDefaultColors(s.tags), assignCodes(s.tags); c1 || c2 {
 		if err := s.save(); err != nil {
 			return nil, err
 		}
@@ -143,6 +182,9 @@ func (s *TagStore) Create(t Tag) (Tag, error) {
 	t.ID = newID()
 	s.mu.Lock()
 	defer s.mu.Unlock()
+	if t.Code = freeCode(s.tags); t.Code == "" {
+		return t, errTooManyTags
+	}
 	s.tags = append(s.tags, t)
 	return t, s.save()
 }
@@ -156,6 +198,7 @@ func (s *TagStore) Update(id string, t Tag) (Tag, error) {
 	defer s.mu.Unlock()
 	for i := range s.tags {
 		if s.tags[i].ID == id {
+			t.Code = s.tags[i].Code // assigned by the server, never changed
 			s.tags[i] = t
 			return t, s.save()
 		}

tags_test.go

@@ -0,0 +1,54 @@
+package main
+
+import (
+	"os"
+	"path/filepath"
+	"slices"
+	"testing"
+)
+
+func TestTagCodes(t *testing.T) {
+	path := filepath.Join(t.TempDir(), "tags.json")
+	// File written before codes existed, with a duplicate code.
+	old := `[{"id":"a","pattern":"x","color":"#000000"},{"id":"b","code":"07","pattern":"y","color":"#000000"},{"id":"c","code":"07","pattern":"z","color":"#000000"}]`
+	if err := os.WriteFile(path, []byte(old), 0o644); err != nil {
+		t.Fatal(err)
+	}
+	s, err := LoadTagStore(path)
+	if err != nil {
+		t.Fatal(err)
+	}
+	got := []string{}
+	for _, tg := range s.List() {
+		got = append(got, tg.Code)
+	}
+	if want := []string{"01", "07", "02"}; !slices.Equal(got, want) {
+		t.Fatalf("migrated codes = %v, want %v", got, want)
+	}
+
+	n, err := s.Create(Tag{Pattern: "w", Color: "#000000"})
+	if err != nil || n.Code != "03" {
+		t.Fatalf("Create code = %q, %v; want 03", n.Code, err)
+	}
+	// The client cannot change a code.
+	u, err := s.Update("b", Tag{Code: "42", Pattern: "y2", Color: "#000000"})
+	if err != nil || u.Code != "07" {
+		t.Fatalf("Update code = %q, %v; want 07", u.Code, err)
+	}
+	// A deleted tag frees its code; the others keep theirs.
+	if err := s.Delete("a"); err != nil {
+		t.Fatal(err)
+	}
+	if n, _ := s.Create(Tag{Pattern: "v", Color: "#000000"}); n.Code != "01" {
+		t.Fatalf("code after delete = %q, want 01", n.Code)
+	}
+
+	// Codes are saved in the file.
+	s2, err := LoadTagStore(path)
+	if err != nil {
+		t.Fatal(err)
+	}
+	if got := s2.List()[0].Code; got != "07" {
+		t.Fatalf("reloaded code = %q, want 07", got)
+	}
+}

web/app.js

@@ -48,11 +48,18 @@ const I18N = {
     newTag: 'new',
     confirmDelete: (p) => `Delete tag "${p}"?`,
     confirmReset: 'Replace all tags with the defaults (warning, error, ok)?',
+    presetAria: 'Add a preset', presetPick: '+ Preset…',
+    preset_http_status: 'HTTP status codes', preset_http_methods: 'HTTP methods',
+    preset_http_probes: 'Probes and attacks', preset_http_bots: 'Bots and scripts',
+    preset_http_errors: 'TLS/HTTPS and proxy errors',
+    pl_probes: 'probes / attacks', pl_bots: 'bots / scripts', pl_tls: 'TLS errors', pl_proxy: 'proxy errors',
+    presetAdded: (n) => (n ? `${n} tag(s) added` : 'These tags are already in the list'),
     tagsLoadErr: 'Tags: ',
     err_pattern_required: 'The keyword is required',
     err_invalid_color: 'Invalid color (expected #rrggbb)',
     err_invalid_regex: 'Invalid regular expression',
     err_tag_not_found: 'Tag not found',
+    err_too_many_tags: 'Too many tags (99 at most)',
     err_live_logsql: 'Live view is not available in LogsQL mode',
     dateTime: 'Date & time',
     tzLabel: 'Time zone',
@@ -71,7 +78,7 @@ const I18N = {
     srcHost: 'Host system',
     hostTitle: 'Host system logs',
     hostEnabled: 'Collect the system logs of this machine',
-    hostOff: 'Off: the system logs of the machine hosting Logstream are not collected.',
+    hostOff: 'Off: the system logs of the machine hosting LogStream are not collected.',
     hostWaiting: 'Starting…',
     hostJournal: ({ n, r }) => `Reading the systemd journal (${n} files): ${r} entries since startup.`,
     hostFiles: ({ n, r }) => `Following ${n} files of /var/log: ${r} lines since startup.`,
@@ -98,8 +105,8 @@ const I18N = {
     dockerLegend: 'Colored: followed · grey: not followed · dashed: stopped · the color identifies the compose project. Click a label to switch it.',
     dockerNoMatch: 'No container',
     stFollowing: 'followed', stSelected: 'followed when running', stIgnored: 'not followed', stStopped: 'stopped',
-    stLocked: 'excluded', stLockedTitle: 'Logstream itself, or label logstream.exclude=true',
+    stLocked: 'excluded', stLockedTitle: 'LogStream itself, or label logstream.exclude=true',
-    dockerHelp: 'Logs are read through docker-socket-proxy, a read-only gateway: Logstream can list containers and read their logs, nothing else. Choices apply per compose service (or container name), so they survive container re-creations.',
+    dockerHelp: 'Logs are read through docker-socket-proxy, a read-only gateway: LogStream can list containers and read their logs, nothing else. Choices apply per compose service (or container name), so they survive container re-creations.',
     fContainer: 'container', fContainerId: 'container ID', fImage: 'image', fProject: 'compose project',
     fService: 'compose service', fStream: 'stream', fSourceType: 'source',
     fUnit: 'systemd unit', fLogFile: 'log file',
@@ -142,7 +149,9 @@ const I18N = {
     hCappedTitle: 'The chosen division would exceed 300 intervals over this range: it has been enlarged.',
     hUnzoom: '× Reset zoom', unitDay: 'd',
     toTop: 'Back to top',
-    colRcv: 'Received', colMt: 'Message time', colSev: 'Severity', colHost: 'Host', colApp: 'App', colMsg: 'Message',
+    colRcv: 'Received', colMt: 'Message time', colSev: 'Severity', colHost: 'Host', colApp: 'App', colCodes: 'Filters', colMsg: 'Message',
+    codesTitle: 'Codes of the color tags found in the message',
+    tagCodeTitle: 'Code shown on the log lines this tag matches',
     colGrip: 'Drag to resize, double-click for the automatic width',
     resetCols: 'Reset column widths', colsReset: 'Column widths reset',
     colsHelp: 'Drag the edge of a column header in the log list to resize it (remembered by this browser).',
@@ -192,11 +201,18 @@ const I18N = {
     newTag: 'nouveau',
     confirmDelete: (p) => `Supprimer le tag « ${p} » ?`,
     confirmReset: 'Remplacer tous les tags par les tags par défaut (warning, error, ok) ?',
+    presetAria: 'Ajouter un préréglage', presetPick: '+ Préréglage…',
+    preset_http_status: 'Codes HTTP', preset_http_methods: 'Méthodes HTTP',
+    preset_http_probes: 'Sondes et attaques', preset_http_bots: 'Robots et scripts',
+    preset_http_errors: 'Erreurs TLS/HTTPS et proxy',
+    pl_probes: 'sondes / attaques', pl_bots: 'robots / scripts', pl_tls: 'erreurs TLS', pl_proxy: 'erreurs proxy',
+    presetAdded: (n) => (n ? `${n} tag(s) ajouté(s)` : 'Ces tags sont déjà dans la liste'),
     tagsLoadErr: 'Tags : ',
     err_pattern_required: 'Le mot-clé est obligatoire',
     err_invalid_color: 'Couleur invalide (format #rrggbb attendu)',
     err_invalid_regex: 'Expression régulière invalide',
     err_tag_not_found: 'Tag introuvable',
+    err_too_many_tags: 'Trop de tags (99 au maximum)',
     err_live_logsql: 'Le direct n\'est pas disponible en mode LogsQL',
     dateTime: 'Date et heure',
     tzLabel: 'Fuseau horaire',
@@ -215,7 +231,7 @@ const I18N = {
     srcHost: 'Système hôte',
     hostTitle: 'Logs système de l\'hôte',
     hostEnabled: 'Collecter les logs système de cette machine',
-    hostOff: 'Désactivé : les logs système de la machine qui héberge Logstream ne sont pas collectés.',
+    hostOff: 'Désactivé : les logs système de la machine qui héberge LogStream ne sont pas collectés.',
     hostWaiting: 'Démarrage…',
     hostJournal: ({ n, r }) => `Lecture du journal systemd (${n} fichiers) : ${r} entrées depuis le démarrage.`,
     hostFiles: ({ n, r }) => `Suivi de ${n} fichiers de /var/log : ${r} lignes depuis le démarrage.`,
@@ -242,8 +258,8 @@ const I18N = {
     dockerLegend: 'En couleur : suivis · en gris : non suivis · pointillés : arrêtés · la couleur identifie le projet compose. Cliquez sur une étiquette pour la basculer.',
     dockerNoMatch: 'Aucun conteneur',
     stFollowing: 'suivi', stSelected: 'suivi dès qu\'il tourne', stIgnored: 'non suivi', stStopped: 'arrêté',
-    stLocked: 'exclu', stLockedTitle: 'Logstream lui-même, ou étiquette logstream.exclude=true',
+    stLocked: 'exclu', stLockedTitle: 'LogStream lui-même, ou étiquette logstream.exclude=true',
-    dockerHelp: 'Les logs sont lus via docker-socket-proxy, une passerelle en lecture seule : Logstream peut lister les conteneurs et lire leurs logs, rien d\'autre. Les choix s\'appliquent par service compose (ou nom de conteneur), ils survivent donc à la recréation des conteneurs.',
+    dockerHelp: 'Les logs sont lus via docker-socket-proxy, une passerelle en lecture seule : LogStream peut lister les conteneurs et lire leurs logs, rien d\'autre. Les choix s\'appliquent par service compose (ou nom de conteneur), ils survivent donc à la recréation des conteneurs.',
     fContainer: 'conteneur', fContainerId: 'ID du conteneur', fImage: 'image', fProject: 'projet compose',
     fService: 'service compose', fStream: 'flux', fSourceType: 'source',
     fUnit: 'unité systemd', fLogFile: 'fichier de log',
@@ -286,7 +302,9 @@ const I18N = {
     hCappedTitle: 'La division choisie dépasserait 300 intervalles sur cette plage : elle a été élargie.',
     hUnzoom: '× Annuler le zoom', unitDay: 'j',
     toTop: 'Revenir en haut',
-    colRcv: 'Réception', colMt: 'Heure message', colSev: 'Sévérité', colHost: 'Hôte', colApp: 'App', colMsg: 'Message',
+    colRcv: 'Réception', colMt: 'Heure message', colSev: 'Sévérité', colHost: 'Hôte', colApp: 'App', colCodes: 'Filtres', colMsg: 'Message',
+    codesTitle: 'Codes des tags de couleur trouvés dans le message',
+    tagCodeTitle: 'Code affiché sur les lignes de log où ce tag est trouvé',
     colGrip: 'Glisser pour redimensionner, double-clic pour la largeur automatique',
     resetCols: 'Réinitialiser les colonnes', colsReset: 'Largeurs de colonnes réinitialisées',
     colsHelp: 'Glissez le bord d\'un en-tête de colonne de la liste pour la redimensionner (mémorisé par ce navigateur).',
@@ -681,7 +699,11 @@ function compileMatchers() {
     let src = tag.regex ? tag.pattern : escapeRe(tag.pattern);
     if (tag.wholeWord) src = `(?<![\\p{L}\\p{N}_])(?:${src})(?![\\p{L}\\p{N}_])`;
     try {
-      out.push({ re: new RegExp(src, 'gu' + (tag.caseSensitive ? '' : 'i')), html: `<mark class="tag" style="${tagStyle(tag.color)}">` });
+      // A regex may name a group "hl" to color only that part of the match.
+      const hl = tag.regex && /\(\?P?<hl>/.test(tag.pattern);
+      if (hl) src = src.replace(/\(\?P<hl>/g, '(?<hl>');
+      out.push({ re: new RegExp(src, 'gu' + (hl ? 'd' : '') + (tag.caseSensitive ? '' : 'i')), html: `<mark class="tag" style="${tagStyle(tag.color)}">`,
+        code: tag.code, name: tag.label || tag.pattern });
     } catch (e) {
       console.warn('Tag skipped (invalid pattern):', tag.pattern, e.message);
     }
@@ -706,6 +728,8 @@ function highlight(text) {
     let x;
     while ((x = m.re.exec(text)) !== null) {
       if (x[0] === '') { m.re.lastIndex++; continue; }
+      const g = x.indices?.groups?.hl;
+      if (g) { if (g[1] > g[0]) spans.push({ s: g[0], e: g[1], prio, html: m.html }); continue; }
       spans.push({ s: x.index, e: x.index + x[0].length, prio, html: m.html });
     }
   });
@@ -721,6 +745,30 @@ function highlight(text) {
   return out + esc(text.slice(pos));
 }
 
+// Badges with the codes of the tags found in a message, in list order. The
+// column has room for 3: beyond that, 2 badges and "+N" (all in the tooltip).
+function codesHTML(text) {
+  text = String(text ?? '');
+  const found = [];
+  for (const m of state.matchers) {
+    if (!m.code || !text) continue;
+    m.re.lastIndex = 0;
+    let x;
+    while ((x = m.re.exec(text)) !== null) {
+      if (x[0] === '') { m.re.lastIndex++; continue; }
+      const g = x.indices?.groups?.hl;
+      if (!x.indices?.groups || g) { found.push(m); break; }
+    }
+  }
+  if (!found.length) return '';
+  const shown = found.length > 3 ? found.slice(0, 2) : found;
+  const title = found.map((m) => `${m.code} ${m.name}`).join('\n');
+  return `<span title="${esc(title)}">`
+    + shown.map((m) => `<b>${esc(m.code)}</b>`).join('')
+    + (found.length > 3 ? `<b class="more">+${found.length - 2}</b>` : '')
+    + '</span>';
+}
+
 /* ================= List rendering ================= */
 
 const SEV_CLASS = { emerg: 'crit', alert: 'crit', crit: 'crit', err: 'err', warning: 'warning', notice: 'notice', info: 'info', debug: 'debug' };
@@ -746,6 +794,7 @@ function rowHTML(r, isNew) {
     + (r.app
       ? `<span class="app${r.source_type === 'docker' ? ' proj' : ''}" data-act="app"${r.source_type === 'docker' ? ` style="--h:${hueOf(r.compose_project || r.container || r.app)}"` : ''} title="${esc((r.compose_project ? r.compose_project + '/' : '') + (r.container ? r.container + ' · ' : '') + r.app + ' · ' + t('clickApp'))}">${r.source_type === 'docker' ? DOCKER_ICON : ''}${esc(r.app)}</span>`
       : '<span class="app"></span>')
+    + `<span class="codes">${codesHTML(r._msg)}</span>`
     + `<div class="msg">${highlight(r._msg)}</div>`
     + '</article>';
 }
@@ -812,7 +861,9 @@ function renderList() {
 function rehighlight() {
   for (const row of list.children) {
     const r = recOf.get(row);
-    if (r) row.querySelector('.msg').innerHTML = highlight(r._msg);
+    if (!r) continue;
+    row.querySelector('.msg').innerHTML = highlight(r._msg);
+    row.querySelector('.codes').innerHTML = codesHTML(r._msg);
   }
 }
 
@@ -1978,6 +2029,28 @@ $('#purgeBtn').addEventListener('click', async () => {
 
 const PALETTE = ['#6366f1', '#0ea5e9', '#14b8a6', '#a855f7', '#ec4899', '#eab308', '#64748b', '#f97316'];
 
+// Ready-made tags for HTTP/HTTPS access logs. The patterns are valid in both
+// JavaScript and Go (RE2) and cover nginx/Apache (common, combined), Traefik
+// (CLF, JSON), Caddy (JSON) and HAProxy (httplog). For status codes and
+// methods only the "hl" group is colored, not the context around it.
+const HTTP_STATUS_CTX = '(?:" |"(?:status|DownstreamStatus|OriginStatus|status_code)": ?|(?:-1|\\d+)/(?:-1|\\d+)/(?:-1|\\d+)/(?:-1|\\d+)/\\+?\\d+ )';
+const httpStatus = (d, color) => ({ label: `HTTP ${d}xx`, pattern: `${HTTP_STATUS_CTX}(?<hl>${d}\\d\\d)\\b`, color });
+const httpMethod = (m, color) => ({ label: m.replace(/\|/g, '/'), pattern: `"(?<hl>${m})[ "]`, color, caseSensitive: true });
+const PRESETS = {
+  http_status: () => [httpStatus(2, '#86efac'), httpStatus(3, '#93c5fd'), httpStatus(4, '#fdba74'), httpStatus(5, '#f87171')],
+  http_methods: () => [httpMethod('GET|HEAD|OPTIONS', '#cbd5e1'), httpMethod('POST|PUT|PATCH', '#c4b5fd'), httpMethod('DELETE', '#f9a8d4')],
+  http_probes: () => [{ label: t('pl_probes'), color: '#fda4af',
+    pattern: '(?:wp-login\\.php|xmlrpc\\.php|wp-admin|phpmyadmin|/\\.env|/\\.git|/\\.aws|/cgi-bin/|\\.\\./|%2e%2e|/etc/passwd|<script|union(?:\\s|%20|\\+)+select)' }],
+  http_bots: () => [{ label: t('pl_bots'), color: '#fde68a',
+    pattern: '\\b(?:[a-z]*bot|crawler|spider|curl|wget|python-requests|Go-http-client|zgrab|masscan|nmap|sqlmap|nikto)\\b' }],
+  http_errors: () => [
+    { label: t('pl_tls'), color: '#f0abfc',
+      pattern: '(?:TLS handshake error|SSL_do_handshake\\(\\) failed|SSL handshake|SSL routines|certificate (?:has )?expired|certificate verify failed|bad certificate|unknown certificate|x509:)' },
+    { label: t('pl_proxy'), color: '#fdba74',
+      pattern: '(?:upstream timed out|upstream prematurely closed|no live upstreams|connect\\(\\) failed|connection refused|bad gateway|gateway time-?out|service unavailable)' },
+  ],
+};
+
 async function loadTags() {
   try { state.tags = await api('/api/tags'); } catch (e) { toast(t('tagsLoadErr') + e.message); }
   compileMatchers();
@@ -1987,9 +2060,10 @@ function tagRowHTML(tag) {
   const opt = (field, label, title) =>
     `<label class="opt" title="${esc(title)}"><input type="checkbox" data-f="${field}"${tag[field] ? ' checked' : ''}>${esc(label)}</label>`;
   return `<div class="tag-row${tag.enabled ? '' : ' off'}" data-id="${esc(tag.id)}">
+    <span class="tag-code" title="${esc(t('tagCodeTitle'))}">${esc(tag.code || '··')}</span>
     <input type="color" value="${esc(tag.color)}" data-f="color" aria-label="${esc(t('colorAria'))}">
     <input type="text" value="${esc(tag.pattern)}" data-f="pattern" placeholder="${esc(t('keyword'))}" spellcheck="false" aria-label="${esc(t('keyword'))}">
-    <span class="preview"><mark class="tag" style="${tagStyle(tag.color)}">${esc(tag.pattern || t('preview'))}</mark></span>
+    <span class="preview" title="${esc(tag.pattern)}"><mark class="tag" style="${tagStyle(tag.color)}">${esc(tag.label || tag.pattern || t('preview'))}</mark></span>
     <div class="opts">
       ${opt('wholeWord', t('optWhole'), t('optWholeTitle'))}
       ${opt('caseSensitive', 'Aa', t('optCaseTitle'))}
@@ -2032,7 +2106,7 @@ $('#tagList').addEventListener('input', (ev) => {
   tag[field] = ev.target.type === 'checkbox' ? ev.target.checked : ev.target.value;
   rowEl.classList.toggle('off', !tag.enabled);
   const mark = rowEl.querySelector('.preview mark');
-  mark.textContent = tag.pattern || t('preview');
+  mark.textContent = tag.label || tag.pattern || t('preview');
   mark.setAttribute('style', tagStyle(tag.color));
   scheduleSave(tag, rowEl);
   applyTags();
@@ -2065,6 +2139,24 @@ $('#addTag').addEventListener('click', async () => {
   } catch (e) { toast(e.message); }
 });
 
+// Adds a preset group, skipping tags whose pattern is already in the list.
+$('#presetTags').addEventListener('change', async (ev) => {
+  const make = PRESETS[ev.target.value];
+  ev.target.value = '';
+  if (!make) return;
+  let added = 0;
+  try {
+    for (const p of make()) {
+      if (state.tags.some((x) => x.pattern === p.pattern)) continue;
+      state.tags.push(await api('/api/tags', { method: 'POST', body: { regex: true, enabled: true, ...p } }));
+      added++;
+    }
+  } catch (e) { toast(e.message); }
+  renderTagList();
+  applyTags();
+  toast(t('presetAdded', added));
+});
+
 $('#resetTags').addEventListener('click', async () => {
   if (!confirm(t('confirmReset'))) return;
   try {
@@ -2103,7 +2195,7 @@ $('#range').value = store.get('range', '1h');
 if (!$('#range').value) $('#range').value = '1h';
 $('#severity').value = store.get('severity', '');
 
-// With OIDC login, show who is logged in and the log out button.
+// With a login (local or OIDC), show who is logged in and the log out button.
 fetch('/auth/me').then((res) => (res.ok ? res.json() : null)).then((me) => {
   if (!me || !me.user) return;
   const btn = $('#logoutBtn');

web/index.html

@@ -3,7 +3,7 @@
 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1">
-  <title>Logstream</title>
+  <title>LogStream</title>
   <link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect width='32' height='32' rx='8' fill='%236366f1'/%3E%3Cpath d='M8 10h16M8 16h11M8 22h14' stroke='white' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E">
   <link rel="stylesheet" href="style.css">
   <script>
@@ -20,7 +20,7 @@
   <header class="topbar">
     <div class="brand">
       <svg viewBox="0 0 32 32" aria-hidden="true"><rect width="32" height="32" rx="8"/><path d="M8 10h16M8 16h11M8 22h14"/></svg>
-      <span>Logstream</span>
+      <span>LogStream</span>
     </div>
 
     <div class="search">
@@ -107,6 +107,7 @@
       <span data-col="sev"><span class="lbl" data-i18n="colSev">Severity</span><i class="grip" data-i18n-title="colGrip"></i></span>
       <span data-col="host"><span class="lbl" data-i18n="colHost">Host</span><i class="grip" data-i18n-title="colGrip"></i></span>
       <span data-col="app"><span class="lbl" data-i18n="colApp">App</span><i class="grip" data-i18n-title="colGrip"></i></span>
+      <span data-col="codes"><span class="lbl" data-i18n="colCodes" data-i18n-title="codesTitle">Filters</span></span>
       <span data-col="msg"><span class="lbl" data-i18n="colMsg">Message</span></span>
     </div>
     <main id="list" class="list"></main>
@@ -188,7 +189,17 @@
               <p class="muted small" data-i18n="tagsHelp"></p>
               <div id="tagList" class="tag-list"></div>
               <footer>
-                <button id="addTag" class="btn primary" type="button" data-i18n="addTag">+ Add tag</button>
+                <span class="tag-add">
+                  <button id="addTag" class="btn primary" type="button" data-i18n="addTag">+ Add tag</button>
+                  <select id="presetTags" class="field" aria-label="Presets" data-i18n-aria="presetAria">
+                    <option value="" data-i18n="presetPick">+ Preset…</option>
+                    <option value="http_status" data-i18n="preset_http_status">HTTP status codes</option>
+                    <option value="http_methods" data-i18n="preset_http_methods">HTTP methods</option>
+                    <option value="http_probes" data-i18n="preset_http_probes">Probes and attacks</option>
+                    <option value="http_bots" data-i18n="preset_http_bots">Bots and scripts</option>
+                    <option value="http_errors" data-i18n="preset_http_errors">TLS/HTTPS and proxy errors</option>
+                  </select>
+                </span>
                 <button id="resetTags" class="btn ghost" type="button" data-i18n="resetTags">Restore default tags</button>
               </footer>
             </section>

web/login.html

@@ -0,0 +1,95 @@
+<!doctype html>
+<html lang="en">
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>LogStream</title>
+  <link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect width='32' height='32' rx='8' fill='%236366f1'/%3E%3Cpath d='M8 10h16M8 16h11M8 22h14' stroke='white' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E">
+  <link rel="stylesheet" href="style.css">
+  <script>
+    // Same saved theme and language as the UI, applied before first paint.
+    try {
+      var t = localStorage.getItem('logstream.theme');
+      if (t === 'light' || t === 'dark') document.documentElement.dataset.theme = t;
+      var l = localStorage.getItem('logstream.lang');
+      if (l) document.documentElement.lang = l;
+    } catch (e) {}
+  </script>
+</head>
+<body class="login-page">
+  <div class="login-tools">
+    <div class="seg" role="radiogroup" id="langSwitch">
+      <button type="button" role="radio" data-lang="fr">FR</button>
+      <button type="button" role="radio" data-lang="en">EN</button>
+    </div>
+    <button id="themeBtn" class="icon-btn" type="button" data-i18n-title="theme" data-i18n-aria="theme">
+      <svg class="sun" viewBox="0 0 24 24"><circle cx="12" cy="12" r="4"/><path d="M12 2v2M12 20v2M4.9 4.9l1.4 1.4M17.7 17.7l1.4 1.4M2 12h2M20 12h2M4.9 19.1l1.4-1.4M17.7 6.3l1.4-1.4"/></svg>
+      <svg class="moon" viewBox="0 0 24 24"><path d="M21 12.8A9 9 0 1 1 11.2 3a7 7 0 0 0 9.8 9.8z"/></svg>
+    </button>
+  </div>
+
+  <main class="login-card">
+    <img id="logo" class="login-logo" src="auth/logo" alt="" hidden>
+    <div class="brand">
+      <svg viewBox="0 0 32 32" aria-hidden="true"><rect width="32" height="32" rx="8"/><path d="M8 10h16M8 16h11M8 22h14"/></svg>
+      <span>LogStream</span>
+    </div>
+    <p class="muted" data-i18n="intro">Sign in to view the logs.</p>
+
+    <form method="post" action="auth/login">
+      <input type="hidden" name="r" id="ret">
+      <label for="user" data-i18n="user">User</label>
+      <input id="user" name="user" type="text" autocomplete="username" autocapitalize="none" spellcheck="false" required autofocus>
+      <label for="pass" data-i18n="pass">Password</label>
+      <input id="pass" name="pass" type="password" autocomplete="current-password" required>
+      <p id="err" class="login-err" role="alert" data-i18n="error" hidden>Wrong user or password.</p>
+      <button class="btn primary" type="submit" data-i18n="submit">Sign in</button>
+    </form>
+  </main>
+
+  <script>
+    (function () {
+      var I18N = {
+        en: { intro: 'Sign in to view the logs.', user: 'User', pass: 'Password', submit: 'Sign in',
+              error: 'Wrong user or password.', theme: 'Light / dark theme' },
+        fr: { intro: 'Connectez-vous pour consulter les logs.', user: 'Utilisateur', pass: 'Mot de passe',
+              submit: 'Se connecter', error: 'Utilisateur ou mot de passe incorrect.', theme: 'Thème clair / sombre' },
+      };
+      function get(k) { try { return localStorage.getItem('logstream.' + k); } catch (e) { return null; } }
+      function set(k, v) { try { localStorage.setItem('logstream.' + k, v); } catch (e) {} }
+      var lang = get('lang');
+      if (!I18N[lang]) lang = /^fr\b/i.test(navigator.language || '') ? 'fr' : 'en';
+
+      function applyLang() {
+        var d = I18N[lang];
+        document.documentElement.lang = lang;
+        document.querySelectorAll('[data-i18n]').forEach(function (el) { el.textContent = d[el.dataset.i18n]; });
+        document.querySelectorAll('[data-i18n-title]').forEach(function (el) { el.title = d[el.dataset.i18nTitle]; });
+        document.querySelectorAll('[data-i18n-aria]').forEach(function (el) { el.setAttribute('aria-label', d[el.dataset.i18nAria]); });
+        document.querySelectorAll('#langSwitch [data-lang]').forEach(function (b) { b.setAttribute('aria-checked', String(b.dataset.lang === lang)); });
+      }
+      document.querySelectorAll('#langSwitch [data-lang]').forEach(function (b) {
+        b.addEventListener('click', function () { lang = b.dataset.lang; set('lang', lang); applyLang(); });
+      });
+
+      document.getElementById('themeBtn').addEventListener('click', function () {
+        var root = document.documentElement;
+        var dark = root.dataset.theme ? root.dataset.theme === 'dark' : matchMedia('(prefers-color-scheme: dark)').matches;
+        root.dataset.theme = dark ? 'light' : 'dark';
+        set('theme', root.dataset.theme);
+      });
+
+      var q = new URLSearchParams(location.search);
+      document.getElementById('ret').value = q.get('r') || '/';
+      document.getElementById('err').hidden = q.get('e') !== '1';
+
+      // LOGIN_LOGO: shown only when the server has one.
+      var logo = document.getElementById('logo');
+      logo.addEventListener('load', function () { logo.hidden = false; });
+      if (logo.complete && logo.naturalWidth) logo.hidden = false;
+
+      applyLang();
+    })();
+  </script>
+</body>
+</html>

web/style.css

@@ -37,7 +37,8 @@
   --tag-warning: #fdba74;
   --tag-warning-text: #111827;
 
-  --log-size: 12.5px;   /* Settings > Interface > Font size */
+  --log-size: 12.5px;
+  --codes-w: 4.9rem;    /* tag codes column: room for 3 badges */   /* Settings > Interface > Font size */
   /* --log-font is set by Settings > Interface > Font (defaults to --mono) */
   --mono: ui-monospace, "SF Mono", "JetBrains Mono", "Cascadia Code", Menlo, Consolas, monospace;
   --sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
@@ -296,13 +297,13 @@ body.busy .progress::after {
 .list { margin: 6px 20px 0; background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; }
 .list:empty { display: none; }
 
-/* Columns: received, message time, severity, host, app, message. Widths come from
+/* Columns: received, message time, severity, host, app, tag codes, message. Widths come from
    --col-* (set on #table when a column has been resized, see app.js), shared by
    the header and every row through subgrid so that the columns line up. */
 .table {
   display: grid;
   grid-template-columns: var(--col-rcv, max-content) var(--col-mt, max-content) var(--col-sev, 4.6rem)
-    var(--col-host, minmax(5rem, 9rem)) var(--col-app, minmax(4rem, 8rem)) minmax(0, 1fr);
+    var(--col-host, minmax(5rem, 9rem)) var(--col-app, minmax(4rem, 8rem)) var(--codes-w) minmax(0, 1fr);
   column-gap: 12px;
   margin: 6px 20px 0; background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius);
   overflow: clip; /* rounded corners without breaking the sticky header (hidden would) */
@@ -331,7 +332,7 @@ body.col-resizing, body.col-resizing * { cursor: col-resize !important; user-sel
 
 .row {
   display: grid;
-  grid-template-columns: max-content max-content 4.6rem minmax(5rem, 9rem) minmax(4rem, 8rem) 1fr;
+  grid-template-columns: max-content max-content 4.6rem minmax(5rem, 9rem) minmax(4rem, 8rem) var(--codes-w) 1fr;
   gap: 0 12px; align-items: baseline;
   padding: 5px 14px 5px 11px;
   border-left: 3px solid transparent;
@@ -372,6 +373,15 @@ body.col-resizing, body.col-resizing * { cursor: col-resize !important; user-sel
 .row.sev-crit, .row.sev-err, .row.sev-warning { border-left-color: var(--sev); }
 .row.sev-crit, .row.sev-err { background: color-mix(in srgb, var(--sev) 7%, transparent); }
 .row .host[data-act], .row .app[data-act] { cursor: pointer; }
+/* Codes of the tags found in the message: grey badges, fixed size */
+.row .codes { white-space: nowrap; overflow: hidden; }
+.row .codes > span { display: inline-flex; gap: 3px; vertical-align: 1px; }
+.row .codes b, .tag-code {
+  min-width: 2.2ch; padding: 1px 4px; border-radius: 4px; text-align: center;
+  font-family: var(--mono); font-size: 10.5px; font-weight: 700; line-height: 1.35; font-variant-numeric: tabular-nums;
+  background: #b4bac3; color: #111827;
+}
+.row .codes b.more { background: none; box-shadow: inset 0 0 0 1px #b4bac3; color: var(--muted); }
 .row .host[data-act]:hover, .row .app[data-act]:hover { color: var(--accent); text-decoration: underline; text-underline-offset: 2px; }
 
 mark.tag {
@@ -475,6 +485,7 @@ dialog.settings .dlg > header { padding: 14px 16px 14px 22px; border-bottom: 1px
 .preview-list .row .host { grid-area: host; }
 .preview-list .row .app { grid-area: app; display: block; }
 .preview-list .row .msg { grid-area: msg; }
+.preview-list .row .codes { display: none; }
 
 dialog {
   width: min(720px, calc(100vw - 32px)); max-height: calc(100vh - 64px);
@@ -578,6 +589,8 @@ input.switch:disabled { cursor: not-allowed; }
 input.switch:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
 
 .set-section footer { display: flex; flex-wrap: wrap; gap: 8px; justify-content: space-between; margin-top: 14px; }
+.tag-add { display: flex; flex-wrap: wrap; gap: 8px; }
+.tag-add select.field { width: auto; }
 
 .seg { display: inline-flex; padding: 3px; gap: 3px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 10px; }
 .seg button {
@@ -590,11 +603,12 @@ input.switch:focus-visible { outline: 2px solid var(--accent); outline-offset: 2
 .tag-list { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; }
 .tag-row {
   display: grid; align-items: center; gap: 8px 10px;
-  grid-template-columns: 38px minmax(8rem, 1fr) 7.5rem auto 36px;
+  grid-template-columns: auto 38px minmax(8rem, 1fr) 7.5rem auto 36px;
   padding: 8px 10px; border: 1px solid var(--border); border-radius: 10px;
   background: var(--panel-2);
 }
 .tag-row.off { opacity: .55; }
+.tag-row .tag-code { font-size: 12px; padding: 3px 6px; cursor: default; }
 .tag-row input[type="color"] {
   width: 38px; height: 32px; padding: 0; border: 1px solid var(--border); border-radius: 8px;
   background: none; cursor: pointer;
@@ -637,8 +651,8 @@ input.switch:focus-visible { outline: 2px solid var(--accent); outline-offset: 2
   .table .list { display: block; margin: 0; }
   .list-head { display: none; }
   .row, .table .row {
-    grid-template-columns: auto auto 1fr;
+    grid-template-columns: auto auto 1fr auto;
-    grid-template-areas: "rcv sev host" "msg msg msg";
+    grid-template-areas: "rcv sev host codes" "msg msg msg msg";
     gap: 3px 8px; padding: 8px 12px 8px 10px;
   }
   .row time.rcv { grid-area: rcv; }
@@ -646,6 +660,7 @@ input.switch:focus-visible { outline: 2px solid var(--accent); outline-offset: 2
   .row .sev { grid-area: sev; }
   .row .host { grid-area: host; justify-self: end; max-width: 100%; }
   .row .app { display: none; }
+  .row .codes { grid-area: codes; }
   .row .msg { grid-area: msg; }
   .details { grid-column: 1 / -1; }
   .details dl { grid-template-columns: 1fr; }
@@ -667,8 +682,34 @@ input.switch:focus-visible { outline: 2px solid var(--accent); outline-offset: 2
   #sizeSwitch button { flex: 1; padding: 0 4px; white-space: nowrap; font-size: 12px; }
   .field-grid select { margin-bottom: 6px; }
   .status { padding: 6px 16px; }
-  .tag-row { grid-template-columns: 38px 1fr 36px; }
+  .tag-row { grid-template-columns: auto 38px 1fr 36px; }
   .tag-row .preview { display: none; }
   .tag-row .opts { grid-column: 1 / -1; grid-row: 2; flex-wrap: wrap; }
-  .tag-row [data-del] { grid-column: 3; grid-row: 1; }
+  .tag-row [data-del] { grid-column: 4; grid-row: 1; }
 }
+
+/* ---------- Login page (AUTH_MODE=local) ---------- */
+body.login-page {
+  min-height: 100vh; padding: 16px;
+  display: grid; place-items: center;
+}
+.login-tools { position: fixed; top: 12px; right: 16px; display: flex; align-items: center; gap: 8px; }
+.login-card {
+  width: 100%; max-width: 360px;
+  display: flex; flex-direction: column; align-items: center; gap: 10px;
+  padding: 32px 28px 28px;
+  background: var(--panel); border: 1px solid var(--border); border-radius: 14px; box-shadow: var(--shadow);
+}
+.login-logo { max-width: 200px; max-height: 96px; object-fit: contain; margin-bottom: 6px; }
+.login-card .brand { font-size: 20px; }
+.login-card .brand svg { width: 32px; height: 32px; }
+.login-card > p { margin: 0 0 8px; text-align: center; }
+.login-card form { width: 100%; display: flex; flex-direction: column; gap: 6px; }
+.login-card label { font-size: 13px; font-weight: 550; }
+.login-card input {
+  height: 38px; padding: 0 11px; margin-bottom: 6px;
+  border: 1px solid var(--border); border-radius: 9px; background: var(--bg);
+}
+.login-card input:focus { outline: 0; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
+.login-card .btn.primary { height: 38px; justify-content: center; margin-top: 6px; font-size: 14px; }
+.login-err { margin: 0; color: var(--sev-err); font-size: 13px; }