feat(gherkin): ajouter features UI/Admin pour modération complète
Création de 6 nouvelles features Gherkin + documentation : Features UI mobile (Flutter) : - signalement-ui.feature : interface signalement avec 7 catégories - historique-signalements.feature : suivi personnel des signalements - badges-statistiques.feature : gamification Bronze/Argent/Or - sanctions-appel.feature : notifications et processus d'appel Features Admin dashboard (React) : - dashboard-moderateur.feature : files d'attente et SLA temps réel - outils-moderateur.feature : player Wavesurfer.js, transcription, historique créateur Documentation : - gherkin-moderation-overview.md : mapping complet règles métier, stats, coûts Couverture : - 190 scénarios couvrant 100% sections 14 (moderation-flows) et 19 (badges) - Conformité DSA/RGPD/WCAG testée - Stack : Go/Flutter/React avec Godog/flutter_gherkin/Cucumber.js
This commit is contained in:
jpgiannetti
349
features/admin/moderation/dashboard-moderateur.feature
Normal file
349
features/admin/moderation/dashboard-moderateur.feature
Normal file
@@ -0,0 +1,349 @@
|
||||
# language: fr
|
||||
|
||||
@admin @moderation @dashboard
|
||||
Fonctionnalité: Dashboard modération pour modérateurs
|
||||
En tant que modérateur
|
||||
Je veux accéder à un dashboard centralisé de modération
|
||||
Afin de traiter efficacement les signalements et gérer les sanctions
|
||||
|
||||
# 14.4 - Outils modérateurs - Dashboard
|
||||
|
||||
Contexte:
|
||||
Étant donné que je suis connecté en tant que modérateur
|
||||
Et que j'ai accès au dashboard de modération
|
||||
|
||||
# Vue d'ensemble du dashboard
|
||||
|
||||
Scénario: Affichage du dashboard principal
|
||||
Étant donné que j'accède au dashboard de modération
|
||||
Quand la page se charge
|
||||
Alors je vois les sections principales:
|
||||
| section | position | contenu |
|
||||
| En-tête | Haut | Logo, nom utilisateur, rôle (Junior/Senior)|
|
||||
| Statistiques globales | Bandeau haut | Signalements en attente, traités aujourd'hui, temps moyen |
|
||||
| File d'attente prioritaire | Gauche | Signalements CRITIQUES et HAUTE priorité |
|
||||
| File d'attente normale | Centre | Signalements MOYENNE et BASSE priorité |
|
||||
| Fil d'activité | Droite | Actions récentes de l'équipe |
|
||||
| Navigation | Sidebar gauche | Signalements, Sanctions, Appels, Stats |
|
||||
Et toutes les sections sont chargées en <2 secondes
|
||||
|
||||
Scénario: Statistiques globales en temps réel
|
||||
Étant donné que je consulte les statistiques du dashboard
|
||||
Quand je vérifie les KPIs affichés
|
||||
Alors je vois les métriques suivantes:
|
||||
| métrique | valeur exemple | mise à jour |
|
||||
| Signalements en attente | 42 | Temps réel |
|
||||
| Signalements traités aujourd'hui | 138 | Temps réel |
|
||||
| Temps moyen de traitement | 45 min | Toutes les 5min|
|
||||
| Mon temps moyen (personnel) | 38 min | Toutes les 5min|
|
||||
| SLA respecté (24h) | 94% | Temps réel |
|
||||
Et les métriques s'actualisent automatiquement
|
||||
Et un badge de notification clignote si >50 signalements en attente
|
||||
|
||||
# Files d'attente séparées par priorité
|
||||
|
||||
Scénario: File d'attente CRITIQUE (24/7)
|
||||
Étant donné que 5 signalements de priorité CRITIQUE sont en attente
|
||||
Quand j'affiche la file CRITIQUE
|
||||
Alors je vois une liste rouge avec les signalements:
|
||||
| colonne | contenu exemple | ordre tri |
|
||||
| Priorité score | 95 (badge rouge "URGENT") | Score décroissant|
|
||||
| Titre contenu | "Podcast #42" | - |
|
||||
| Catégorie IA | 🚫 Haine & violence (97%) | - |
|
||||
| Signalé par | @user123 (⭐ Or) + 3 autres | - |
|
||||
| Temps écoulé | "Il y a 45 min" (rouge si >1h) | - |
|
||||
| Actions rapides | [Écouter] [Valider] [Rejeter] | - |
|
||||
Et la file CRITIQUE est toujours visible en haut de page
|
||||
Et une alerte sonore se déclenche si nouveau signalement CRITIQUE
|
||||
|
||||
Scénario: File d'attente HAUTE priorité
|
||||
Étant donné que 15 signalements de priorité HAUTE sont en attente
|
||||
Quand j'affiche la file HAUTE
|
||||
Alors je vois une liste orange avec les mêmes colonnes
|
||||
Et les signalements sont triés par score de priorité décroissant
|
||||
Et un compteur "⏰ 23h restantes pour SLA 24h" s'affiche
|
||||
Et la file s'actualise toutes les 30 secondes
|
||||
|
||||
Scénario: File d'attente MOYENNE et BASSE
|
||||
Étant donné que 20 signalements MOYENNE et 10 BASSE sont en attente
|
||||
Quand j'affiche ces files
|
||||
Alors elles sont regroupées dans un onglet "Autres signalements"
|
||||
Et je peux filtrer par priorité MOYENNE ou BASSE
|
||||
Et ces signalements sont traités après les priorités hautes
|
||||
|
||||
# Badge qualité du signaleur
|
||||
|
||||
Scénario: Identification des signaleurs de confiance
|
||||
Étant donné qu'un signalement provient d'un utilisateur Badge Or
|
||||
Quand j'affiche la file d'attente
|
||||
Alors je vois le badge "⭐ Or" à côté du pseudo
|
||||
Et un tooltip s'affiche:
|
||||
"""
|
||||
Utilisateur de confiance
|
||||
Score fiabilité: 95/100
|
||||
Historique: 54 signalements validés / 60 envoyés (90%)
|
||||
"""
|
||||
Et je sais que ce signalement est probablement pertinent
|
||||
|
||||
Scénario: Signalements multiples du même contenu
|
||||
Étant donné qu'un contenu a été signalé par 6 utilisateurs
|
||||
Quand j'affiche le signalement
|
||||
Alors je vois "Signalé par @user1 + 5 autres"
|
||||
Et je peux cliquer pour voir la liste complète:
|
||||
| signaleur | badge | catégorie choisie | commentaire |
|
||||
| @user1 | Or | Haine & violence | "Propos à 2:30" |
|
||||
| @user2 | Argent| Haine & violence | "Discriminatoire" |
|
||||
| @user3 | - | Haine & violence | "" |
|
||||
| @user4 | Bronze| Fausse info | "Désinformation" |
|
||||
| @user5 | - | Autre | "Contenu choquant" |
|
||||
| @user6 | Or | Haine & violence | "Passage 2:25-2:45" |
|
||||
Et je vois que 5/6 signaleurs ont choisi la même catégorie
|
||||
Et cela renforce la probabilité de violation
|
||||
|
||||
# Filtres et recherche
|
||||
|
||||
Scénario: Filtrer les signalements par catégorie
|
||||
Étant donné que je suis sur le dashboard
|
||||
Quand je clique sur le filtre "Catégorie"
|
||||
Alors je vois les 7 catégories:
|
||||
| catégorie | nombre en attente |
|
||||
| 🚫 Haine & violence | 12 |
|
||||
| 🔞 Contenu sexuel | 5 |
|
||||
| ⚖️ Illégalité | 2 |
|
||||
| 🎵 Droits d'auteur | 8 |
|
||||
| 📧 Spam | 15 |
|
||||
| ❌ Fausse information | 7 |
|
||||
| 🔧 Autre | 3 |
|
||||
Et je peux cliquer pour filtrer par catégorie
|
||||
Et le filtre s'applique instantanément
|
||||
|
||||
Scénario: Rechercher un signalement spécifique
|
||||
Étant donné que je veux rechercher un signalement
|
||||
Quand je tape "podcast" dans la barre de recherche
|
||||
Alors les résultats s'affichent en temps réel:
|
||||
| recherche dans |
|
||||
| Titre du contenu |
|
||||
| Pseudo du créateur |
|
||||
| Commentaires signaleurs |
|
||||
| Numéro de ticket |
|
||||
Et les résultats sont mis en évidence
|
||||
Et je peux cliquer pour ouvrir le signalement
|
||||
|
||||
Scénario: Filtrer par assignation
|
||||
Étant donné que je suis modérateur junior
|
||||
Quand je clique sur le filtre "Assignation"
|
||||
Alors je vois les options:
|
||||
| option | nombre |
|
||||
| Assignés à moi | 8 |
|
||||
| Non assignés | 25 |
|
||||
| Assignés à d'autres | 9 |
|
||||
| Tous | 42 |
|
||||
Et je peux voir uniquement mes signalements
|
||||
Et je peux m'auto-assigner un signalement non assigné
|
||||
|
||||
# Actions rapides depuis la liste
|
||||
|
||||
Scénario: Actions rapides sans ouvrir le détail
|
||||
Étant donné que je vois un signalement évident (spam)
|
||||
Et que le score IA est de 98%
|
||||
Quand j'utilise les actions rapides
|
||||
Alors je peux cliquer sur:
|
||||
| action | raccourci clavier | effet |
|
||||
| Écouter | E | Lance le player audio |
|
||||
| Approuver | A | Valide le signalement |
|
||||
| Rejeter | R | Rejette le signalement |
|
||||
| Escalade | S (Senior) | Transfère à un modérateur senior|
|
||||
| Détails | D | Ouvre la page détaillée |
|
||||
Et l'action est immédiate
|
||||
Et le signalement disparaît de la liste
|
||||
|
||||
Scénario: Validation rapide avec confirmation
|
||||
Étant donné que je clique sur "Approuver" (A)
|
||||
Quand l'action est déclenchée
|
||||
Alors une modal de confirmation s'affiche:
|
||||
"""
|
||||
Valider ce signalement ?
|
||||
|
||||
Action: Retirer le contenu + Strike 1 au créateur
|
||||
Contenu: "Podcast #42" par @createur
|
||||
|
||||
[Annuler] [Confirmer]
|
||||
"""
|
||||
Et je peux confirmer avec Entrée ou cliquer
|
||||
Et si je confirme, l'action est immédiate
|
||||
Et le signalement passe en "Traité"
|
||||
|
||||
# Fil d'activité en temps réel
|
||||
|
||||
Scénario: Affichage du fil d'activité de l'équipe
|
||||
Étant donné que je consulte le fil d'activité
|
||||
Quand je vérifie les dernières actions
|
||||
Alors je vois les actions récentes de l'équipe en temps réel:
|
||||
"""
|
||||
Il y a 2 min - @mod_alice a validé signalement #12345 (Spam)
|
||||
Il y a 5 min - @mod_bob a rejeté signalement #12344 (Non fondé)
|
||||
Il y a 8 min - @mod_charlie a escaladé signalement #12343 (Complexe)
|
||||
Il y a 12 min - @mod_alice a approuvé appel #APP-456
|
||||
"""
|
||||
Et le fil se met à jour en temps réel (WebSocket)
|
||||
Et je vois qui travaille sur quoi
|
||||
Et cela améliore la collaboration
|
||||
|
||||
Scénario: Collaboration sur cas complexes
|
||||
Étant donné qu'un modérateur senior travaille sur un cas complexe
|
||||
Quand il ajoute un commentaire interne
|
||||
Alors le commentaire apparaît dans le fil d'activité:
|
||||
"""
|
||||
@mod_senior a commenté le signalement #12350:
|
||||
"Besoin d'un second avis sur ce cas. Passage 3:42 borderline."
|
||||
"""
|
||||
Et je peux cliquer pour voir le signalement
|
||||
Et je peux répondre au commentaire
|
||||
Et cela facilite l'entraide entre modérateurs
|
||||
|
||||
# Statistiques personnelles
|
||||
|
||||
Scénario: Voir mes statistiques personnelles
|
||||
Étant donné que je clique sur mon profil modérateur
|
||||
Quand j'accède à mes statistiques
|
||||
Alors je vois:
|
||||
| métrique | valeur | période |
|
||||
| Signalements traités | 342 | Ce mois |
|
||||
| Temps moyen de traitement | 38 min | Ce mois |
|
||||
| Précision (appels rejetés) | 94% | Ce mois |
|
||||
| Signalements/jour | 18 | Moyenne 30j |
|
||||
| Médaille de performance | 🥈 Argent | - |
|
||||
Et je peux comparer avec la moyenne de l'équipe
|
||||
Et cela me motive à améliorer mes performances
|
||||
|
||||
Plan du Scénario: Médailles de performance modérateur
|
||||
Étant donné que mon temps moyen est de <temps> min
|
||||
Et que ma précision est de <precision>%
|
||||
Quand le système calcule ma médaille
|
||||
Alors je reçois la médaille "<medaille>"
|
||||
|
||||
Exemples:
|
||||
| temps | precision | medaille |
|
||||
| 25 | 97 | 🥇 Or (Top performer) |
|
||||
| 35 | 92 | 🥈 Argent (Bon) |
|
||||
| 50 | 85 | 🥉 Bronze (Standard) |
|
||||
|
||||
# Notifications et alertes
|
||||
|
||||
Scénario: Alerte sonore pour signalement CRITIQUE
|
||||
Étant donné que je travaille sur le dashboard
|
||||
Quand un nouveau signalement CRITIQUE arrive
|
||||
Alors une alerte sonore se déclenche (bip urgent)
|
||||
Et une notification desktop s'affiche:
|
||||
"""
|
||||
🚨 Nouveau signalement CRITIQUE
|
||||
Contenu: "Podcast #XX" - Violence
|
||||
[Traiter maintenant]
|
||||
"""
|
||||
Et le signalement apparaît en tête de liste (fond rouge)
|
||||
Et je suis immédiatement alerté
|
||||
|
||||
Scénario: Notification si SLA bientôt dépassé
|
||||
Étant donné qu'un signalement HAUTE priorité est en attente depuis 22h
|
||||
Quand il reste 2h avant le SLA de 24h
|
||||
Alors une notification s'affiche:
|
||||
"""
|
||||
⚠️ SLA bientôt dépassé
|
||||
Signalement #12345 - Haine & violence
|
||||
Deadline dans 2h
|
||||
[Prendre en charge]
|
||||
"""
|
||||
Et le signalement est mis en évidence en orange
|
||||
Et je peux cliquer pour le traiter en priorité
|
||||
|
||||
# Auto-refresh et temps réel
|
||||
|
||||
Scénario: Actualisation automatique des données
|
||||
Étant donné que je suis sur le dashboard
|
||||
Quand de nouvelles données arrivent
|
||||
Alors le dashboard s'actualise automatiquement:
|
||||
| donnée | fréquence actualisation |
|
||||
| File d'attente | 30 secondes |
|
||||
| Statistiques globales | 5 minutes |
|
||||
| Fil d'activité | Temps réel (WebSocket) |
|
||||
| Mon temps moyen | 5 minutes |
|
||||
Et je n'ai pas besoin de rafraîchir manuellement
|
||||
Et les changements s'affichent avec une animation subtile
|
||||
|
||||
# Responsive et performance
|
||||
|
||||
Scénario: Dashboard responsive pour écrans larges
|
||||
Étant donné que j'utilise un écran 27" (2560x1440)
|
||||
Quand j'affiche le dashboard
|
||||
Alors les 3 colonnes sont affichées côte à côte:
|
||||
| colonne | largeur |
|
||||
| File prioritaire | 30% |
|
||||
| File normale | 45% |
|
||||
| Fil d'activité | 25% |
|
||||
Et je vois tout en un seul coup d'œil
|
||||
Et je peux travailler efficacement
|
||||
|
||||
Scénario: Dashboard sur écran standard (1920x1080)
|
||||
Étant donné que j'utilise un écran Full HD
|
||||
Quand j'affiche le dashboard
|
||||
Alors les colonnes s'adaptent:
|
||||
| colonne | largeur | position |
|
||||
| File prioritaire | 60% | Gauche |
|
||||
| Fil d'activité | 40% | Droite |
|
||||
Et je peux basculer entre files avec onglets
|
||||
Et l'UX reste fluide
|
||||
|
||||
Scénario: Performance du dashboard
|
||||
Étant donné que 100 signalements sont en attente
|
||||
Quand je charge le dashboard
|
||||
Alors le chargement initial prend <2 secondes
|
||||
Et l'affichage est fluide (60 FPS)
|
||||
Et la pagination charge 20 signalements à la fois
|
||||
Et le scroll est instantané
|
||||
Et la mémoire utilisée reste <500 MB
|
||||
|
||||
# Dark mode pour modérateurs
|
||||
|
||||
Scénario: Support du dark mode
|
||||
Étant donné que je travaille de nuit
|
||||
Quand j'active le dark mode
|
||||
Alors les couleurs s'adaptent:
|
||||
| élément | couleur light | couleur dark |
|
||||
| Fond page | Blanc | Noir (#1E1E1E) |
|
||||
| Cartes signalements | Gris clair | Gris foncé |
|
||||
| Badge CRITIQUE | Rouge vif | Rouge (#FF4444) |
|
||||
| Badge HAUTE | Orange | Orange (#FFA500) |
|
||||
| Texte principal | Noir | Blanc |
|
||||
Et le contraste reste optimal
|
||||
Et mes yeux sont moins fatigués
|
||||
|
||||
# Accessibilité
|
||||
|
||||
Scénario: Raccourcis clavier pour productivité
|
||||
Étant donné que je suis sur le dashboard
|
||||
Quand j'utilise les raccourcis clavier
|
||||
Alors je peux naviguer rapidement:
|
||||
| raccourci | action |
|
||||
| A | Approuver le signalement sélectionné|
|
||||
| R | Rejeter le signalement sélectionné |
|
||||
| E | Écouter le contenu |
|
||||
| D | Ouvrir les détails |
|
||||
| S | Escalader (modérateur senior) |
|
||||
| ↑ / ↓ | Naviguer dans la liste |
|
||||
| Entrée | Ouvrir le signalement sélectionné |
|
||||
| Échap | Fermer la modal/retour |
|
||||
Et je gagne en productivité (×2-3)
|
||||
|
||||
# Coût infrastructure
|
||||
|
||||
Scénario: Coût du dashboard de modération
|
||||
Étant donné que le dashboard est développé et déployé
|
||||
Quand on évalue le coût
|
||||
Alors le coût de développement est:
|
||||
| composant | technologie | coût |
|
||||
| Frontend | React + TanStack Table | 0€ (interne) |
|
||||
| Backend API | Go (existant) | 0€ |
|
||||
| WebSocket temps réel | Go + Redis | 0-20€/mois |
|
||||
| Hébergement dashboard | OVH (serveur existant) | 0€ (mutualisé) |
|
||||
Et le coût total est de 0-20€/mois
|
||||
Et c'est inclus dans l'infrastructure existante
|
||||
Reference in New Issue
Block a user