From 8d105b63ec2650c7cc1338bd15b62d68b4c01a2d Mon Sep 17 00:00:00 2001 From: Gilles Soulier Date: Fri, 5 Jun 2026 05:05:27 +0200 Subject: [PATCH] =?UTF-8?q?docs:=20spec=20jalon=202=20-=20s=C3=A9paration?= =?UTF-8?q?=20terminal=20par=20machine=20+=20remont=C3=A9e=20d'=C3=A9tat?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Suite au test live: retour d'usage (amelioration.md) sur la séparation des sorties entre machines distinctes dans le terminal. Co-Authored-By: Claude Opus 4.8 --- .../specs/2026-06-05-jalon2-polish-design-system-design.md | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/docs/superpowers/specs/2026-06-05-jalon2-polish-design-system-design.md b/docs/superpowers/specs/2026-06-05-jalon2-polish-design-system-design.md index 946098c..b9cdf0d 100644 --- a/docs/superpowers/specs/2026-06-05-jalon2-polish-design-system-design.md +++ b/docs/superpowers/specs/2026-06-05-jalon2-polish-design-system-design.md @@ -63,6 +63,8 @@ Le design system impose (consigne) : variables CSS uniquement, composants exista `App.tsx` orchestre : `
` en haut, la rangée 3 volets au milieu (flex:1), `` en bas. +**Remontée d'état dans `App`** : la liste des machines, les compteurs d'updates, la machine sélectionnée et le thème vivent désormais dans `App` (le Dashboard les reçoit en props, plus de fetch local autonome). Cela alimente le Header (action Ajouter), la StatusBar (N machines, M updates) et le TerminalPanel (machine sélectionnée). Le chargement des machines + snapshots se fait dans `App` via une fonction `load()` passée au Dashboard pour rafraîchir après action. + ## Composants ### Nouveaux @@ -80,7 +82,7 @@ Le design system impose (consigne) : variables CSS uniquement, composants exista - **`AddMachineModal.tsx`** : enveloppé dans `` ; footer = `` + `` ; champs en inputs tokenisés ; erreur affichée avec `` + texte `--err`. Logique de soumission inchangée (POST /api/machines). - **`Dashboard.tsx`** : retirer le bouton « + Ajouter » local (déplacé dans le Header) ; le Dashboard expose l'ouverture de la modale via prop/état remonté à `App`. Grille de tuiles inchangée. État vide : texte `--ink-3`. - **`HermesPanel.tsx`** : en-tête `.label` + `` (ou autre), texte stub inchangé. -- **`TerminalPanel.tsx`** : ajouter un petit en-tête `.label` « TERMINAL · {machineId ?? "—"} » au-dessus du conteneur xterm. xterm inchangé. +- **`TerminalPanel.tsx`** : recevoir la **machine sélectionnée** (objet `MachineView`, pas juste l'id) depuis `App`. En-tête clair au-dessus du xterm : `` + `.label` « TERMINAL » + nom de la machine (`.mono`) + hostname (`--ink-3`). **Séparation franche entre machines** (retour d'usage, `amelioration.md`) : à chaque changement de machine, écrire une bannière de séparation dans le terminal, p. ex. `\n──────── () ────────\n` (couleur accent), avant de rejouer le flux. Le terminal est déjà recréé par machine (`useEffect` deps) ; l'en-tête nommé + la bannière rendent le passage d'une machine à l'autre non ambigu (fini l'UUID). xterm inchangé sinon. ## Flux thème @@ -103,5 +105,6 @@ Au montage de `App` : `applyTheme(getInitialTheme())`. État `theme` dans `App` - [ ] Header avec titre, bouton Ajouter, bascule thème fonctionnelle et persistée. - [ ] Status bar tmux avec mode, compteurs et horloge live. - [ ] MachineTile utilise StatusLed + IconButton (tooltips) ; AddMachineModal utilise Popup + Button. +- [ ] Le terminal identifie clairement la machine courante (nom + hostname, plus d'UUID) et marque une séparation franche au passage d'une machine à l'autre. - [ ] Les deux thèmes sont cohérents et lisibles. - [ ] `pnpm check`, `pnpm build`, et les tests des helpers passent.