Merge pull request 'Flowdeck 7.85.1 — HUB-18 : thème commun, barre v0.5.0 + initialisation thème Hub (fusion #132)' (#52) from hub18-theme-commun into main

CHANGELOG.md

@@ -1,3 +1,13 @@
+## v7.85.1 (2026-11-06) — Barre commune v0.5.0 : thème commun (HUB-18, fusion #132)
+
+> **Hypothèse d'ordre** : cette version suppose la fusion préalable de la PR HUB-15 #51 (Flowdeck 7.85.0) ; branchée sur `main` (7.84.15), elle vise **7.85.1**.
+
+- **Barre d'apps v0.5.0 vendangée (dracodev-commons, branche `hub18-theme-commun`, PR commons #12)** : seul `static/js/vendor/draco-barre.js` change, remplacé verbatim par la v0.5.0 ; le CSS et le fragment `app/templates/_draco_bar.html` sont inchangés.
+- **Thème commun** : la barre apprend la préférence de thème du profil du Hub (`GET <hub>/api/profil/theme`, cookie draco ; `<hub>` = URL résolue de la barre, jamais figée) et l'applique à l'ouverture : cache `localStorage` `draco-theme-hub` (TTL 12 h) appliqué synchrone, puis fetch asynchrone non bloquant ; `sombre`/`clair` posent `data-theme`, `systeme` le retire (`prefers-color-scheme` décide). **Repli intégral** si le Hub ne répond pas, répond non-OK ou `theme: null` : le comportement actuel (choix local, puis système) reste seul maître.
+- **Initialisation propre à Flowdeck** (`static/js/app.js`) : écoute de l'événement `draco:theme` de la barre — le mode effectif est appliqué sur `data-theme` et mémorisé dans la clé locale `theme` (convergence) ; le sélecteur de thème des Réglages reste fonctionnel pour la session.
+- **Cache** : le bump 7.85.0 → 7.85.1 change aussi `asset_version`, donc les navigateurs ne garderont pas l'ancienne barre.
+- Tests : `tests/test_draco_bar_texte.py` étendu (marqueurs v0.5.0 du JS vendangé + écouteur `draco:theme` dans app.js).
+
 ## v7.85.0 (2026-11-06) — HUB-15 : provisionnement JIT des comptes draco (fusion #129)
 
 - **Généralisation de `maybe_link` en création JIT** (`app/services/draco.py`) : à la première connexion avec un cookie `draco_session` valide, si aucun compte local ne correspond au `sub` (ni lien `draco_links`, ni repli mono-utilisateur), le pendant local est **créé automatiquement** depuis les claims (`sub`, `name`) et lié au `sub` dans la même transaction — aucune création manuelle dans l'app. Un compte de suite créé dans le Hub fonctionne donc dans Flowdeck dès sa première visite.

VERSION

@@ -1 +1 @@
-7.85.0
+7.85.1

app/main.py

@@ -216,7 +216,7 @@ def _lire_version() -> str:
 
 
 # Littéral de version synchronisé avec le fichier VERSION :
-# version="7.85.0"
+# version="7.85.1"
 # Patron historique des bumps (voir scripts/bump_version.py, qui cherche
 # ce littéral) et contrôle de tests/test_pwa_offline.py. La version
 # runtime reste lue dynamiquement depuis VERSION par _lire_version()

static/js/app.js

@@ -64,6 +64,25 @@
     document.documentElement.setAttribute('data-theme', savedTheme);
   }
 
