[TECH] Améliorer la structure des écrans d'instruction (PIX-12902).

[AndreiaPena]

🦄 Problème

Nous souhaitions au début de l'implémentation faire un affichage dynamique et pour se faire, nous avions introduit l'essentiel des balises span (servant à rendre certaines infos en gras) dans les clés de traduction.

Cette décision a été remise en cause et finalement nous sommes parti pour créer plusieurs composants.
Les clés traductions peuvent ainsi se délester des balises html (ce qu'on doit un maximum éviter de faire, les clés ne devraient servir qu'à la traduction, pas à nos besoin structurels)

🤖 Proposition

Extraire les balises html des clés de traduction pour les écrans d'instruction (page 1 à 4 )

💯 Pour tester

Checker la non régression des écrans

• Créer une session V3 avec certifv3@example.net et ajouter un candidat
• Se réconcilier avec certifiable-contenu-user@example.net et vérifier que l'on obtient bien le premier écran d'instruction
• Les pages sont bien structurées.

[pix-bot-github]

Une fois les applications déployées, elles seront accessibles via les liens suivants :

• App (.fr)
• App (.org)
• Orga (.fr)
• Orga (.org)
• Certif (.fr)
• Certif (.org)
• Junior
• Admin
• API
• Audit Logger

Les variables d'environnement seront accessibles via les liens suivants :

• scalingo front
• scalingo api
• scalingo audit-logger

[matthieu-octo]

Test fonctionnel OK ✅

[mcampourcy]

Plutôt que d'enchaîner les clés text1, strong-text1 etc, je me demande si on ne pourrait pas plutôt tout mettre dans un array, pour faire un join dans le js ou le hbs.

Et donc au lieu de :

"3": {
  "strong-text1": "Il est important d'aller jusqu'au bout du test,",
  "strong-text2": "pénalité",
  "text1": "et donc de bien gérer votre temps. Une",
  "text2": "tenant compte du nombre de questions restantes sera appliquée."
}

On aurait :

"3": {
    [
        "Il est important d'aller jusqu'au bout du test,",
        "et donc de bien gérer votre temps. Une",
        "pénalité",
        "tenant compte du nombre de questions restantes sera appliquée."
    ]
}

Mais je suis en train de chercher partout dans la doc Ember, je ne trouve pas de solution correcte pour implémenter ça dans le js/hbs

[aceol]

est-ce que Phrase sait gérer ca?

[mcampourcy]

aucune idée 😅