Task: Refonte UX Editeur de Routines
Date: 03-02-2026
Status: TERMINE
Objectif
Rendre l'editeur de routines simple et complet avec:
- Structure visuelle pour loops et conditions
- Context Explorer (voir ce qui est disponible)
- AI Assistant pour ecrire les expressions
- Transform avec acces a tout le contexte
Fichiers crees
Frontend (connectors-front/src)
| Fichier |
Description |
lib/routineUtils.ts |
Utilitaires: buildNodeTree, getUpstreamNodes, addNodeToLoopBody, addNodeToConditionBranch, getAvailableContext |
components/routines/RoutineNodeTree.tsx |
Rendu hierarchique des nodes avec support loops/conditions |
components/routines/ContextExplorer.tsx |
Panneau contexte (sidebar desktop, drawer mobile) |
components/routines/ExpressionInput.tsx |
Input avec boutons Context + AI Assistant |
Fichiers modifies
| Fichier |
Modifications |
routes/routines/[id]/edit/index.tsx |
Integration RoutineNodeTree, logique addNode avec contexte |
lib/api.ts |
Ajout fonction routineAssist() |
Backend (connectors-api/src)
| Fichier |
Modifications |
services/ai.ts |
Ajout fonction routineAssist() pour expressions |
index.ts |
Ajout endpoint POST /api/ai/routine-assist |
Fonctionnalites implementees
1. Structure visuelle Loops
- Loops affiches avec bloc "BODY" contenant les nodes enfants
- Variables
loop.item et loop.index indiquees comme disponibles
- Boutons "Ajouter au body" et "Ajouter apres le loop"
- Edges generes avec
port: "body" ou port: "done"
2. Structure visuelle Conditions
- Conditions affichees avec branches TRUE/FALSE cote-a-cote (desktop)
- Branches empilees sur mobile
- Boutons pour ajouter dans chaque branche
- Edges generes avec
label: "true" ou label: "false"
3. Context Explorer
- Desktop: Sidebar permanente a droite
- Mobile: Drawer bottom avec bouton [folder icon]
- Sections: trigger, nodes, loop, variables
- Clic insere
{{path}} dans le champ actif
4. AI Expression Assistant
- Bouton [robot icon] sur les champs expression
- Popover avec textarea pour la demande
- Appel a
/api/ai/routine-assist via Ollama
- Suggestion affichee avec bouton "Utiliser"
Compatibilite
- Edges sans
port/label = comportement lineaire (fallback)
- Routines existantes fonctionnent sans modification
- Nouveau UI ajoute les attributs manquants automatiquement
Tests manuels a effectuer
- [ ] Creer routine avec loop contenant 2 nodes dans body
- [ ] Creer condition avec branches differentes
- [ ] Utiliser AI pour generer une expression
- [ ] Context Explorer insere correctement
- [ ] Routines existantes toujours fonctionnelles
Deploiement
Les modifications sont dans:
/stock_8to/33800-stack/projects/connectors-front//stock_8to/33800-stack/projects/connectors-api/
Commit et push vers GitLab necessaires pour deploiement CI/CD.