fix: replace raw ai_consent_required code with translatable message and consent prompt

- Centralize AI consent 403 responses in server-consent helpers - Return human-readable message + code + i18n errorKey from all AI APIs - Update dashboard and AI clients to detect code/errorKey and translate - Add consent.ai.requiredToast i18n keys (fr/en)
2026-07-18 17:32:00 +00:00
parent 86505659cf
commit 324bf40658
41 changed files with 404 additions and 97 deletions
--- a/memento-note/components/agents/agent-card.tsx
+++ b/memento-note/components/agents/agent-card.tsx
@@ -128,7 +128,7 @@ export function AgentCard({ agent, onEdit, onRefresh, onToggle }: AgentCardProps
            if (pollRef.current) clearInterval(pollRef.current)
            pollRef.current = null
            setIsRunning(false)
-            toast.error(t('agents.toasts.runError', { error: data.error || t('agents.toasts.runFailed') }), { 
+            toast.error(t('agents.toasts.runError', { error: data.errorKey ? t(data.errorKey) : (data.error || t('agents.toasts.runFailed')) }), { 
              id: toastId,
              description: '' // Clear the loading description
            })
--- a/memento-note/components/auto-label-suggestion-dialog.tsx
+++ b/memento-note/components/auto-label-suggestion-dialog.tsx
@@ -122,7 +122,7 @@ export function AutoLabelSuggestionDialog({
        onLabelsCreated()
        onOpenChange(false)
      } else {
-        toast.error(data.error || t('ai.autoLabels.error'))
+        toast.error(data.errorKey ? t(data.errorKey) : (data.error || t('ai.autoLabels.error')))
      }
    } catch (error) {
      console.error('Failed to create labels:', error)
--- a/memento-note/components/batch-organization-dialog.tsx
+++ b/memento-note/components/batch-organization-dialog.tsx
@@ -149,7 +149,7 @@ export function BatchOrganizationDialog({
        onNotesMoved()
        onOpenChange(false)
      } else {
-        toast.error(data.error || t('ai.batchOrganization.applyFailed'))
+        toast.error(data.errorKey ? t(data.errorKey) : (data.error || t('ai.batchOrganization.applyFailed')))
      }
    } catch (error) {
      console.error('Failed to apply organization plan:', error)
--- a/memento-note/components/contextual-ai-chat.tsx
+++ b/memento-note/components/contextual-ai-chat.tsx
@@ -345,7 +345,7 @@ export function ContextualAIChat({
          return
        }
        const data = await res.json()
-        if (!res.ok) throw new Error(data.error || t('ai.genericError'))
+        if (!res.ok) throw new Error(data.errorKey ? t(data.errorKey) : (data.error || t('ai.genericError')))
        const descs = data.descriptions || []
        let resultText = descs.map((d: any) =>
          noteImages.length > 1 ? `**Image ${d.index + 1}:** ${d.description}` : d.description
@@ -381,7 +381,7 @@ export function ContextualAIChat({
        return
      }
      const data = await res.json()
-      if (!res.ok) throw new Error(data.error || t('ai.genericError'))
+      if (!res.ok) throw new Error(data.errorKey ? t(data.errorKey) : (data.error || t('ai.genericError')))
      const result = data[action.resultKey] || ''
      setActionPreview({ label: t(action.i18nKey), text: result, asRichText: action.id === 'toRichText' })
    } catch (e: any) {
@@ -457,7 +457,7 @@ export function ContextualAIChat({
      })
      const data = await res.json()
      if (!res.ok || !data.success) {
-        mToast.error(data.error || t('ai.errorShort'), { id: toastId })
+        mToast.error(data.errorKey ? t(data.errorKey) : (data.error || t('ai.errorShort')), { id: toastId })
        setGenerateLoading(null)
        return
      }
@@ -577,7 +577,7 @@ export function ContextualAIChat({
        }),
      })
      const data = await res.json()
-      if (!res.ok) throw new Error(data.error || t('ai.resource.enrichError'))
+      if (!res.ok) throw new Error(data.errorKey ? t(data.errorKey) : (data.error || t('ai.resource.enrichError')))
      setResourcePreview({ text: data.enrichedContent, source: resourceMode })
    } catch (e: any) {
      mToast.error(e.message || t('ai.resource.enrichError'))
@@ -622,7 +622,7 @@ export function ContextualAIChat({
        }),
      })
      const data = await res.json()
-      if (!res.ok) throw new Error(data.error || t('ai.genericError'))
+      if (!res.ok) throw new Error(data.errorKey ? t(data.errorKey) : (data.error || t('ai.genericError')))
      setResourcePreview({ text: data.enrichedContent, source: mode })
    } catch (e: any) {
      mToast.error(e.message || t('ai.resource.enrichErrorShort'))
--- a/memento-note/components/dashboard-view.tsx
+++ b/memento-note/components/dashboard-view.tsx
@@ -519,7 +519,7 @@ export function DashboardView({ onNoteSelect }: DashboardViewProps) {
    try {
      const res = await fetch('/api/ai/echo')
      const json = await res.json()
-      if (res.status === 403 && json.error === 'ai_consent_required') { await requestAiConsent(); return }
+      if (res.status === 403 && json.code === 'ai_consent_required') { await requestAiConsent(); return }
      if (!res.ok) throw new Error(json.error)
      if (json.insight) {
        await reloadBriefingAndPaths()
--- a/memento-note/components/flashcards/flashcard-generate-dialog.tsx
+++ b/memento-note/components/flashcards/flashcard-generate-dialog.tsx
@@ -64,11 +64,7 @@ export function FlashcardGenerateDialog({
      })
      const data = await res.json()
      if (!res.ok) {
-        if (data.errorKey) {
-          toast.error(t(data.errorKey) || data.error)
-        } else {
-          toast.error(data.error || t('flashcards.generateFailed'))
-        }
+        toast.error(data.errorKey ? t(data.errorKey) : (data.error || t('flashcards.generateFailed')))
        return
      }
      setCards(data.cards || [])
--- a/memento-note/components/flashcards/revision-view.tsx
+++ b/memento-note/components/flashcards/revision-view.tsx
@@ -353,7 +353,7 @@ export function RevisionView() {
      const res = await fetch(`/api/flashcards/decks/${deckId}`)
      const data = await res.json()
      if (!res.ok) {
-        toast.error(data.error || t('flashcards.loadDeckFailed'))
+        toast.error(data.errorKey ? t(data.errorKey) : (data.error || t('flashcards.loadDeckFailed')))
        return
      }
      setActiveDeckId(deckId)
@@ -432,7 +432,7 @@ export function RevisionView() {
      const res = await fetch(`/api/flashcards/decks/${deckId}`)
      const data = await res.json()
      if (!res.ok) {
-        toast.error(data.error || t('flashcards.loadDeckFailed'))
+        toast.error(data.errorKey ? t(data.errorKey) : (data.error || t('flashcards.loadDeckFailed')))
        setExpandedDeckId(null)
        return
      }
--- a/memento-note/components/fusion-modal.tsx
+++ b/memento-note/components/fusion-modal.tsx
@@ -69,7 +69,7 @@ export function FusionModal({
      const data = await res.json()
      
      if (!res.ok) {
-        throw new Error(data.error || 'Failed to generate fusion')
+        throw new Error(data.errorKey ? t(data.errorKey) : (data.error || 'Failed to generate fusion'))
      }

      if (!data.fusedNote) {
--- a/memento-note/components/home-client.tsx
+++ b/memento-note/components/home-client.tsx
@@ -20,7 +20,7 @@ import {

 import { NotebookSuggestionToast } from '@/components/notebook-suggestion-toast'
 import { Button } from '@/components/ui/button'
-import { Plus, ArrowUpDown, Search, Sparkles, FileText, FolderOpen, ChevronRight, ChevronDown, Tag as TagIcon, X, Menu, LayoutGrid, List, Table, Columns3, CalendarDays, Wand2, Download, Upload, Globe } from 'lucide-react'
+import { Plus, ArrowUpDown, Search, Sparkles, FileText, FolderOpen, ChevronRight, ChevronDown, Tag as TagIcon, X, Menu, LayoutGrid, List, Table, Columns3, CalendarDays, Wand2, Download, Upload, Globe, Presentation } from 'lucide-react'
 import { emitNoteChange, NOTE_CHANGE_EVENT, type NoteChangeEvent } from '@/lib/note-change-sync'
 import { useReminderCheck } from '@/hooks/use-reminder-check'
 import { useAutoLabelSuggestion } from '@/hooks/use-auto-label-suggestion'
@@ -67,6 +67,10 @@ const NotebookSiteDialog = dynamic(
  () => import('@/components/wizard/notebook-site-dialog').then(m => ({ default: m.NotebookSiteDialog })),
  { ssr: false }
 )
+const NotebookSlidesDialog = dynamic(
+  () => import('@/components/wizard/notebook-slides-dialog').then(m => ({ default: m.NotebookSlidesDialog })),
+  { ssr: false }
+)
 const StructuredViewsIntro = dynamic(
  () => import('@/components/structured-views/structured-views-intro').then(m => ({ default: m.StructuredViewsIntro })),
  { ssr: false }
@@ -151,6 +155,7 @@ export function HomeClient({
  const [isEnablingStructured, setIsEnablingStructured] = useState(false)
  const [showStructuredWizard, setShowStructuredWizard] = useState(false)
  const [showNotebookSite, setShowNotebookSite] = useState(false)
+  const [showNotebookSlides, setShowNotebookSlides] = useState(false)
  const [aiMenuOpen, setAiMenuOpen] = useState(false)
  const aiMenuRef = useRef<HTMLDivElement>(null)
  const [showStudyPlanner, setShowStudyPlanner] = useState(false)
@@ -179,7 +184,7 @@ export function HomeClient({
        toast.success(`${data.created} notes importées !`)
        window.location.reload()
      } else {
-        toast.error(data.error || 'Erreur')
+        toast.error(data.errorKey ? t(data.errorKey) : (data.error || 'Erreur'))
      }
    }
    input.click()
@@ -1136,6 +1141,11 @@ export function HomeClient({
                              label: t('notebookSite.shortTitle') || 'Site web',
                              action: () => { setShowNotebookSite(true); setAiMenuOpen(false) },
                            },
+                            {
+                              icon: <Presentation size={14} />,
+                              label: t('notebook.slides') || 'Présentation',
+                              action: () => { setShowNotebookSlides(true); setAiMenuOpen(false) },
+                            },
                          ].map((item, i) => (
                            <button
                              key={i}
@@ -1452,6 +1462,14 @@ export function HomeClient({
          onClose={() => setShowNotebookSite(false)}
        />
      )}
+
+      {showNotebookSlides && currentNotebook && (
+        <NotebookSlidesDialog
+          notebookId={currentNotebook.id}
+          notebookName={currentNotebook.name}
+          onClose={() => setShowNotebookSlides(false)}
+        />
+      )}
    </div>
  )
 }
--- a/memento-note/components/note-editor/note-editor-context.tsx
+++ b/memento-note/components/note-editor/note-editor-context.tsx
@@ -426,7 +426,7 @@ export function NoteEditorProvider({ note, readOnly = false, fullPage = false, o
          return
        }
        const errorData = await response.json()
-        throw new Error(errorData.error || t('ai.titleGenerationError'))
+        throw new Error(errorData.errorKey ? t(errorData.errorKey) : (errorData.error || t('ai.titleGenerationError')))
      }

      const data = await response.json()
@@ -502,7 +502,7 @@ export function NoteEditorProvider({ note, readOnly = false, fullPage = false, o
          return
        }
        const errorData = await response.json()
-        throw new Error(errorData.error || t('ai.reformulationError'))
+        throw new Error(errorData.errorKey ? t(errorData.errorKey) : (errorData.error || t('ai.reformulationError')))
      }

      const data = await response.json()
@@ -542,7 +542,7 @@ export function NoteEditorProvider({ note, readOnly = false, fullPage = false, o
        return
      }
      const data = await response.json()
-      if (!response.ok) throw new Error(data.error || t('notes.clarifyFailed'))
+      if (!response.ok) throw new Error(data.errorKey ? t(data.errorKey) : (data.error || t('notes.clarifyFailed')))
      setContentImmediate(data.reformulatedText || data.text)
      toast.success(t('ai.reformulationApplied'))
    } catch (error) {
@@ -575,7 +575,7 @@ export function NoteEditorProvider({ note, readOnly = false, fullPage = false, o
        return
      }
      const data = await response.json()
-      if (!response.ok) throw new Error(data.error || t('notes.shortenFailed'))
+      if (!response.ok) throw new Error(data.errorKey ? t(data.errorKey) : (data.error || t('notes.shortenFailed')))
      setContentImmediate(data.reformulatedText || data.text)
      toast.success(t('ai.reformulationApplied'))
    } catch (error) {
@@ -608,7 +608,7 @@ export function NoteEditorProvider({ note, readOnly = false, fullPage = false, o
        return
      }
      const data = await response.json()
-      if (!response.ok) throw new Error(data.error || t('notes.improveFailed'))
+      if (!response.ok) throw new Error(data.errorKey ? t(data.errorKey) : (data.error || t('notes.improveFailed')))
      setContentImmediate(data.reformulatedText || data.text)
      toast.success(t('ai.reformulationApplied'))
    } catch (error) {
@@ -642,7 +642,7 @@ export function NoteEditorProvider({ note, readOnly = false, fullPage = false, o
        body: JSON.stringify({ text: content })
      })
      const data = await response.json()
-      if (!response.ok) throw new Error(data.error || t('notes.transformFailed'))
+      if (!response.ok) throw new Error(data.errorKey ? t(data.errorKey) : (data.error || t('notes.transformFailed')))

      setContentImmediate(data.transformedText)
      setIsMarkdown(true)
--- a/memento-note/components/note-editor/note-editor-toolbar.tsx
+++ b/memento-note/components/note-editor/note-editor-toolbar.tsx
@@ -330,7 +330,7 @@ export function NoteEditorToolbar({ mode, onClose, onToggleAttachments, attachme
          duration: 6000,
        })
      } else {
-        toast.error(data.error || t('general.error'))
+        toast.error(data.errorKey ? t(data.errorKey) : (data.error || t('general.error')))
      }
    } catch {
      toast.error(t('general.error'))
@@ -408,7 +408,7 @@ export function NoteEditorToolbar({ mode, onClose, onToggleAttachments, attachme
        })
      } else {
        toast.dismiss(toastId)
-        toast.error(data.error || t('general.error'))
+        toast.error(data.errorKey ? t(data.errorKey) : (data.error || t('general.error')))
      }
    } catch {
      toast.dismiss(toastId)
@@ -437,7 +437,7 @@ export function NoteEditorToolbar({ mode, onClose, onToggleAttachments, attachme
        setPublishOpen(false)
      } else {
        const data = await res.json().catch(() => ({}))
-        toast.error(data.error || t('general.error'))
+        toast.error(data.errorKey ? t(data.errorKey) : (data.error || t('general.error')))
      }
    } catch {
      toast.error(t('general.error'))
--- a/memento-note/components/note-editor/publish-dialog.tsx
+++ b/memento-note/components/note-editor/publish-dialog.tsx
@@ -46,7 +46,7 @@ export function PublishDialog({ open, onClose, noteId, noteTitle, isPublic: init
          duration: 6000,
        })
      } else {
-        toast.error(data.error || 'Erreur')
+        toast.error(data.errorKey ? t(data.errorKey) : (data.error || 'Erreur'))
      }
    } catch { toast.error('Erreur') }
    finally { setLoading(false) }
--- a/memento-note/components/notebook-summary-dialog.tsx
+++ b/memento-note/components/notebook-summary-dialog.tsx
@@ -68,7 +68,7 @@ export function NotebookSummaryDialog({
      if (data.success && data.data) {
        setSummary(data.data)
      } else {
-        toast.error(data.error || t('notebook.summaryError'))
+        toast.error(data.errorKey ? t(data.errorKey) : (data.error || t('notebook.summaryError')))
        onOpenChange(false)
      }
    } catch (error) {
--- a/memento-note/components/personas-panel.tsx
+++ b/memento-note/components/personas-panel.tsx
@@ -124,7 +124,7 @@ export function PersonasPanel({ noteTitle, noteContent }: PersonasPanelProps) {
        body: JSON.stringify({ content: noteContent, title: noteTitle, personaId }),
      })
      const data = await res.json()
-      if (!res.ok) throw new Error(data.error || t('common.error'))
+      if (!res.ok) throw new Error(data.errorKey ? t(data.errorKey) : (data.error || t('common.error')))
      setResults(prev => new Map(prev).set(personaId, data))
      setExpanded(personaId)
    } catch {
--- a/memento-note/components/rich-text-editor.tsx
+++ b/memento-note/components/rich-text-editor.tsx
@@ -2005,7 +2005,7 @@ function SlashCommandMenu({ editor, onInsertImage, onSuggestCharts }: { editor:
        }),
      })
      const data = await res.json()
-      if (!res.ok) { toast.error(data.error || 'Erreur'); return }
+      if (!res.ok) { toast.error(data.errorKey ? t(data.errorKey) : (data.error || 'Erreur')); return }
      let html = data.reformulatedText || data.text || ''
      // Clean up excessive whitespace
      html = html
--- a/memento-note/components/wizard/ai-notebook-wizard.tsx
+++ b/memento-note/components/wizard/ai-notebook-wizard.tsx
@@ -100,7 +100,7 @@ export function AiNotebookWizard({ onClose, onComplete }: { onClose: () => void;
        } else if (data.errorKey === 'ai.quotaExceeded') {
          toast.error(t('ai.quotaExceeded') || 'Quota IA dépassé')
        } else {
-          toast.error(data.error || 'Erreur')
+          toast.error(data.errorKey ? t(data.errorKey) : (data.error || 'Erreur'))
        }
        setLoading(false)
        return
--- a/memento-note/components/wizard/notebook-site-dialog.tsx
+++ b/memento-note/components/wizard/notebook-site-dialog.tsx
@@ -100,7 +100,7 @@ export function NotebookSiteDialog({ notebookId, notebookName, onClose }: Notebo
        body: JSON.stringify({ selectedNoteIds: selected, template, description }),
      })
      const data = await res.json()
-      if (!res.ok) { toast.error(data.error || 'Erreur'); setStep('selection'); return }
+      if (!res.ok) { toast.error(data.errorKey ? t(data.errorKey) : (data.error || 'Erreur')); setStep('selection'); return }
      setExistingSlug(data.slug)
      setSiteUrl(data.url)
      setStep('done')
--- a/memento-note/components/wizard/notebook-slides-dialog.tsx
+++ b/memento-note/components/wizard/notebook-slides-dialog.tsx
@@ -0,0 +1,237 @@
+'use client'
+
+import { useState, useEffect, useRef } from 'react'
+import { Presentation, X } from 'lucide-react'
+import { useLanguage } from '@/lib/i18n'
+import { toast } from 'sonner'
+import { useRouter } from 'next/navigation'
+
+const THEMES = [
+  'auto',
+  'Architectural SaaS',
+  'Midnight Cathedral',
+  'Aurora Borealis',
+  'Tokyo Neon',
+  'Sunlit Gallery',
+  'Clinical Precision',
+  'Venture Pitch',
+  'Forest Floor',
+  'Steel & Glass',
+  'Cyberpunk Terminal',
+  'Editorial Ink',
+  'Coastal Morning',
+  'Paper Studio',
+]
+
+const PURPOSES = [
+  { value: 'auto', key: 'ai.generate.purposeAuto' },
+  { value: 'course', key: 'ai.generate.purposeCourse' },
+  { value: 'board', key: 'ai.generate.purposeBoard' },
+  { value: 'project', key: 'ai.generate.purposeProject' },
+  { value: 'strategy', key: 'ai.generate.purposeStrategy' },
+  { value: 'pitch', key: 'ai.generate.purposePitch' },
+  { value: 'summary', key: 'ai.generate.purposeSummary' },
+]
+
+const STATUS_KEYS = [
+  'notebook.slidesStatus1',
+  'notebook.slidesStatus2',
+  'notebook.slidesStatus3',
+  'notebook.slidesStatus4',
+]
+
+export function NotebookSlidesDialog({
+  notebookId,
+  notebookName,
+  onClose,
+}: {
+  notebookId: string
+  notebookName: string
+  onClose: () => void
+}) {
+  const { t, language } = useLanguage()
+  const router = useRouter()
+  const [loading, setLoading] = useState(false)
+  const [theme, setTheme] = useState('auto')
+  const [purpose, setPurpose] = useState('auto')
+  const [progress, setProgress] = useState(0)
+  const timerRef = useRef<ReturnType<typeof setInterval>>(null)
+
+  useEffect(() => {
+    return () => {
+      if (timerRef.current) clearInterval(timerRef.current)
+    }
+  }, [])
+
+  const handleGenerate = async () => {
+    setLoading(true)
+    setProgress(0)
+
+    let elapsed = 0
+    timerRef.current = setInterval(() => {
+      elapsed += 0.6
+      setProgress(() => {
+        const target = 85 * (1 - Math.exp(-elapsed / 15))
+        return Math.min(target, 85)
+      })
+    }, 600)
+
+    try {
+      const res = await fetch('/api/ai/notebook-slides', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({
+          notebookId,
+          theme,
+          purpose,
+          language: language === 'fr' ? 'fr' : 'en',
+        }),
+      })
+      const data = await res.json()
+
+      if (timerRef.current) clearInterval(timerRef.current)
+      setProgress(100)
+
+      if (!res.ok) {
+        toast.error(
+          data.errorKey === 'ai.featureLocked'
+            ? (t('ai.featureLocked') || 'Plan requis')
+            : (data.error || 'Erreur'),
+        )
+      } else if (data.success && data.canvasId) {
+        window.dispatchEvent(new Event('ai-usage-changed'))
+        toast.success(t('notebook.slidesReady') || `Présentation générée (${data.slideCount} slides)`)
+        setTimeout(() => {
+          router.push(`/lab?canvas=${data.canvasId}`)
+          onClose()
+        }, 400)
+      } else {
+        toast.error(data.errorKey ? t(data.errorKey) : (data.error || 'Erreur lors de la génération'))
+      }
+    } catch (e: any) {
+      if (timerRef.current) clearInterval(timerRef.current)
+      toast.error(e.message || 'Erreur')
+    } finally {
+      setLoading(false)
+    }
+  }
+
+  const statusIdx = Math.min(Math.floor(progress / 22), STATUS_KEYS.length - 1)
+
+  return (
+    <div
+      className="fixed inset-0 z-[300] flex items-center justify-center p-4 bg-black/50 backdrop-blur-sm"
+      dir="auto"
+      onClick={loading ? undefined : onClose}
+    >
+      <div
+        className="w-full max-w-lg rounded-2xl border border-border bg-card shadow-2xl overflow-hidden flex flex-col"
+        onClick={(e) => e.stopPropagation()}
+      >
+        <div className="flex items-center justify-between px-6 py-4 border-b border-border/50 bg-brand-accent/5 shrink-0">
+          <div className="flex items-center gap-2">
+            <Presentation className="h-5 w-5 text-brand-accent" />
+            <h2 className="text-base font-semibold">
+              {t('notebook.slides') || 'Présentation'}
+            </h2>
+          </div>
+          <button
+            onClick={onClose}
+            disabled={loading}
+            className="p-1 rounded-lg hover:bg-muted text-muted-foreground disabled:opacity-30 disabled:cursor-not-allowed"
+          >
+            <X className="h-5 w-5" />
+          </button>
+        </div>
+
+        <div className="p-6 space-y-5">
+          {!loading && (
+            <>
+              <p className="text-sm text-muted-foreground">
+                {t('notebook.slidesDescription') || `Génère une présentation à partir des notes du carnet « ${notebookName} ».`}
+              </p>
+
+              <div className="space-y-1.5">
+                <span className="text-[10px] uppercase tracking-[0.2em] font-bold text-muted-foreground px-1">
+                  {t('ai.generate.theme') || 'Thème'}
+                </span>
+                <select
+                  value={theme}
+                  onChange={(e) => setTheme(e.target.value)}
+                  className="w-full bg-card/60 border border-border rounded-lg px-3 py-2 text-sm outline-none focus:ring-1 ring-brand-accent/10 transition-all cursor-pointer text-foreground"
+                >
+                  {THEMES.map((th) => (
+                    <option key={th} value={th}>
+                      {th === 'auto' ? (t('ai.generate.themeAuto') || 'Auto') : th}
+                    </option>
+                  ))}
+                </select>
+              </div>
+
+              <div className="space-y-1.5">
+                <span className="text-[10px] uppercase tracking-[0.2em] font-bold text-muted-foreground px-1">
+                  {t('ai.generate.purpose') || 'Type de deck'}
+                </span>
+                <select
+                  value={purpose}
+                  onChange={(e) => setPurpose(e.target.value)}
+                  className="w-full bg-card/60 border border-border rounded-lg px-3 py-2 text-sm outline-none focus:ring-1 ring-brand-accent/10 transition-all cursor-pointer text-foreground"
+                >
+                  {PURPOSES.map((p) => (
+                    <option key={p.value} value={p.value}>
+                      {t(p.key) || p.value}
+                    </option>
+                  ))}
+                </select>
+              </div>
+
+              <button
+                onClick={handleGenerate}
+                className="w-full flex items-center justify-center gap-2 px-4 py-3 text-sm rounded-lg bg-brand-accent text-white hover:bg-brand-accent/90 transition-colors font-medium"
+              >
+                <Presentation className="h-4 w-4" />
+                {t('notebook.slidesGenerate') || 'Générer la présentation'}
+              </button>
+            </>
+          )}
+
+          {loading && (
+            <div className="space-y-5 py-4">
+              <div className="space-y-2">
+                <div className="w-full h-2.5 bg-muted rounded-full overflow-hidden">
+                  <div
+                    className="h-full bg-gradient-to-r from-brand-accent to-brand-accent/70 rounded-full transition-all duration-700 ease-out"
+                    style={{ width: `${progress}%` }}
+                  />
+                </div>
+                <div className="flex items-center justify-between">
+                  <span className="text-xs text-muted-foreground animate-pulse">
+                    {t(STATUS_KEYS[statusIdx])}
+                  </span>
+                  <span className="text-xs font-mono font-bold text-brand-accent tabular-nums">
+                    {Math.round(progress)}%
+                  </span>
+                </div>
+              </div>
+
+              <div className="flex items-center justify-between px-2">
+                {STATUS_KEYS.map((_, i) => (
+                  <div
+                    key={i}
+                    className={`h-1 flex-1 mx-0.5 rounded-full transition-colors duration-300 ${
+                      i <= statusIdx ? 'bg-brand-accent' : 'bg-muted'
+                    }`}
+                  />
+                ))}
+              </div>
+
+              <p className="text-[10px] text-muted-foreground/60 text-center">
+                {t('notebook.slidesGeneratingHint') || 'Outline + rédaction des slides'}
+              </p>
+            </div>
+          )}
+        </div>
+      </div>
+    </div>
+  )
+}