feat(notes): vues structurées tableau/kanban, flashcards et MCP robuste

Ajoute la base organisable par carnet (schéma, champs partagés, valeurs par note)
avec activation guidée, tableau éditable, kanban et suppression de colonnes.
Corrige le multiselect en vue tableau et enrichit sidebar, grille et i18n FR/EN.
Inclut aussi les améliorations flashcards SM-2, l'audit consentement IA et la
robustesse du serveur MCP (config, validation, rate-limit, métriques).

Co-authored-by: Cursor <cursoragent@cursor.com>

memento-note/components/flashcards/flashcard-generate-dialog.tsx

@@ -1,6 +1,7 @@
 'use client'
 
-import { useState, useCallback } from 'react'
+import { useState, useCallback, useEffect } from 'react'
+import { createPortal } from 'react-dom'
 import { GraduationCap, Loader2, Sparkles, X } from 'lucide-react'
 import { useLanguage } from '@/lib/i18n'
 import { useAiConsent } from '@/components/legal/ai-consent-provider'
@@ -37,6 +38,20 @@ export function FlashcardGenerateDialog({
   const [loading, setLoading] = useState(false)
   const [saving, setSaving] = useState(false)
   const [cards, setCards] = useState<PreviewCard[] | null>(null)
+  const [mounted, setMounted] = useState(false)
+
+  useEffect(() => {
+    setMounted(true)
+  }, [])
+
+  useEffect(() => {
+    if (!open) return
+    const onKey = (e: KeyboardEvent) => {
+      if (e.key === 'Escape') onClose()
+    }
+    document.addEventListener('keydown', onKey)
+    return () => document.removeEventListener('keydown', onKey)
+  }, [open, onClose])
 
   const handleGenerate = useCallback(async () => {
     if (!(await requestAiConsent())) return
@@ -75,7 +90,9 @@ export function FlashcardGenerateDialog({
       })
       const data = await res.json()
       if (!res.ok) {
-        toast.error(data.error || t('flashcards.saveFailed'))
+        toast.error(
+          (data.errorKey ? t(data.errorKey) : null) || data.error || t('flashcards.saveFailed'),
+        )
         return
       }
       toast.success(t('flashcards.savedCount', { count: data.savedCount }))
@@ -98,18 +115,18 @@ export function FlashcardGenerateDialog({
     })
   }
 
-  if (!open) return null
+  if (!open || !mounted) return null
 
-  return (
+  return createPortal(
     <div
-      className="fixed inset-0 z-[100] flex items-center justify-center bg-black/40 backdrop-blur-sm p-4"
+      className="fixed inset-0 z-[100] flex items-start sm:items-center justify-center overflow-y-auto bg-black/40 backdrop-blur-sm p-4 sm:p-6"
       onClick={onClose}
     >
       <div
-        className="bg-card border border-border rounded-2xl shadow-xl w-full max-w-lg max-h-[90vh] overflow-hidden flex flex-col"
+        className="bg-card border border-border rounded-2xl shadow-xl w-full max-w-lg max-h-[min(90dvh,calc(100dvh-2rem))] my-auto overflow-hidden flex flex-col shrink-0"
         onClick={(e) => e.stopPropagation()}
       >
-        <div className="flex items-center justify-between px-5 py-4 border-b border-border/60">
+        <div className="flex shrink-0 items-center justify-between px-5 py-4 border-b border-border/60">
           <div className="flex items-center gap-2">
             <GraduationCap size={18} className="text-brand-accent" />
             <div>
@@ -122,7 +139,7 @@ export function FlashcardGenerateDialog({
           </button>
         </div>
 
-        <div className="flex-1 overflow-y-auto p-5 space-y-5">
+        <div className="flex-1 min-h-0 overflow-y-auto overscroll-contain p-5 space-y-5 custom-scrollbar">
           {!cards ? (
             <>
               <div>
@@ -185,7 +202,7 @@ export function FlashcardGenerateDialog({
           )}
         </div>
 
-        <div className="px-5 py-4 border-t border-border/60 flex gap-2 justify-end">
+        <div className="shrink-0 px-5 py-4 border-t border-border/60 flex gap-2 justify-end">
           <button
             type="button"
             onClick={onClose}
@@ -216,6 +233,7 @@ export function FlashcardGenerateDialog({
           )}
         </div>
       </div>
-    </div>
+    </div>,
+    document.body,
   )
 }