Task: Routines - Refonte UX + Fonctionnalites manquantes

Date: 03/02/2026 Statut: TERMINE Duree: Session unique

Actions realisees

Phase 1 - Responsive fix

• [x] connectors-front/src/routes/routines/new/index.tsx : padding mobile (px-2 sm:px-0), bouton retour btn-sm sm:btn-md
• [x] connectors-front/src/routes/routines/[id]/edit/index.tsx : idem + grid-cols-1 sm:grid-cols-2

Phase 2 - NodeConfigForm (remplacement JSON brut)

• [x] NOUVEAU connectors-front/src/components/routines/NodeConfigForm.tsx : 550+ lignes
  • Formulaires types pour les 9 types de nodes (trigger, action, fetch, condition, loop, transform, variable, delay, output)
  • Sub-components : TriggerForm, ActionForm, FetchForm, ConditionForm, LoopForm, TransformForm, VariableForm, DelayForm, OutputForm
  • FallbackJsonForm pour les types inconnus
  • ActionForm charge la liste des actions via api.getActions()
  • FetchForm charge connecteurs + instances via api.getConnectors() + api.getInstances()
  • TransformForm avec operations add/remove dynamiques
  • TriggerForm avec presets cron + URL webhook (si routineId fourni)
• [x] Integre dans new/index.tsx et edit/index.tsx (remplacement du textarea JSON)
• [x] Nettoyage du code : suppression nodeConfigJson, saveNodeConfig devenus inutiles

Phase 3 - SSE Streaming + Cancel

Backend:

• [x] routineExecutor.ts : ajout NodeProgressEvent type, ExecutionOptions interface (onNodeProgress callback + cancelledRef)
• [x] Emission events node_started, node_done, node_error dans executeNode()
• [x] Propagation des options dans les branches condition, loop, et edges par defaut
• [x] Check de cancellation au debut de chaque executeNode()
• [x] routines.ts : ajout executeStream() retournant ReadableStream SSE
• [x] routines.ts : ajout cancelExecution() pour annuler en DB
• [x] index.ts : endpoint POST /api/routines/:id/execute/stream (SSE)
• [x] index.ts : endpoint POST /api/routines/executions/:execId/cancel

Frontend:

• [x] api.ts : ajout executeRoutineStream() (meme pattern que executeActionStream())
• [x] api.ts : ajout cancelRoutineExecution()
• [x] [id]/index.tsx : execution utilise le streaming SSE avec progression temps reel
  • Barre de progression (Node X/Y)
  • Liste des nodes avec spinner/check/cross
  • Duration par node affichee en temps reel

Phase 4 - Triggers fonctionnels (cron + webhook)

Cron:

• [x] NOUVEAU connectors-api/src/services/routineScheduler.ts : service complet
  • initScheduler() charge toutes les routines cron actives au demarrage
  • refreshRoutine() appele apres chaque create/update/delete
  • Utilise croner (npm package ajoute a package.json)
  • Re-fetch la routine avant chaque execution (verifie is_active)
  • Audit logging pour chaque execution cron
  • getSchedulerStatus() pour monitoring
• [x] index.ts : import + init scheduler au demarrage
• [x] index.ts : appel refreshRoutine() dans les handlers create/update/delete
• [x] package.json : ajout dependance croner: ^8.0.0

Webhook:

• [x] index.ts : endpoint POST /api/webhooks/:routineId (public, token optionnel)
  • Verifie trigger_type === 'webhook' et is_active
  • Token via query param ou body
  • Passe body + query comme trigger_params
  • Audit logging
• [x] NodeConfigForm.tsx : TriggerForm affiche URL webhook + bouton copier (si routineId fourni)

Phase 5 - Ameliorations UX

• [x] [id]/index.tsx : bouton "Dupliquer" → cree copie avec "(copie)" + is_active: false
• [x] new/index.tsx + edit/index.tsx : boutons fleches haut/bas pour reordonner les nodes
  • Reconstruit les edges automatiquement apres reorder
• [x] index.tsx (liste) : toggle switch is_active inline via api.updateRoutine()

Fichiers modifies

A faire apres deploiement

• [ ] bun install sur prod-portainer pour installer croner
• [ ] Redemarrer connectors-api
• [ ] Rebuild + redeploy connectors-front
• [ ] Tester: page edit, formulaires nodes, streaming, cron, webhook, duplicate, reorder, toggle