Appearance
BDD-128 — Améliorer l'ergonomie du Workflow Editor (cohérence UI)
User story
En tant qu'administrateur, je veux une interface d'édition de workflow visuellement cohérente (barre d'outils, menu d'ajout de blocs, inspecteur, icônes du canvas), afin de configurer mes flux plus rapidement et sans ambiguïté (retours UX Romain).
Critères d'acceptance
| Critère | Statut |
|---|---|
| Boutons de la barre d'outils (Sauvegarder, Ajouter un bloc, Résumé, Lancer) : même hauteur, style et hiérarchie visuelle | ✅ |
| Menu « Ajouter un bloc » : style aligné sur les menus d'action ; indication clic vs glisser-déposer | ✅ |
| Clic sur un type de bloc : ajout au centre du canvas | ✅ |
| Inspecteur Source : sections « Général » et « Fichier du dépôt » alignées ; bannières info discrètes ; « Colonnes détectées » sans surclasser Général | ✅ |
| Canvas : icônes Source, Traitement et Destination avec le même habillage (fond bleu, couleur primaire unifiée) | ✅ |
Export Destination CSV après Lancer : téléchargement avec extension .csv et nom lisible | ✅ |
Périmètre livré
Front
front/src/css/workflow-editor-toolbar.scss— tokens partagés barre d'outils.WorkflowBlockPaletteMenu,WorkflowCanvasToolbar,WorkflowEditorPage.WorkflowInspectorDrawer,WorkflowInspectorSection,WorkflowInputSourcePanel.useWorkflowCanvasDnD—addBlockAtViewportCenterpour l'ajout au clic.workflow-destination-export.js,WorkflowDestinationPanel,workflow-store— téléchargement signé avec attributdownload.
Back
workflow-destination-run.service.ts— clé S3 avec segmentworkflow_export_{runSlice}.csv(sans modifieruploadFile.ts).workflow-run-artifact.service.ts— résolution du nom de fichier (clés legacy UUID sans extension + queryoutputType).workflows.controller.ts—GET .../export-download?artifactRef=&outputType=.
Migration SQL
Aucun changement de schéma SQL pour ce ticket.
Tests
| Couche | Fichier |
|---|---|
| Front unit | WorkflowBlockPaletteMenu.spec.js |
| Front unit | workflow-destination-export.spec.js |
| Front unit | useWorkflowCanvasDnD.spec.js |
| Back unit | workflow-run-artifact.service.spec.ts |
Documentation technique
Hors périmètre
- Refonte formulaires → source (reportée).
- Modification de
back/src/domains/s3Helper/uploadFile.ts(helper partagé).
