Règles métier — Conformité et expérience¶

Ce document décrit les règles métier liées à la conformité réglementaire (RGPD, accessibilité) et à l'expérience utilisateur (internationalisation, PWA, consentement cookies) de Primatch.

Internationalisation (i18n)¶

RB-CONF-001 — Langues supportées¶

• L'application est disponible en Français (par défaut) et en Anglais
• La langue est détectée automatiquement à partir du navigateur au premier chargement
• Seules les langues fr et en sont supportées ; toute autre langue navigateur retombe sur le français

RB-CONF-002 — Sélecteur de langue¶

• Un bouton de changement de langue est affiché dans le header public (pages non authentifiées)
• Le bouton affiche le libellé de la langue vers laquelle l'utilisateur peut basculer (ex : « EN » si l'application est en français)
• Le changement est instantané, sans rechargement de page

RB-CONF-003 — Persistance du choix de langue¶

• Le choix de langue est sauvegardé dans le localStorage (clé i18nextLng)
• Au chargement suivant, la langue stockée est prioritaire sur la détection navigateur
• L'attribut lang du document HTML est mis à jour dynamiquement

RB-CONF-004 — Espaces de noms de traduction¶

• Les traductions sont organisées en 8 espaces de noms : common, auth, profile, club, game, account, notification, landing
• L'espace de noms par défaut est common

Accessibilité (WCAG 2.1 AA)¶

RB-CONF-010 — Contrastes de couleurs¶

• Tous les textes respectent un ratio de contraste minimum de 4.5:1 (texte normal) ou 3:1 (texte large ≥ 18px) conformément aux critères WCAG 2.1 AA
• La couleur text-muted du thème est calibrée à #535B66 pour garantir un ratio ≥ 4.5:1 sur fond blanc

RB-CONF-011 — Navigation au clavier¶

• Tous les éléments interactifs (boutons, liens, champs) sont focusables et navigables au clavier
• Un anneau de focus visible (focus-visible:ring) est affiché sur les boutons et éléments de navigation
• Un lien « Aller au contenu principal » (skip-to-content) est disponible en début de page pour les utilisateurs de lecteur d'écran

RB-CONF-012 — Attributs sémantiques¶

• Les messages d'erreur des champs de formulaire ont l'attribut role="alert" pour être annoncés par les lecteurs d'écran
• L'attribut lang du document est mis à jour dynamiquement lors du changement de langue
• Chaque page de contenu principal est identifiée par un id="main-content" pour le lien skip-to-content

Consentement cookies (RGPD)¶

RB-CONF-020 — Bandeau de consentement¶

• Un bandeau de consentement aux cookies est affiché en bas de page lors de la première visite
• Le bandeau a le rôle ARIA dialog avec aria-live="polite" pour l'accessibilité

RB-CONF-021 — Actions utilisateur¶

• L'utilisateur peut accepter ou refuser les cookies
• Un lien vers la politique de confidentialité est inclus dans le bandeau
• Le choix est immédiat : le bandeau disparaît dès qu'une action est effectuée

RB-CONF-022 — Persistance du consentement¶

• Le choix est sauvegardé dans le localStorage (clé primatch_cookie_consent, valeurs accepted ou declined)
• Le bandeau ne réapparaît pas si un choix a déjà été enregistré
• ❌ Le bandeau ne doit pas bloquer l'utilisation de l'application

PWA (Progressive Web App)¶

RB-CONF-030 — Installation¶

• L'application est installable en tant que PWA sur mobile et desktop
• Le manifest inclut les métadonnées de l'application (nom, icônes, couleurs, orientation)
• Le mode d'enregistrement du service worker est prompt : l'utilisateur choisit quand mettre à jour

RB-CONF-031 — Mode hors-ligne¶

• Le service worker met en cache les ressources statiques pour un chargement rapide
• En mode développement, le service worker est désactivé (devOptions.enabled: false)