sepehr 640fcb26f7 fix: improve note interactions and markdown LaTeX support
## Bug Fixes

### Note Card Actions
- Fix broken size change functionality (missing state declaration)
- Implement React 19 useOptimistic for instant UI feedback
- Add startTransition for non-blocking updates
- Ensure smooth animations without page refresh
- All note actions now work: pin, archive, color, size, checklist

### Markdown LaTeX Rendering
- Add remark-math and rehype-katex plugins
- Support inline equations with dollar sign syntax
- Support block equations with double dollar sign syntax
- Import KaTeX CSS for proper styling
- Equations now render correctly instead of showing raw LaTeX

## Technical Details

- Replace undefined currentNote references with optimistic state
- Add optimistic updates before server actions for instant feedback
- Use router.refresh() in transitions for smart cache invalidation
- Install remark-math, rehype-katex, and katex packages

## Testing

- Build passes successfully with no TypeScript errors
- Dev server hot-reloads changes correctly
2026-01-09 22:13:49 +01:00

3.4 KiB

PRD - Authentification Avancée & Administration

1. Contexte & Objectifs

L'application Memento dispose actuellement d'une authentification basique. Pour un usage multi-utilisateurs ou privé/familial sécurisé, il est nécessaire d'introduire des rôles (Admin vs Utilisateur standard) et de permettre la gestion des comptes.

Objectifs :

  • Permettre à un Administrateur de gérer les utilisateurs (création manuelle, suppression).
  • Permettre à tout utilisateur de modifier ses informations personnelles (nom, mot de passe).
  • Sécuriser l'application en introduisant des rôles.

2. Spécifications Fonctionnelles

2.1 Gestion des Rôles (Backend)

  • Modèle User : Ajouter un champ role avec deux valeurs possibles : USER (défaut) et ADMIN.
  • NextAuth : Le rôle de l'utilisateur doit être disponible dans la session (via le token JWT) pour être vérifié côté client et serveur.

2.2 Dashboard Admin (/admin)

Accès : Restreint aux utilisateurs ayant le rôle ADMIN. Fonctionnalités :

  1. Liste des utilisateurs :
    • Tableau affichant : Nom, Email, Rôle, Date de création.
    • Actions par ligne : "Supprimer", "Promouvoir Admin / Rétrograder".
  2. Création d'utilisateur :
    • Un bouton "Nouvel Utilisateur" ouvre une modale ou un formulaire.
    • Champs : Nom, Email, Mot de passe, Rôle.
    • Validation : Email unique, mot de passe min 6 caractères.

2.3 Profil Utilisateur (/settings/profile)

Accès : Tout utilisateur connecté. Fonctionnalités :

  1. Modifier le profil :
    • Changer le nom d'affichage.
  2. Sécurité :
    • Changer le mot de passe (nécessite l'ancien mot de passe pour validation).

3. Spécifications Techniques

3.1 Base de Données (Prisma)

Modifier schema.prisma :

model User {
  // ... champs existants
  role String @default("USER") // ou Enum si SQLite le supporte bien (sinon String géré par app)
}

3.2 Authentication (NextAuth v5)

  • Modifier auth.config.ts :
    • Ajouter role au type Session et User.
    • Dans le callback jwt, récupérer le rôle depuis la DB et le persister dans le token.
    • Dans le callback session, passer le rôle du token à la session.

3.3 Server Actions

Créer app/actions/admin.ts :

  • getUsers(): Retourne la liste (Admin only).
  • createUser(data): Crée un user avec hash du mot de passe (Admin only).
  • deleteUser(id): Supprime un user (Admin only).
  • updateUserRole(id, role): Change le rôle (Admin only).

Créer app/actions/profile.ts :

  • updateProfile(data): Met à jour nom/email.
  • changePassword(oldPwd, newPwd): Vérifie l'ancien hash et met à jour.

3.4 Interface Utilisateur (UI)

  • Admin : Utiliser Table, Dialog et Form de Shadcn UI.
  • Profil : Utiliser Card, Input et Button de Shadcn UI.
  • Menu : Ajouter un lien "Admin" dans la Sidebar ou le menu utilisateur, visible uniquement si role === 'ADMIN'.

4. Plan d'Implémentation

  1. Migration DB : Ajouter le champ role et mettre à jour Prisma.
  2. Config Auth : Mettre à jour NextAuth pour propager le rôle.
  3. Backend : Implémenter les Server Actions (Admin & Profil).
  4. Frontend Admin : Créer la page /admin et ses composants.
  5. Frontend Profil : Créer la page /settings/profile.
  6. Sécurisation : Ajouter les vérifications de rôle dans le Middleware ou les Layouts.