+  // Thème commun de la suite (HUB-18, fusion #132) : la barre
+  // commune (barre v0.5.0) applique la préférence du Hub à
+  // l'ouverture — directement sur data-theme depuis son cache, et
+  // via l'événement « draco:theme » quand le fetch aboutit. Le mode
+  // effectif est mémorisé dans la clé locale « theme » (convergence :
+  // la préférence du Hub devient le choix local courant) ; le
+  // sélecteur de thème de Flowdeck (Réglages) reste le maître pour
+  // la suite de la session. Repli : si le Hub ne répond pas, aucun
+  // événement n'arrive et le choix local ci-dessus reste seul
+  // maître, comme avant. app.js (defer) s'exécute avant la barre :
+  // l'écouteur est donc toujours posé à temps pour le fetch.
+  document.addEventListener('draco:theme', function(e) {
+    const mode = e && e.detail && e.detail.mode;
+    if (mode === 'dark' || mode === 'light') {
+      document.documentElement.setAttribute('data-theme', mode);
+      try { localStorage.setItem('theme', mode); } catch (err) { /* stockage indisponible */ }
+    }
+  });
+
   // Close context menu on click outside
   document.addEventListener('click', function(e) {
     const menu = document.getElementById('context-menu');

static/js/vendor/draco-barre.js

@@ -36,6 +36,12 @@
  * remplissage), aligné à gauche du libellé via .draco-menu-icone.
  * L'en-tête d'identité ne reçoit pas d'icône. Aucun changement de
  * comportement : liens résolus et Déconnexion relayée inchangés.
+ * v0.5.0 (carte HUB-18, fusion #132) : thème commun de la suite —
+ * la barre apprend la préférence de thème du profil du Hub
+ * (GET <hub>/api/profil/theme, cookie draco) et l'applique à
+ * l'ouverture par le mécanisme data-theme des hôtes, avec cache
+ * local court et repli intégral sur le comportement actuel de
+ * l'hôte si le Hub ne répond pas. Voir « Thème commun » plus bas.
  *
  * Aucun gestionnaire inline : un seul écouteur délégué sur le document
  * (patron validé par le prototype — les onclick du HTML généré sont
@@ -268,6 +274,131 @@
   }
   var resolvedUrls = resolveUrls();
 
+  /* ── Thème commun (v0.5.0, carte HUB-18, fusion #132) ────────────
+   * La préférence de thème de la suite vit dans le profil du Hub :
+   *   GET <hub>/api/profil/theme → {"theme": "sombre"|"clair"|"systeme"|null}
+   * authentifié par le cookie draco (credentials: "include").
+   * <hub> est l'URL RÉSOLUE ci-dessus (explicite > dérivation -dev >
+   * défaut officiel) — jamais un nom figé de plus.
+   * Application par le mécanisme data-theme existant des hôtes :
+   * "sombre" → data-theme="dark", "clair" → data-theme="light",
+   * "systeme" → attribut RETIRÉ (prefers-color-scheme décide, garde
+   * html:not([data-theme]) du CSS de la barre comme des hôtes).
+   * L'événement draco:theme ({theme, mode} — mode = "dark"/"light"
+   * EFFECTIF) est ensuite dispatché pour les hôtes dont le mécanisme
+   * propre doit suivre (icônes et libellés, feuilles de style,
+   * palettes ShaarIt, attribut dédié de la console…) ; un hôte qui
+   * s'initialise après la barre lit la même information dans
+   * DRACO_BAR.themePref / DRACO_BAR.themeMode.
+   * Ordre d'application : 1) le cache local FRAIS est appliqué de
+   * façon SYNCHRONE à l'initialisation de la barre (script en defer
+   * chez tous les hôtes : avant DOMContentLoaded, donc avant le
+   * premier rendu dans le cas général) ; 2) un fetch ASYNCHRONE et
+   * NON BLOQUANT rafraîchit le cache et ré-applique si la préférence
+   * a changé. À la toute première visite (aucun cache), un bref
+   * flash du thème local de l'hôte reste possible le temps du fetch :
+   * c'est le prix du repli — l'état affiché transitoire est le thème
+   * que l'hôte aurait de toute façon choisi seul, jamais un état
+   * cassé, et les visites suivantes sont servies par le cache.
+   * Cache : localStorage "draco-theme-hub" ({theme, ts}), TTL 12 h
+   * (ordre de la journée) ; il ne contient QUE la préférence du Hub,
+   * jamais le choix local de l'hôte.
+   * REPLI INTÉGRAL : Hub injoignable, réponse non-OK (401…), JSON
+   * invalide, theme null ou valeur inconnue → RIEN n'est appliqué et
+   * RIEN n'est mis en cache ; un échec de fetch n'efface pas un cache
+   * existant. Le comportement actuel de l'hôte (son localStorage,
+   * puis le système) reste alors exactement le maître, comme avant
+   * la v0.5.0. Le sélecteur de thème LOCAL de chaque hôte reste
+   * fonctionnel : la barre n'applique qu'à l'ouverture (cache, puis
+   * fetch) ; elle ne ré-applique ensuite que sur changement du
+   * schéma système, et seulement tant que la préférence résolue est
+   * "systeme". */
+  var THEME_CACHE_CLE = "draco-theme-hub";
+  var THEME_CACHE_TTL_MS = 12 * 60 * 60 * 1000;
+  var themePref = null;  /* "sombre"|"clair"|"systeme"|null (non résolue) */
+  var themeMode = null;  /* "dark"|"light"|null : mode effectif appliqué */
+
+  function themeSystemeEstSombre() {
+    try {
+      return !!(window.matchMedia &&
+        window.matchMedia("(prefers-color-scheme: dark)").matches);
+    } catch (e) { return false; }
+  }
+  function lireCacheTheme() {
+    try {
+      var brut = window.localStorage &&
+        window.localStorage.getItem(THEME_CACHE_CLE);
+      if (!brut) return null;
+      var c = JSON.parse(brut);
+      if (!c || typeof c.ts !== "number") return null;
+      if (Date.now() - c.ts > THEME_CACHE_TTL_MS) return null;
+      if (c.theme === "sombre" || c.theme === "clair" || c.theme === "systeme")
+        return c.theme;
+    } catch (e) { /* stockage indisponible ou corrompu : pas de cache */ }
+    return null;
+  }
+  function ecrireCacheTheme(theme) {
+    try {
+      if (window.localStorage) {
+        window.localStorage.setItem(THEME_CACHE_CLE,
+          JSON.stringify({ theme: theme, ts: Date.now() }));
+      }
+    } catch (e) { /* stockage indisponible : le prochain fetch refera le travail */ }
+  }
+  function appliquerThemeCommun(theme) {
+    var root = document.documentElement;
+    if (!root) return;
+    if (theme === "sombre" || theme === "clair") {
+      themeMode = theme === "sombre" ? "dark" : "light";
+      root.setAttribute("data-theme", themeMode);
+    } else if (theme === "systeme") {
+      themeMode = themeSystemeEstSombre() ? "dark" : "light";
+      root.removeAttribute("data-theme");
+    } else {
+      return;
+    }
+    themePref = theme;
+    if (window.DRACO_BAR) {
+      window.DRACO_BAR.themePref = themePref;
+      window.DRACO_BAR.themeMode = themeMode;
+    }
+    try {
+      document.dispatchEvent(new CustomEvent("draco:theme",
+        { detail: { theme: themePref, mode: themeMode } }));
+    } catch (e) { /* aucun écouteur hôte : data-theme suffit */ }
+  }
+  function initThemeCommun() {
+    var enCache = lireCacheTheme();
+    if (enCache) appliquerThemeCommun(enCache);
+    /* Suivi du schéma système tant que la préférence est "systeme" :
+     * sans data-theme, le CSS suit tout seul ; l'événement est
+     * re-dispatché pour les hôtes qui matérialisent le mode. */
+    try {
+      var mq = window.matchMedia &&
+        window.matchMedia("(prefers-color-scheme: dark)");
+      if (mq && mq.addEventListener) {
+        mq.addEventListener("change", function () {
+          if (themePref === "systeme") appliquerThemeCommun("systeme");
+        });
+      }
+    } catch (e) { /* pas de matchMedia : pas de suivi */ }
+    if (typeof window.fetch !== "function") return;
+    var url = withSlash(resolvedUrls.hub || DEFAULT_URLS.hub) +
+      "api/profil/theme";
+    window.fetch(url, { credentials: "include" }).then(function (resp) {
+      if (!resp || !resp.ok) return null;
+      return resp.json();
+    }).then(function (data) {
+      if (!data) return;
+      var t = data.theme;
+      if (t === "sombre" || t === "clair" || t === "systeme") {
+        ecrireCacheTheme(t);
+        appliquerThemeCommun(t);
+      }
+      /* theme null ou inconnu : repli intégral, rien n'est touché. */
+    }).catch(function () { /* Hub injoignable : repli intégral */ });
+  }
+
   function setCounts(counts) {
     Object.keys(counts || {}).forEach(function (k) {
       /* Toutes les occurrences : l'onglet ET sa ligne dans le menu. */
@@ -695,6 +826,9 @@
   window.DRACO_BAR = {
     setCounts: setCounts, setCurrent: setCurrent, setDomain: setDomain,
     urls: resolvedUrls,
+    /* Thème commun (v0.5.0) : préférence du Hub résolue et mode
+     * effectif appliqué ; null tant que rien n'a été résolu (repli). */
+    themePref: null, themeMode: null,
     setUrls: function (urls) {
       cfg.urls = Object.assign({}, cfg.urls, urls || {});
       resolvedUrls = resolveUrls();
@@ -709,6 +843,7 @@
   buildCompteMenu();
   syncAvatar();
   refreshCompteMenu();
+  initThemeCommun();
   if (cfg.current) setCurrent(cfg.current);
   if (cfg.domain) setDomain(cfg.domain);
   if (cfg.counts) setCounts(cfg.counts);

tests/test_draco_bar_texte.py

@@ -115,3 +115,19 @@ def test_barre_intacte_apres_suppression():
     # draco-barre.js depuis les onglets : l'onglet agent suffit a l'alimenter.
     js_barre = (ROOT / "static/js/vendor/draco-barre.js").read_text()
     assert "Console Spark" in js_barre
+
+
+def test_barre_v050_theme_commun_hub18():
+    # v0.5.0 (HUB-18, fusion #132) : la barre apprend la préférence
+    # de thème du Hub et l'applique à l'ouverture. Vendange verbatim
+    # commons ; l'initialisation propre à Flowdeck vit dans app.js
+    # (écouteur draco:theme → data-theme + clé locale « theme »).
+    js = (ROOT / "static/js/vendor/draco-barre.js").read_text(encoding="utf-8")
+    assert "api/profil/theme" in js
+    assert 'credentials: "include"' in js
+    assert "draco-theme-hub" in js
+    assert 'CustomEvent("draco:theme"' in js
+    assert "themePref" in js and "themeMode" in js
+    assert "resolvedUrls.hub" in js
+    app = (ROOT / "static/js/app.js").read_text(encoding="utf-8")
+    assert 'addEventListener("draco:theme"' in app or "addEventListener('draco:theme'" in app