rpa_vision_v3/docs/STABILISATION_API_OFFLINE_VWB_09JAN2026.md

Stabilisation API Hors Ligne - Visual Workflow Builder

Auteur : Dom, Alice, Kiro - 09 janvier 2026

Résumé

Correction des problèmes de "saut de page" et de gestion du mode hors ligne dans le Visual Workflow Builder Frontend V2.

Problèmes Identifiés

1. Sauts de page (page "saute") : Causés par des re-renders excessifs lors des vérifications de santé API avec polling
2. Erreur JSON parse : Unexpected token '<', '<!DOCTYPE'... - Le frontend recevait du HTML au lieu de JSON quand le backend n'était pas démarré
3. Warning "API hors ligne" : Affichage constant d'erreurs même quand le mode hors ligne était attendu

Solutions Implémentées

1. Amélioration de apiClient.ts

• Ajout de la détection automatique du mode hors ligne
• Vérification du content-type des réponses pour détecter les réponses HTML
• Système d'abonnement aux changements d'état de connexion (onConnectionStateChange)
• Cache des vérifications de santé pour éviter les requêtes excessives
• Retour gracieux de données vides en mode hors ligne au lieu d'erreurs

2. Nouveau hook useConnectionState

export function useConnectionState() {
  const [connectionState, setConnectionState] = useState<ConnectionState>(() => 
    apiClient.getConnectionState()
  );

  useEffect(() => {
    const unsubscribe = apiClient.onConnectionStateChange((state) => {
      setConnectionState(state);
    });
    return unsubscribe;
  }, []);

  return {
    isOnline: connectionState === 'online',
    isOffline: connectionState === 'offline',
    isChecking: connectionState === 'checking',
    connectionState,
    forceCheck,
  };
}

3. Mise à jour des composants

• WorkflowManager : Remplacé useApiHealth avec polling par useConnectionState
• Executor : Remplacé useApiHealth avec polling par useConnectionState
• Ajout de l'option silentOffline: true pour éviter les erreurs en mode hors ligne

Fichiers Modifiés

1. visual_workflow_builder/frontend/src/services/apiClient.ts
2. visual_workflow_builder/frontend/src/hooks/useApiClient.ts
3. visual_workflow_builder/frontend/src/components/WorkflowManager/index.tsx
4. visual_workflow_builder/frontend/src/components/Executor/index.tsx

Comportement Attendu

Mode En Ligne (Backend démarré)

• Toutes les fonctionnalités disponibles
• Sauvegarde et chargement des workflows fonctionnels
• Exécution des workflows possible

Mode Hors Ligne (Backend non démarré)

• Interface stable sans sauts de page
• Indicateur "API Hors ligne" affiché discrètement
• Boutons de sauvegarde/chargement/exécution désactivés
• Pas d'erreurs dans la console du navigateur
• Possibilité de créer des workflows localement

Tests de Validation

1. ✅ Pas d'erreurs TypeScript dans les fichiers modifiés
2. ✅ Interface stable sans re-renders excessifs
3. ✅ Gestion gracieuse du mode hors ligne
4. ✅ Indicateur d'état de connexion fonctionnel

Démarrage du Backend VWB

Pour activer toutes les fonctionnalités, démarrer le backend :

cd visual_workflow_builder/backend
python app_lightweight.py

Le backend sera accessible sur le port 5002.

Conformité

• ✅ Commentaires en français
• ✅ Attribution "Auteur : Dom, Alice, Kiro"
• ✅ Date mise à jour (09 janvier 2026)
• ✅ Documentation dans docs/
• ✅ Respect de l'architecture existante