feat(notes): liens internes, onglet Réseau, living blocks et consentement IA

Rend les liens entre notes visibles et persistants (sync NoteLink au save, auto-save, graphe réseau rafraîchi), ajoute living blocks, Memory Echo, recherche globale, consentement IA explicite et consolide les prototypes design en architectural-grid. Co-authored-by: Cursor <cursoragent@cursor.com>
2026-05-24 14:27:29 +00:00
parent 077e665dfc
commit e2672cd2c2
323 changed files with 20670 additions and 42431 deletions
--- a/memento-note/app/(main)/settings/appearance/appearance-settings-client.tsx
+++ b/memento-note/app/(main)/settings/appearance/appearance-settings-client.tsx
@@ -7,6 +7,11 @@ import { useLanguage } from '@/lib/i18n'
 import { toast } from 'sonner'
 import { Palette, Type, LayoutGrid, Maximize } from 'lucide-react'
 import { applyDocumentTheme, normalizeThemeId, type ThemeId } from '@/lib/apply-document-theme'
+import {
+  NOTES_LAYOUT_STORAGE_KEY,
+  parseNotesLayoutMode,
+  setNotesLayoutPreference,
+} from '@/lib/notes-view-preference'
 import { motion } from 'motion/react'

 const PRESET_COLORS = [
@@ -38,6 +43,11 @@ export function AppearanceSettingsClient({
  const [fontSize, setFontSize] = useState(initialFontSize || 'medium')
  const [fontFamily, setFontFamily] = useState(initialFontFamily)
  const [accentColor, setAccentColor] = useState(initialAccentColor)
+  const [notesLayout, setNotesLayout] = useState<'grid' | 'list' | 'table'>('list')
+
+  useEffect(() => {
+    setNotesLayout(parseNotesLayoutMode(localStorage.getItem(NOTES_LAYOUT_STORAGE_KEY)))
+  }, [])

  useEffect(() => {
    document.documentElement.style.setProperty('--color-brand-accent', accentColor)
@@ -83,6 +93,14 @@ export function AppearanceSettingsClient({
    toast.success(t('settings.settingsSaved'))
  }

+  const handleNotesLayoutChange = (value: string) => {
+    const layout = value === 'grid' ? 'grid' : value === 'table' ? 'table' : 'list'
+    setNotesLayout(layout)
+    setNotesLayoutPreference(layout)
+    window.dispatchEvent(new CustomEvent('memento-notes-layout-change', { detail: { layout } }))
+    toast.success(t('settings.settingsSaved'))
+  }
+
  const SelectCard = ({
    icon: Icon,
    title,
@@ -275,6 +293,19 @@ export function AppearanceSettingsClient({
            ]}
            onChange={handleFontFamilyChange}
          />
+
+          <SelectCard
+            icon={LayoutGrid}
+            title={t('settings.notesViewLabel')}
+            description={t('settings.notesViewDescription')}
+            value={notesLayout === 'grid' ? 'masonry' : notesLayout === 'table' ? 'table' : 'list'}
+            options={[
+              { value: 'masonry', label: t('settings.notesViewMasonry') },
+              { value: 'list', label: t('settings.notesViewList') },
+              { value: 'table', label: t('settings.notesViewTable') },
+            ]}
+            onChange={(v) => handleNotesLayoutChange(v === 'masonry' ? 'grid' : v === 'table' ? 'table' : 'list')}
+          />
        </div>
      </div>
    </motion.div>
--- a/memento-note/app/(main)/settings/data/page.tsx
+++ b/memento-note/app/(main)/settings/data/page.tsx
@@ -1,7 +1,7 @@
 'use client'

 import { useState } from 'react'
-import { Download, Upload, Trash2, Loader2, RefreshCw, Sparkles, Database, ShieldAlert } from 'lucide-react'
+import { Download, Upload, Trash2, Loader2, RefreshCw, Sparkles, Database, ShieldAlert, FolderArchive } from 'lucide-react'
 import { toast } from 'sonner'
 import { useLanguage } from '@/lib/i18n'
 import { useSession } from 'next-auth/react'
@@ -20,6 +20,39 @@ export default function DataSettingsPage() {
  const [isDeleting, setIsDeleting] = useState(false)
  const [isReindexing, setIsReindexing] = useState(false)
  const [isCleaningUp, setIsCleaningUp] = useState(false)
+  const [isZipExporting, setIsZipExporting] = useState(false)
+
+  const handleZipExport = async () => {
+    setIsZipExporting(true)
+    try {
+      const response = await fetch('/api/user/export')
+      if (!response.ok) {
+        let message = t('dataManagement.zipExport.failed')
+        try {
+          const body = (await response.json()) as { error?: string }
+          if (body.error) message = body.error
+        } catch {
+          /* non-JSON error body */
+        }
+        toast.error(message)
+        return
+      }
+      const blob = await response.blob()
+      const url = window.URL.createObjectURL(blob)
+      const a = document.createElement('a')
+      a.href = url
+      a.download = `memento-workspace-export-${new Date().toISOString().split('T')[0]}.zip`
+      document.body.appendChild(a)
+      a.click()
+      document.body.removeChild(a)
+      window.URL.revokeObjectURL(url)
+      toast.success(t('dataManagement.zipExport.success'))
+    } catch {
+      toast.error(t('dataManagement.zipExport.failed'))
+    } finally {
+      setIsZipExporting(false)
+    }
+  }

  const handleExport = async () => {
    setIsExporting(true)
@@ -135,6 +168,18 @@ export default function DataSettingsPage() {
      onAction: handleExport,
      btnClass: 'bg-ink text-paper shadow-xl shadow-ink/20 hover:scale-[1.02] active:scale-95',
    },
+    {
+      icon: FolderArchive,
+      iconColor: 'text-amber-600 dark:text-amber-400',
+      iconBg: 'bg-amber-500/10 dark:bg-amber-500/20',
+      title: t('dataManagement.zipExport.title'),
+      description: t('dataManagement.zipExport.description'),
+      loading: isZipExporting,
+      loadingText: t('dataManagement.zipExporting'),
+      buttonText: t('dataManagement.zipExport.button'),
+      onAction: handleZipExport,
+      btnClass: 'bg-ink text-paper shadow-xl shadow-ink/20 hover:scale-[1.02] active:scale-95',
+    },
    {
      icon: Upload,
      iconColor: 'text-emerald-600 dark:text-emerald-400',
--- a/memento-note/app/(main)/settings/general/general-settings-client.tsx
+++ b/memento-note/app/(main)/settings/general/general-settings-client.tsx
@@ -1,13 +1,17 @@
 'use client'

 import { useState } from 'react'
+import Link from 'next/link'
 import { useLanguage } from '@/lib/i18n'
 import { updateAISettings } from '@/app/actions/ai-settings'
 import { toast } from 'sonner'
 import { useRouter } from 'next/navigation'
-import { Globe, Bell, Shield } from 'lucide-react'
+import { Globe, Bell, Shield, Brain, HelpCircle } from 'lucide-react'
 import { motion } from 'motion/react'
 import { openCookiePreferences } from '@/lib/consent/cookie-consent'
+import { useAiConsent } from '@/components/legal/ai-consent-provider'
+import { Tooltip, TooltipTrigger, TooltipContent } from '@/components/ui/tooltip'
+import { cn } from '@/lib/utils'


 interface GeneralSettingsClientProps {
@@ -21,6 +25,7 @@ interface GeneralSettingsClientProps {

 export function GeneralSettingsClient({ initialSettings }: GeneralSettingsClientProps) {
  const { t, setLanguage: setContextLanguage } = useLanguage()
+  const { hasAiConsent, revokeConsent, requestAiConsent } = useAiConsent()
  const router = useRouter()
  const [language, setLanguage] = useState(initialSettings.preferredLanguage || 'auto')
  const [emailNotifications, setEmailNotifications] = useState(initialSettings.emailNotifications ?? false)
@@ -196,6 +201,82 @@ export function GeneralSettingsClient({ initialSettings }: GeneralSettingsClient
            </button>
          </div>
        </div>
+
+        <div className="bg-white/40 dark:bg-white/5 border border-border rounded-xl p-8 space-y-6 md:col-span-2">
+          <div className="flex items-start justify-between gap-4">
+            <div className="flex items-center gap-5">
+              <div className="p-3 bg-paper dark:bg-white/10 rounded-2xl text-concrete border border-border">
+                <Brain size={18} />
+              </div>
+              <div className="space-y-1">
+                <div className="flex items-center gap-2">
+                  <h4 className="text-base font-bold text-ink">{t('consent.ai.revocationTitle')}</h4>
+                  <Tooltip>
+                    <TooltipTrigger asChild>
+                      <button
+                        type="button"
+                        className="inline-flex text-concrete hover:text-ink transition-colors"
+                        aria-label={t('consent.ai.helpAriaLabel')}
+                      >
+                        <HelpCircle size={16} />
+                      </button>
+                    </TooltipTrigger>
+                    <TooltipContent side="top" className="max-w-sm text-balance leading-relaxed">
+                      {t('consent.ai.helpTooltip')}
+                    </TooltipContent>
+                  </Tooltip>
+                </div>
+                <p className="text-[11px] text-concrete max-w-2xl">{t('consent.ai.revocationDescription')}</p>
+              </div>
+            </div>
+            <span
+              className={cn(
+                'shrink-0 px-3 py-1 rounded-full text-[10px] font-bold uppercase tracking-wider border',
+                hasAiConsent
+                  ? 'bg-emerald-500/10 text-emerald-700 dark:text-emerald-400 border-emerald-500/20'
+                  : 'bg-concrete/10 text-concrete border-border'
+              )}
+            >
+              {hasAiConsent ? t('consent.ai.statusActive') : t('consent.ai.statusInactive')}
+            </span>
+          </div>
+
+          {!hasAiConsent && (
+            <div className="rounded-xl border border-border/60 bg-paper/50 dark:bg-black/20 p-5 space-y-3 text-left">
+              <p className="text-xs font-semibold text-ink">{t('consent.ai.whatItMeansTitle')}</p>
+              <p className="text-[11px] text-concrete leading-relaxed">{t('consent.ai.inactiveHint')}</p>
+              <ul className="text-[11px] text-concrete leading-relaxed list-disc pl-4 space-y-1">
+                <li>{t('consent.ai.noCommercialUse')}</li>
+                <li>{t('consent.ai.affectedFeatures')}</li>
+                <li>{t('consent.ai.dataPortabilityHint')}</li>
+              </ul>
+              <Link
+                href="/settings/data"
+                className="inline-flex text-[11px] font-semibold text-ink underline underline-offset-2 hover:opacity-80"
+              >
+                {t('consent.ai.dataPortabilityLink')} →
+              </Link>
+            </div>
+          )}
+
+          <div className="flex flex-col sm:flex-row gap-3 pt-1">
+            {hasAiConsent ? (
+              <button
+                onClick={() => revokeConsent()}
+                className="flex-1 px-5 py-3.5 bg-white dark:bg-white/10 border border-border rounded-xl text-xs font-bold uppercase tracking-[0.25em] text-ink dark:text-paper hover:scale-[1.01] active:scale-95 transition-all duration-300 shadow-sm"
+              >
+                {t('consent.ai.revokeButton')}
+              </button>
+            ) : (
+              <button
+                onClick={() => requestAiConsent()}
+                className="flex-1 px-5 py-3.5 bg-ink text-paper border border-border rounded-xl text-xs font-bold uppercase tracking-[0.25em] hover:scale-[1.01] active:scale-95 transition-all duration-300 shadow-sm"
+              >
+                {t('consent.ai.grantButton')}
+              </button>
+            )}
+          </div>
+        </div>
      </div>
    </motion.div>
  )