Validé sur PC Windows (DESKTOP-58D5CAC, 2560x1600) : - 8 clics résolus visuellement (1 anchor_template, 1 som_text_match, 6 som_vlm) - Score moyen 0.75, temps moyen 1.6s - Texte tapé correctement (bonjour, test word, date, email) - 0 retries, 2 actions non vérifiées (OK) Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
334 lines
10 KiB
Markdown
334 lines
10 KiB
Markdown
# Tâches : Localisation du Composant RealDemo
|
|
|
|
## Vue d'ensemble
|
|
|
|
Ce document détaille les tâches nécessaires pour implémenter la localisation complète du composant RealDemo dans le Visual Workflow Builder.
|
|
|
|
## 📋 Liste des Tâches
|
|
|
|
### Phase 1 : Analyse et Préparation
|
|
|
|
#### Tâche 1.1 : Analyse du Contenu Existant
|
|
**Priorité :** Haute
|
|
**Estimation :** 30 minutes
|
|
**Assigné à :** Développeur Frontend
|
|
|
|
**Description :**
|
|
Analyser le composant RealDemo actuel pour identifier toutes les chaînes de caractères à localiser.
|
|
|
|
**Critères d'acceptation :**
|
|
- [ ] Inventaire complet des chaînes à localiser
|
|
- [ ] Identification des clés de traduction nécessaires
|
|
- [ ] Vérification de la cohérence avec les traductions existantes
|
|
- [ ] Documentation des conventions à respecter
|
|
|
|
**Livrables :**
|
|
- Liste des chaînes à localiser
|
|
- Proposition de noms de clés
|
|
- Analyse de cohérence
|
|
|
|
#### Tâche 1.2 : Définition des Clés de Traduction
|
|
**Priorité :** Haute
|
|
**Estimation :** 15 minutes
|
|
**Assigné à :** Développeur Frontend
|
|
|
|
**Description :**
|
|
Définir les clés de traduction selon les conventions établies dans le système existant.
|
|
|
|
**Critères d'acceptation :**
|
|
- [ ] Clés nommées selon les conventions (`realDemo.component.*`)
|
|
- [ ] Hiérarchie cohérente avec l'existant
|
|
- [ ] Pas de conflit avec les clés existantes
|
|
- [ ] Documentation des nouvelles clés
|
|
|
|
**Livrables :**
|
|
- Spécification des clés de traduction
|
|
- Structure JSON proposée
|
|
|
|
### Phase 2 : Création des Traductions
|
|
|
|
#### Tâche 2.1 : Traductions Françaises (Référence)
|
|
**Priorité :** Haute
|
|
**Estimation :** 15 minutes
|
|
**Assigné à :** Développeur Frontend
|
|
|
|
**Description :**
|
|
Ajouter les traductions françaises dans le fichier `fr.json` comme référence.
|
|
|
|
**Critères d'acceptation :**
|
|
- [ ] Nouvelles clés ajoutées dans `i18n/fr.json`
|
|
- [ ] Textes français corrects et naturels
|
|
- [ ] Cohérence avec les traductions existantes
|
|
- [ ] Respect de la structure JSON
|
|
|
|
**Livrables :**
|
|
- Fichier `fr.json` mis à jour
|
|
- Validation de la syntaxe JSON
|
|
|
|
#### Tâche 2.2 : Traductions Anglaises
|
|
**Priorité :** Haute
|
|
**Estimation :** 20 minutes
|
|
**Assigné à :** Développeur Frontend
|
|
|
|
**Description :**
|
|
Créer les traductions anglaises naturelles et idiomatiques.
|
|
|
|
**Critères d'acceptation :**
|
|
- [ ] Nouvelles clés ajoutées dans `i18n/en.json`
|
|
- [ ] Traductions anglaises naturelles
|
|
- [ ] Respect des conventions anglaises (Title Case, etc.)
|
|
- [ ] Longueur appropriée pour l'interface
|
|
|
|
**Livrables :**
|
|
- Fichier `en.json` mis à jour
|
|
- Validation de la qualité des traductions
|
|
|
|
#### Tâche 2.3 : Traductions Espagnoles
|
|
**Priorité :** Haute
|
|
**Estimation :** 20 minutes
|
|
**Assigné à :** Développeur Frontend
|
|
|
|
**Description :**
|
|
Créer les traductions espagnoles en respectant les conventions culturelles.
|
|
|
|
**Critères d'acceptation :**
|
|
- [ ] Nouvelles clés ajoutées dans `i18n/es.json`
|
|
- [ ] Traductions espagnoles correctes
|
|
- [ ] Accents et caractères spéciaux respectés
|
|
- [ ] Grammaire et syntaxe appropriées
|
|
|
|
**Livrables :**
|
|
- Fichier `es.json` mis à jour
|
|
- Validation linguistique
|
|
|
|
#### Tâche 2.4 : Traductions Allemandes
|
|
**Priorité :** Haute
|
|
**Estimation :** 20 minutes
|
|
**Assigné à :** Développeur Frontend
|
|
|
|
**Description :**
|
|
Créer les traductions allemandes en respectant les spécificités linguistiques.
|
|
|
|
**Critères d'acceptation :**
|
|
- [ ] Nouvelles clés ajoutées dans `i18n/de.json`
|
|
- [ ] Traductions allemandes correctes
|
|
- [ ] Majuscules sur les noms respectées
|
|
- [ ] Mots composés appropriés
|
|
|
|
**Livrables :**
|
|
- Fichier `de.json` mis à jour
|
|
- Validation linguistique
|
|
|
|
### Phase 3 : Modification du Composant
|
|
|
|
#### Tâche 3.1 : Import du Service de Localisation
|
|
**Priorité :** Haute
|
|
**Estimation :** 10 minutes
|
|
**Assigné à :** Développeur Frontend
|
|
|
|
**Description :**
|
|
Ajouter l'import et l'utilisation du hook `useLocalization` dans le composant RealDemo.
|
|
|
|
**Critères d'acceptation :**
|
|
- [ ] Import correct de `useLocalization`
|
|
- [ ] Hook initialisé dans le composant
|
|
- [ ] Types TypeScript respectés
|
|
- [ ] Pas d'erreur de compilation
|
|
|
|
**Livrables :**
|
|
- Composant avec import ajouté
|
|
- Validation TypeScript
|
|
|
|
#### Tâche 3.2 : Remplacement des Chaînes Codées en Dur
|
|
**Priorité :** Haute
|
|
**Estimation :** 15 minutes
|
|
**Assigné à :** Développeur Frontend
|
|
|
|
**Description :**
|
|
Remplacer toutes les chaînes de caractères codées en dur par des appels au service de traduction.
|
|
|
|
**Critères d'acceptation :**
|
|
- [ ] Titre remplacé par `t('realDemo.component.title')`
|
|
- [ ] Description remplacée par `t('realDemo.component.description')`
|
|
- [ ] Bouton remplacé par `t('realDemo.component.startButton')`
|
|
- [ ] Aucune chaîne codée en dur restante
|
|
- [ ] Fonctionnalité préservée
|
|
|
|
**Livrables :**
|
|
- Composant RealDemo localisé
|
|
- Tests de fonctionnement
|
|
|
|
### Phase 4 : Validation et Tests
|
|
|
|
#### Tâche 4.1 : Validation Automatique des Traductions
|
|
**Priorité :** Haute
|
|
**Estimation :** 10 minutes
|
|
**Assigné à :** Développeur Frontend
|
|
|
|
**Description :**
|
|
Exécuter le script de validation automatique pour vérifier la cohérence des traductions.
|
|
|
|
**Critères d'acceptation :**
|
|
- [ ] Script `validate_translations.py` exécuté sans erreur
|
|
- [ ] Toutes les langues ont les mêmes clés
|
|
- [ ] Structure JSON cohérente
|
|
- [ ] Rapport de validation propre
|
|
|
|
**Livrables :**
|
|
- Rapport de validation sans erreur
|
|
- Corrections éventuelles appliquées
|
|
|
|
#### Tâche 4.2 : Tests d'Intégration Multilingue
|
|
**Priorité :** Haute
|
|
**Estimation :** 20 minutes
|
|
**Assigné à :** Développeur Frontend
|
|
|
|
**Description :**
|
|
Tester le composant dans toutes les langues supportées pour vérifier l'affichage et le comportement.
|
|
|
|
**Critères d'acceptation :**
|
|
- [ ] Composant s'affiche correctement en français
|
|
- [ ] Composant s'affiche correctement en anglais
|
|
- [ ] Composant s'affiche correctement en espagnol
|
|
- [ ] Composant s'affiche correctement en allemand
|
|
- [ ] Changement de langue fonctionne en temps réel
|
|
- [ ] Mise en page préservée dans toutes les langues
|
|
|
|
**Livrables :**
|
|
- Tests réussis dans les 4 langues
|
|
- Screenshots de validation (optionnel)
|
|
|
|
#### Tâche 4.3 : Tests de Non-Régression
|
|
**Priorité :** Moyenne
|
|
**Estimation :** 15 minutes
|
|
**Assigné à :** Développeur Frontend
|
|
|
|
**Description :**
|
|
Vérifier que les modifications n'ont pas impacté les autres composants ou fonctionnalités.
|
|
|
|
**Critères d'acceptation :**
|
|
- [ ] Autres composants localisés fonctionnent toujours
|
|
- [ ] Sélecteur de langue fonctionne
|
|
- [ ] Persistance du choix de langue préservée
|
|
- [ ] Performance non dégradée
|
|
|
|
**Livrables :**
|
|
- Tests de non-régression passés
|
|
- Validation de l'intégrité du système
|
|
|
|
### Phase 5 : Documentation et Finalisation
|
|
|
|
#### Tâche 5.1 : Mise à Jour de la Documentation
|
|
**Priorité :** Moyenne
|
|
**Estimation :** 15 minutes
|
|
**Assigné à :** Développeur Frontend
|
|
|
|
**Description :**
|
|
Mettre à jour la documentation existante pour inclure les nouvelles traductions.
|
|
|
|
**Critères d'acceptation :**
|
|
- [ ] `LOCALISATION_COMPLETE_07JAN2026.md` mis à jour
|
|
- [ ] Nouvelles clés documentées
|
|
- [ ] Statistiques mises à jour (130 clés au lieu de 127)
|
|
- [ ] Exemples d'utilisation ajoutés
|
|
|
|
**Livrables :**
|
|
- Documentation mise à jour
|
|
- Exemples d'utilisation
|
|
|
|
#### Tâche 5.2 : Validation Finale et Nettoyage
|
|
**Priorité :** Moyenne
|
|
**Estimation :** 10 minutes
|
|
**Assigné à :** Développeur Frontend
|
|
|
|
**Description :**
|
|
Effectuer une validation finale complète et nettoyer le code si nécessaire.
|
|
|
|
**Critères d'acceptation :**
|
|
- [ ] Code propre et commenté
|
|
- [ ] Pas de code mort ou inutilisé
|
|
- [ ] Imports optimisés
|
|
- [ ] Validation finale réussie
|
|
|
|
**Livrables :**
|
|
- Code finalisé et propre
|
|
- Validation complète
|
|
|
|
## 📊 Résumé des Estimations
|
|
|
|
| Phase | Tâches | Temps Total | Priorité |
|
|
|-------|--------|-------------|----------|
|
|
| Phase 1 | 2 tâches | 45 minutes | Haute |
|
|
| Phase 2 | 4 tâches | 75 minutes | Haute |
|
|
| Phase 3 | 2 tâches | 25 minutes | Haute |
|
|
| Phase 4 | 3 tâches | 45 minutes | Haute/Moyenne |
|
|
| Phase 5 | 2 tâches | 25 minutes | Moyenne |
|
|
| **Total** | **13 tâches** | **3h 35min** | - |
|
|
|
|
## 🔄 Dépendances entre Tâches
|
|
|
|
```
|
|
1.1 → 1.2 → 2.1 → 2.2, 2.3, 2.4 → 3.1 → 3.2 → 4.1 → 4.2 → 4.3 → 5.1 → 5.2
|
|
```
|
|
|
|
**Tâches parallélisables :**
|
|
- Tâches 2.2, 2.3, 2.4 (traductions) peuvent être faites en parallèle
|
|
- Tâches 4.2 et 4.3 peuvent être faites en parallèle
|
|
|
|
## ⚠️ Risques et Points d'Attention
|
|
|
|
### Risques Identifiés
|
|
|
|
1. **Qualité des traductions**
|
|
- **Risque :** Traductions non naturelles
|
|
- **Mitigation :** Révision par des locuteurs natifs si possible
|
|
|
|
2. **Cohérence terminologique**
|
|
- **Risque :** Incohérence avec l'existant
|
|
- **Mitigation :** Vérification systématique avec les traductions existantes
|
|
|
|
3. **Problèmes de mise en page**
|
|
- **Risque :** Textes trop longs dans certaines langues
|
|
- **Mitigation :** Tests d'affichage dans toutes les langues
|
|
|
|
### Points d'Attention
|
|
|
|
- **Validation continue :** Exécuter le script de validation après chaque modification
|
|
- **Tests manuels :** Vérifier l'affichage dans chaque langue
|
|
- **Sauvegarde :** Garder une copie du code original pour rollback rapide
|
|
|
|
## 🎯 Critères de Succès
|
|
|
|
### Critères Techniques
|
|
- [ ] 0 erreur dans la validation automatique
|
|
- [ ] 100% des chaînes externalisées
|
|
- [ ] Types TypeScript corrects
|
|
- [ ] Pas de régression fonctionnelle
|
|
|
|
### Critères Fonctionnels
|
|
- [ ] Interface cohérente dans les 4 langues
|
|
- [ ] Changement de langue instantané
|
|
- [ ] Traductions naturelles et appropriées
|
|
- [ ] Mise en page préservée
|
|
|
|
### Critères de Qualité
|
|
- [ ] Code propre et maintenable
|
|
- [ ] Documentation à jour
|
|
- [ ] Tests passés
|
|
- [ ] Performance maintenue
|
|
|
|
## 📝 Notes d'Implémentation
|
|
|
|
### Conventions à Respecter
|
|
- **Nommage des clés :** `realDemo.component.*`
|
|
- **Structure JSON :** Respecter la hiérarchie existante
|
|
- **Types TypeScript :** Maintenir la compatibilité
|
|
- **Imports :** Utiliser les imports relatifs appropriés
|
|
|
|
### Outils Utilisés
|
|
- **Validation :** `python i18n/validate_translations.py`
|
|
- **Édition JSON :** Éditeur avec validation syntaxique
|
|
- **Tests :** Interface utilisateur dans le navigateur
|
|
- **TypeScript :** Compilation avec vérification des types
|
|
|
|
Cette planification détaillée assure une implémentation méthodique et de qualité de la localisation du composant RealDemo, en s'appuyant sur l'infrastructure existante et en maintenant les standards établis. |