Feature #1143
openFeature #1133: Implémenter une page de profil utilisateur avec gestion des crédits et des tiers d'abonnement
Frontend — Page de profil client (infos, jauge crédits, tier, upgrade)
0%
issue:1133 — spec in epic + ticket description
Description
## Objectif
Construire la page de profil client Next.js (App Router) consommant les endpoints de lecture du backend (#1141) : infos personnelles, jauge de crédits, carte tier, bouton upgrade. Le changement de mot de passe est traité dans le ticket Fullstack dédié.
## Dépendances
Dépend des endpoints de lecture profil/crédits/tier (#1141).
## Portée
- Route App Router « Mon compte », accessible depuis le menu principal.
- Section infos personnelles (nom, email, entreprise) : email en lecture seule, autres champs modifiables (formulaire + TanStack Query mutation vers l'endpoint backend).
- Jauge de crédits (Atomic Design) à couleur adaptative : vert >50 %, orange <30 %, rouge <10 %.
- Carte du tier actuel : nom, avantages en liste à puces, couleur distinctive par niveau (Démarrage/Maintenance/Évolutions/Pilotage).
- Bouton « Demander une mise à niveau » (optionnel : mailto/redirection vers un formulaire).
- Option : historique des consommations de crédits (affichage si l'endpoint le fournit).
- i18n next-intl : ajouter les clés dans `src/i18n/messages/en.ts` ET `fr.ts` (mêmes clés/placeholders).
## Acceptance criteria
- [ ] La page « Mon compte » est accessible depuis le menu principal.
- [ ] Infos perso affichées; tous les champs modifiables sauf l'email.
- [ ] La jauge de crédits respecte les seuils de couleur (vert >50 %, orange <30 %, rouge <10 %).
- [ ] Le tier est affiché avec ses avantages (liste à puces) et une couleur distinctive.
- [ ] Le bouton « Demander une mise à niveau » est présent et fonctionnel.
- [ ] Clés i18n présentes et cohérentes dans `en.ts` et `fr.ts` (tsc vert).
- [ ] `npx vitest run && npx tsc --noEmit && npx eslint . && npm run build` verts.
Files