# 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
