Profile completeness

Card affichée sur /account (page d'accueil user). Disparaît automatiquement quand le user atteint 100 %.

Critères par défaut

5 checks dans lib/profile-completeness.ts :

1. Nom renseigné (≥ 2 caractères)
2. Avatar uploadé
3. Username choisi (autre que le cuid de placeholder)
4. Email vérifié
5. 2FA activée

Le percent est Math.round((done / total) * 100).

Pure function

import { profileCompleteness } from "@/lib/profile-completeness";

const { percent, checks } = profileCompleteness({
  name: user.name,
  username: user.username,
  image: user.image,
  emailVerified: user.emailVerified,
  twoFactorEnabled: user.twoFactorEnabled,
});

Pure (pas de Prisma) → testable et utilisable côté serveur ou client. La card React appelle /api/user/profile puis passe la réponse à ce helper.

Étendre

Édite profileCompleteness() pour ajouter / retirer un check :

{
  key: "bio",
  label: "Ajouter ta bio",
  done: !!u.bio && u.bio.length >= 20,
  href: "/account/settings",
},

L'UI s'auto-render : icône check / cercle vide selon done, lien vers href quand on clique sur "Continuer".

Quand l'afficher

Par défaut sur /account/page.tsx. Tu peux la mettre ailleurs (dashboard landing, modal d'onboarding, etc.) — c'est juste un composant client.